/* ============================================================
   SIMPLIFY — RESPONSIVE STYLES
   ============================================================ */

/* ── TABLET: ≤ 1024px ────────────────────────────────────────── */
@media (max-width: 1024px) {
    .grid--4       { grid-template-columns: repeat(2, 1fr); }
    .pillars-grid  { grid-template-columns: repeat(2, 1fr); }
    .production-steps { grid-template-columns: repeat(2, 1fr); }
    .production-steps::before { display: none; }
    .aircraft-grid { grid-template-columns: repeat(2, 1fr); }
    .news-grid     { grid-template-columns: repeat(2, 1fr); }
    .footer-inner  { grid-template-columns: 1fr 1fr 1fr; gap: var(--space-2xl); }
    .footer-brand  { grid-column: 1 / -1; }
    .split         { grid-template-columns: 1fr; gap: var(--space-2xl); }
    .split--reverse { direction: ltr; }
}

/* ── MOBILE: ≤ 768px ─────────────────────────────────────────── */
@media (max-width: 768px) {
    :root { --space-4xl: 4rem; --space-3xl: 3rem; }

    /* Nav — handled by nav.css @media (max-width: 900px) */

    /* Grids */
    .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }
    .aircraft-grid  { grid-template-columns: 1fr; }
    .news-grid      { grid-template-columns: 1fr; }
    .pillars-grid   { grid-template-columns: 1fr; }
    .production-steps { grid-template-columns: 1fr; }
    .form-grid      { grid-template-columns: 1fr; }
    .footer-inner   { grid-template-columns: 1fr 1fr; }
    .footer-bottom  { flex-direction: column; text-align: center; }

    /* Hero */
    .home-hero { min-height: 100svh; }
    .home-hero__headline { font-size: clamp(2.8rem, 10vw, 4.5rem); }

    /* Configurator */
    .configurator__progress { overflow-x: auto; }
    .config-step-indicator__label { display: none; }
    .config-detail-drawer__list { grid-template-columns: 1fr; }

    /* Compare table */
    .compare-table th,
    .compare-table td { padding: var(--space-sm) var(--space-md); font-size: 0.82rem; }
}

/* ── SMALL MOBILE: ≤ 480px ───────────────────────────────────── */
@media (max-width: 480px) {
    .container { padding-inline: var(--space-lg); }
    .btn { padding: 0.75rem 1.5rem; font-size: 0.85rem; }
    .btn-group { flex-direction: column; align-items: stretch; }
    .btn-group .btn { text-align: center; justify-content: center; }
    .footer-inner { grid-template-columns: 1fr; }
    .modal__box, .exit-popup__box { padding: var(--space-xl); }
}