/* Responsive */
@media (max-width: 1024px) {
    .pricing-grid { grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; }
    .pricing-card--popular { transform: none; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .why-grid { grid-template-columns: 1fr; }
    .steps-grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
}

@media (max-width: 768px) {
    :root { --section-padding: 3rem; --card-padding: 1.5rem; }

    h1 { font-size: 2rem; }
    h2 { font-size: 1.5rem; }

    .hero h1 { font-size: 2.25rem; }
    .hero-subtitle { font-size: 1.0625rem; }
    .hero-cta { flex-direction: column; align-items: center; }
    .hero-trust { flex-direction: column; align-items: center; }

    .main-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--bg-white);
        border-bottom: 1px solid var(--border);
        flex-direction: column;
        padding: 1rem;
        box-shadow: var(--shadow-md);
    }
    .main-nav.active { display: flex; }
    .nav-link { width: 100%; text-align: center; padding: 0.75rem; }
    .hamburger { display: block; }

    .proof-stats { gap: 1.5rem; }
    .proof-stat strong { font-size: 1.25rem; }

    .documents-grid { grid-template-columns: 1fr; }

    .form-row { grid-template-columns: 1fr; }
    .form-actions { flex-direction: column-reverse; gap: 0.75rem; }
    .form-actions .btn { width: 100%; }

    .footer-grid { grid-template-columns: 1fr; gap: 2rem; }

    .flash-container { left: 1rem; right: 1rem; max-width: none; }

    .wizard-steps { overflow-x: auto; }
    .wizard-step-label { font-size: 0.6875rem; }

    .dashboard-header { flex-direction: column; gap: 1rem; }
    .dashboard-actions { width: 100%; display: flex; gap: 0.5rem; }
    .dashboard-actions .btn { flex: 1; }

    .account-grid { grid-template-columns: 1fr; }

    .result-actions { flex-direction: column; }

    .error-code { font-size: 4rem; }
}

@media (max-width: 480px) {
    .container { padding: 0 1rem; }
    .hero { padding: 3rem 0 2rem; }
    .hero h1 { font-size: 1.75rem; }
    .pricing-amount { font-size: 2rem; }
    .btn-lg { padding: 0.875rem 1.5rem; font-size: 1rem; }
}
