/* --- Overlay de brillo --- */
    .shine-overlay {
        background: linear-gradient(135deg,
            rgba(255,255,255,0.6) 0%,
            rgba(255,255,255,0) 50%,
            rgba(255,255,255,0.6) 100%);
        background-size: 200% 200%;
        animation: shine 1.5s ease-in-out infinite;
    }

    @keyframes shine {
        0%   { background-position: -200% center; }
        100% { background-position:  200% center; }
    }

    /* --- TÍTULO: visible en estado normal, se retira al hover --- */
    .titulo-noticia {
        z-index: 2;
        opacity: 1;
        transition: opacity 0.35s ease;
    }
    .titulo-noticia::before {
        content: '';
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,0.28);
        z-index: -1;
    }
    .group:hover .titulo-noticia { opacity: 0; }

    /* --- BOTÓN: oculto en estado normal, aparece al hover --- */
    .texto-noticia {
        z-index: 3;
        opacity: 0;
        transform: translateY(16px);
        transition: opacity 0.4s ease, transform 0.4s ease;
        pointer-events: none;
    }
    .texto-noticia::before {
        content: '';
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,0.32);
        z-index: -1;
    }
    .group:hover .texto-noticia {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }

    /* --- Tarjeta: transición de entrada + hover --- */
    .tarjeta-noticia {
        transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
                    filter    0.4s ease,
                    opacity   0.75s cubic-bezier(.22,1,.36,1);
        transform-origin: center center;
        position: relative;
    }
    .tarjeta-noticia::before {
        content: '';
        position: absolute;
        inset: 0;
        box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
        opacity: 0;
        transition: opacity 0.4s ease;
        pointer-events: none;
        z-index: -1;
    }
    .tarjeta-noticia:hover {
        transform: scale(1.1);
        filter: brightness(1.2) saturate(1.15);
        z-index: 30;
    }
    .tarjeta-noticia:hover::before { opacity: 1; }

    /* Quita subrayado/color del enlace */
    .tarjeta-noticia a {
        text-decoration: none;
        color: inherit;
    }

    /* --- Animaciones de entrada/salida con scroll --- */
    .anim-item {
        opacity: 0;
        transition-property: opacity, transform, filter;
        transition-duration: 0.75s;
        transition-timing-function: cubic-bezier(.22,1,.36,1);
        will-change: opacity, transform;
    }
    .anim-item.is-visible { opacity: 1; }

    .anim-titulo                    { transform: translateY(-40px); }
    .anim-titulo.is-visible         { transform: translateY(0); }

    .anim-parrafo                   { transform: translateX(-40px); }
    .anim-parrafo.is-visible        { transform: translateX(0); }

    .anim-blog                      { transform: scale(.85); }
    .anim-blog.is-visible           { transform: scale(1); }

    .anim-tarjeta                   { transform: translateY(60px) scale(.9); }
    .anim-tarjeta.is-visible        { transform: translateY(0) scale(1); }
    .anim-tarjeta.is-visible:hover  { transform: scale(1.1); }

    @media (prefers-reduced-motion: reduce) {
        .anim-item, .anim-item.is-visible {
            transition: none !important;
            transform: none !important;
            opacity: 1 !important;
        }
    }




      /* ============================================================
     🎨 AJUSTES DE IMAGEN DEL CARRUSEL  (modifica aquí los valores)
     ============================================================ */
  :root{
    --gcp-img-brightness: 0.7;
    --gcp-red-overlay-opacity: 0.10;
    --gcp-red-color: 248, 42, 0;
    --gcp-red-spread: 45%;
  }

  /* ============ CARRUSEL — solo lo que JS manipula o requiere 3D ============ */
  #gcp-cube-stage{
    transform-style: preserve-3d;
    transition: transform .9s cubic-bezier(.65,.05,.36,1), height .9s cubic-bezier(.65,.05,.36,1);
    will-change: transform, height;
  }
  #gcp-cube-stage.no-transition{ transition:none !important; }

  #gcp-cube-scaler{
    transform-origin:50% 50%;
    transition: transform .45s cubic-bezier(.65,.05,.36,1);
    will-change: transform;
  }

  .cube-face{
    backface-visibility:hidden;
    will-change: transform;
  }
  .cube-face.face-current{ position:relative; }
  .cube-face.face-incoming{ position:absolute; top:0; left:0; height:100%; }

  #gcp-hero-measurer{
    position:absolute; top:0; left:0; visibility:hidden; pointer-events:none; z-index:-1;
  }

  /* ============ 🎨 AJUSTES DE IMAGEN ============ */
  .gcp-img{
    filter: brightness(var(--gcp-img-brightness));
  }
  .gcp-img-wrap--red::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background: linear-gradient(
      to left,
      rgba(var(--gcp-red-color), var(--gcp-red-overlay-opacity)) 0%,
      rgba(var(--gcp-red-color), calc(var(--gcp-red-overlay-opacity) * 0.35)) var(--gcp-red-spread),
      rgba(var(--gcp-red-color), 0) 100%
    );
  }

  /* ============ 🎬 TÍTULO ANIMADO (GCP) ============ */
  .gcp-title-anim{
    --gta-tri:#ffffff;
    --gta-accent:#f82a00;
    --gta-letter-w:0.62em;
    --gta-word-gap: 0.15em;
    --gta-tri-half:0.30em;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
  }
  .gcp-title-anim .gta-triangle{
    width:0;height:0;
    border-left:var(--gta-tri-half) solid transparent;
    border-right:var(--gta-tri-half) solid transparent;
    border-top:calc(var(--gta-tri-half) * 1.65) solid var(--gta-tri);
    margin-left:0.1em;
    margin-bottom:0.35em;
    opacity:1;
    transform:translateY(0) scale(1);
  }
  .gcp-title-anim .gta-row{
    display:flex;
    align-items:center;
    opacity:1;
    transform:translateY(0);
  }
  .gcp-title-anim .gta-letter{
    width:var(--gta-letter-w);
    flex-shrink:0;
    text-align:center;
    font-weight:700;
    line-height:1;
    letter-spacing:.01em;
    color:var(--gta-tri);
  }
  .gcp-title-anim .gta-row:nth-child(3) .gta-letter,
  .gcp-title-anim .gta-row:nth-child(4) .gta-letter{
    margin-right:-0.08em;
  }
  .gcp-title-anim .gta-rest{
    font-weight:700;
    line-height:1;
    letter-spacing:.01em;
    color:var(--gta-tri);
    opacity:1;
    max-width:12em;
    overflow:hidden;
    white-space:nowrap;
    margin-left:var(--gta-word-gap);
  }

  /* ============ FILTRO: estado final ============ */
  .gcp-filter-anim{ width:30%; }

  /* ============ 🎬 ANIMACIÓN (solo con .gcp-anim-run) ============ */
  /* ⚡ VERSIÓN ACELERADA — mantiene el orden: filtro → triángulo → filas → palabras */

  /* 1) El filtro rojo crece (antes 2.2s → ahora 1.3s) */
  .gcp-anim-run .gcp-filter-anim{
    width:7%;
    animation: gcpFilterGrow 1.3s cubic-bezier(.4,0,.2,1) forwards;
  }

  /* 2) El triángulo cae */
  .gcp-anim-run .gcp-title-anim .gta-triangle{
    opacity:0;
    transform:translateY(-20px) scale(.8);
    animation: gtaDropIn .55s cubic-bezier(.2,.9,.3,1) 1.35s forwards;
  }

  /* 3) Las filas (letras G, C, P) bajan una tras otra */
  .gcp-anim-run .gcp-title-anim .gta-row{
    opacity:0;
    transform:translateY(-40px);
    animation: gtaTravelDown .55s cubic-bezier(.3,.7,.3,1) forwards;
  }
  .gcp-anim-run .gcp-title-anim .gta-row:nth-child(2){ animation-delay:1.55s; }
  .gcp-anim-run .gcp-title-anim .gta-row:nth-child(3){ animation-delay:1.80s; }
  .gcp-anim-run .gcp-title-anim .gta-row:nth-child(4){ animation-delay:2.05s; }

  /* 4) Las palabras (rupo, orporativo, apelera) se revelan una tras otra */
  .gcp-anim-run .gcp-title-anim .gta-rest{
    opacity:0;
    max-width:0;
    animation: gtaRevealWord .55s ease forwards;
  }
  .gcp-anim-run .gcp-title-anim .gta-row:nth-child(2) .gta-rest{ animation-delay:2.35s; }
  .gcp-anim-run .gcp-title-anim .gta-row:nth-child(3) .gta-rest{ animation-delay:2.60s; }
  .gcp-anim-run .gcp-title-anim .gta-row:nth-child(4) .gta-rest{ animation-delay:2.85s; }

  /* ============ KEYFRAMES ============ */
  @keyframes gcpFilterGrow{
    from{ width:7%; }
    to  { width:30%; }
  }
  @keyframes gtaDropIn{
    to{ opacity:1; transform:translateY(0) scale(1); }
  }
  @keyframes gtaTravelDown{
    0%  { opacity:0; transform:translateY(-40px); }
    30% { opacity:1; }
    100%{ opacity:1; transform:translateY(0); }
  }
  @keyframes gtaRevealWord{
    to{ opacity:1; max-width:12em; }
  }








  /* --- ANIMACIÓN DE ENTRADA/SALIDA AL SCROLL --- */
    .anim-item {
        opacity: 0;
        transition: opacity 0.75s cubic-bezier(.22,1,.36,1),
                    transform 0.75s cubic-bezier(.22,1,.36,1);
        will-change: opacity, transform;
    }
    .anim-dato {
        transform: translateY(70px) scale(.85);
    }
    .anim-dato.is-visible {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    @media (prefers-reduced-motion: reduce) {
        .anim-item, .anim-item.is-visible {
            transition: none !important;
            transform: none !important;
            opacity: 1 !important;
        }
    }

    /* --- CUADROS NUMERADOS (nav lateral fijo) --- */
    .cuadros-numerados {
        position: fixed;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        display: flex;
        flex-direction: column;
        justify-content: center;
        z-index: 50;
        transition: opacity 0.25s ease;
    }

    .cuadro-num {
        position: relative;
        width: 48px;
        height: 56px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #2c2f30;
        border-bottom: 1px solid #1b1f20;
        opacity: 0;
        transform: translateX(40px);
        animation: cuadro-entrada 0.5s ease forwards;
        transition: background-color 0.3s ease, transform 0.25s ease;
    }
    .cuadro-num:last-child { border-bottom: none; }
    .cuadro-num:nth-child(2) { animation-delay: 0.08s; }
    .cuadro-num:nth-child(3) { animation-delay: 0.16s; }
    .cuadro-num:nth-child(4) { animation-delay: 0.24s; }

    @keyframes cuadro-entrada {
        to { opacity: 1; transform: translateX(0); }
    }

    .cuadro-num span:first-child {
        font-size: 22px;
        font-weight: 800;
        color: #7a7a7a;
        transition: color 0.3s ease;
    }

    .cuadro-num:hover {
        background-color: #45494b;
        transform: scale(1.08);
    }
    .cuadro-num:hover span:first-child {
        color: #ffffff;
    }

    .cuadro-num.activo {
        background-color: #6b6f70;
    }
    .cuadro-num.activo span:first-child {
        color: #ffffff;
    }

    .cuadro-tooltip {
        position: absolute;
        top: 50%;
        right: calc(100% + 12px);
        transform: translateY(-50%) translateX(8px);
        background-color: #1b1f20;
        color: #ffffff;
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
        padding: 8px 14px;
        border-radius: 4px;
        box-shadow: 0 8px 20px rgba(0,0,0,0.35);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.25s ease, transform 0.25s ease;
    }

    .cuadro-tooltip::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 100%;
        transform: translateY(-50%);
        border: 6px solid transparent;
        border-left-color: #1b1f20;
    }

    .cuadro-num:hover .cuadro-tooltip {
        opacity: 1;
        transform: translateY(-50%) translateX(0);
    }

    @media (max-width: 768px) {
        .cuadro-num { width: 36px; height: 42px; }
        .cuadro-num span:first-child { font-size: 16px; }
        .cuadro-tooltip { display: none; }
    }




     /* --- ANIMACIÓN DE ENTRADA/SALIDA CON SCROLL --- */
    .anim-item {
        opacity: 0;
        transition: opacity 0.8s cubic-bezier(.22,1,.36,1),
                    transform 0.8s cubic-bezier(.22,1,.36,1);
        will-change: opacity, transform;
    }
    .anim-titulo                 { transform: translateY(-55px); }
    .anim-titulo.is-visible      { opacity: 1; transform: translateY(0); }

    .anim-stat                   { transform: translateY(90px) scale(.8); }
    .anim-stat.is-visible        { opacity: 1; transform: translateY(0) scale(1); }

    .anim-parrafo                { transform: translateX(-60px); }
    .anim-parrafo.is-visible     { opacity: 1; transform: translateX(0); }

    @media (prefers-reduced-motion: reduce) {
        .anim-item, .anim-item.is-visible {
            transition: none !important;
            transform: none !important;
            opacity: 1 !important;
        }
    }

    /* ══════════════════════════════════════════ */
    /* CUADROS NUMERADOS — entrada + estados      */
    /* ══════════════════════════════════════════ */
    .cuadro-num {
        opacity: 0;
        transform: translateX(40px);
        animation: cuadro-entrada 0.5s ease forwards;
        transition: background-color 0.3s ease, transform 0.25s ease;
    }
    .cuadro-num:last-child    { border-bottom: none; }
    .cuadro-num:nth-child(2)  { animation-delay: 0.08s; }
    .cuadro-num:nth-child(3)  { animation-delay: 0.16s; }

    @keyframes cuadro-entrada {
        to { opacity: 1; transform: translateX(0); }
    }

    /* Ícono */
    .cuadro-icono {
        color: #7a7a7a;
        transition: color 0.3s ease;
    }

    .cuadro-num:hover {
        background-color: #45494b;
        transform: scale(1.05);
    }
    .cuadro-num:hover .cuadro-icono { color: #ffffff; }

    .cuadro-num.activo { background-color: #6b6f70; }
    .cuadro-num.activo .cuadro-icono { color: #ffffff; }

    /* ============================================
       TARJETA QUE SALE DE ATRÁS (efecto cajón)
       ============================================ */
    .cuadro-tarjeta {
        position: absolute;
        top: 0;
        right: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 0 28px 0 22px;
        white-space: nowrap;
        color: #ffffff;
        font-size: 15px;
        font-weight: 700;
        letter-spacing: 0.02em;
        text-transform: uppercase;
        background-color: #2c2f30;
        box-shadow: -8px 0 24px rgba(0,0,0,0.35);
        transform: translateX(100%);
        clip-path: inset(0 0 0 100%);
        transition:
            transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
            clip-path 0.45s cubic-bezier(0.22, 1, 0.36, 1),
            background-color 0.35s ease;
        z-index: 1;
        pointer-events: none;
    }

    .cuadro-tarjeta::after {
        content: '';
        position: absolute;
        top: 0;
        right: -14px;
        width: 0;
        height: 0;
        border-top: 28px solid transparent;
        border-bottom: 28px solid transparent;
        border-left: 14px solid #2c2f30;
        transition: border-left-color 0.35s ease;
    }

    .cuadro-num:hover .cuadro-tarjeta {
        transform: translateX(0);
        clip-path: inset(0 0 0 0);
    }

    /* Colores por cuadro al hacer hover */
    .cuadro-num:nth-child(1):hover .cuadro-tarjeta { background-color: #dc0d00; }
    .cuadro-num:nth-child(1):hover .cuadro-tarjeta::after { border-left-color: #dc0d00; }

    .cuadro-num:nth-child(2):hover .cuadro-tarjeta { background-color: #68c547; }
    .cuadro-num:nth-child(2):hover .cuadro-tarjeta::after { border-left-color: #68c547; }

    .cuadro-num:nth-child(3):hover .cuadro-tarjeta { background-color: #53e8cf; color: #1b1f20; }
    .cuadro-num:nth-child(3):hover .cuadro-tarjeta::after { border-left-color: #53e8cf; }

    @media (max-width: 768px) {
        .cuadro-tarjeta {
            font-size: 12px;
            padding: 0 18px 0 14px;
        }
        .cuadro-tarjeta::after {
            border-top-width: 22px;
            border-bottom-width: 22px;
        }
    }

    /* ══════════════════════════════════════════ */
    /* NÚMEROS ULTRA-GRUESOS - Sección Nosotros  */
    /* ══════════════════════════════════════════ */
    #seccion-1 .stat-num {
        -webkit-text-stroke: 0.045em #f4c9c4;
        paint-order: stroke fill;
        text-rendering: geometricPrecision;
        letter-spacing: -0.02em;
        transform: scale(1.02);
        transform-origin: center;
    }

    @media (min-width: 768px) {
        #seccion-1 .stat-num {
            -webkit-text-stroke-width: 0.055em;
            letter-spacing: -0.03em;
        }
    }

    @supports not (-webkit-text-stroke: 1px black) {
        #seccion-1 .stat-num {
            text-shadow:
                1px 0 0 #f4c9c4,
                -1px 0 0 #f4c9c4,
                0 1px 0 #f4c9c4,
                0 -1px 0 #f4c9c4,
                1px 1px 0 #f4c9c4,
                -1px -1px 0 #f4c9c4,
                1px -1px 0 #f4c9c4,
                -1px 1px 0 #f4c9c4;
        }
    }










        /* PARALLAX — hook de JS + transición mínima (el transform lo escribe JS inline) */
    .parallax-bg {
        transition: transform 0.01s linear;
        will-change: transform;
    }

    /* ============================================ */
    /* TÍTULO CON EFECTO DE RELLENO PROGRESIVO      */
    /* (JS reescribe el gradient en cada frame)     */
    /* ============================================ */
    #titulo-parallax {
        transition: transform 0.6s cubic-bezier(0.7, 0, 0.84, 0), opacity 0.6s ease;
        background-image: linear-gradient(to right, #a40000 0%, #a40000 0%, #000000 0%, #000000 100%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
    }

    /* ============================================ */
    /* ANIMACIÓN DE ENTRADA HACIA EL CENTRO         */
    /* ============================================ */
    @keyframes slideInFromLeft {
        0%   { transform: translateX(-100%); }
        75%  { transform: translateX(4.5%);  }
        100% { transform: translateX(0);     }
    }

    @keyframes slideInFromRight {
        0%   { transform: translateX(100%);  }
        75%  { transform: translateX(-4.5%); }
        100% { transform: translateX(0);     }
    }

    .reveal-left {
        animation: slideInFromLeft 2s cubic-bezier(0.65, 0, 0.35, 1) both;
        animation-play-state: paused;
    }
    .reveal-right {
        animation: slideInFromRight 2s cubic-bezier(0.65, 0, 0.35, 1) both;
        animation-play-state: paused;
    }

    .heroSection-inview .reveal-left,
    .heroSection-inview .reveal-right {
        animation-play-state: running;
    }






        /* ====== TARJETA BASE Y HOVER ====== */
    .grupo-tarjeta {
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), filter 0.3s ease;
        cursor: pointer;
        transform-origin: center center;
    }
    .grupo-tarjeta.activa {
        z-index: 20;
        transform: scale(1.05) !important;
        filter: brightness(1.05);
        box-shadow: none !important;
    }

    /* ====== IMAGEN DE PRODUCTO (base + hover, antes estaba en JS inline) ====== */
    .producto-imagen {
        transform: translate(-50%, 0);
        filter: grayscale(1) drop-shadow(0 6px 6px rgba(0,0,0,0.25));
        transition: filter 0.4s ease-in-out, transform 0.4s ease-in-out;
        will-change: transform, filter;
    }
    .grupo-tarjeta.activa .producto-imagen {
        filter: grayscale(0) drop-shadow(0 6px 6px rgba(0,0,0,0.25));
        transform: translate(-50%, -3.125rem);
    }

    /* ====== VISTA NORMAL ====== */
    .vista-normal {
        transition: opacity 0.5s ease;
    }
    .grupo-tarjeta.activa .vista-normal {
        opacity: 0;
        transition: opacity 0.3s ease 0.2s;
    }

    /* ====== VISTA HOVER ====== */
    .vista-hover {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 6;
        pointer-events: none;
        transform: translateY(100%);
        transition: transform 0.35s ease 0.1s;
    }
    .grupo-tarjeta.activa .vista-hover {
        transform: translateY(0);
        pointer-events: auto;
        transition: transform 0.75s cubic-bezier(0.16, 1, 0.3, 1) 0.1s;
    }

    /* Franja de color: crece desde abajo */
    .vista-hover .franja {
        transform-origin: bottom center;
        transform: scaleY(0);
        transition: transform 0.3s ease 0.5s;
    }
    .grupo-tarjeta.activa .vista-hover .franja {
        transform: scaleY(1);
        transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1) 0.25s;
    }

    /* Sección negra */
    .vista-hover .seccion-negra {
        transform: none;
        opacity: 1;
        box-sizing: border-box;
    }

    /* Texto: justificado sin guiones ni cortes */
    .vista-hover .texto-hover {
        text-align: justify;
        text-justify: inter-word;
        hyphens: none !important;
        -webkit-hyphens: none !important;
        -ms-hyphens: none !important;
        word-break: normal;
        overflow-wrap: break-word;
        word-wrap: break-word;
        max-height: 100%;
        text-align-last: left;
    }

    /* Logo con "pop" */
    .vista-hover .logo-hover {
        opacity: 0;
        transform: scale(0.5);
        transition: opacity 0.25s ease 0.1s, transform 0.25s ease 0.1s;
    }
    .grupo-tarjeta.activa .vista-hover .logo-hover {
        opacity: 1;
        transform: scale(1);
        transition: opacity 0.45s ease 0.85s, transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) 0.85s;
    }

    /* Texto desliza desde la derecha */
    .vista-hover .texto-hover {
        opacity: 0;
        transform: translateX(20px);
        transition: opacity 0.25s ease 0s, transform 0.25s ease 0s;
    }
    .grupo-tarjeta.activa .vista-hover .texto-hover {
        opacity: 1;
        transform: translateX(0);
        transition: opacity 0.45s ease 1.05s, transform 0.45s ease 1.05s;
    }

    /* ====== ANIMACIÓN DE ENTRADA (SCROLL) ====== */
    .card-anim {
        opacity: 0;
        transform: translateY(70px) scale(1);
        transition:
            opacity 1.4s cubic-bezier(0.16, 1, 0.3, 1),
            transform 1.4s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .card-anim.in-view {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    .card-anim:nth-child(1) { transition-delay: 0s; }
    .card-anim:nth-child(2) { transition-delay: 0.10s; }
    .card-anim:nth-child(3) { transition-delay: 0.20s; }
    .card-anim:nth-child(4) { transition-delay: 0.30s; }
    .card-anim:nth-child(5) { transition-delay: 0.40s; }
    .card-anim:nth-child(6) { transition-delay: 0.50s; }
    .card-anim:nth-child(7) { transition-delay: 0.60s; }
    .card-anim:nth-child(8) { transition-delay: 0.70s; }
    .card-anim:nth-child(9) { transition-delay: 0.80s; }
    .card-anim:nth-child(10) { transition-delay: 0.90s; }

    /* ====== ANIMACIONES DE TEXTO (SCROLL) ====== */
    #titulo-principal,
    #subtitulo-rojo,
    #parrafo-desc {
        transition: transform 0.6s cubic-bezier(0.7, 0, 0.84, 0), opacity 0.6s ease;
    }
    .texto-salida-izq   { transform: translateX(-150px); opacity: 0; }
    .texto-salida-arriba{ transform: translateY(-100px); opacity: 0; }
    .texto-salida-der   { transform: translateX(150px);  opacity: 0; }







    /* ============================================ */
    /* ANIMACIÓN DE ENTRADA DEL BLOQUE COMPLETO      */
    /* ============================================ */
    .video-anim {
        opacity: 0;
        transform: translateY(160px) scale(0.88);
        transition:
            opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
            transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
        will-change: opacity, transform;
    }

    .video-anim.in-view {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    /* ✨ Botón Play: pulso llamativo ✨ */
    .play-pulse-ring {
        position: absolute;
        inset: 0;
        border-radius: 9999px;
        background: rgba(248, 42, 0, 0.5);
        animation: play-pulse 2.4s ease-out infinite;
    }

    @keyframes play-pulse {
        0% {
            transform: scale(1);
            opacity: 0.6;
        }
        100% {
            transform: scale(3.2);
            opacity: 0;
        }
    }





    /* ============================================
   CARRUSEL — Móvil (mismo look que web, más compacto)
   ============================================ */

/* Evita un pequeño scroll horizontal por el sub-pixel del scale */
#gcp-hero-carousel {
  overflow-x: clip;
  touch-action: pan-y;
}

@media (max-width: 767px) {
  /* Los dots se achican para no tapar el texto escalado */
  .hero-carousel-dot {
    width: 6px;
    height: 6px;
  }

  /* En pantallas muy chicas, mantén legible el título GCP */
  .gcp-title-anim .gta-letter {
    letter-spacing: 0;
  }
}


/* ============================================================ */
/* ✅ NUEVO — Label (AÑOS / PLANTAS / PAÍSES) ENCIMA del número  */
/* Solo esto se agregó. Nada más fue tocado.                    */
/* ============================================================ */
#seccion-1 .stat-block {
    position: relative;
}
#seccion-1 .stat-bignum {
    position: relative;
    z-index: 1;
}
#seccion-1 .stat-label {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    pointer-events: none;
}


.grupo-tarjeta { -webkit-tap-highlight-color: transparent; }

@media (max-width: 767px) {
    .card-anim:nth-child(n) { transition-delay: 0s; }
}