/* ============================================================
   LAXMI KAPAT — responsive.css
   Mobile-first breakpoints ONLY. No base styles here.
   480 · 768 · 1024 · 1440
   ============================================================ */

/* Mobile default: hamburger shown, nav menu is an overlay panel */
@media (max-width: 767px) {
  .nav-toggle { display: flex; }

  .nav-menu {
    position: fixed;
    inset: 0 0 0 auto;
    width: min(82vw, 320px);
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: var(--space-md);
    padding: var(--space-xl) var(--space-lg);
    background: var(--color-surface);
    border-left: 1px solid var(--color-border);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform .4s cubic-bezier(.4, 0, .2, 1);
  }
  .nav-menu.open { transform: translateX(0); }

  .nav-link { font-size: var(--text-lg); }
  .nav-cta { display: inline-flex; }

  .status-rail-inner { flex-wrap: wrap; justify-content: flex-start; row-gap: .3rem; }
}

/* ── 480px — large mobile ─────────────────────────────────── */
@media (min-width: 480px) {
  .hero-cta { flex-wrap: nowrap; }
  .error-actions { gap: var(--space-md); }
  .cta-banner-actions { flex-wrap: nowrap; }
}

/* ── 768px — tablet ───────────────────────────────────────── */
@media (min-width: 768px) {
  :root { --gutter: 2.5rem; }

  .hero-manifest { grid-template-columns: repeat(4, 1fr); }
  .stats-grid { grid-template-columns: repeat(4, 1fr); }
  .doors-grid { grid-template-columns: repeat(3, 1fr); }
  .contact-grid { grid-template-columns: 1fr 1fr; }
  .heritage-split { grid-template-columns: 1.1fr .9fr; }

  .spec-grid { grid-template-columns: repeat(2, 1fr); }
  .spec-plate-flagship { grid-column: span 2; }

  .supply-line { display: flex; align-items: stretch; flex-wrap: nowrap; }
  .supply-node { flex: 1 1 0; }
  .supply-connector { flex: 0 1 56px; margin-block: auto; }

  .register-row {
    grid-template-columns: 160px 150px 1fr 130px;
    align-items: baseline;
    gap: var(--space-sm);
  }

  .case-row-data { flex-direction: row; flex-wrap: wrap; gap: var(--space-lg); }
  .case-row-data div { border-top: none; padding-top: 0; }

  .footer-inner { grid-template-columns: 2fr 1fr 1.4fr; }
  .footer-bottom { flex-direction: row; justify-content: space-between; }

  .section { padding-block: var(--space-xl); }
}

/* ── 1024px — desktop ─────────────────────────────────────── */
@media (min-width: 1024px) {
  :root { --gutter: 3.5rem; }

  .spec-grid { grid-template-columns: repeat(3, 1fr); }
  .spec-plate-flagship { grid-column: span 2; display: flex; flex-direction: column; justify-content: space-between; }

  .index-list-lg .spec-grid { grid-template-columns: repeat(2, 1fr); }

  .footer-inner { grid-template-columns: 2.2fr 1fr 1.4fr; }
}

/* ── 1440px — large desktop ───────────────────────────────── */
@media (min-width: 1440px) {
  :root { --container: 1320px; --gutter: 4.5rem; }
  .section { padding-block: 8rem; }
  .hero { padding-block: 9rem 6rem; }
}

/* ── REDUCED MOTION ───────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}