/* ===== Paleta rosa Martina =====
   Conserva #b27676 (--c-cool-dark-blue) en secciones ui-dark.
   En el resto: #FCF2E9 fondos, #FAE9E1 tarjetas, #FDD8D2 acentos. */
:root {
    --c-rose-cream: #FCF2E9;
    --c-rose-cream-rgb: 252, 242, 233;
    --c-rose-soft: #FAE9E1;
    --c-rose-soft-rgb: 250, 233, 225;
    --c-rose-accent: #FDD8D2;
    --c-rose-accent-rgb: 253, 216, 210;
}

/* Fondos claros — crema #FCF2E9 */
.page-content-wrapper.ui-light-lightgray,
.top-sticky__section__content.ui-light-lightgray,
.ui-light-beige.ui-background,
.benefits.ui-light.ui-background,
.benefits .top-sticky__section__content.ui-light.ui-background,
.footer.ui-light.ui-background {
    --t-background: var(--c-rose-cream);
    --t-background-rgb: var(--c-rose-cream-rgb);
}

.ui-light-beige {
    --t-line-alt: var(--c-rose-accent);
    --t-line-alt-rgb: var(--c-rose-accent-rgb);
}

/* Tarjetas y superficies elevadas — rosa suave #FAE9E1 */
.with-you-card.ui-light.ui-background,
.wow__bottom__card__content.ui-light.ui-background,
.how-to-use-card.ui-light-beige,
.clingr-modal__addon.ui-light.ui-background {
    --t-background: var(--c-rose-soft);
    --t-background-rgb: var(--c-rose-soft-rgb);
    background-color: var(--c-rose-soft);
}

/* Acentos — coral #FDD8D2 */


.benefits__block__content__title {
    border-top-color: var(--c-rose-accent);
}

.how-to-use__content__tabs {
    background: var(--c-rose-soft) !important;
}

.how-to-use__content__tabs:before {
    background: var(--c-cool-dark-blue) !important;
}

/* ===== 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;
        background-color: var(--c-rose-soft) !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__bg {
        display: none !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;
    }
}

/* ===== Modal reserva — sin foto decorativa ===== */
.choose-shop .column-one__title,
.choose-shop .column-one__title__decor {
    min-height: 0 !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: none;
    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 sedes: móvil sin efectos, 3 cards ordenadas --- */
    .with-you__lines {
        display: none !important;
    }

    .with-you__sticky,
    .with-you__sticky__content {
        position: relative !important;
        height: auto !important;
    }

    .with-you__content {
        padding-top: 36px !important;
        padding-bottom: 20px !important;
    }

    .with-you__content__image {
        display: none !important;
    }

    .with-you__content__title,
    .with-you__content__text-row {
        transform: none !important;
    }

    .with-you__cards-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
        padding: 0 20px 32px !important;
    }

    .with-you__cards-list__item {
        position: relative !important;
        top: auto !important;
        padding-bottom: 0 !important;
        transform: none !important;
    }

    .with-you-card {
        min-height: 0 !important;
        border-radius: 16px !important;
        overflow: hidden !important;
        box-shadow:
            0 4px 20px rgba(0, 0, 0, 0.08),
            0 1px 4px rgba(0, 0, 0, 0.05) !important;
    }

    .with-you-card__overlay {
        display: none !important;
    }

    .with-you-card__content {
        padding: 18px 16px 16px !important;
        gap: 12px !important;
    }

    .with-you-card__content__header {
        display: flex !important;
        flex-direction: row !important;
        margin-bottom: 10px !important;
        padding: 0 !important;
        align-items: center !important;
        gap: 12px !important;
    }

    .with-you-card__content__header__divider {
        display: none !important;
    }

    .with-you-card__content__header__icon-box {
        width: auto !important;
        justify-content: flex-start !important;
    }

    .with-you-card__content__header__title {
        margin-left: 0 !important;
        padding-bottom: 0 !important;
    }

    .with-you-card__content__main {
        align-items: stretch !important;
        gap: 12px !important;
    }

    .with-you-card__content__main__image {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 12px !important;
        overflow: hidden !important;
        aspect-ratio: 16 / 10 !important;
    }

    .with-you-card__content__main__image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
        border-radius: 0 !important;
        transform: none !important;
    }

    .with-you-card__content__main__text {
        font-size: 14px !important;
        line-height: 1.55 !important;
        text-align: left !important;
        padding: 0 !important;
        margin-top: 0 !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;
    }

    .reviews-carousel__list__item {
        width: min(150px, 40vw) !important;
    }

    .reviews-carousel__list__image {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 390 / 540 !important;
    }

    .reviews-carousel__list__image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !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;
    }

    /* --- With-you sedes --- */
    .with-you__cards-list {
        gap: 12px !important;
        padding: 0 16px 28px !important;
    }

    .with-you-card__content {
        padding: 16px 14px 14px !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;
    }

    .reviews-carousel__list__item {
        width: min(120px, 34vw) !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;
    }
}
