/* =====================================================================
   FDAPT — Styles responsives
   ===================================================================== */

@media (max-width: 1024px) {
    .hero__grid { grid-template-columns: 1fr; }
    .hero__visual { max-width: 480px; margin: 0 auto; padding-bottom: 40px; }
    .hero__mock-card { transform: none; }
    .grid-4 { grid-template-columns: repeat(2, 1fr); }
    .grid-3 { grid-template-columns: repeat(2, 1fr); }
    .steps { grid-template-columns: repeat(2, 1fr); }
    .simulator { grid-template-columns: 1fr; }
    .contact-grid { grid-template-columns: 1fr; }
    .footer__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
    .site-nav {
        position: fixed;
        top: 82px; left: 16px; right: 16px;
        background: #fff;
        border: 1px solid var(--color-gray-100);
        border-radius: 22px;
        flex-direction: column;
        align-items: stretch;
        padding: 16px 16px 20px;
        box-shadow: var(--shadow-lg);
        transform: translateY(-12px);
        opacity: 0;
        pointer-events: none;
        transition: all var(--transition);
    }
    .site-nav.is-open { transform: translateY(0); opacity: 1; pointer-events: auto; }
    .site-nav ul { flex-direction: column; gap: 2px; margin-right: 0; }
    .site-nav ul li a { display: block; padding: 13px 14px; border-radius: 12px; }
    .btn-nav-cta { margin-top: 12px; justify-content: center; }
    .nav-toggle { display: flex; }

    .grid-4, .grid-3, .grid-2 { grid-template-columns: 1fr; }
    .steps { grid-template-columns: 1fr; }
    .form-row { grid-template-columns: 1fr; }
    .form-card { padding: 28px 22px; }
    .footer__grid { grid-template-columns: 1fr; text-align: left; }
    .section { padding: 56px 0; }
    .hero { padding: 60px 0 80px; }
    .hero__floating-card { position: static; margin-top: 16px; max-width: none; }
}

@media (max-width: 480px) {
    .hero__actions { flex-direction: column; }
    .hero__actions .btn { width: 100%; }
    .hero__trust { flex-direction: column; gap: 12px; }
    .hero__floating-card { position: static; margin-top: 16px; max-width: none; }
    .confirmation__reference { font-size: 1.1rem; padding: 14px 18px; }
    .carousel-arrow { width: 38px; height: 38px; }
    .carousel-arrow .icon-svg { width: 16px; height: 16px; }
}
