/**
 * Deposito Trujillo — homepage (/ , cms page athlete2-home-fi) layout fixes.
 * Scoped to .cms-athlete2-home-fi on the CMS homepage route.
 */

.cms-athlete2-home-fi.page-layout-cms-full-width {
    overflow-x: clip;
}

.cms-athlete2-home-fi .page-main,
.cms-athlete2-home-fi .column.main {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    max-width: 100%;
}

.cms-athlete2-home-fi [data-content-type='row'][data-appearance='full-width'] .row-full-width-inner,
.cms-athlete2-home-fi [data-content-type='row'][data-appearance='contained'] .row-full-width-inner {
    padding-left: clamp(12px, 3vw, 32px);
    padding-right: clamp(12px, 3vw, 32px);
    box-sizing: border-box;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
}

.cms-athlete2-home-fi [data-content-type='row'][data-appearance='full-bleed'] {
    margin-left: 0;
    margin-right: 0;
    max-width: 100%;
}

.cms-athlete2-home-fi [data-content-type='row'] {
    margin-bottom: clamp(12px, 2vw, 28px);
}

.cms-athlete2-home-fi [data-content-type='row']:last-child {
    margin-bottom: 0;
}

/* Collapse Page Builder rows that render no visible content (keep widget carousels) */
.cms-athlete2-home-fi [data-content-type='row']:not(
    :has(
        img,
        video,
        iframe,
        .widget-product-carousel,
        .ox-carousel,
        .owl-carousel,
        .slider-heroca-1-horario-de-atencion,
        [data-content-type='products'],
        [data-content-type='slider'],
        [data-content-type='html'],
        .sponsor-slider,
        .seccion-caja-promo-sika,
        .mastercard-promo,
        .trujillo-container,
        #gift-container,
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        p
    )
) {
    display: none;
}

.cms-athlete2-home-fi [data-content-type='row'][data-appearance='full-bleed'] img,
.cms-athlete2-home-fi [data-content-type='row'][data-appearance='full-width'] img {
    display: block;
    width: 100%;
}

.cms-athlete2-home-fi figure[data-content-type='image'] {
    margin: 0;
}

.cms-athlete2-home-fi figure[data-content-type='image'] img {
    border-radius: 8px;
}

.cms-athlete2-home-fi .hero-banner .row-full-width-inner {
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

.cms-athlete2-home-fi .hero-banner.hero-banner--ratio-1920-500 {
    margin-bottom: clamp(8px, 1.5vw, 16px);
}

.cms-athlete2-home-fi .hero-banner.hero-banner--ratio-1920-500 .row-full-width-inner,
.cms-athlete2-home-fi .hero-banner.hero-banner--ratio-1920-500 [data-content-type='banner'] {
    min-height: 0;
}

.cms-athlete2-home-fi .hero-banner img {
    width: 100%;
    height: auto;
    display: block;
}

/* Hide off-screen responsive duplicate blocks */
.cms-athlete2-home-fi .articulos-destacados-movil {
    position: static !important;
    top: auto !important;
    left: auto !important;
}

.cms-athlete2-home-fi img,
.cms-athlete2-home-fi video {
    max-width: 100%;
    height: auto;
}

.cms-athlete2-home-fi .pagebuilder-column-group,
.cms-athlete2-home-fi .pagebuilder-column-line {
    flex-wrap: wrap;
    gap: 12px;
}

.cms-athlete2-home-fi .pagebuilder-column {
    min-width: 0;
}

/* Trust / benefits cards */
.cms-athlete2-home-fi .seccion-caja-promo-sika,
.cms-athlete2-home-fi .seccion-caja-promo-sika2 {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 clamp(12px, 3vw, 24px);
    box-sizing: border-box;
}

.cms-athlete2-home-fi .seccion-caja-promo-sika {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
}

.cms-athlete2-home-fi .caja-promo-sika {
    flex: 1 1 160px;
    max-width: 200px;
    min-width: 140px;
}

/* Sponsor / brand sliders */
.cms-athlete2-home-fi .sponsor-slider {
    overflow: hidden;
    width: 100%;
}

.cms-athlete2-home-fi .sponsor-slider .slider-track {
    display: flex;
    align-items: center;
    gap: 32px;
}

.cms-athlete2-home-fi .sponsor-slider,
.cms-athlete2-home-fi .mastercard-promo,
.cms-athlete2-home-fi .trujillo-container {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(12px, 3vw, 24px);
    padding-right: clamp(12px, 3vw, 24px);
    box-sizing: border-box;
}

.cms-athlete2-home-fi .mastercard-promo .promo-cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}

