/* Responsive overrides. @version 1.2.14 */
@media screen and (max-width: 600px) {

    /*
     * No poner overflow-x: hidden en html/body: crea un scrollport raro y en iOS
     * degrada/rompe `position: sticky` (pin del carrusel de beneficios: scrub + “enganche” al scroll).
     * El 100vw del carrusel queda en el contenedor de la sección, no en toda la página.
     */

    h1 {
        font-size: 2.2rem !important;
    }

    header .bc-buttons-group {
        margin-top: 1em !important;
        /* gap:1em !important; */
    }

    header .bc-header-btn {
        margin:0 .3em !important;
    }

    .hero-tarjetas .hero-tarjeta {
        width: 100vw !important;
    }

    .floating-layer__card {
        margin: 0;
        width: 100vw !important;
    }

    .hero-header {
        padding-left: 39vw !important;
    }

    .pre-welcome-text {
        width: 50vw !important;
    }

    #solictar-tarjeta-empresarial,
    #solictar-tarjeta-infinite {
        width: 105% !important;
    }

    .bc-landing-view--infinite .hero-image.hero-image--visible {
        right: -8vw !important;
    }

    .hero-header--overlay .hero-tarjetas {
        margin-left: -9em !important;
    }

    .hero-tarjetas .hero-tarjeta {
        width: 90vw !important;
    }


    /*
     * Carrusel single-track (móvil): 25+50+25 sobre inner 200% hace que en 100vw se vean
     * 2 columnas a la vez (panel + mitad de la tarjeta). Track a 3×100%: cada franja = 100% del ancho
     * del .benefits-carousel; scrub: -2/3 del ancho del inner = recorrido 0 → columna 3.
     */
    .bc-landing .benefits-carousel--single-track .benefits-carousel__inner {
        width: 300% !important;
        max-width: none;
        flex-direction: row !important;
        align-items: stretch !important;
    }

    .bc-landing .benefits-carousel--scroll-scrub .benefits-carousel__inner {
        /* Desplazamiento máximo: 2/3 del ancho del inner (3 columnas de 1/3) */
        transform: translate3d(
            calc(-66.666666% * var(--benefits-scroll-p, 0)),
            0,
            0
        ) !important;
    }

    .bc-landing .benefits-carousel--single-track:not(.benefits-carousel--scroll-scrub)[data-slide="1"] .benefits-carousel__inner {
        transform: translate3d(-66.666666%, 0, 0) !important;
    }

    .bc-landing .benefits-carousel--single-track .benefits-carousel__panel--left,
    .bc-landing .benefits-carousel--single-track .benefits-carousel__panel--right {
        margin-left: 0 !important;
        margin-right: 0 !important;
        flex: 0 0 33.333333% !important;
        width: 33.333333% !important;
        max-width: 33.333333% !important;
    }

    .bc-landing .benefits-carousel--single-track .benefits-carousel__panel {
        flex: 0 0 33.333333% !important;
        width: 33.333333% !important;
        max-width: 33.333333% !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    .bc-landing .benefits-carousel--single-track .benefits-carousel__card-wrap {
        top: -4.3em;
        order: 0 !important;
        flex: 0 0 33.333333% !important;
        width: 33.333333% !important;
        max-width: 33.333333% !important;
        margin: 0 !important;
    }

    /* En desktop, `style.css` usa márgenes -50vw para alinear; en móvil se solapan las columnas. */
    .bc-landing .beneficios-permanentes-card,
    .bc-landing .beneficios-visa-card {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    /* Icono base 300px en style.css: en columna 100% full-bleed seguía desbordando. */
    .bc-landing .benefits-carousel--single-track {
        --carousel-icon-block-width: 100% !important;
    }

    .bc-landing .benefits-carousel--single-track .benefits-carousel__title {
        max-width: 100% !important;
    }

    .bc-landing .benefits-carousel--single-track .benefits-carousel__icon {
        width: 100% !important;
        max-width: 100% !important;
    }

    .bc-landing .benefits-carousel--single-track .benefits-carousel__text {
        max-width: 100% !important;
    }

    .bc-landing .benefits-panel-carousel__viewport {
        overflow: hidden;
        width: 100%;
        min-width: 0;
    }

    .bc-landing .benefits-panel-carousel__slide {
        min-width: 0;
    }

    .bc-landing .benefits-panel-carousel__slide .benefits-carousel__content {
        max-width: 100%;
    }

    /* Condiciones Visa: sin SVG, texto apilado (en desktop el intro permanece oculto en `infinite.css`) */
    .bc-landing .condiciones-aplican-section__banner > svg {
        display: none !important;
    }

    .bc-landing .condiciones-aplican-section__banner {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding: 1.1rem 1rem 1.35rem;
        border-radius: 9999px;
        box-sizing: border-box;
    }

    .bc-landing .condiciones-aplican-section__disclaimer {
        position: static !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        order: 1;
        margin: 0 0 2em 0 !important;
        padding: 0.7rem 0.9rem !important;
        text-align: center;
        color: #fff;
        font-style: italic;
        font-weight: 400;
        font-size: 0.8rem !important;
        line-height: 1.35;
        letter-spacing: 0.01em;
        white-space: normal !important;
        border: 1px solid rgba(255, 255, 255, 0.45);
        border-radius: 9999px;
        background-color: rgba(0, 0, 0, 0.08);
    }

    .bc-landing .condiciones-aplican-section__intro {
        display: block !important;
        order: 2;
        margin: 0 !important;
        padding: 0 0.25rem !important;
        text-align: center;
        color: #fff;
        font-size: 1.05rem !important;
        font-weight: 700;
        line-height: 1.3;
    }

    .bc-landing .condiciones-aplican-section__urls {
        position: static !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        order: 3;
        margin: 0 !important;
        padding: 0 0.25rem !important;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.4em 0.35em;
        text-align: center;
        font-size: 0.9rem !important;
        font-weight: 500;
        line-height: 1.4;
        color: #fff;
    }

    .bc-landing .condiciones-aplican-section__url {
        text-decoration: underline;
        text-underline-offset: 0.12em;
    }


    .bc-landing .landing-infinite__tasa-section .landing-infinite__tasa-cta {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #btn-enlace-empresarial,
    #btn-enlace-infinite {
        margin-left:0 !important;
    }

}