/* ================================================================
   HERO BLOG GASEX v1.0
   Hereda el Hero Principal + título multi-línea + tagline + badge
   + imagen decorativa + overlay con color personalizable
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&display=swap');

/* ── BASE (idéntico al hero principal) ─────────────── */

.wp-block-gasex-blog-carousel.blog-hero-gasex {
    --gasex-white:        #ffffff;
    --gasex-dark:         #1a1a1a;
    --transition-smooth:  all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    container-type:       inline-size;
    position:             relative;
    width:                100%;
    min-height:           58vh;
    display:              flex;
    align-items:          center;
    overflow:             hidden;
    background-color:     var(--gasex-dark);
}

.wp-block-gasex-blog-carousel .hero-slider-main {
    position:   relative;
    width:      100%;
    height:     100%;
    min-height: 58vh;
}

.wp-block-gasex-blog-carousel .hero-slide {
    position:      absolute;
    inset:         0;
    opacity:       0;
    transition:    opacity 1.2s ease-in-out;
    display:       flex;
    align-items:   center;
    z-index:       1;
    pointer-events: none;
}

.wp-block-gasex-blog-carousel .hero-slide.is-active {
    opacity:       1;
    z-index:       2;
    pointer-events: auto;
}

/* ── IMAGEN ─────────────────────────────────────────── */

.wp-block-gasex-blog-carousel .hero-imagen-wrapper {
    position: absolute;
    inset:    0;
    z-index:  1;
}

.wp-block-gasex-blog-carousel .hero-img {
    width:      100%;
    height:     100%;
    object-fit: cover;
    transition: transform 20s linear;
}

.wp-block-gasex-blog-carousel .hero-slide.is-active .hero-img {
    transform: scale(1.1);
}

/* ── OVERLAY con color CSS var ──────────────────────── */
/* Se calcula en JS: --ov-main y --ov-mid son rgba() completos */

.wp-block-gasex-blog-carousel .hero-slide::before {
    content:        "";
    position:       absolute;
    top:            0;
    height:         100%;
    z-index:        2;
    pointer-events: none;
}

.wp-block-gasex-blog-carousel .hero-slide.pos-left::before {
    left:       0;
    width:      55%;
    background: linear-gradient(to right, var(--ov-main), var(--ov-mid), transparent);
}

.wp-block-gasex-blog-carousel .hero-slide.pos-right::before {
    right:      0;
    width:      100%;
    background: linear-gradient(to left, var(--ov-main), var(--ov-mid), transparent);
}

.wp-block-gasex-blog-carousel .hero-slide.pos-center::before {
    left:       50%;
    transform:  translateX(-50%);
    width:      80%;
    background: var(--ov-main);
}

.wp-block-gasex-blog-carousel .hero-slide.no-overlay::before {
    display: none !important;
}

/* ── CONTENIDO ──────────────────────────────────────── */

.wp-block-gasex-blog-carousel .hero-contenido-wrapper {
    position:   relative;
    z-index:    3;
    width:      100%;
    padding:    60px 0;
    color:      var(--gasex-white);
}

.wp-block-gasex-blog-carousel .hero-gasex-container {
    width:          100%;
    max-width:      1320px;
    margin:         0 auto;
    padding:        0 25px;
    display:        flex;
    flex-direction: column;
}

.wp-block-gasex-blog-carousel .hero-contenido {
    display:        flex;
    flex-direction: column;
    align-items:    flex-start;
    opacity:        0;
    transform:      translateY(10px);
    transition:     opacity 0.6s ease, transform 0.6s ease;
    zoom:           0.80;
}

/* Botón CTA: ancho natural, centrado dentro del contenido */
.wp-block-gasex-blog-carousel .gx-btn--glass {
    align-self:  center;
    margin-top:  8px;
}

.wp-block-gasex-blog-carousel .hero-slide.is-active .hero-contenido {
    opacity:           1;
    transform:         translateY(0);
    transition-delay:  0.3s;
}

/* ── ALINEACIÓN ─────────────────────────────────────── */

.wp-block-gasex-blog-carousel .hero-slide.pos-left .hero-gasex-container  { align-items: flex-start; text-align: left;   }
.wp-block-gasex-blog-carousel .hero-slide.pos-center .hero-gasex-container { align-items: center;     text-align: center; }
.wp-block-gasex-blog-carousel .hero-slide.pos-right .hero-gasex-container  { align-items: flex-end;   text-align: right;  }

