/* ===== RESPONSIVE ===== */

@media (max-width: 1024px) {
    .hero-layout {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .hero-content {
        max-width: 100%;
        text-align: center;
    }

    .hero-features,
    .hero-actions {
        justify-content: center;
    }

    .hero-visual {
        order: -1;
        max-width: 360px;
        margin: 0 auto;
    }

    .hero-product-card {
        left: 0;
        bottom: -8px;
        max-width: 160px;
    }

    .contact-info { display: none; }

    .privacy-list { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
    .mobile-nav-toggle { display: flex; align-items: center; justify-content: center; }

    .main-nav {
        position: fixed;
        top: var(--header-h);
        right: 0;
        left: 0;
        background: var(--white);
        border-bottom: 1px solid var(--gray-200);
        box-shadow: var(--shadow-lg);
        padding: 16px 20px;
        transform: translateY(-10px);
        opacity: 0;
        visibility: hidden;
        transition: var(--transition);
        z-index: 999;
        flex: unset;
        justify-content: flex-start;
    }

    .main-nav.active {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

    .nav-list {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .nav-link {
        width: 100%;
        justify-content: space-between;
        padding: 14px 16px;
        border: 1px solid var(--gray-100);
        border-radius: var(--radius-sm);
    }

    .dropdown-menu {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: none;
        background: var(--gray-50);
        max-height: 0;
        overflow: hidden;
        padding: 0;
        margin-top: 0;
        transition: max-height 0.3s ease;
    }

    .nav-dropdown.active .dropdown-menu {
        max-height: 320px;
        padding: 8px;
        margin-top: 4px;
    }

    .header-contact .header-btn span.btn-text-full { display: none; }

    .site-tagline { display: none; }

    .footer-content {
        flex-direction: column;
        text-align: center;
        align-items: center;
    }
}

@media (max-width: 768px) {
    :root { --header-h: 64px; }

    .hero-section { padding: 40px 0; }

    .hero-visual { max-width: 300px; }

    .hero-product-card { max-width: 140px; }

    .product-layout {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .product-visual {
        position: static;
        order: -1;
        max-width: 400px;
        margin: 0 auto;
    }

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

    .doctor-message { grid-template-columns: 1fr; text-align: center; }
    .doctor-photo { max-width: 280px; margin: 0 auto; }

    .trust-list { flex-direction: column; align-items: center; }

    .hero-content {
        max-width: 100%;
        text-align: center;
        margin: 0 auto;
    }

    .hero-description { margin-left: auto; margin-right: auto; }

    .hero-features { justify-content: center; }

    .hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .cta-btn,
    .btn-outline,
    .btn-whatsapp {
        justify-content: center;
        width: 100%;
    }

    .contact-method {
        flex-direction: column;
        text-align: center;
    }

    .method-btn { margin-right: 0; width: 100%; text-align: center; }

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

    .whatsapp-float span { display: none; }

    .whatsapp-float a {
        width: 56px;
        height: 56px;
        padding: 0;
        justify-content: center;
        border-radius: 50%;
    }

    .section,
    .cities-section,
    .about-section,
    .contact-section,
    .faq-section { padding: 48px 0; }
}

@media (max-width: 480px) {
    .logo-icon { width: 40px; height: 40px; font-size: 28px; }
    .site-title { font-size: 0.95rem; }
    .header-btn { padding: 10px 16px; font-size: 0.82rem; }
}

.mobile-nav-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 998;
    backdrop-filter: blur(2px);
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}