/* ===== HERO — Intro video card ===== */
.intro__content .intro__content__video,
a.intro-video.intro__content__video {
    padding-top: 0 !important;
    aspect-ratio: 9 / 16 !important;
    height: auto !important;
    max-height: min(42vh, 320px);
}

.intro__content__video > .background {
    right: 0;
    bottom: 0;
}

.intro__content__video .intro-video__button {
    --icon-width: 56;
    --icon-height: 56;
    transform: scale(0.72);
    transform-origin: bottom left;
}

/* ===== WOW section — 5ma.jpg fondo, video card lower ===== */
.wow-top__background img {
    object-fit: cover;
    object-position: center 35%;
}

.wow-top__video {
    transform: translateY(-15%) !important;
}

/* ===== HOW-TO-USE section — 23m.jpg fondo ===== */
.how-to-use__content__sticky__bg img {
    object-fit: contain;
    object-position: center 40%;
}

/* --- How-to-use cards: desktop (>=980px) --- */
@media (min-width: 980px) {
    .how-to-use__content__list > li {
        height: auto !important;
        align-self: flex-start !important;
    }

    .how-to-use-card,
    .how-to-use-card--bigger,
    .how-to-use-card--last {
        overflow: hidden !important;
        max-height: none !important;
        height: auto !important;
        justify-content: flex-start !important;
        padding: 14px 24px 16px !important;
        gap: 10px !important;
    }

    .how-to-use-card--bigger .how-to-use-card__content,
    .how-to-use-card--last .how-to-use-card__content {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .how-to-use-card__counter-box {
        margin-bottom: 0 !important;
    }

    .how-to-use-card__content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        height: auto !important;
        overflow: hidden !important;
        padding-top: 0 !important;
        gap: 12px !important;
    }

    .how-to-use-card__content:before {
        display: none !important;
    }

    .how-to-use-card__image,
    .how-to-use-card--first .how-to-use-card__image,
    .how-to-use-card--mobile-full .how-to-use-card__image,
    .how-to-use-card--last .how-to-use-card__image {
        position: relative !important;
        bottom: auto !important;
        left: auto !important;
        width: 82% !important;
        max-width: 82% !important;
        height: auto !important;
        aspect-ratio: 4 / 3 !important;
        flex: 0 0 auto !important;
        min-height: 0 !important;
        overflow: hidden !important;
        margin: 0 auto !important;
        border-radius: 12px !important;
    }

    .how-to-use-card__image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    .how-to-use-card__content h3 {
        padding-bottom: 4px !important;
    }
}

/* --- How-to-use cards: móvil (<980px) --- */
@media (max-width: 979px) {
    .how-to-use {
        padding-top: 0 !important;
    }

    .how-to-use__content__sticky__overflow {
        height: auto !important;
        min-height: 100vh;
    }

    .how-to-use__content__sticky__lines {
        display: none !important;
    }

    .how-to-use__content__title {
        position: relative !important;
        bottom: auto !important;
        padding: 60px 0 24px !important;
    }

    .how-to-use__content__sticky__tabs {
        padding-bottom: 40px !important;
    }

    .how-to-use__content__list {
        flex-direction: column !important;
        gap: 16px !important;
        padding: 0 20px !important;
    }

    .how-to-use__content__list > li {
        flex: none !important;
        width: 100% !important;
        height: auto !important;
        margin-left: 0 !important;
    }

    .how-to-use-card,
    .how-to-use-card--bigger,
    .how-to-use-card--last {
        overflow: hidden !important;
        max-height: none !important;
        height: auto !important;
        justify-content: flex-start !important;
        padding: 14px 20px 16px !important;
        gap: 10px !important;
    }

    .how-to-use-card--bigger .how-to-use-card__content,
    .how-to-use-card--last .how-to-use-card__content {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .how-to-use-card__counter-box {
        margin-bottom: 0 !important;
    }

    .how-to-use-card__content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        height: auto !important;
        overflow: hidden !important;
        padding-top: 0 !important;
        gap: 10px !important;
    }

    .how-to-use-card__content:before {
        display: none !important;
    }

    .how-to-use-card__image,
    .how-to-use-card--first .how-to-use-card__image,
    .how-to-use-card--mobile-full .how-to-use-card__image,
    .how-to-use-card--last .how-to-use-card__image {
        position: relative !important;
        bottom: auto !important;
        left: auto !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 4 / 3 !important;
        flex: 0 0 auto !important;
        min-height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        border-radius: 10px !important;
    }

    .how-to-use-card__image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    .how-to-use-card__content h3 {
        font-size: 14px !important;
        padding-bottom: 2px !important;
    }
}

