/* ENDOLIFTER — responsive.css */

@media (max-width: 1024px) {
    :root { --section-pad: 80px; }

    .cards-grid--3, .cards-grid--4, .posts-grid, .resenas-grid, .dif-grid { grid-template-columns: repeat(2, 1fr); }
    .que-es__grid { grid-template-columns: 1fr; gap: 48px; }
    .que-es__media-frame { position: static; }
    .doctor-preview__grid, .doctor-page__grid, .zona-detail { grid-template-columns: 1fr; gap: 40px; }
    .contacto-grid { grid-template-columns: 1fr; gap: 40px; }
    .site-footer__grid { grid-template-columns: repeat(2, 1fr); gap: 36px; }
    .card-info { position: static; }
}

@media (max-width: 768px) {
    :root { --section-pad: 60px; }
    body { padding-top: 64px; padding-bottom: 64px; }

    .main-nav { display: none; }
    .nav-toggle { display: inline-flex; }
    .site-header__cta .btn { display: none; }
    .site-header__cta .nav-toggle { display: inline-flex; }

    .hero { padding: 100px 0 60px; min-height: auto; }
    .hero__cta { flex-direction: column; align-items: stretch; }
    .hero__cta .btn { width: 100%; }
    .hero__badges { gap: 16px; flex-direction: column; align-items: flex-start; }
    .hero__scroll { display: none; }

    .cards-grid--3, .cards-grid--4, .posts-grid, .resenas-grid, .dif-grid, .ig-grid { grid-template-columns: 1fr; }
    .form-grid { grid-template-columns: 1fr; }
    .site-footer__grid { grid-template-columns: 1fr; gap: 32px; }
    .site-footer__bottom { flex-direction: column; align-items: flex-start; }

    .financiacion-box { flex-direction: column; text-align: center; }

    .trust-bar__list { gap: 20px; }
    .trust-bar__item { flex: 1 1 40%; }

    .mobile-bar { display: flex; }

    .resenas-grid {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 16px;
        padding-bottom: 12px;
        -webkit-overflow-scrolling: touch;
    }
    .resenas-grid .resena-card { min-width: 85vw; scroll-snap-align: start; }

    .wa-float { width: 54px; height: 54px; bottom: 80px; right: 16px; }
    .wa-float__tooltip { display: none; }

    .container { padding: 0 20px; }
    .endolifter-form { padding: 24px; }
}

@media (max-width: 480px) {
    h1, .hero__title { font-size: clamp(1.8rem, 8vw, 2.4rem); }
    h2, .section-title { font-size: clamp(1.5rem, 6vw, 2rem); }
    .ig-grid { grid-template-columns: repeat(2, 1fr); }
    .cards-grid--4 { grid-template-columns: 1fr; }
}
