/*
 * Cursos AB — diseño editorial premium (compacto, aire, bordes finos)
 * Serif titular hero • Inter texto • mockups ~50% • sombras suaves
 */

:root {
    --bs-primary: #5c1418;
    --bs-primary-rgb: 92, 20, 24;
    --ab-primary: #5c1418;
    --ab-secondary: #1f1f1f;
    --ab-accent-blue: #3d6ea8;
    --ab-text: #2b2b2b;
    --ab-text-muted: #5f6368;
    --ab-white: #ffffff;
    --ab-cream-panel: #f7f5f2;
    --ab-footer-bg: #6b6b6b;
    --ab-footer-bar: #4a4039;
    --ab-link-gold: #e8cf7a;
    --ab-accent-heading: #1e3a5f;

    --border-subtle: 1px solid rgba(0, 0, 0, 0.08);
    --border-hairline: 1px solid #e6e4e1;

    --font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --font-sans: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 0.75rem;
    --sp-4: 1rem;
    --sp-5: 1.5rem;
    --sp-6: 2rem;
    --sp-7: 2.5rem;
    --sp-8: 3rem;
    --sp-9: 4rem;
    --sp-10: 5rem;
    --sp-11: 6rem;

    /* Ritmo vertical ampliado (≈ x2 respecto al anterior compacto) */
    --section-y: clamp(4rem, 9vw, 7rem);
    --section-y-tight: clamp(2.75rem, 6vw, 4.5rem);
    --section-inner-max: 56rem;
    --section-inline-padding: clamp(1.5rem, 5vw, 3.25rem);
    --carousel-main-max: 42rem;

    --fs-caption: 0.6875rem;
    --fs-small: 0.8125rem;
    --fs-body: 1.0625rem;
    --fs-body-lg: 1.125rem;
    --fs-lead: clamp(1.0625rem, 1.35vw, 1.125rem);
    --fs-subhead: clamp(0.9375rem, 1.25vw, 1rem);
    --fs-h3: clamp(0.9375rem, 1.35vw, 1.0625rem);
    --fs-h2-section: clamp(0.8125rem, 1.15vw + 0.35rem, 1rem);
    --fs-hero-sub: clamp(0.9375rem, 1.4vw, 1.0625rem);
    --fs-hero-kicker: clamp(0.6875rem, 1vw, 0.8125rem);
    --fs-hero-title: clamp(1.75rem, 3vw + 0.75rem, 2.5rem);
    --fs-price: clamp(1.65rem, 3vw, 2.15rem);

    --lh-tight: 1.18;
    --lh-snug: 1.38;
    --lh-body: 1.65;
    --lh-heading: 1.32;

    --radius-ui: 10px;

    --shadow-soft: 0 4px 14px rgba(0, 0, 0, 0.06);
    --shadow-float: 0 8px 28px rgba(0, 0, 0, 0.08);
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--ab-text);
    background: var(--ab-white);
    -webkit-font-smoothing: antialiased;
}

/* === Criterio único de márgenes (Bootstrap .container) === */
.site-header .container,
.site-footer .container,
.site-main .landing-container {
    width: 100%;
    max-width: var(--section-inner-max);
    margin-inline: auto;
    padding-inline: var(--section-inline-padding);
    box-sizing: border-box;
}

/* Ancestros con overflow ≠ visible rompen position:sticky (Polypane / MDN) */
.site-main.site-main--stack {
    overflow: visible;
}

html,
body {
    overflow-x: clip;
    overflow-y: auto;
}

.site-main > section {
    position: relative;
}

.site-main > section .landing-container {
    position: relative;
    z-index: 10;
    pointer-events: auto;
}

.site-main .landing-row {
    --bs-gutter-x: 1.5rem;
}

.site-main .landing-col {
    min-width: 0;
}

.site-main .landing-col img.img-fluid,
.site-main .landing-col > .img-fluid {
    display: block;
    max-width: 100%;
    height: auto;
}

/* fondo2: anula img-fluid (height:auto) en miniaturas */
.site-main .section-fondo2 .cuaderno-thumb.img-fluid {
    width: auto !important;
    height: var(--fondo2-thumb-h) !important;
    max-width: 100%;
    object-fit: contain;
    object-position: bottom center;
}

/* Ritmo común: las secciones respiran por padding interno, no por márgenes externos variables. */
.site-main > section:not(.section-hero) {
    margin-block: 0 !important;
}

/* -------------------------------------------------------------------------
   Apilamiento por capas (JS: stack-scroll.js) — desktop ≥992px
   Host reserva altura; .stack-pin-layer fija top:0 cuando .is-stack-pin-active
   ------------------------------------------------------------------------- */
.site-main--stack > section {
    margin-block: 0;
}

