/* ================================================
   Escenas de video (Higgsfield) dentro de la página
   El mismo mundo del hero en dos momentos más:
   · --infra  : la cabaña de noche, donde viven los datos (3 rótulos por scroll)
   · --cierre : el amanecer despejado, justo antes del formulario
   Cada sección es alta y su interior queda fijo (sticky) mientras el scroll
   cambia los rótulos y acerca apenas la cámara. El video se carga cuando el
   visitante se acerca (aztra-scenes.js), no al entrar a la página.
   ================================================ */
.aztra-scene { position: relative; height: 250vh; background: #0d1220; }
.aztra-scene--cierre { height: 170vh; }
.aztra-scene__sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; }

.aztra-scene__video {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; object-position: 50% 50%;
    transform-origin: 50% 62%; will-change: transform; pointer-events: none;
}
.aztra-scene--infra .aztra-scene__video { object-position: 62% 50%; transform-origin: 66% 62%; }

/* velos: funden arriba y abajo con el fondo de la página y dan apoyo al texto */
.aztra-scene__scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.aztra-scene--infra .aztra-scene__scrim {
    background:
        linear-gradient(180deg, #0d1220 0%, rgba(13, 18, 32, 0) 15%, rgba(13, 18, 32, 0) 84%, #0d1220 100%),
        linear-gradient(90deg, rgba(7, 11, 20, 0.80) 0%, rgba(7, 11, 20, 0.48) 32%, rgba(7, 11, 20, 0) 58%);
}
.aztra-scene--cierre .aztra-scene__scrim {
    background: linear-gradient(180deg,
        #0d1220 0%,
        rgba(13, 18, 32, 0.70) 13%,
        rgba(13, 18, 32, 0.40) 38%,
        rgba(13, 18, 32, 0) 58%,
        rgba(13, 18, 32, 0) 82%,
        #0d1220 100%);
}

/* rótulos */
.aztra-scene__caps { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.aztra-scene__cap {
    position: absolute; left: clamp(24px, 7vw, 120px); top: 45%;
    max-width: 440px; opacity: 0; visibility: hidden;
    will-change: transform, opacity;
}
.aztra-scene__cap h3 {
    color: #EDEDED;
    font-family: var(--aztra-display, 'Bebas Neue', sans-serif);
    /* !important: aztra-branding.css fuerza h3 a 24px !important bajo 768px */
    font-size: clamp(38px, 4.4vw, 66px) !important;
    line-height: 1.02; margin: 14px 0; font-weight: 400; letter-spacing: 0.02em;
    text-shadow: 0 2px 26px rgba(0, 0, 0, 0.55);
}
.aztra-scene__cap p {
    color: rgba(237, 237, 237, 0.9); font-size: 17px; line-height: 1.7; margin: 0;
    max-width: 34ch; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.8);
}
.aztra-scene__cap .aztra-nucleo__eyebrow { color: #A9C2DE; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.7); }

.aztra-scene__cap--center {
    left: 0; right: 0; top: 17%; margin: 0 auto;
    width: min(90vw, 780px); max-width: none; text-align: center;
}
.aztra-scene__cap--center h3 { font-size: clamp(34px, 4.2vw, 62px) !important; margin: 12px 0 0; }
.aztra-scene__cap .default-btn { pointer-events: auto; margin-top: 26px; }

.aztra-scene__count {
    position: absolute; z-index: 2; pointer-events: none;
    right: clamp(24px, 6vw, 110px); bottom: clamp(26px, 6vh, 60px);
    display: flex; align-items: baseline; gap: 8px;
    color: rgba(237, 237, 237, 0.55); font-size: 13px; letter-spacing: 2px;
}
.aztra-scene__count b { color: #89A6C6; font-size: 27px; font-weight: 800; }

@media (max-width: 767px) {
    .aztra-scene { height: 220vh; }
    .aztra-scene--cierre { height: 150vh; }
    .aztra-scene__video,
    .aztra-scene--infra .aztra-scene__video { object-position: 50% 50%; transform-origin: 50% 62%; }
    /* en celular el texto va arriba, sobre el cielo, y la escena queda abajo */
    .aztra-scene__cap { left: 22px; right: 22px; top: 13%; max-width: none; text-align: center; }
    .aztra-scene__cap p { margin: 0 auto; }
    .aztra-scene__cap--center { width: auto; top: 13%; }
    .aztra-scene--infra .aztra-scene__scrim {
        background: linear-gradient(180deg,
            #0d1220 0%,
            rgba(7, 11, 20, 0.86) 12%,
            rgba(7, 11, 20, 0.72) 34%,
            rgba(7, 11, 20, 0) 52%,
            rgba(7, 11, 20, 0) 86%,
            #0d1220 100%);
    }
    /* abajo ya vive el botón flotante: sin contador ni segundo botón */
    .aztra-scene__count, .aztra-scene__cap .default-btn { display: none; }
}

/* sin animación (reduce-motion): la imagen fija y todos los rótulos legibles */
.aztra-scene.is-static { height: auto; }
.aztra-scene.is-static .aztra-scene__sticky { position: relative; height: auto; min-height: 80vh; padding: 130px 0 110px; }
.aztra-scene.is-static .aztra-scene__count { display: none; }
.aztra-scene.is-static .aztra-scene__caps { position: relative; inset: auto; display: grid; gap: 54px; padding: 0 8vw; }
.aztra-scene.is-static .aztra-scene__cap {
    position: static; width: auto; margin: 0;
    opacity: 1 !important; visibility: visible !important; transform: none !important;
}
.aztra-scene.is-static .aztra-scene__cap--center { margin: 0 auto; }

/* ---------- cámara con el scroll (.aztra-scene--scrub) ----------
   La sección es más alta: más scroll = cámara más lenta y más control.
   Debajo del canvas queda la primera imagen fija, para que nunca se vea vacío
   mientras bajan los cuadros. */
.aztra-scene--scrub { height: 380vh; }
.aztra-scene__still,
.aztra-scene__canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.aztra-scene__still { object-fit: cover; object-position: 62% 50%; }
.aztra-scene__canvas { display: block; opacity: 0; transition: opacity .5s ease; }
.aztra-scene.is-ready .aztra-scene__canvas { opacity: 1; }
.aztra-scene.is-static .aztra-scene__canvas { display: none; }
@media (max-width: 767px) {
    .aztra-scene--scrub { height: 330vh; }
    .aztra-scene__still { object-position: 50% 50%; }
}
.aztra-scene--scrub.is-static { height: auto; }
