/* =====================================================================
   IRDEN CARS — responsive.css
   Breakpoints: 1024 (laptop) · 860 (tablet / nav switch) · 640 (mobile) · 400 (small)
   ===================================================================== */

/* ---------- <= 1080px ---------- */
@media (max-width: 1080px) {
  .form-wrap { grid-template-columns: 1fr; }
  .form-aside { position: static; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
  .footer-top { grid-template-columns: 1fr 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}

/* ---------- <= 960px ---------- */
@media (max-width: 960px) {
  .split { grid-template-columns: 1fr; }
  .split__media { order: -1; }
  .hero-inner { padding-block: 40px; }
}

/* ---------- <= 860px : switch to mobile navigation ---------- */
@media (max-width: 860px) {
  .primary-nav,
  .header-actions .btn,
  .header-actions .wa-link { display: none; }
  .nav-toggle { display: block; }
  .site-header .container { max-width: 100%; }

  .section { padding-block: clamp(52px, 12vw, 84px); }
}

/* ---------- <= 720px ---------- */
@media (max-width: 720px) {
  body { font-size: 16px; }
  .container { padding-inline: 20px; }

  .form-grid { grid-template-columns: 1fr; }
  .fleet-grid { grid-template-columns: 1fr; gap: 20px; }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .footer-bottom { justify-content: center; text-align: center; }

  .hero { min-height: auto; padding-top: calc(var(--header-h) + 40px); padding-bottom: 64px; }
  .hero-meta { gap: 16px 24px; }
  .scroll-hint { display: none; }

  .hero-cta .btn,
  .cta-band .hero-cta .btn { flex: 1 1 100%; }

  .wa-float__label { display: none; }
  .wa-float { padding: 14px; right: 16px; bottom: 16px; }
}

/* ---------- <= 460px ---------- */
@media (max-width: 460px) {
  .container { padding-inline: 16px; }
  .brand img { width: 140px; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-brand img { width: 160px; }

  .vehicle-card__actions { grid-template-columns: 1fr; }
  .vehicle-card__actions .btn--wa { width: 100%; }

  .form-actions .btn { width: 100%; }
  .mobile-nav .m-links a { font-size: 1.3rem; }
}

/* ---------- Large screens ---------- */
@media (min-width: 1500px) {
  :root { --container: 1280px; }
}

/* ---------- Print ---------- */
@media print {
  .site-header, .mobile-nav, .nav-scrim, .wa-float, .hero-cta, .scroll-hint { display: none !important; }
  body { background: #fff; color: #111; }
}