@media (min-width: 992px) {
    .site-main--stack.is-stack-ready > section {
        position: relative;
    }

    /* Host pin: espacio en el flujo del documento */
    .site-main--stack.is-stack-ready > section.stack-pin-host {
        position: relative;
        z-index: var(--stack-z, 10);
        min-height: var(--stack-min-h, 100vh);
        min-height: var(--stack-min-h, 100svh);
        overflow: visible;
        background: transparent;
        box-shadow: none;
    }

    .site-main--stack.is-stack-ready > section.stack-pin-host.parallax-container {
        overflow: visible;
        isolation: auto;
    }

    .site-main--stack.is-stack-ready > section.stack-pin-host .stack-pin-spacer {
        display: block;
        width: 100%;
        height: 0;
        pointer-events: none;
    }

    /* Capa en flujo normal hasta que JS activa el pin */
    .site-main--stack.is-stack-ready > section.stack-pin-host .stack-pin-layer {
        position: relative;
        width: 100%;
        min-height: 100vh;
        min-height: 100svh;
        overflow: hidden;
    }

    /* Pin activo: top:0 + z-index (la sección siguiente cubre por encima) */
    .site-main--stack.is-stack-ready > section.stack-pin-host.is-stack-pin-active .stack-pin-layer {
        position: fixed;
        top: var(--stack-top, 0);
        left: 0;
        right: 0;
        width: 100%;
        height: 100vh;
        height: 100svh;
        z-index: var(--stack-z, 10);
        overflow: hidden;
    }

    .site-main--stack.is-stack-ready > section.stack-pin-host.is-stack-pin-past .stack-pin-layer {
        visibility: hidden;
        pointer-events: none;
    }

    /* Pin inferior: bottom:0 (mismo tramo scroll que top; JS refuerza top/bottom) */
    .site-main--stack.is-stack-ready > section.stack-pin-host--bottom.is-stack-pin-active .stack-pin-layer {
        position: fixed;
        top: auto !important;
        bottom: var(--stack-bottom, 0) !important;
        left: 0;
        right: 0;
        width: 100%;
        height: 100vh;
        height: 100svh;
        z-index: var(--stack-z, 10);
    }

    .site-main--stack.is-stack-ready > section.stack-pin-host.section-escritura .stack-pin-layer,
    .site-main--stack.is-stack-ready > section.stack-pin-host.section-testimonios .stack-pin-layer,
    .site-main--stack.is-stack-ready > section.stack-pin-host.section-cuadernos .stack-pin-layer {
        background-color: #f8f5f0;
    }

    /* Sección que cubre: z-index por encima de la capa pinneada (sin solapar otras pin) */
    .site-main--stack.is-stack-ready > section.section-carousel {
        position: relative;
        z-index: 60;
        background-color: #f8f5f0;
    }

    .site-main--stack.is-stack-ready > section.section-quote {
        position: relative;
        z-index: 90;
        background-color: #f8f5f0;
    }

    .site-main--stack.is-stack-ready > section.section-pago {
        position: relative;
        z-index: 110;
        background-color: #f8f5f0;
    }

    .site-main--stack.is-stack-ready > section.section-faq {
        position: relative;
        z-index: 115;
        background-color: #f8f5f0;
    }

    /* Videos por debajo de testimonios pin (70 < 80) */
    .site-main--stack.is-stack-ready > section.section-videos {
        z-index: 70;
        background-color: var(--ab-cream-panel, #f7f5f2);
    }

    .site-main--stack.is-stack-ready > section.stack-pin-host .parallax-moving-layer {
        top: 0;
        left: 0;
        right: 0;
        height: 100%;
        z-index: 0;
    }

    .site-main--stack.is-stack-ready > section.stack-pin-host .landing-container {
        position: relative;
        z-index: 10;
    }

    /* Hero */
    .site-main--stack.is-stack-ready > section.stack-pin-host.section-hero .stack-pin-layer {
        background-color: #120a0c;
    }

    .site-main--stack.is-stack-ready > section.stack-pin-host.section-hero .stack-pin-layer::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background: linear-gradient(
            165deg,
            rgba(10, 8, 12, 0.58) 0%,
            rgba(32, 16, 20, 0.48) 42%,
            rgba(12, 9, 11, 0.58) 100%
        );
    }

    /* Multimedia (3.ª sección) */
    .site-main--stack.is-stack-ready > section.stack-pin-host.section-media .stack-pin-layer {
        background-color: var(--ab-cream-panel);
    }

    /* Secciones que cubren (z-index mayor que la capa pinneada, fondo opaco) */
    .site-main--stack.is-stack-ready > section:not(.stack-pin-host) {
        position: relative;
        box-shadow: 0 -20px 50px rgba(8, 6, 5, 0.12);
    }

    .site-main--stack.is-stack-ready > section.section-fondo2.is-stack-covering,
    .site-main--stack.is-stack-ready > section.section-pilares.is-stack-covering {
        z-index: calc(var(--stack-z, 10) + 10);
    }

    /* Pilares no debe tapar escritura (40 < 50) */
    .site-main--stack.is-stack-ready > section.section-pilares {
        z-index: 40;
    }

    .site-main--stack.is-stack-ready > section.is-stack-covering {
        box-shadow: 0 -26px 60px rgba(8, 6, 5, 0.16);
    }

    .site-main--stack.is-stack-ready > section.section-fondo2 {
        background-color: #f8f5f0;
    }

    .site-main--stack.is-stack-ready > section.section-pilares {
        background-color: #f8f5f0;
    }
}

@media (max-width: 991.98px) {
    .site-main--stack > section:not(.section-hero),
    .site-main--stack > section.stack-pin-host:not(.section-hero) .stack-pin-layer {
        position: static !important;
        top: auto !important;
        bottom: auto !important;
        min-height: auto !important;
        height: auto !important;
        z-index: auto !important;
        box-shadow: none !important;
    }

    .site-main--stack > section.section-hero,
    .site-main--stack > section.section-hero .stack-pin-layer {
        position: relative !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        box-shadow: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-main--stack > section {
        position: static !important;
        top: auto !important;
        min-height: auto !important;
        z-index: auto !important;
    }
}

/* Carrusel principal — diapositiva central + laterales visibles */
.main-carousel {
    --carousel-slide-w: min(17.5rem, 62vw);
    --carousel-img-max-h: min(14rem, 32vh);
    position: relative;
    width: 100%;
    max-width: var(--carousel-main-max);
    margin-inline: auto;
    padding-inline: clamp(2rem, 5vw, 2.75rem);
}

.main-carousel__viewport {
    overflow: hidden;
    width: 100%;
    border-radius: var(--radius-ui);
}

.main-carousel__track {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: clamp(0.45rem, 1.2vw, 0.85rem);
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
}

.main-carousel__slide {
    flex: 0 0 var(--carousel-slide-w);
    width: var(--carousel-slide-w);
    max-width: var(--carousel-slide-w);
    min-width: 0;
    opacity: 0.5;
    transform: scale(0.9);
    transition:
        opacity 0.4s ease,
        transform 0.4s ease;
}

.main-carousel__slide.is-active {
    opacity: 1;
    transform: scale(1);
}

.main-carousel__img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: var(--carousel-img-max-h);
    margin-inline: auto;
    object-fit: contain;
    border-radius: var(--radius-ui);
    background-color: #fff;
    box-shadow: var(--shadow-soft);
}