.cms-athlete2-home-fi .mastercard-promo .promo-card {
    flex: 1 1 140px;
    max-width: 180px;
}

.cms-athlete2-home-fi .trujillo-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}

.cms-athlete2-home-fi .trujillo-img-col,
.cms-athlete2-home-fi .trujillo-content-col {
    flex: 1 1 280px;
    min-width: 0;
}

.cms-athlete2-home-fi .trujillo-phones-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 10px;
}

/* Brand grid — "Descubre los mejores precios" */
.cms-athlete2-home-fi .hero-banner:has(#gift-container) {
    padding: clamp(16px, 3vw, 32px) 0;
}

.cms-athlete2-home-fi .hero-banner:has(#gift-container) .row-full-width-inner {
    max-width: 1200px;
    padding-left: clamp(12px, 3vw, 24px);
    padding-right: clamp(12px, 3vw, 24px);
}

.cms-athlete2-home-fi #gift-container {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px 28px;
    margin: 0 auto;
    max-width: 1100px;
}

.cms-athlete2-home-fi .gift-item {
    width: auto !important;
    max-width: 150px;
    margin: 0 auto;
}

.cms-athlete2-home-fi .gift-item.more-items {
    display: block !important;
}

.cms-athlete2-home-fi .gift-item > div {
    position: relative;
    width: 130px;
    height: 130px;
    margin: 0 auto;
}

.cms-athlete2-home-fi .gift-item img {
    position: relative;
    z-index: 2;
    display: block;
    width: 130px !important;
    height: 130px !important;
    border-radius: 50%;
    object-fit: contain;
    background: #fff;
    box-sizing: border-box;
    padding: 8px;
}

.cms-athlete2-home-fi .gift-item svg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    pointer-events: none;
}

.cms-athlete2-home-fi .gift-item p {
    margin-top: 10px;
    color: #fff;
}

.cms-athlete2-home-fi #toggle-more {
    display: none;
}

/* Featured products grid */
.cms-athlete2-home-fi .articulos-destacados-pc .pagebuilder-column-line {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.cms-athlete2-home-fi .columna-articulos-destacados {
    flex: 1 1 220px;
    max-width: 320px;
}

.cms-athlete2-home-fi .img-articulos-destacados {
    width: 100%;
    display: block;
    border-radius: 12px;
}

/* PageBuilder product carousels */
.cms-athlete2-home-fi ol.widget-product-carousel {
    margin: 0 auto;
    max-width: 1280px;
    padding: 0 clamp(8px, 2vw, 20px);
    box-sizing: border-box;
}

.cms-athlete2-home-fi [data-content-type='products'][data-appearance='carousel'] {
    overflow: hidden;
}

.cms-athlete2-home-fi [data-content-type='products'][data-appearance='carousel'] .product-item {
    height: 100%;
}

/* Olegnax hero carousel widget row */
.cms-athlete2-home-fi .column.main > [data-content-type='row']:first-child,
.cms-athlete2-home-fi .column.main > div:first-child {
    margin-top: 0;
}

.cms-athlete2-home-fi .slider-heroca-1-horario-de-atencion {
    width: 100%;
    overflow: hidden;
    margin: 0;
    line-height: 0;
}

.cms-athlete2-home-fi .slider-heroca-1-horario-de-atencion .ox-carousel,
.cms-athlete2-home-fi .slider-heroca-1-horario-de-atencion .owl-carousel {
    margin: 0;
}

.cms-athlete2-home-fi .slider-heroca-1-horario-de-atencion img {
    width: 100%;
    display: block;
}

/* -------------------------------------------------------------------------- */
/* Hero carousel (bannerprincipal_home) — avoid clipping promo text           */
/* -------------------------------------------------------------------------- */
.cms-athlete2-home-fi .bannerprincipal_home,
.cms-athlete2-home-fi .bannerprincipal_home .ox-carousel,
.cms-athlete2-home-fi .bannerprincipal_home .owl-carousel {
    overflow: hidden;
    max-width: 100%;
}

.cms-athlete2-home-fi .bannerprincipal_home .ox-carousel__img,
.cms-athlete2-home-fi .bannerprincipal_home .owl-item img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center center;
}

