/**
 * Landing móvil / tablet (< 992px)
 * Ritmo, márgenes y tipografía unificados (sin cambiar HTML).
 */

@media (max-width: 991.98px) {
    :root {
        --section-y: clamp(2.25rem, 6vw, 3.25rem);
        --section-y-tight: clamp(1.5rem, 4vw, 2.25rem);
        --section-inline-padding: clamp(1.125rem, 4.5vw, 1.5rem);
        --mobile-title-size: clamp(0.8125rem, 3.15vw, 0.9375rem);
        --mobile-subtitle-size: clamp(1rem, 2.75vw, 1.125rem);
        --mobile-subhead-size: clamp(0.8125rem, 2.35vw, 0.9375rem);
        --mobile-row-y: clamp(1.75rem, 5vw, 2.5rem);
    }

    /* —— Ritmo vertical y contenedor (el hero conserva altura de pantalla) —— */
    .site-main--stack > section.min-vh-100:not(.section-hero) {
        min-height: auto !important;
    }

    .site-main--stack > section.parallax-container:not(.section-hero) {
        min-height: auto !important;
    }

    .site-main--stack > section:not(.section-hero) .landing-row.min-vh-100,
    .site-main--stack > section:not(.section-hero) .landing-row.py-5 {
        min-height: auto !important;
        padding-block: var(--mobile-row-y) !important;
    }

    /* Hero: pantalla completa, por encima de fondo2 (evita partitura + texto blanco ilegible) */
    .site-main--stack > section.section-hero,
    .section-hero {
        position: relative !important;
        z-index: 5 !important;
        isolation: isolate;
        min-height: min(100svh, 100dvh) !important;
        overflow: hidden;
        background-color: #120a0c !important;
    }

    .section-fondo2 {
        position: relative;
        z-index: 1;
    }

    .section-hero .stack-pin-spacer {
        display: none !important;
        height: 0 !important;
    }

    .section-hero .stack-pin-layer {
        position: relative !important;
        min-height: min(100svh, 100dvh) !important;
        overflow: hidden;
        background-color: #120a0c;
    }

    .section-hero .landing-container {
        position: relative;
        z-index: 3;
        min-height: min(100svh, 100dvh);
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .section-hero .landing-row {
        min-height: min(88svh, 88dvh) !important;
        padding-block: clamp(2rem, 7svh, 3.5rem) !important;
        width: 100%;
    }

    .section-hero .parallax-moving-layer {
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        height: 100% !important;
        min-height: 100% !important;
        transform: none !important;
        z-index: 0 !important;
    }

    .section-hero::before {
        z-index: 1 !important;
    }

    .site-main .landing-container {
        padding-inline: var(--section-inline-padding);
    }

    .site-main .row.g-4,
    .site-main .row.g-lg-5 {
        --bs-gutter-x: 0.85rem;
        --bs-gutter-y: 1.15rem;
    }

    .site-main .landing-col > .display-6,
    .site-main .landing-col > .landing-title,
    .site-main .landing-col > h2 {
        margin-bottom: 1.25rem !important;
    }

    /* —— Títulos de sección: serif (Cormorant) —— */
    .site-main h2.display-6,
    .site-main h2.landing-title,
    .site-main .landing-title,
    .site-main .section-faq__title {
        font-family: var(--font-serif) !important;
        font-size: var(--mobile-title-size) !important;
        font-weight: 700 !important;
        line-height: 1.34 !important;
        letter-spacing: 0.08em !important;
        text-transform: uppercase !important;
        text-align: center !important;
        text-wrap: balance;
        color: var(--ab-secondary) !important;
        margin-top: 0 !important;
        margin-bottom: 1.25rem !important;
        padding-inline: 0.15rem;
    }

    /* —— Subtítulos / leads (único criterio) —— */
    .site-main .lead:not(.landing-lead-lg):not(.section-fondo2__lead):not(.cuaderno-cta-line):not(.section-media__lead),
    .site-main .landing-col > p.lead:not(.landing-lead-lg):not(.section-fondo2__lead):not(.cuaderno-cta-line):not(.section-media__lead) {
        font-family: var(--font-sans) !important;
        font-size: var(--mobile-subtitle-size) !important;
        font-weight: 500 !important;
        line-height: 1.55 !important;
        letter-spacing: 0.01em !important;
        text-transform: none !important;
        text-align: center !important;
        text-wrap: balance;
        color: var(--ab-text-muted) !important;
        max-width: 22rem;
        margin-inline: auto !important;
        margin-bottom: 0 !important;
    }

    /* Subtítulos / leads destacados: sans (Inter), negrita */
    .landing-lead-lg,
    .section-fondo2 .section-fondo2__lead,
    .section-media .section-media__lead,
    .card-multimedia-bg .section-media__lead,
    .card-multimedia-bg p.landing-lead-lg {
        font-family: var(--font-sans) !important;
        font-size: clamp(1.125rem, 3.8vw, 1.35rem) !important;
        font-weight: 700 !important;
        line-height: 1.55 !important;
        color: var(--ab-text) !important;
        max-width: 22rem;
        margin-inline: auto !important;
    }

    /* CTA bajo cuadernos: semibold */
    .section-fondo2 .cuaderno-cta-line {
        font-family: var(--font-sans) !important;
        font-size: clamp(1rem, 2.75vw, 1.125rem) !important;
        font-weight: 600 !important;
        line-height: 1.55 !important;
        color: var(--ab-text-muted) !important;
        max-width: 22rem;
        margin-inline: auto !important;
    }

    .section-fondo2 .section-fondo2__lead.text-start,
    .section-media .section-media__lead.text-lg-start {
        text-align: center !important;
    }

    /* Subtítulos de bloque (h3 bajo títulos de sección) */
    .site-main .landing-col h3.fs-5,
    .site-main .landing-col h3.text-uppercase {
        font-family: var(--font-sans) !important;
        font-size: var(--mobile-subhead-size) !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
        letter-spacing: 0.06em !important;
        text-transform: uppercase !important;
        text-align: center !important;
        text-wrap: balance;
        color: var(--ab-text) !important;
        margin-top: 1rem !important;
        margin-bottom: 0 !important;
    }

    /* Vídeos: mismas métricas; se mantienen colores de acento */
    .site-main .section-videos__tagline {
        font-size: var(--mobile-subhead-size) !important;
        line-height: 1.4 !important;
        letter-spacing: 0.08em !important;
        margin-bottom: 0 !important;
    }

    .site-main .section-videos__taglines {
        gap: 1.15rem;
        margin-bottom: 1.25rem;
    }

    /* —— Hero: rem fijos (misma proporción que escritorio, sin vw) —— */
    .section-hero .hero-kicker {
        font-size: 0.75rem !important;
        letter-spacing: 0.16em !important;
        margin-bottom: 0.75rem !important;
    }

    .section-hero .hero-title {
        font-size: 1.625rem !important;
        line-height: 1.2 !important;
        margin-bottom: 0.75rem !important;
    }

    .section-hero .hero-subtitle {
        font-size: 0.875rem !important;
        letter-spacing: 0.07em !important;
    }

    @container hero-copy (min-width: 20rem) {
        .section-hero .hero-title {
            font-size: 1.75rem !important;
        }
    }

    .section-hero .hero-title-wrap {
        margin-bottom: 0.75rem !important;
    }

    .section-hero .hero-text-block {
        padding-inline: 0.25rem;
        container-type: inline-size;
        container-name: hero-copy;
    }

    .section-hero .hero-kicker,
    .section-hero .hero-title,
    .section-hero .hero-title__text,
    .section-hero .hero-subtitle {
        color: #fff !important;
    }

    /* —— Sección tablet + cuadernos —— */
    .section-fondo2 {
        --fondo2-tablet-w: min(58vw, 11rem);
        --fondo2-thumb-slot-w: min(62vw, 12rem);
        --fondo2-thumb-media-h: min(28vh, 11rem);
        --fondo2-thumb-max-h: min(32vh, 13rem);
        --fondo2-tablet-max-h: min(34vh, 13.5rem);
    }

    .section-fondo2__group {
        --fondo2-phone-h: min(34vh, 14rem);
        --fondo2-thumb-h: calc(var(--fondo2-phone-h) * 0.9);
        --fondo2-visual-w: calc(var(--fondo2-phone-h) * 9 / 16);
        --fondo2-row-gap: clamp(1.25rem, 3vh, 1.75rem);
        --fondo2-col-gap: clamp(0.75rem, 2vw, 1.15rem);
    }

    .section-fondo2 .landing-container {
        min-height: min(100svh, 100dvh);
        justify-content: center;
        padding-top: clamp(2.5rem, 8svh, 4rem);
        padding-bottom: clamp(1.25rem, 4svh, 2rem);
    }

    .section-fondo2 .landing-row {
        padding-top: 0.35rem !important;
        padding-bottom: clamp(1rem, 4svh, 1.75rem) !important;
    }

    .section-fondo2__content {
        gap: 0.4rem;
    }

    .section-fondo2__stage {
        --fondo2-inner-w: min(28rem, 100%);
        --fondo2-grid-gap-x: 0.35rem;
        --fondo2-grid-gap-y: clamp(0.85rem, 2vh, 1.25rem);
    }

    .fondo2-burst--tablet .section-fondo2__stack--device {
        width: fit-content;
        max-width: min(92vw, 100%);
    }

    .fondo2-burst--tablet,
    .fondo2-burst--practice {
        align-items: center;
    }

    .fondo2-burst--lead {
        align-items: center;
    }

    .fondo2-burst--preview {
        align-items: center;
    }

    .fondo2-burst--preview .section-fondo2__stack {
        align-items: center;
        margin-inline: auto;
    }

    .section-fondo2__stack {
        align-items: center;
    }

    .section-fondo2 .fondo2-burst--lead .section-fondo2__lead {
        font-family: var(--font-sans) !important;
        font-size: clamp(1.125rem, 3.8vw, 1.35rem) !important;
        font-weight: 700 !important;
        max-width: 20rem;
        margin-inline: auto;
        text-align: center !important;
        color: var(--ab-text) !important;
    }

    .section-fondo2 .cuaderno-cta-line {
        width: min(26rem, 100%);
        max-width: min(26rem, 100%);
    }

    .section-fondo2 .cuaderno-cta-line {
        margin-top: 0.5rem !important;
        padding-top: 0.65rem !important;
    }

    /* —— Pilares / carrusel —— */
    #pilaresCarousel {
        max-width: min(17.5rem, 88vw);
        margin-inline: auto;
    }

    .section-carousel .landing-container {
        display: block;
        min-height: auto !important;
        height: auto !important;
        justify-content: flex-start;
    }

    .section-carousel .landing-row {
        min-height: auto !important;
        height: auto !important;
        align-items: stretch;
        padding-block: var(--mobile-row-y) !important;
    }

    .section-carousel .landing-col {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        padding-block: 0.35rem;
    }

    .section-carousel .landing-col {
        max-width: 100%;
    }

    .main-carousel {
        width: 100%;
        max-width: 100%;
        padding-inline: 0;
    }

    .main-carousel__arrow--prev {
        left: 0.15rem;
    }

    .main-carousel__arrow--next {
        right: 0.15rem;
    }

    .main-carousel__slide {
        flex: 0 0 min(16.5rem, 78vw);
        width: min(16.5rem, 78vw);
        max-width: min(16.5rem, 78vw);
    }

    .main-carousel__track {
        gap: 0.25rem;
    }

    .main-carousel__img {
        max-height: min(15rem, 40vw);
    }

    .main-carousel__dots,
    .section-carousel .carousel-indicators {
        margin-bottom: 0 !important;
    }

    /* —— Multimedia / pilares / escritura —— */
    .section-media .landing-container,
    .section-pilares .landing-container,
    .section-escritura .landing-container {
        min-height: auto !important;
    }

    .section-media .landing-row,
    .section-pilares .landing-row,
    .section-escritura .landing-row {
        padding-block: var(--mobile-row-y) !important;
    }

    /* —— Vídeos —— */
    .section-videos .landing-row {
        padding-block: var(--mobile-row-y) !important;
    }

    .section-videos .row.mb-4,
    .section-videos .row.mb-lg-5 {
        margin-bottom: 1.15rem !important;
    }

    .bolas-texto {
        max-height: 11.5rem;
        width: auto;
        max-width: 100%;
        object-fit: contain;
        margin-inline: auto;
        display: block;
    }

    /* —— Cuadernos —— */
    .section-cuadernos {
        padding-block: var(--section-y-tight);
    }

    .section-cuadernos .landing-row {
        padding-block: var(--mobile-row-y) !important;
    }

    .section-cuadernos h2.landing-title {
        font-size: var(--mobile-title-size) !important;
        padding-inline: 0.25rem;
    }

    .cuadernos-catalog__header {
        margin-bottom: 1.25rem !important;
    }

    .section-cuadernos .landing-col {
        align-items: stretch !important;
        width: 100%;
    }

    .cuadernos-catalog {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
        align-self: stretch;
    }

    /* Móvil: 2 cuadernos arriba; mixto y texto abajo a ancho completo (sin colapso) */
    .cuadernos-catalog__mosaic {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-areas:
            'tl tr'
            'bl bl'
            'br br';
        column-gap: clamp(0.75rem, 4vw, 1.25rem);
        row-gap: clamp(1.15rem, 4vw, 1.75rem);
        align-items: stretch;
        width: 100%;
    }

    .cuadernos-catalog__cell {
        justify-content: center;
        align-items: center;
        min-width: 0;
        overflow: visible;
    }

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

    .cuadernos-catalog__cell--bl {
        grid-column: 1 / -1;
        display: flex !important;
        flex-direction: column;
        align-items: stretch !important;
        justify-content: center;
        justify-self: stretch;
        align-self: stretch;
        width: 100%;
        min-width: 0;
        padding-block: 0.15rem;
        padding-inline: 0;
    }

    .cuadernos-catalog__cell--br {
        justify-self: stretch;
        align-self: center;
        padding-inline: clamp(0.5rem, 3vw, 1rem);
    }

    .cuadernos-catalog__subtitle {
        font-size: var(--mobile-subhead-size) !important;
        line-height: 1.45 !important;
        text-align: center !important;
        max-width: 20rem;
        margin-inline: auto;
    }

    .section-cuadernos img.cuaderno-catalogo:not(.cuaderno-catalogo--mixto) {
        width: 100% !important;
        max-width: min(11.5rem, 100%) !important;
        max-height: none !important;
        height: auto !important;
        margin-inline: auto;
    }

    .section-cuadernos img.cuaderno-catalogo--mixto {
        width: 100% !important;
        max-width: 100% !important;
        max-height: none !important;
        height: auto !important;
        margin-inline: 0 !important;
        display: block;
        object-fit: contain;
        object-position: center center;
    }

    /* —— Pago + FAQ —— */
    .section-pago .landing-row,
    .section-faq .landing-row {
        padding-block: var(--mobile-row-y) !important;
    }

    .section-faq .section-faq__title {
        margin-bottom: 1.15rem !important;
    }

    .section-faq__content {
        max-width: 100%;
    }

    .faq-accordion .faq-accordion__trigger {
        font-size: var(--mobile-subtitle-size) !important;
        padding: 0.95rem 1rem;
    }

    .faq-accordion .faq-accordion__answer {
        font-size: var(--mobile-subhead-size) !important;
        line-height: 1.65;
    }

    .section-pago .col-pago {
        padding-inline: 0;
    }

    /* —— Testimonios: solo escritorio —— */
    .section-testimonios {
        display: none !important;
    }

    /* —— Cita Annabell (avatar + texto equilibrados) —— */
    .section-quote .landing-container {
        min-height: auto !important;
    }

    .section-quote .landing-row {
        padding-block: clamp(1rem, 3.5vw, 1.5rem) !important;
    }

    .section-quote .quote-framed {
        padding-block: clamp(0.75rem, 3vw, 1.1rem);
    }

    .section-quote .annabell-showcase {
        --quote-avatar-size: min(5.25rem, 22vw);
        --quote-card-max: min(20rem, 92vw);

        max-width: var(--quote-card-max);
        margin-inline: auto;
        --bs-gutter-y: 0.65rem;
    }

    .section-quote .annabell-showcase > .col-12:first-child {
        display: flex;
        justify-content: center;
    }

    .section-quote .annabell-showcase > .col-12:first-child .card {
        width: auto;
        max-width: none;
        height: auto !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .section-quote .annabell-photo {
        width: var(--quote-avatar-size);
        height: var(--quote-avatar-size);
        max-width: var(--quote-avatar-size);
        margin-inline: auto;
        object-fit: cover;
        object-position: center 18%;
        border-radius: 50%;
        border: 2px solid rgba(92, 20, 24, 0.35);
        box-shadow: 0 4px 14px rgba(8, 6, 5, 0.1);
    }

    .section-quote .quote-card--overlap {
        margin-top: 0;
    }

    .section-quote .quote-card--overlap .card-body {
        padding: 1.15rem 1.1rem 1.25rem !important;
        text-align: center;
    }

    .section-quote .quote-title {
        font-size: clamp(1.0625rem, 3.1vw, 1.1875rem) !important;
        line-height: 1.48 !important;
        margin-bottom: 0.85rem !important;
        max-width: 16.5rem;
        margin-inline: auto;
    }

    .section-quote .quote-name {
        font-size: 0.9375rem;
        margin-bottom: 0.2rem !important;
    }

    .section-quote .quote-role {
        font-size: 0.8125rem;
        line-height: 1.38;
        margin-bottom: 0.15rem !important;
    }

    .section-quote .quote-role:last-of-type {
        margin-bottom: 0.65rem !important;
    }

    .section-quote .rating-stars {
        margin-top: 0.35rem;
        gap: 0.28rem;
    }

    .section-quote .rating-star {
        width: 11px;
        height: 11px;
    }

    /* Centrado de mockups e imágenes */
    .site-main .landing-col img.img-fluid,
    .site-main .landing-col > .img-fluid,
    .site-main .tablet-frame,
    .site-main .video-horizontal-frame {
        margin-inline: auto;
    }

    /* Cuaderno mixto: ancho completo del catálogo (después de reglas genéricas de img-fluid) */
    .section-cuadernos .cuadernos-catalog__cell--bl .cuaderno-catalogo--mixto {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
        align-self: stretch;
    }
}