.main-carousel__arrow {
    position: absolute;
    top: 50%;
    z-index: 3;
    transform: translateY(-50%);
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: var(--shadow-soft);
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.main-carousel__arrow:hover {
    background: #fff;
    box-shadow: var(--shadow-float);
}

.main-carousel__arrow--prev {
    left: 0;
}

.main-carousel__arrow--next {
    right: 0;
}

.main-carousel__arrow-icon {
    display: block;
    width: 0.55rem;
    height: 0.55rem;
    margin: auto;
    border: solid currentColor;
    border-width: 0 2px 2px 0;
    color: rgba(30, 28, 26, 0.75);
}

.main-carousel__arrow--prev .main-carousel__arrow-icon {
    transform: rotate(135deg);
    margin-left: 0.15rem;
}

.main-carousel__arrow--next .main-carousel__arrow-icon {
    transform: rotate(-45deg);
    margin-right: 0.15rem;
}

.main-carousel__dots {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--sp-2);
    margin-top: var(--sp-4);
}

.main-carousel__dot {
    width: 6px;
    height: 6px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.2);
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.main-carousel__dot.active,
.main-carousel__dot[aria-current='true'] {
    background-color: rgba(92, 20, 24, 0.55);
    transform: scale(1.15);
}

@media (min-width: 992px) {
    .main-carousel {
        --carousel-slide-w: min(18rem, 44%);
        --carousel-img-max-h: min(15rem, 30vh);
    }
}

/* -------------------------------------------------------------------------
   Tipografía landing — 2 familias
   • Cormorant Garamond (--font-serif): títulos de sección (h2)
   • Inter (--font-sans): subtítulos, leads, párrafos, UI
   ------------------------------------------------------------------------- */
.site-main h2.display-6,
.site-main h2.landing-title,
.site-main .landing-title,
.site-main .section-faq__title {
    font-family: var(--font-serif);
    font-weight: 700;
    color: var(--ab-secondary);
}

.site-main .section-fondo2__lead,
.site-main .section-media__lead,
.site-main .landing-lead-lg {
    font-family: var(--font-sans);
    font-weight: 700;
    color: var(--ab-text);
}

.site-main .section-fondo2__lead.text-secondary,
.site-main .section-media__lead.text-dark {
    color: var(--ab-text) !important;
}

.site-main .cuaderno-cta-line {
    font-family: var(--font-sans);
    font-weight: 600;
    color: var(--ab-text-muted);
}

.site-main .landing-col h3.fs-5,
.site-main .landing-col h3.text-uppercase {
    font-family: var(--font-sans);
    font-weight: 600;
    color: var(--ab-text);
}

.site-main .lead {
    font-family: var(--font-sans);
    font-weight: 500;
}

/* Ajuste fino títulos largos con utilidades display-* */
.landing-title {
    letter-spacing: 0.05em;
    text-wrap: balance;
    font-size: clamp(0.92rem, 0.95vw + 0.68rem, 1.28rem);
    line-height: var(--lh-heading);
    text-align: center;
}

.site-main h2.display-6 {
    text-align: center;
    text-wrap: balance;
}

/* Cabecera */
.site-header {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--bs-border-color-translucent);
    box-shadow: var(--bs-box-shadow-sm);
}

.site-header .container {
    padding-block: var(--sp-3);
}

@media (min-width: 768px) {
    .site-header .container {
        padding-block: var(--sp-4);
    }
}

.header-logo,
.custom-logo-link img {
    max-height: 3.25rem;
    width: auto;
}

@media (min-width: 768px) {
    .header-logo,
    .custom-logo-link img {
        max-height: 3.75rem;
    }
}

.site-nav .navbar-nav {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

.site-nav .navbar-nav a {
    color: var(--ab-primary);
    font-weight: 600;
    font-family: var(--font-sans);
    font-size: var(--fs-small);
    letter-spacing: 0.03em;
    text-decoration: none;
}

.site-nav .navbar-nav a:hover {
    color: var(--ab-accent-heading);
}

.navbar-toggler {
    border: 1px solid var(--bs-border-color-translucent);
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 0.15rem rgba(30, 58, 95, 0.12);
}

.navbar-toggler-icon {
    opacity: 0.75;
}

/* Hero — velo sobre imagen; altura y espaciado vía utilidades Bootstrap (.min-vh-100 .py-5) */
.section-hero {
    position: relative;
    background-size: cover;
    background-position: center center;
}

.section-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: linear-gradient(
        165deg,
        rgba(10, 8, 12, 0.58) 0%,
        rgba(32, 16, 20, 0.48) 42%,
        rgba(12, 9, 11, 0.58) 100%
    );
}

@media (min-width: 1025px) {
    .section-hero:not(.parallax-container) {
        background-attachment: fixed;
    }
}

@media (max-width: 1024px) {
    .section-fondo2,
    .section-media,
    .section-pilares,
    .section-escritura,
    .section-cuadernos {
        background-attachment: scroll !important;
    }
}

/* Hero: mismo container que el resto; bloque de texto más estrecho y centrado */
.section-hero .landing-col {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.section-hero .hero-text-block {
    width: 100%;
    max-width: min(46rem, 100%);
    margin-inline: auto;
    text-align: center;
}

.section-hero .hero-title-wrap,
.section-hero .hero-title,
.section-hero .hero-title__text {
    text-align: center;
}

.hero-kicker {
    font-family: var(--font-sans);
    font-size: var(--fs-hero-kicker);
    font-weight: 600;
    line-height: var(--lh-snug);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.94);
    margin-bottom: var(--sp-5);
    text-align: center;
}

.hero-title-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: var(--sp-5);
}

.hero-title {
    font-family: var(--font-serif);
    font-size: var(--fs-hero-title);
    font-weight: 700;
    line-height: var(--lh-tight);
    letter-spacing: 0.01em;
    color: #fff;
    text-wrap: balance;
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    text-align: center;
}

.hero-title__text {
    display: inline;
    text-align: center;
}