/* -------------------------------------------------------------------------- */
/* Promo product strip (#magento-grid) under hero                             */
/* Inline styles use flex: 1 1 43% which leaves the 4th tile (Mercado Libre)  */
/* alone on a row at tablet widths — green artwork then looks like a float.   */
/* -------------------------------------------------------------------------- */
.cms-athlete2-home-fi #magento-grid-wrapper,
.cms-athlete2-home-fi #magento-grid-wrapper-dup-1,
.cms-index-index #magento-grid-wrapper,
.cms-index-index #magento-grid-wrapper-dup-1 {
    /* Soften the fixed -110px pull-up so tiles don't collide with hero mid-width */
    margin-top: clamp(-72px, -7vw, -24px) !important;
}

.cms-athlete2-home-fi #magento-grid,
.cms-athlete2-home-fi #magento-grid-dup-1,
.cms-index-index #magento-grid,
.cms-index-index #magento-grid-dup-1 {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 16px !important;
}

/* Desktop: prefer 4 across when space allows */
.cms-athlete2-home-fi #magento-grid > .magento-card,
.cms-athlete2-home-fi #magento-grid > a,
.cms-athlete2-home-fi #magento-grid-dup-1 > .magento-card,
.cms-athlete2-home-fi #magento-grid-dup-1 > a,
.cms-index-index #magento-grid > .magento-card,
.cms-index-index #magento-grid > a,
.cms-index-index #magento-grid-dup-1 > .magento-card,
.cms-index-index #magento-grid-dup-1 > a {
    flex: 1 1 calc(25% - 16px) !important;
    max-width: 265px !important;
    min-width: 0 !important;
    box-sizing: border-box;
}

/* Tablet (~900–1100): force balanced 2×2 instead of 3+1 */
@media (max-width: 1100px) {
    .cms-athlete2-home-fi #magento-grid > .magento-card,
    .cms-athlete2-home-fi #magento-grid > a,
    .cms-athlete2-home-fi #magento-grid-dup-1 > .magento-card,
    .cms-athlete2-home-fi #magento-grid-dup-1 > a,
    .cms-index-index #magento-grid > .magento-card,
    .cms-index-index #magento-grid > a,
    .cms-index-index #magento-grid-dup-1 > .magento-card,
    .cms-index-index #magento-grid-dup-1 > a {
        flex: 1 1 calc(50% - 16px) !important;
        max-width: calc(50% - 12px) !important;
    }
}

@media (max-width: 768px) {
    .cms-athlete2-home-fi [data-content-type='row'][data-appearance='full-width'] .row-full-width-inner {
        padding-left: 12px;
        padding-right: 12px;
    }

    .cms-athlete2-home-fi .gift-item.more-items {
        display: none !important;
    }

    .cms-athlete2-home-fi .gift-item.more-items.is-expanded {
        display: block !important;
    }

    .cms-athlete2-home-fi #toggle-more {
        display: inline-block;
    }

    .cms-athlete2-home-fi .caja-promo-sika {
        flex: 1 1 calc(50% - 12px);
        max-width: none;
    }

    .cms-athlete2-home-fi .trujillo-btn {
        display: block !important;
        width: 100%;
        max-width: 320px;
        margin: 0 auto;
        padding-left: 16px !important;
        padding-right: 16px !important;
        box-sizing: border-box;
    }

    .cms-athlete2-home-fi .mastercard-promo .promo-top {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    /* Mobile: still 2×2 for the 4-tile promo strip */
    .cms-athlete2-home-fi #magento-grid > .magento-card,
    .cms-athlete2-home-fi #magento-grid > a,
    .cms-athlete2-home-fi #magento-grid-dup-1 > .magento-card,
    .cms-athlete2-home-fi #magento-grid-dup-1 > a,
    .cms-index-index #magento-grid > .magento-card,
    .cms-index-index #magento-grid > a,
    .cms-index-index #magento-grid-dup-1 > .magento-card,
    .cms-index-index #magento-grid-dup-1 > a {
        flex: 1 1 calc(50% - 12px) !important;
        max-width: calc(50% - 8px) !important;
    }

    .cms-athlete2-home-fi #magento-grid-wrapper,
    .cms-athlete2-home-fi #magento-grid-wrapper-dup-1,
    .cms-index-index #magento-grid-wrapper,
    .cms-index-index #magento-grid-wrapper-dup-1 {
        margin-top: -24px !important;
    }
}