/* ════════════════════════════════════════════════════════════
   CONTACT PAGE — MOBILE OPTIMIZATION OVERRIDES
   Target Breakpoints: 1024px, 768px, 480px
   ════════════════════════════════════════════════════════════ */

/* ── SMALL DESKTOP / TABLET LANDSCAPE (max-width: 1024px) ── */
@media (max-width: 1024px) {
    .s-demo, .sec-white {
        padding: 80px 0 !important;
    }

    .container {
        padding: 0 32px !important;
    }

    /* Typography Scaling */
    .s-h2 { font-size: 3rem !important; }
}

/* ── TABLET PORTRAIT (max-width: 768px) ── */
@media (max-width: 768px) {
    .s-demo { padding: 80px 0 40px !important; }
    .sec-white { padding: 60px 0 !important; }

    /* Nav Fix */
    .site-nav { padding: 0 20px !important; height: 64px !important; }
    .nav-menu, .nav-right { display: none !important; }
    .nav-hamburger { display: flex !important; }

    /* Grid Collapse */
    .container > div[style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }

    /* Card padding reduction */
    .reveal[style*="padding:48px"] {
        padding: 32px !important;
        border-radius: 24px !important;
    }

    /* Consultation box */
    div[style*="margin-top:56px"] {
        margin-top: 40px !important;
        padding: 24px !important;
    }
}

/* ── MOBILE (max-width: 480px) ── */
@media (max-width: 480px) {
    .s-demo { padding: 60px 0 32px !important; }
    .sec-white { padding: 40px 0 !important; }

    .container {
        padding: 0 20px !important;
    }

    /* Typography Scaling */
    .s-h1, .s-h2 { font-size: 1.8rem !important; }
    h3.s-h2 { font-size: 1.4rem !important; margin-bottom: 20px !important; }
    .s-body { font-size: 0.95rem !important; line-height: 1.6 !important; }

    /* Card padding reduction */
    .reveal[style*="padding:48px"], .reveal[style*="padding: 48px"] {
        padding: 24px 20px !important;
    }

    /* Form specific adjustments */
    .s-form-group label { font-size: 0.85rem !important; }
    .s-form-group input, .s-form-group select, .s-form-group textarea {
        padding: 12px !important;
        font-size: 0.9rem !important;
    }

    /* Info items */
    div[style*="display:flex; gap:16px"] h4 {
        font-size: 1rem !important;
    }

    /* Footer */
    .s-footer-top {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }
    .s-footer-cols {
        grid-template-columns: 1fr 1fr !important;
        gap: 24px !important;
    }
}