.hero-title__cursor {
    display: inline-block;
    width: 0;
    min-height: 0.92em;
    margin-left: 0.12em;
    vertical-align: baseline;
    border-right: 2px solid rgba(255, 180, 140, 0.95);
    animation: cursor-parpadeo 0.8s step-end infinite;
}

.hero-subtitle-wrap {
    margin-top: var(--sp-3);
    text-align: center;
}

.hero-subtitle {
    font-family: var(--font-sans);
    font-size: var(--fs-hero-sub);
    font-weight: 500;
    line-height: var(--lh-snug);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.9);
    text-wrap: balance;
    text-align: center;
}

@keyframes cursor-parpadeo {
    from,
    to {
        border-color: transparent;
    }
    50% {
        border-color: rgba(255, 180, 140, 0.95);
    }
}

/* Fondos partitura */
.section-fondo2,
.section-media,
.section-pilares,
.section-escritura,
.section-cuadernos {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/* Partitura visible con velo crema (todas las secciones salvo hero) */
.section-fondo2,
.site-main > section:not(.section-hero) .parallax-moving-layer {
    background-position: 58% 42%;
    background-size: cover;
}

@media (max-width: 767.98px) {
    .section-fondo2,
    .site-main > section:not(.section-hero) .parallax-moving-layer {
        background-position: center 38%;
    }
}

.section-media {
    background-color: var(--ab-cream-panel);
}

@media (min-width: 1025px) {
    .section-fondo2,
    .section-media,
    .section-pilares,
    .section-escritura,
    .section-cuadernos {
        background-attachment: fixed;
    }
}

/* Fondo suave panel multimedia (tarjeta = Bootstrap .card) */
.card-multimedia-bg {
    width: 100%;
    max-width: 100%;
    margin-inline: auto;
    background:
        linear-gradient(165deg, rgba(255, 253, 250, 0.97) 0%, rgba(250, 246, 240, 0.98) 100%),
        url('../images/Rectangulo-naranja-para-fondo-1-1.webp');
    background-size: auto, cover;
    background-position: center, center;
    background-blend-mode: normal, luminosity;
}

/* Tablet + cuadernos — 2 filas × 2 columnas, sin solapamiento */
.section-fondo2__group {
    /* Teléfono (fila 1); cuadernos (fila 2) ~90% de su alto */
    --fondo2-phone-h: clamp(13.5rem, 21vh, 15rem);
    --fondo2-visual-w: calc(var(--fondo2-phone-h) * 9 / 16);
    --fondo2-thumb-h: calc(var(--fondo2-phone-h) * 0.9);
    --fondo2-inner-pad: clamp(1rem, 3.5vw, 1.75rem);
    --fondo2-pad-block: clamp(1.25rem, 3vh, 2rem);
    --fondo2-col-gap: clamp(0.85rem, 2vw, 1.35rem);
    --fondo2-row-gap: clamp(1.5rem, 3vh, 2.25rem);
    --fondo2-stack-gap: 0.65rem;
    --fondo2-badge-slot-h: 2.15rem;
    --fondo2-cell-pad-inner: clamp(0.5rem, 1.8vw, 0.85rem);
    width: 100%;
    max-width: min(38rem, 100%);
    margin-inline: auto;
    padding: var(--fondo2-pad-block) var(--fondo2-inner-pad);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: clamp(1.25rem, 2.5vh, 2rem);
}

.section-fondo2__grid {
    display: flex;
    flex-direction: column;
    gap: var(--fondo2-row-gap);
    width: 100%;
}

.section-fondo2__row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--fondo2-col-gap);
    width: 100%;
}

.section-fondo2__row--top {
    align-items: center;
}

.section-fondo2__row--bottom {
    align-items: end;
}

.section-fondo2__slot {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    box-sizing: border-box;
}

/* Columna izquierda: contenido hacia el centro (borde interior derecho) */
.section-fondo2__slot--tablet,
.section-fondo2__slot--practice {
    align-items: flex-end;
    padding-inline-start: 0.15rem;
    padding-inline-end: var(--fondo2-cell-pad-inner);
}

/* Columna derecha: contenido hacia el centro (borde interior izquierdo) */
.section-fondo2__slot--lead,
.section-fondo2__slot--preview {
    align-items: flex-start;
    padding-inline-start: var(--fondo2-cell-pad-inner);
    padding-inline-end: 0.15rem;
}

.section-fondo2__slot--lead {
    justify-content: center;
}

.section-fondo2__row--bottom .section-fondo2__slot--practice,
.section-fondo2__row--bottom .section-fondo2__slot--preview {
    justify-content: flex-end;
}

.section-fondo2__stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--fondo2-stack-gap);
    width: fit-content;
    max-width: 100%;
}

.section-fondo2__stack--device {
    padding-top: 6px;
    padding-bottom: 8px;
}

.section-fondo2__stack--thumb {
    gap: var(--fondo2-stack-gap);
}

/* Sin badge abajo: reserva el mismo hueco que la columna derecha */
.section-fondo2__slot--practice .section-fondo2__stack--thumb {
    padding-bottom: calc(var(--fondo2-badge-slot-h) + var(--fondo2-stack-gap));
    justify-content: flex-end;
}

.section-fondo2__stack--thumb > .cuaderno-thumb {
    display: block;
    height: var(--fondo2-thumb-h) !important;
    width: auto !important;
    max-width: 100%;
    margin-inline: auto;
}

.section-fondo2__badge {
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .section-fondo2 .section-fondo2__tablet.tablet-frame {
        border-width: 6px;
    }
}

.section-fondo2__lead {
    font-family: var(--font-sans);
    font-size: var(--fs-lead);
    font-weight: 700;
    line-height: 1.58;
    letter-spacing: 0.01em;
    color: var(--ab-text);
    width: 100%;
    max-width: 14.5rem;
    margin: 0;
    text-align: start;
}

@media (min-width: 992px) {
    .section-fondo2__lead {
        padding-block: var(--sp-2);
    }
}

.section-fondo2__group .cuaderno-cta-line {
    text-align: center;
    margin-inline: auto;
    width: 100%;
    max-width: 100%;
    padding-inline: 0;
}