.wp-block-gasex-blog-carousel .hero-slide.pos-center .hero-contenido,
.wp-block-gasex-blog-carousel .hero-slide.pos-center .hero-desc { margin-left: auto; margin-right: auto; }
.wp-block-gasex-blog-carousel .hero-slide.pos-right  .hero-desc  { margin-left: auto; }

/* ── TÍTULO MULTI-LÍNEA ─────────────────────────────── */

.wp-block-gasex-blog-carousel .blog-title-group {
    display:        flex;
    flex-direction: column;
    gap:            0;
    margin-bottom:  16px;
    line-height:    1.1;
}

.wp-block-gasex-blog-carousel .blog-line {
    display:     block;
    line-height: 1.1;
}

/* Líneas con íconos laterales — flex automático */
.wp-block-gasex-blog-carousel .blog-line--1,
.wp-block-gasex-blog-carousel .blog-line--2 {
    display:     flex;
    align-items: center;
    gap:         0.15em;
}

/* Tagline — estilo cinta / ribbon (clip-path se aplica inline desde JS) */
.wp-block-gasex-blog-carousel .blog-tagline.tagline-style-ribbon {
    padding:         10px 32px;
    min-width:       220px;
    justify-content: center;
}

.wp-block-gasex-blog-carousel .blog-line__deco {
    width:       auto;
    flex-shrink: 0;
    object-fit:  contain;
    /* height controlado por inline style desde JS */
}

/* Estilos de fuente */
.wp-block-gasex-blog-carousel .blog-line.line-style-script {
    font-family:  'Dancing Script', cursive;
    font-weight:  700;
    font-style:   normal;
    line-height:  1.2;
}

.wp-block-gasex-blog-carousel .blog-line.line-style-normal {
    font-family:  'Montserrat', sans-serif;
    font-weight:  700;
}