/* ===== CTA WhatsApp — fondo con las chicas Martina ===== */
.partner__girls > div {
    width: 100% !important;
    max-width: 100%;
}

.partner__girls picture img {
    object-fit: contain !important;
    object-position: bottom center;
}

/* ===== FOOTER — layout limpio ===== */
.footer {
    position: relative;
    z-index: 2;
}

.footer__content {
    position: relative;
    z-index: 1;
    padding-top: clamp(24px, 4vw, 48px) !important;
    padding-bottom: clamp(18px, 3vw, 36px) !important;
}

.footer__content__upper-row {
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: clamp(16px, 2vw, 28px);
    margin-bottom: clamp(20px, 3vw, 40px) !important;
}

.footer__logo {
    display: block !important;
    margin-right: 0 !important;
}

.footer__logo .btn__icon {
    filter: invert(1) brightness(0.2);
    width: clamp(96px, 10vw, 130px);
    height: auto;
}

.footer__contacts {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.footer__contacts--socials {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 0 !important;
}

.footer__contacts--socials .icon-link + .icon-link {
    margin-left: 0 !important;
}

.footer__icon-whatsapp {
    width: 24px !important;
    height: 24px !important;
    object-fit: contain !important;
    border-radius: 0;
}

.footer__contacts--email {
    text-align: center;
    font-weight: 500;
}

.footer__content__lower-row {
    border-top: 1px solid rgba(44, 48, 62, 0.14);
    padding-top: 14px;
}

/* ===== RESPONSIVE — Tablet (max 979px) ===== */
@media (max-width: 979px) {
    .intro__content .intro__content__video,
    a.intro-video.intro__content__video {
        width: min(160px, 38vw) !important;
        max-height: min(38vh, 280px);
    }

    /* --- WOW section --- */
    .wow-top__video {
        transform: translateY(-10%) !important;
    }

    /* --- With-you (Belleza profesional) --- */
    .with-you__lines {
        display: none !important;
    }

    .with-you__content__image {
        width: 100% !important;
        max-width: 100% !important;
    }

    .with-you-card {
        border-radius: 18px !important;
        overflow: hidden !important;
        box-shadow:
            0 4px 24px rgba(0, 0, 0, 0.10),
            0 1.5px 6px rgba(0, 0, 0, 0.06) !important;
    }

    .with-you-card__content {
        padding: 24px 20px 20px !important;
    }

    .with-you-card__content__header {
        margin-bottom: 14px !important;
    }

    .with-you-card__content__main__text {
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    .with-you__cards-list {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .with-you__cards-list__item {
        padding-bottom: 16px !important;
    }

    /* --- Reviews --- */
    .reviews {
        padding-top: 50px !important;
        padding-bottom: 40px !important;
    }

    .reviews__title {
        margin-bottom: 30px !important;
    }

    .reviews-carousel__content {
        flex-direction: column !important;
        align-items: center !important;
        gap: 20px !important;
    }

    /* --- Partner / CTA WhatsApp --- */
    .partner__title {
        font-size: clamp(28px, 8vw, 42px) !important;
        text-align: center !important;
    }

    .partner__content {
        flex-direction: column !important;
        gap: 16px !important;
    }

    .partner__content__text {
        border-radius: 16px !important;
    }

    .partner__content__button {
        border-radius: 16px !important;
        min-height: 140px !important;
    }

    /* --- Footer --- */
    .footer__content__upper-row {
        grid-template-columns: 1fr;
        text-align: center;
        justify-items: center;
        gap: 14px;
        margin-bottom: 18px !important;
    }

    .footer__copyright.is-hidden--sm-down {
        display: none !important;
    }

    .footer__content__lower-row {
        flex-direction: column;
        align-items: center;
        gap: 12px;
        text-align: center;
        padding-top: 12px;
    }

    .footer__vig {
        position: static !important;
        transform: none !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 2px;
    }
}

/* ===== RESPONSIVE — Móvil (max 567px) ===== */
@media (max-width: 567px) {
    /* --- Intro --- */
    .intro__content .intro__content__video,
    a.intro-video.intro__content__video {
        width: min(120px, 35vw) !important;
        max-height: min(34vh, 220px);
    }

    .intro__content__video .intro-video__button {
        transform: scale(0.55);
    }

    .intro__content__title .text--intro-title {
        font-size: clamp(32px, 10vw, 48px) !important;
    }

    /* --- WOW --- */
    .wow-top__background img {
        object-position: center 45%;
    }

    .wow-top__video {
        transform: translateY(-5%) !important;
    }

    .wow-middle {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }

    /* --- Benefits --- */
    .benefits__block {
        padding-top: 40px !important;
    }

    .benefits__block__content__title {
        margin-top: 20px !important;
        margin-bottom: 30px !important;
        font-size: 18px !important;
    }

    /* --- How to use --- */
    .how-to-use__content__title h2 {
        font-size: clamp(24px, 7vw, 36px) !important;
    }

    .how-to-use__content__tabs {
        min-height: 36px !important;
    }

    .how-to-use__content__tab {
        font-size: 12px !important;
        padding: 0 14px !important;
    }

    .how-to-use__content__list {
        gap: 12px !important;
        padding: 0 16px !important;
    }

    .how-to-use-card,
    .how-to-use-card--bigger,
    .how-to-use-card--last {
        padding: 12px 16px 14px !important;
    }

    /* --- Partner / CTA WhatsApp --- */
    .partner {
        padding-top: 40px !important;
    }

    .partner__girls picture img {
        object-position: top center;
    }

    .partner__content__text {
        padding: 14px 16px 16px !important;
    }

    .partner__content__button {
        min-height: 120px !important;
        padding: 40px 16px !important;
    }

    .partner__container {
        padding-bottom: 30px !important;
    }

    /* --- Reviews --- */
    .reviews {
        padding-top: 40px !important;
        padding-bottom: 30px !important;
    }

    .reviews__title {
        margin-bottom: 24px !important;
        font-size: clamp(24px, 7vw, 36px) !important;
    }

    /* --- Footer --- */
    .footer__logo .btn__icon {
        width: 90px;
    }

    .footer__content {
        padding-top: 20px !important;
        padding-bottom: 16px !important;
    }

    .footer__content__upper-row {
        gap: 12px;
        margin-bottom: 14px !important;
    }

    .footer__contacts--email {
        font-size: 13px;
    }
}

/* Wow middle — icono visible sobre fondo claro */
.wow-middle__bottom .divider-content-top__feature-box__icon-box {
    color: var(--t-heading);
}

.wow-middle__bottom .divider-content-top__feature-box__icon-box .icon-care {
    display: inline-block;
    overflow: visible;
}

@media (min-width: 1920px) and (min-height: 700px) {
    .wow-middle__bottom .divider-content-top__feature-box__icon-box .icon-care {
        --icon-width: 60;
        --icon-height: 60;
    }
}

/* Description — ocultar feature y líneas en móvil/tablet */
@media (max-width: 979px) {
    .description__info > .col:first-child,
    .description__info__divider-box {
        display: none !important;
    }

    .description__info {
        margin-top: 20px !important;
        padding-top: 0 !important;
    }

    .description__title {
        margin-bottom: 12px;
    }
}