.section-fondo2 .cuaderno-thumb--practice,
.section-fondo2 .cuaderno-thumb--preview {
    width: auto;
    margin-inline: auto;
}

@media (max-width: 575.98px) {
    .section-fondo2__row {
        grid-template-columns: 1fr;
        row-gap: clamp(1rem, 2.5vh, 1.5rem);
        align-items: center;
    }

    .section-fondo2__slot--tablet,
    .section-fondo2__slot--practice,
    .section-fondo2__slot--lead,
    .section-fondo2__slot--preview {
        align-items: center;
        padding-inline: 0.15rem;
    }

    .section-fondo2__slot--practice .section-fondo2__stack--thumb {
        padding-bottom: 0;
    }

    .section-fondo2__slot--lead {
        align-items: center;
    }

    .section-fondo2__lead {
        text-align: center;
        max-width: 20rem;
    }

    .section-fondo2 .section-fondo2__tablet.tablet-frame {
        width: min(var(--fondo2-visual-w), 86vw);
        max-height: var(--fondo2-phone-h);
    }
}

/* Titulares legacy */
.section-heading-accent {
    color: var(--ab-accent-heading);
}

.cuaderno-cta-line {
    font-family: var(--font-sans);
    font-size: var(--fs-subhead);
    font-weight: 600;
    line-height: var(--lh-snug);
    text-wrap: balance;
    text-align: center;
    max-width: 36rem;
    margin-inline: auto;
    margin-bottom: 0;
    padding-top: clamp(1.5rem, 3.5vw, 2.25rem);
    border-top: 1px solid rgba(45, 42, 38, 0.06);
}

/* Marcos dispositivos (~45–50% escala previa) */
.tablet-frame {
    position: relative;
    width: min(100%, 178px);
    margin: var(--sp-2) auto;
    aspect-ratio: 9 / 16;
    background: #111;
    border: 6px solid rgba(36, 36, 36, 0.78);
    border-radius: var(--radius-ui);
    box-shadow: var(--shadow-float);
    overflow: hidden;
}

.tablet-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.tablet-camera {
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 6px;
    height: 6px;
    background: #444;
    border-radius: 50%;
    z-index: 3;
    border: 1px solid #111;
}

.tablet-home {
    position: absolute;
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 18px;
    height: 18px;
    background: transparent;
    border: 2px solid #555;
    border-radius: 50%;
    z-index: 3;
}

@media (max-width: 767px) {
    .tablet-frame {
        max-width: 156px;
        border-width: 6px;
    }

    .tablet-home {
        width: 14px;
        height: 14px;
    }
}

.video-horizontal-frame {
    position: relative;
    width: min(100%, 308px);
    margin: var(--sp-3) auto;
    aspect-ratio: 16 / 9;
    background: #000;
    border: 5px solid rgba(36, 36, 36, 0.72);
    border-radius: var(--radius-ui);
    box-shadow: var(--shadow-float);
    overflow: hidden;
}

.video-horizontal {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media (max-width: 767px) {
    .video-horizontal-frame {
        border-width: 6px;
    }
}

.badge-pages {
    display: inline-block;
    background-color: var(--ab-accent-blue);
    color: var(--ab-white) !important;
    font-family: var(--font-sans);
    font-weight: 600;
    font-size: var(--fs-caption);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: var(--sp-2) var(--sp-3);
    border-radius: 6px;
}

.cuaderno-thumb {
    max-width: min(200px, 72vw);
}

/* Después de .tablet-frame global: tamaños fondo2 no heredan 178px / height:auto */
.section-fondo2 .section-fondo2__tablet.tablet-frame {
    width: var(--fondo2-visual-w) !important;
    max-width: 100% !important;
    max-height: var(--fondo2-phone-h) !important;
    margin: 0 auto !important;
}

.section-fondo2 .cuaderno-thumb--practice,
.section-fondo2 .cuaderno-thumb--preview {
    height: var(--fondo2-thumb-h) !important;
    width: auto !important;
}

.section-fondo2 .cuaderno-thumb--practice {
    max-width: min(calc(var(--fondo2-thumb-h) * 400 / 464), 100%) !important;
}

.section-fondo2 .cuaderno-thumb--preview {
    max-width: min(calc(var(--fondo2-thumb-h) * 400 / 278), 100%) !important;
}

.pillar-img {
    width: min(175px, 28vw);
    max-width: 100%;
    margin: 0 auto;
    display: block;
}

.bolas-texto {
    width: 100%;
    max-width: 100%;
    margin-inline: auto;
    border-radius: var(--radius-ui);
}

/* Ilustrado + vídeos — fondo crema + símbolo detrás del contenido */
.section-videos {
    position: relative;
    isolation: isolate;
    background-color: var(--ab-cream-panel, #f7f5f2);
}

.section-videos__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background-color: var(--ab-cream-panel, #f7f5f2);
    background-image: var(--section-symbol-url);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto min(100%, 46rem);
}

.section-videos .landing-container,
.section-videos .landing-col {
    position: relative;
    z-index: 2;
}

/* Gráfico «Intuitivo y simple» sin marco (solo la imagen) */
.section-videos .bolas-texto {
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}

/* Ilustrado + vídeos — vertical: gráfico → tres textos → piano → fila móvil + retrato circular */
.section-videos__text-row {
    max-width: 34rem;
}

.section-videos__taglines {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--sp-6);
    margin-inline: auto;
}

.section-videos__tagline {
    font-family: var(--font-sans);
    font-size: clamp(0.75rem, 1.35vw + 0.55rem, 0.9375rem);
    font-weight: 700;
    line-height: 1.38;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-align: center;
    text-wrap: balance;
    margin: 0;
    max-width: min(26rem, 100%);
}

.section-videos__tagline--wine {
    color: var(--ab-primary);
}

.section-videos__tagline--navy {
    color: var(--ab-accent-heading);
}

.section-videos .video-horizontal-frame--section {
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.12);
    box-shadow: var(--shadow-soft);
}