.wp-block-gasex-blog-carousel .blog-line.line-style-display {
    font-family:    'Montserrat', sans-serif;
    font-weight:    900;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

/* Línea 2 y 3 siempre bold sans */
.wp-block-gasex-blog-carousel .blog-line--2 {
    font-family:    'Montserrat', sans-serif;
    font-weight:    800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-shadow:    0 2px 12px rgba(0,0,0,0.5);
}

.wp-block-gasex-blog-carousel .blog-line--3 {
    font-family:    'Montserrat', sans-serif;
    font-weight:    900;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    text-shadow:    0 2px 12px rgba(0,0,0,0.4);
}

/* Tamaños */
.wp-block-gasex-blog-carousel .blog-line.line-size-sm  { font-size: clamp(1.2rem,  2.5vw,  1.8rem); }
.wp-block-gasex-blog-carousel .blog-line.line-size-md  { font-size: clamp(1.8rem,  3.5vw,  2.8rem); }
.wp-block-gasex-blog-carousel .blog-line.line-size-lg  { font-size: clamp(2.4rem,  5vw,    4rem);   }
.wp-block-gasex-blog-carousel .blog-line.line-size-xl  { font-size: clamp(3rem,    7vw,    6rem);   }
.wp-block-gasex-blog-carousel .blog-line.line-size-xl2 { font-size: clamp(3.8rem,  9.5vw,  8rem);   }
.wp-block-gasex-blog-carousel .blog-line.line-size-xxl { font-size: clamp(4.5rem,  12vw,  10rem);   }

/* ── TAGLINE ────────────────────────────────────────── */

.wp-block-gasex-blog-carousel .blog-tagline {
    display:        inline-flex;
    align-items:    center;
    padding:        8px 20px;
    margin-bottom:  18px;
    font-family:    'Montserrat', sans-serif;
    font-weight:    700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-radius:  2px;
}

.wp-block-gasex-blog-carousel .blog-tagline.tagline-size-xs  { font-size: clamp(0.6rem,  0.9vw,  0.75rem); }
.wp-block-gasex-blog-carousel .blog-tagline.tagline-size-sm  { font-size: clamp(0.7rem,  1.2vw,  0.9rem);  }
.wp-block-gasex-blog-carousel .blog-tagline.tagline-size-md  { font-size: clamp(0.9rem,  1.6vw,  1.15rem); }
.wp-block-gasex-blog-carousel .blog-tagline.tagline-size-lg  { font-size: clamp(1.1rem,  2vw,    1.5rem);  }
.wp-block-gasex-blog-carousel .blog-tagline.tagline-size-xl  { font-size: clamp(1.4rem,  2.8vw,  2rem);    }
.wp-block-gasex-blog-carousel .blog-tagline.tagline-size-xl2 { font-size: clamp(1.8rem,  3.5vw,  2.5rem);  }
.wp-block-gasex-blog-carousel .blog-tagline.tagline-size-xxl { font-size: clamp(2.2rem,  4.5vw,  3rem);    }

/* ── DESCRIPCIÓN ────────────────────────────────────── */

.wp-block-gasex-blog-carousel .hero-desc strong,
.wp-block-gasex-blog-carousel .hero-desc b { font-weight: 700; }

.wp-block-gasex-blog-carousel .hero-desc.desc-size-sm  { font-size: clamp(0.85rem, 1.2vw,  1rem);   }
.wp-block-gasex-blog-carousel .hero-desc.desc-size-md  { font-size: clamp(1rem,    1.5vw,  1.2rem);  }
.wp-block-gasex-blog-carousel .hero-desc.desc-size-lg  { font-size: clamp(1.15rem, 1.8vw,  1.4rem);  }
.wp-block-gasex-blog-carousel .hero-desc.desc-size-xl  { font-size: clamp(1.4rem,  2.2vw,  1.8rem);  }
.wp-block-gasex-blog-carousel .hero-desc.desc-size-xl2 { font-size: clamp(1.55rem, 2.5vw,  2rem);    }
.wp-block-gasex-blog-carousel .hero-desc.desc-size-xxl { font-size: clamp(1.7rem,  2.8vw,  2.2rem);  }

.wp-block-gasex-blog-carousel .hero-desc {
    font-size:     clamp(1rem, 1.5vw, 1.2rem);
    line-height:   1.6;
    margin-bottom: 28px;
    font-weight:   300;
    opacity:       0.9;
    max-width:     720px;
    text-shadow:   0 2px 12px rgba(0,0,0,0.5);
}

/* ── IMAGEN DECORATIVA ──────────────────────────────── */

.wp-block-gasex-blog-carousel .blog-decor {
    position:       absolute;
    z-index:        4;
    left:           var(--decor-x, 70%);
    top:            var(--decor-y, 50%);
    transform:      translate(-50%, -50%);
    width:          var(--decor-size, 40%);
    pointer-events: none;
}

.wp-block-gasex-blog-carousel .blog-decor img {
    width:      100%;
    height:     auto;
    object-fit: contain;
    filter:     drop-shadow(0 8px 24px rgba(0,0,0,0.4));
}

/* ── SELLO / BADGE (imagen) ─────────────────────────── */

.wp-block-gasex-blog-carousel .blog-badge {
    position:       absolute;
    z-index:        5;
    left:           var(--badge-x, 80%);
    top:            var(--badge-y, 15%);
    transform:      translate(-50%, -50%);
    width:          var(--badge-size, 18%);
    pointer-events: none;
}

.wp-block-gasex-blog-carousel .blog-badge img {
    width:      100%;
    height:     auto;
    object-fit: contain;
    filter:     drop-shadow(0 4px 16px rgba(0,0,0,0.3));
}

/* ── BOTÓN CTA — tamaños ────────────────────────────── */

.wp-block-gasex-blog-carousel .gx-btn--size-sm { padding: 7px 18px;  }
.wp-block-gasex-blog-carousel .gx-btn--size-md { padding: 11px 28px; }
.wp-block-gasex-blog-carousel .gx-btn--size-lg { padding: 15px 38px; }
.wp-block-gasex-blog-carousel .gx-btn--size-xl { padding: 20px 52px; }

.wp-block-gasex-blog-carousel .gx-btn--text-sm { font-size: 0.78rem; }
.wp-block-gasex-blog-carousel .gx-btn--text-md { font-size: 0.95rem; }
.wp-block-gasex-blog-carousel .gx-btn--text-lg { font-size: 1.1rem;  }
.wp-block-gasex-blog-carousel .gx-btn--text-xl { font-size: 1.3rem;  }

/* ── NAV DOTS ───────────────────────────────────────── */

.wp-block-gasex-blog-carousel .hero-gasex-nav {
    position:  absolute;
    bottom:    30px;
    left:      50%;
    transform: translateX(-50%);
    z-index:   10;
}

.wp-block-gasex-blog-carousel .nav-indicators {
    display: flex;
    gap:     12px;
}

.wp-block-gasex-blog-carousel .nav-dot {
    width:      50px;
    height:     3px;
    background: rgba(255,255,255,0.25);
    border:     none;
    cursor:     pointer;
    transition: var(--transition-smooth);
}

.wp-block-gasex-blog-carousel .nav-dot.is-active {
    background: var(--gasex-white);
    transform:  scaleX(1.2);
}

/* ── EDITOR ─────────────────────────────────────────── */

.block-editor-page .blog-hero-gasex {
    position:    relative !important;
    min-height:  520px;
    display:     flex;
    align-items: center;
    overflow:    hidden;
}

/* Sin animaciones en editor — todo visible de inmediato */
.block-editor-page .blog-hero-gasex .hero-slide,
.block-editor-page .blog-hero-gasex .hero-contenido,
.block-editor-page .blog-hero-gasex .hero-img {
    transition:       none !important;
    transition-delay: 0s   !important;
    animation:        none !important;
}

/* Slide: siempre row en editor (nunca columna mobile) */
.block-editor-page .blog-hero-gasex .hero-slide {
    position:        relative    !important;
    width:           100%        !important;
    opacity:         1           !important;
    visibility:      visible     !important;
    display:         flex        !important;
    flex-direction:  row         !important;
    align-items:     stretch     !important;
    min-height:      520px;
}

.block-editor-page .blog-hero-gasex .hero-contenido {
    opacity:   1    !important;
    transform: none !important;
}

/* Imagen de fondo sin zoom */
.block-editor-page .blog-hero-gasex .hero-img {
    transform:   none  !important;
    width:       100%  !important;
    height:      100%  !important;
    object-fit:  cover !important;
}

.block-editor-page .blog-hero-gasex .hero-imagen-wrapper {
    position: absolute !important;
    inset:    0;
    z-index:  1;
}

.block-editor-page .blog-hero-gasex .hero-slider-main {
    height:     auto;
    min-height: auto;
}

/* Contenido: ocupa el ancho disponible (lado izquierdo) */
.block-editor-page .blog-hero-gasex .hero-contenido-wrapper {
    position:    relative !important;
    z-index:     3;
    flex:        1 1 60%;
    min-height:  520px;
    display:     flex;
    align-items: center;
}

/* Imagen decorativa: en editor sale del posicionamiento absoluto
   y aparece como columna derecha — evita tapar el texto */
.block-editor-page .blog-hero-gasex .blog-decor {
    position:        relative        !important;
    left:            auto            !important;
    right:           auto            !important;
    top:             auto            !important;
    bottom:          auto            !important;
    transform:       none            !important;
    flex:            0 0 200px;
    width:           200px !important;
    align-self:      center;
    order:           10;
    z-index:         3;
    padding:         16px 12px;
    display:         flex            !important;
    align-items:     center;
    justify-content: center;
}

.block-editor-page .blog-hero-gasex .blog-decor img {
    width:       100%;
    height:      auto;
    max-height:  300px;
    object-fit:  contain;
}

/* Badge: absoluto dentro del slide — se mantiene en su posición % */
.block-editor-page .blog-hero-gasex .blog-badge {
    z-index: 4;
}

/* Nav dots ocultos en editor */
.block-editor-page .blog-hero-gasex .hero-gasex-nav { display: none !important; }

/* Placeholder cuando no hay imagen de fondo */
.block-editor-page .blog-hero-gasex:not(:has(.hero-img)) {
    background: repeating-linear-gradient(
        45deg,
        #1a1a2e 0px, #1a1a2e 20px,
        #16213e 20px, #16213e 40px
    );
}

/* ── PREVIEW MOBILE EN EDITOR ──────────────────────────
   Mismas reglas que el media query, activadas por clase
   ─────────────────────────────────────────────────────── */

.wp-block-gasex-blog-carousel.is-mobile-preview.blog-hero-gasex,
.wp-block-gasex-blog-carousel.is-mobile-preview .hero-slider-main { min-height: 500px; }

.wp-block-gasex-blog-carousel.is-mobile-preview .hero-slide {
    flex-direction:  column;
    justify-content: flex-start;
}

.wp-block-gasex-blog-carousel.is-mobile-preview .blog-badge { display: none !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .blog-decor { display: none !important; }

.wp-block-gasex-blog-carousel.is-mobile-preview .hero-contenido-wrapper { padding: 16px 0 80px; width: 100%; }

.wp-block-gasex-blog-carousel.is-mobile-preview .hero-gasex-container,
.wp-block-gasex-blog-carousel.is-mobile-preview .hero-slide.pos-left  .hero-gasex-container,
.wp-block-gasex-blog-carousel.is-mobile-preview .hero-slide.pos-right .hero-gasex-container { align-items: center !important; text-align: center !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .hero-contenido { width: 100% !important; align-self: center !important; align-items: center !important; text-align: center !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .blog-line--1,
.wp-block-gasex-blog-carousel.is-mobile-preview .blog-line--2           { justify-content: center !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .hero-desc              { margin-left: auto !important; margin-right: auto !important; text-align: center !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .blog-tagline           { align-self: center !important; transform: none !important; }

.wp-block-gasex-blog-carousel.is-mobile-preview .hero-slide::before {
    left:       50%              !important;
    right:      auto             !important;
    transform:  translateX(-50%) !important;
    width:      100%             !important;
    background: var(--ov-main)   !important;
}

.wp-block-gasex-blog-carousel.is-mobile-preview .hero-gasex-nav { display: none !important; }

/* ── RESPONSIVE 991px — tamaños intermedios ─────────── */

@container (max-width: 991px) {
    /* Decor y badge exclusivos de desktop — ocultos en tablet y mobile */
    .wp-block-gasex-blog-carousel .blog-decor { display: none !important; }
    .wp-block-gasex-blog-carousel .blog-badge { display: none !important; }

    /* Centrado desde 991px — explícito para todos los pos-* */
    .wp-block-gasex-blog-carousel .hero-slide.pos-left  .hero-gasex-container,
    .wp-block-gasex-blog-carousel .hero-slide.pos-right .hero-gasex-container,
    .wp-block-gasex-blog-carousel .hero-slide           .hero-gasex-container {
        align-items: center !important;
        text-align:  center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .hero-contenido {
        width:       100%   !important;
        align-self:  center !important;
        align-items: center !important;
        text-align:  center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .gx-btn--glass {
        align-self: center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .blog-line--1,
    .wp-block-gasex-blog-carousel .hero-slide .blog-line--2 {
        justify-content: center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .hero-desc {
        margin-left:  auto   !important;
        margin-right: auto   !important;
        text-align:   center !important;
        align-self:   center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .blog-tagline {
        align-self: center   !important;
        transform:  none     !important;
    }
    /* Forzar centrado en cada elemento — sobreescribe inline style de elAlign() */
    .wp-block-gasex-blog-carousel .hero-slide .blog-line {
        align-self:      center !important;
        text-align:      center !important;
        justify-content: center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .blog-title-group {
        align-items: center !important;
        align-self:  center !important;
        text-align:  center !important;
    }

    /* Tamaños de línea overrides para 991px */
    .wp-block-gasex-blog-carousel .bp991-size-sm  { font-size: clamp(1rem,   2.2vw, 1.4rem) !important; }
    .wp-block-gasex-blog-carousel .bp991-size-md  { font-size: clamp(1.4rem, 3vw,   2rem)   !important; }
    .wp-block-gasex-blog-carousel .bp991-size-lg  { font-size: clamp(1.8rem, 4vw,   2.6rem) !important; }
    .wp-block-gasex-blog-carousel .bp991-size-xl  { font-size: clamp(2.2rem, 5.5vw, 3.5rem) !important; }
    .wp-block-gasex-blog-carousel .bp991-size-xl2 { font-size: clamp(2.8rem, 7vw,   4.5rem) !important; }
    .wp-block-gasex-blog-carousel .bp991-size-xxl { font-size: clamp(3.4rem, 9vw,   5.5rem) !important; }
}

/* ── RESPONSIVE 768px ────────────────────────────────── */

@container (max-width: 768px) {

    .wp-block-gasex-blog-carousel.blog-hero-gasex,
    .wp-block-gasex-blog-carousel .hero-slider-main {
        min-height: 85vh;
    }

    /* Slide como columna */
    .wp-block-gasex-blog-carousel .hero-slide {
        flex-direction:  column;
        justify-content: center;
    }

    /* Badge — oculto en mobile */
    .wp-block-gasex-blog-carousel .blog-badge {
        display: none !important;
    }

    /* Imagen decorativa — oculta en mobile */
    .wp-block-gasex-blog-carousel .blog-decor {
        display: none !important;
    }

    /* Contenido */
    .wp-block-gasex-blog-carousel .hero-contenido-wrapper {
        padding: 56px 0 80px;
        width:   100%;
    }

    /* Zoom suave para que el contenido no llene todo el alto */
    .wp-block-gasex-blog-carousel .hero-contenido {
        zoom: 0.92;
    }

    /* Todo centrado en mobile */
    .wp-block-gasex-blog-carousel .hero-slide .hero-gasex-container {
        align-items: center !important;
        text-align:  center !important;
    }

    .wp-block-gasex-blog-carousel .hero-slide .hero-contenido {
        align-items: center !important;
        text-align:  center !important;
    }

    .wp-block-gasex-blog-carousel .hero-slide .gx-btn--glass {
        align-self: center !important;
    }

    /* Líneas con íconos laterales: centrar el flex */
    .wp-block-gasex-blog-carousel .hero-slide .blog-line--1,
    .wp-block-gasex-blog-carousel .hero-slide .blog-line--2 {
        justify-content: center !important;
    }

    /* Descripción centrada */
    .wp-block-gasex-blog-carousel .hero-slide .hero-desc {
        margin-left:  auto;
        margin-right: auto;
        text-align:   center;
    }

    /* Tagline centrada (ribbon incluido) */
    .wp-block-gasex-blog-carousel .hero-slide .blog-tagline {
        align-self: center;
        transform:  none !important; /* sin rotación en mobile */
    }

    /* Overlay full en mobile */
    .wp-block-gasex-blog-carousel .hero-slide::before {
        left:       50%         !important;
        right:      auto        !important;
        transform:  translateX(-50%) !important;
        width:      100%        !important;
        background: var(--ov-main) !important;
    }

    /* Nav dots */
    .wp-block-gasex-blog-carousel .hero-gasex-nav {
        bottom:    16px;
        width:     100%;
        left:      0;
        transform: none;
    }

    .wp-block-gasex-blog-carousel .nav-indicators {
        flex-wrap:       wrap;
        justify-content: center;
        gap:             8px;
        padding:         0 20px;
    }

    .wp-block-gasex-blog-carousel .nav-dot { width: 32px; }

    /* ── Tamaños mobile personalizados ────────────────────
       Se aplican cuando el usuario elige un tamaño distinto
       al de desktop desde los controles del bloque.
       ─────────────────────────────────────────────────── */
    .wp-block-gasex-blog-carousel .mobile-size-xs  { font-size: clamp(0.7rem,  3vw,  0.85rem) !important; }
    .wp-block-gasex-blog-carousel .mobile-size-sm  { font-size: clamp(0.9rem,  4vw,  1.1rem)  !important; }
    .wp-block-gasex-blog-carousel .mobile-size-md  { font-size: clamp(1.1rem,  5vw,  1.4rem)  !important; }
    .wp-block-gasex-blog-carousel .mobile-size-lg  { font-size: clamp(1.4rem,  6vw,  1.8rem)  !important; }
    .wp-block-gasex-blog-carousel .mobile-size-xl  { font-size: clamp(1.8rem,  7vw,  2.4rem)  !important; }
    .wp-block-gasex-blog-carousel .mobile-size-xl2 { font-size: clamp(2.2rem,  8.5vw, 3rem)   !important; }
    .wp-block-gasex-blog-carousel .mobile-size-xxl { font-size: clamp(2.8rem,  10vw, 3.8rem)  !important; }

    /* Pantallas cortas mobile (ej. 375×677): reducir más */
    @media (max-height: 750px) {
        .wp-block-gasex-blog-carousel .hero-contenido-wrapper {
            padding-top:    24px;
            padding-bottom: 40px;
        }
        .wp-block-gasex-blog-carousel .hero-contenido {
            zoom: 0.80; /* reemplaza el 0.92 de arriba */
        }
    }
}

/* ── Tamaños mobile en editor (preview mobile) ─────── */
.wp-block-gasex-blog-carousel.is-mobile-preview .mobile-size-xs  { font-size: clamp(0.7rem,  3vw,  0.85rem) !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .mobile-size-sm  { font-size: clamp(0.9rem,  4vw,  1.1rem)  !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .mobile-size-md  { font-size: clamp(1.1rem,  5vw,  1.4rem)  !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .mobile-size-lg  { font-size: clamp(1.4rem,  6vw,  1.8rem)  !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .mobile-size-xl  { font-size: clamp(1.8rem,  7vw,  2.4rem)  !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .mobile-size-xl2 { font-size: clamp(2.2rem,  8.5vw, 3rem)   !important; }
.wp-block-gasex-blog-carousel.is-mobile-preview .mobile-size-xxl { font-size: clamp(2.8rem,  10vw, 3.8rem)  !important; }

/* ── 992px – 1280px: laptop pequeño / MacBook Air
   Centra todo el contenido (igual que ≤991px) pero mantiene decor visible.
   Badge también visible — si se quiere ocultar, agregar display:none aquí. */
@container (min-width: 992px) and (max-width: 1280px) {
    .wp-block-gasex-blog-carousel .hero-slide.pos-left  .hero-gasex-container,
    .wp-block-gasex-blog-carousel .hero-slide.pos-right .hero-gasex-container,
    .wp-block-gasex-blog-carousel .hero-slide           .hero-gasex-container {
        align-items: center !important;
        text-align:  center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .hero-contenido {
        width:       100%   !important;
        align-self:  center !important;
        align-items: center !important;
        text-align:  center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .gx-btn--glass {
        align-self: center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .blog-line--1,
    .wp-block-gasex-blog-carousel .hero-slide .blog-line--2 {
        justify-content: center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .hero-desc {
        margin-left:  auto !important;
        margin-right: auto !important;
        text-align:   center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .blog-tagline {
        align-self: center !important;
        transform:  none   !important;
    }

    /* Forzar centrado en cada elemento — sobreescribe inline style de elAlign() */
    .wp-block-gasex-blog-carousel .hero-slide .blog-line {
        align-self:      center !important;
        text-align:      center !important;
        justify-content: center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .hero-desc {
        align-self:  center !important;
        text-align:  center !important;
    }
    .wp-block-gasex-blog-carousel .hero-slide .blog-title-group {
        align-items:  center !important;
        align-self:   center !important;
        text-align:   center !important;
    }

    /* Posición propia de decor y badge para este breakpoint */
    .wp-block-gasex-blog-carousel .blog-decor {
        left:  var(--decor-x-1280);
        top:   var(--decor-y-1280);
        width: var(--decor-size-1280);
    }
    .wp-block-gasex-blog-carousel .blog-badge {
        left:  var(--badge-x-1280);
        top:   var(--badge-y-1280);
        width: var(--badge-size-1280);
    }
}

@media (min-width: 992px) and (max-width: 1280px) {
    .wp-block-gasex-blog-carousel.blog-hero-gasex,
    .wp-block-gasex-blog-carousel .hero-slider-main {
        min-height: 65vh;
    }
    .wp-block-gasex-blog-carousel .hero-contenido-wrapper {
        padding-top:    40px;
        padding-bottom: 40px;
    }
    .wp-block-gasex-blog-carousel .hero-contenido {
        zoom: 0.75;
    }
}

/* ── Laptops medianos y monitores (1281px–1800px, hasta 1150px alto)
   Cubre: 1440×810, 1440×900, 1710×1083, etc.
   Excluye: 1920×1080 (ancho > 1800) que se ve perfecto con la base. */
@media (min-width: 1281px) and (max-width: 1800px) and (max-height: 1150px) {
    .wp-block-gasex-blog-carousel.blog-hero-gasex,
    .wp-block-gasex-blog-carousel .hero-slider-main {
        min-height: 72vh;
    }
    .wp-block-gasex-blog-carousel .hero-contenido-wrapper {
        padding-top:    40px;
        padding-bottom: 40px;
    }
    .wp-block-gasex-blog-carousel .hero-contenido {
        zoom: 0.70;
    }
}

/* Badge y decor ya ocultos en ≤991px via @container — no se necesitan
   reglas específicas por tablet aquí. */