.video-horizontal-frame--piano {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.section-videos__visual {
    width: 100%;
    max-width: min(100%, 36rem);
    margin-inline: auto;
}

.section-videos__device-row {
    width: 100%;
    max-width: min(100%, 36rem);
    margin-inline: auto;
}

.section-videos .tablet-frame--videos-row {
    --videos-bezel-x: 3.25%;
    --videos-bezel-top: 5.5%;
    --videos-bezel-bottom: 7.5%;
    width: min(100%, 220px);
    margin-top: 0;
    margin-bottom: 0;
    overflow: hidden;
    background: #111;
    border: 2px solid rgba(36, 36, 36, 0.75);
    border-radius: var(--radius-ui);
    box-shadow: var(--shadow-soft);
}

.section-videos .tablet-frame--videos-row .tablet-frame__screen {
    position: absolute;
    left: var(--videos-bezel-x);
    right: var(--videos-bezel-x);
    top: var(--videos-bezel-top);
    bottom: var(--videos-bezel-bottom);
    border: none;
    border-radius: 0;
    overflow: hidden;
    background: #000;
    z-index: 1;
}

.section-videos .tablet-frame--videos-row .tablet-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.section-videos .tablet-frame--videos-row .tablet-camera {
    top: 1.8%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #333;
    border: 1px solid #111;
    z-index: 4;
}

.section-videos .tablet-frame--videos-row .tablet-home {
    bottom: 1.8%;
    width: 16px;
    height: 16px;
    border-width: 2px;
    border-color: rgba(255, 255, 255, 0.2);
    z-index: 4;
}

@media (min-width: 576px) {
    .section-videos .tablet-frame--videos-row {
        width: min(100%, 252px);
    }

    .section-videos .tablet-frame--videos-row .tablet-home {
        width: 18px;
        height: 18px;
    }
}

@media (min-width: 768px) {
    .section-videos .tablet-frame--videos-row {
        width: min(100%, 272px);
    }
}

.muchacho-portrait {
    position: relative;
    width: 100%;
    max-width: 156px;
    margin-inline: auto;
    aspect-ratio: 1;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: var(--shadow-soft);
    flex-shrink: 0;
}

.muchacho-portrait.muchacho-portrait--card {
    max-width: 7rem;
    border: none;
    box-shadow: none;
}

.section-videos .muchacho-portrait.muchacho-portrait--inline {
    margin-top: 0;
    margin-inline: auto;
    max-width: min(100%, 190px);
    border: none !important;
    box-shadow: none !important;
    outline: none;
    filter: none;
}

@media (min-width: 576px) {
    .section-videos .muchacho-portrait.muchacho-portrait--inline {
        max-width: 205px;
    }
}

@media (min-width: 992px) {
    .section-videos .muchacho-portrait.muchacho-portrait--inline {
        max-width: 218px;
    }
}

.muchacho-img {
    max-width: min(320px, 78vw);
    margin-top: var(--sp-9);
    border: var(--border-hairline);
    border-radius: var(--radius-ui);
    box-shadow: var(--shadow-soft);
}

/* Retrato circular en bloque vídeos: clase dedicada (evita conflicto con .muchacho-img e img-fluid) */
.muchacho-portrait__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
}

/* Testimonios — misma fila, solapamiento parcial, medidas similares */
.testimonial-overlap {
    --testimonial-slot: min(16.5rem, 44vw);
    --testimonial-overlap-x: clamp(2.25rem, 11%, 3.75rem);
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    width: min(40rem, 100%);
    max-width: 100%;
    margin-inline: auto;
    gap: 0;
}

.testimonial-overlap__photo,
.testimonial-overlap__quote {
    flex: 0 0 var(--testimonial-slot);
    width: var(--testimonial-slot);
    max-width: var(--testimonial-slot);
    min-width: 0;
}

.testimonial-overlap__photo {
    position: relative;
    z-index: 1;
}

.testimonial-overlap__quote {
    position: relative;
    z-index: 2;
    margin-left: calc(-1 * var(--testimonial-overlap-x));
    box-shadow: var(--shadow-float);
}

.testimonial-overlap__img {
    width: 100%;
    height: auto;
    display: block;
}

@media (min-width: 992px) {
    .testimonial-overlap {
        --testimonial-slot: min(18.5rem, 42%);
        --testimonial-overlap-x: clamp(2.75rem, 13%, 4.5rem);
        width: min(44rem, 100%);
    }
}

/* Testimonios — fondo claro a ancho completo, sin recortar las tarjetas */
.section-testimonios {
    position: relative;
    isolation: isolate;
    width: 100%;
    max-width: none;
    margin: 0;
    overflow: visible;
    background-color: var(--ab-cream-panel, #f7f5f2);
    padding-block: clamp(3rem, 8vh, 5rem);
}

.section-testimonios__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background-color: var(--ab-cream-panel, #f7f5f2);
}

/* Símbolo anclado al grupo de tarjetas (no al borde del viewport) */
.section-testimonios .testimonial-overlap::before {
    content: '';
    position: absolute;
    z-index: 0;
    top: 50%;
    right: clamp(-1.5rem, -6%, -0.5rem);
    width: clamp(12rem, 52%, 20rem);
    height: min(125%, 34rem);
    transform: translateY(-50%);
    background-image: var(--testimonial-symbol-url);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;
    pointer-events: none;
}

.section-testimonios .landing-container,
.section-testimonios .landing-row,
.section-testimonios .landing-col {
    position: relative;
    z-index: 2;
    overflow: visible;
}

.section-testimonios .testimonial-overlap {
    position: relative;
    z-index: 3;
}

.section-testimonios .testimonial-overlap__photo {
    position: relative;
    z-index: 1;
}

.section-testimonios .testimonial-overlap__quote {
    position: relative;
    z-index: 2;
}

.section-testimonios .landing-row {
    min-height: auto;
    padding-block: clamp(1.5rem, 4vh, 2.5rem);
}

.section-testimonios .landing-col {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: auto;
}

.section-testimonios .testimonial-overlap__photo,
.section-testimonios .testimonial-overlap__quote {
    overflow: visible;
    background-color: #fff;
}

.section-testimonios .testimonial-overlap__img {
    max-height: none;
    object-fit: contain;
}

.site-main--stack.is-stack-ready > section.section-testimonios {
    z-index: 92 !important;
    background-color: var(--ab-cream-panel, #f7f5f2) !important;
    overflow: visible !important;
    min-height: auto !important;
    box-shadow: none;
}

.site-main--stack.is-stack-ready > section.stack-pin-host.section-testimonios,
.site-main--stack.is-stack-ready > section.stack-pin-host.section-testimonios .stack-pin-layer {
    background-color: var(--ab-cream-panel, #f7f5f2) !important;
    overflow: visible !important;
    min-height: auto !important;
    height: auto !important;
}

/* Annabell — cita a ancho de contenedor */
.annabell-showcase {
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
}

.section-quote .divider-gold {
    width: 100%;
    max-width: 100%;
}

.divider-gold {
    width: min(72%, 36rem);
    border: none;
    border-top: 1px solid rgba(180, 160, 130, 0.28);
    margin-block: 0;
    opacity: 1;
}

.section-quote .divider-gold:first-of-type {
    margin-bottom: var(--sp-8);
}

.section-quote .divider-gold:last-of-type {
    margin-top: var(--sp-10);
}

.annabell-photo {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    object-fit: cover;
}

.quote-card--overlap {
    position: relative;
}

@media (min-width: 768px) {
    .quote-card--overlap {
        margin-left: 0;
    }

    .annabell-showcase .card-body {
        padding: clamp(1.5rem, 3vw, 2.75rem) clamp(1.75rem, 4vw, 3.25rem);
    }
}

.quote-title {
    font-family: var(--font-serif);
    font-size: clamp(1.0625rem, 1.6vw, 1.25rem);
    font-weight: 600;
    font-style: italic;
    line-height: var(--lh-snug);
    color: var(--ab-text);
    text-align: center;
    margin-bottom: var(--sp-5);
}

.quote-name {
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    font-weight: 600;
    text-align: center;
    margin-bottom: var(--sp-2);
    color: var(--ab-text);
}

.quote-role {
    font-family: var(--font-sans);
    font-size: var(--fs-small);
    line-height: var(--lh-snug);
    color: var(--ab-text-muted);
    text-align: center;
    margin-bottom: var(--sp-1);
}

.quote-role:last-of-type {
    margin-bottom: var(--sp-4);
}

.rating-stars {
    display: flex;
    justify-content: center;
    gap: 0.35rem;
    margin-top: var(--sp-3);
    color: rgba(184, 148, 72, 0.72);
    opacity: 1;
}

.rating-star {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
}

/* Cuadernos — mosaico 2 filas × 2 columnas */
.section-cuadernos .landing-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(1.5rem, 3vh, 2.5rem);
}

.cuadernos-catalog__header {
    width: 100%;
    margin-bottom: 0;
}

.cuadernos-catalog {
    width: 100%;
    max-width: min(44rem, 100%);
    margin-inline: auto;
}

.cuadernos-catalog__mosaic {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
        'tl tr'
        'bl br';
    column-gap: clamp(1rem, 3vw, 2rem);
    row-gap: clamp(1.25rem, 3vh, 2.25rem);
    align-items: end;
    width: 100%;
}

.cuadernos-catalog__cell--tl {
    grid-area: tl;
}

.cuadernos-catalog__cell--tr {
    grid-area: tr;
}

.cuadernos-catalog__cell--bl {
    grid-area: bl;
}

.cuadernos-catalog__cell--br {
    grid-area: br;
}

.cuadernos-catalog__cell {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    min-width: 0;
}

.cuadernos-catalog__cell--tl,
.cuadernos-catalog__cell--tr {
    justify-content: center;
}

.cuadernos-catalog__cell--br {
    justify-content: center;
    align-items: flex-start;
    padding-inline: clamp(0.35rem, 2vw, 1rem);
}

.cuadernos-catalog__subtitle {
    font-family: var(--font-sans);
    font-size: var(--fs-subhead);
    font-weight: 600;
    line-height: var(--lh-snug);
    letter-spacing: 0.06em;
    text-align: start;
    text-wrap: balance;
}

.cuaderno-catalogo {
    display: block;
    width: auto;
    max-width: min(220px, 100%);
    height: auto;
    border-radius: var(--radius-ui);
    border: none;
    box-shadow: var(--shadow-soft);
}

.cuaderno-catalogo--mixto {
    display: block;
    width: auto;
    max-width: min(240px, 100%);
    height: auto;
    border-radius: var(--radius-ui);
    border: none;
    box-shadow: var(--shadow-soft);
}

/* Sin stack-pin: capa visible por si la sección queda envuelta en pin-layer legacy */
.site-main--stack.is-stack-ready > section.section-cuadernos .stack-pin-layer,
.site-main--stack.is-stack-ready > section.section-cuadernos.stack-pin-host .stack-pin-layer {
    min-height: auto;
    height: auto;
    overflow: visible;
}

.section-carousel .landing-row {
    min-height: auto;
}

#pilaresCarousel {
    max-width: min(240px, 72vw);
    margin-inline: auto;
}

#pilaresCarousel .carousel-inner {
    border-radius: var(--radius-ui);
    border: none;
    box-shadow: var(--shadow-soft);
}

/* Precio */
.section-pago .col-pago {
    max-width: 100%;
}

@media (min-width: 992px) {
    .section-pago .col-pago {
        flex: 0 0 auto;
        width: 58.33333333%;
    }
}

/* FAQ */
.section-faq__content {
    width: 100%;
    max-width: min(46rem, 100%);
}

.precio-texto {
    color: var(--bs-primary);
    font-family: var(--font-serif);
    font-size: var(--fs-price);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1;
}

.precio-check {
    opacity: 1;
    color: rgba(95, 133, 116, 0.9) !important;
}

.label-pago {
    font-family: var(--font-sans);
    font-size: var(--fs-caption);
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--ab-text-muted);
    padding: var(--sp-2) var(--sp-3);
    background-color: var(--bs-light);
    border-radius: var(--bs-border-radius-lg);
    border: 1px solid rgba(0, 0, 0, 0.06);
}

.contenedor-pago {
    transition:
        box-shadow 0.28s ease,
        background-color 0.22s ease,
        border-color 0.22s ease;
    border: 1px solid var(--bs-border-color-translucent) !important;
}

.contenedor-pago:hover {
    border-color: rgba(92, 20, 24, 0.12) !important;
    box-shadow: var(--bs-box-shadow-sm);
    background-color: var(--bs-light) !important;
}

.section-pago__cta-copy {
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
}

/* CTA «¡LO QUIERO!» — pill rojo con borde metálico */
.btn-lo-quiero {
    --lo-quiero-red: #d41e2a;
    display: inline-block;
    font-family: var(--font-sans);
    font-size: clamp(1rem, 2.2vw, 1.125rem);
    font-weight: 700;
    font-style: italic;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff !important;
    background: linear-gradient(180deg, #e8333f 0%, var(--lo-quiero-red) 48%, #b81824 100%);
    border: none;
    border-radius: 999px;
    padding: 0.7rem clamp(2rem, 6vw, 2.75rem);
    box-shadow:
        0 0 0 3px rgba(180, 160, 120, 0.55),
        0 0 0 5px rgba(120, 100, 70, 0.35),
        0 4px 14px rgba(92, 20, 24, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.35);
    transition:
        transform 0.22s ease,
        box-shadow 0.28s ease,
        filter 0.22s ease;
}

.btn-lo-quiero:hover,
.btn-lo-quiero:focus-visible {
    color: #fff !important;
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow:
        0 0 0 3px rgba(200, 180, 130, 0.65),
        0 0 0 5px rgba(130, 110, 75, 0.4),
        0 8px 22px rgba(92, 20, 24, 0.32),
        inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.btn-lo-quiero:active {
    transform: translateY(0);
    filter: brightness(0.98);
}

.faq-accordion .accordion-item {
    border: none !important;
    border-radius: var(--bs-border-radius-xl) !important;
    margin-bottom: var(--sp-2);
    overflow: hidden;
    background: #fff;
    box-shadow: var(--bs-box-shadow-sm);
}

.faq-accordion .accordion-button {
    font-family: var(--font-sans);
    font-size: var(--fs-small);
    font-weight: 600;
    line-height: var(--lh-snug);
    padding-block: var(--sp-4);
    padding-inline: var(--sp-4);
    background: #fff;
    color: var(--bs-body-color);
}

.faq-accordion .accordion-button:not(.collapsed) {
    background: var(--bs-light);
    color: var(--bs-body-color);
    box-shadow: none;
}

.faq-accordion .accordion-button:focus {
    box-shadow: none;
    border-color: transparent;
}

.faq-accordion .accordion-body {
    font-family: var(--font-sans);
    font-size: var(--fs-small);
    line-height: 1.68;
    color: var(--ab-text-muted);
    font-style: italic;
    padding-block: var(--sp-3) var(--sp-5);
    padding-inline: var(--sp-4);
    background: #fff;
}

/* Botones premium (pill + hover); cubre CTAs inyectados en zona de pago */
.btn {
    transition:
        color 0.22s ease,
        background-color 0.22s ease,
        border-color 0.22s ease,
        box-shadow 0.28s ease,
        transform 0.22s ease;
}

.btn:hover:not(:disabled):not(.disabled) {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(92, 20, 24, 0.15);
}

.btn:active:not(:disabled):not(.disabled) {
    transform: translateY(0);
}

.contenedor-pago .btn,
.contenedor-pago button[type='submit'],
.contenedor-pago input[type='submit'],
.contenedor-pago input[type='button'] {
    border-radius: var(--bs-border-radius-pill);
}

/* Footer */
.footer-main {
    background-color: var(--ab-footer-bg);
    padding-block: clamp(var(--sp-8), 5vw, var(--sp-10));
}

.footer-logo {
    width: min(52%, 14rem);
}

.footer-heading {
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-bottom: var(--sp-5);
}

.footer-social-label {
    font-family: var(--font-sans);
    font-weight: 600;
    font-size: var(--fs-caption);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: var(--sp-1);
    color: rgba(255, 255, 255, 0.9);
}

.footer-social a {
    font-size: var(--fs-small);
    line-height: var(--lh-snug);
    color: var(--ab-link-gold);
    text-decoration: none;
    word-break: break-word;
}

.footer-social a:hover {
    text-decoration: underline;
}

.footer-bar {
    background-color: var(--ab-footer-bar);
    color: rgba(255, 255, 255, 0.88);
    font-size: var(--fs-caption);
    letter-spacing: 0.02em;
    padding-block: var(--sp-4);
}

/* -------------------------------------------------------------------------
   Parallax — capas independientes (fondo móvil + contenido fijo)
   ------------------------------------------------------------------------- */
.parallax-container {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.parallax-container.section-hero {
    background-color: #120a0c;
}

/* Hero: capa a ras del contenedor (evita franja clara arriba por top:-10%) */
.parallax-container.section-hero .parallax-moving-layer {
    top: 0;
    height: 100%;
}

.parallax-moving-layer {
    position: absolute;
    left: 0;
    right: 0;
    top: -10%;
    height: 120%;
    z-index: 0;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    will-change: transform;
    backface-visibility: hidden;
    pointer-events: none;
}

.parallax-container.section-hero::before {
    z-index: 1;
}

/* Contenido por encima de la capa parallax */
.parallax-container .landing-container {
    position: relative;
    z-index: 2;
}

@media (min-width: 1025px) {
    .section-hero.parallax-container {
        background-attachment: scroll;
    }
}

@media (prefers-reduced-motion: reduce) {
    .parallax-moving-layer {
        transform: none !important;
        will-change: auto;
        top: 0;
        height: 100%;
    }
}

@media (max-width: 767.98px) {
    .parallax-moving-layer {
        transform: none !important;
        will-change: auto;
        top: 0;
        height: 100%;
    }
}