/* A single cinematic entrance, followed by a quiet resting layout. */
.wrapper-intro::after {
    background: linear-gradient(90deg, rgba(8, 19, 22, .67), rgba(8, 19, 22, .2)), linear-gradient(0deg, rgba(8, 19, 22, .42), transparent 50%);
}
.hero-cinematic {
    position: relative;
    color: #fff;
    min-height: 760px;
    min-height: min(920px, 100svh);
    display: flex;
    align-items: center;
    padding: 150px 0 120px;
    overflow: hidden;
}
.hero-stage { perspective: 1100px; }
.hero-copy {
    width: min(900px, 100%);
    margin: 0 auto;
    --hero-shift: -85px;
    animation: hero-journey 5.2s cubic-bezier(.22, .61, .36, 1) both;
    animation-play-state: paused;
    will-change: transform, opacity, filter;
}
.hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .25em;
    margin: 0 0 28px;
}
.hero-eyebrow > span { width: 34px; height: 2px; background: #ffc239; }
.hero-cinematic h1 {
    color: #fff;
    font-size: clamp(46px, 5.6vw, 86px);
    font-weight: 600;
    line-height: 1.12;
    letter-spacing: -.055em;
    margin: 0;
    text-shadow: 0 4px 40px rgba(0, 0, 0, .12);
}
.hero-cinematic h1 > span { color: #ffcf72; }
.hero-details {
    margin-top: 30px;
    animation: hero-reveal 1.2s cubic-bezier(.22, .61, .36, 1) 4.1s both;
    animation-play-state: paused;
}
.hero-details > p { font-size: 16px; line-height: 1.9; color: rgba(255,255,255,.85); margin: 0 0 30px; }
.hero-cta {
    display: inline-flex;
    align-items: center;
    gap: 35px;
    padding: 17px 24px;
    background: #ffc239;
    color: #182025;
    border: 1px solid #ffc239;
    font-size: 13px;
    font-weight: 600;
    border-radius: 3px;
    transition: background .25s, transform .25s;
}
.hero-cta > span { font-size: 22px; line-height: 1; }
.hero-cta:hover { color: #182025; background: #ffda84; transform: translateY(-3px); }
.hero-cta:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
.hero-bottom {
    position: absolute;
    bottom: 30px;
    left: max(24px, calc((100% - 1110px) / 2));
    right: max(24px, calc((100% - 1110px) / 2));
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 9px;
    letter-spacing: .2em;
    color: rgba(255,255,255,.65);
    animation: hero-reveal 1.2s ease 4.5s both;
    animation-play-state: paused;
}
.hero-scroll { display: flex; gap: 22px; align-items: center; letter-spacing: .06em; font-size: 11px; }
.hero-scroll > span { font-size: 22px; color: #ffcf72; }
.hero-ready .hero-copy, .hero-ready .hero-details, .hero-ready .hero-bottom { animation-play-state: running; }
@keyframes hero-journey {
    0% { opacity: 0; transform: translate3d(120px, -70px, -2300px); filter: blur(14px); }
    12% { opacity: .2; }
    53% { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); }
    68% { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); }
    100% { opacity: 1; transform: translate3d(var(--hero-shift), 0, 0); filter: blur(0); }
}
@keyframes hero-reveal {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 1199px) { .hero-copy { --hero-shift: -15px; width: min(800px, 94%); } }
@media (max-width: 767px) {
    .wrapper-intro { background-position: right center; }
    .hero-video { object-position: right center; }
    .hero-cinematic { min-height: 740px; min-height: 100svh; padding: 150px 0 120px; }
    .hero-copy { width: 100%; --hero-shift: 0px; }
    .hero-eyebrow { font-size: 9px; letter-spacing: .15em; gap: 10px; margin-bottom: 25px; }
    .hero-cinematic h1 { font-size: clamp(38px, 8.3vw, 62px); }
    .hero-details > p { font-size: 14px; max-width: 360px; }
    .hero-desktop-break { display: none; }
    .hero-bottom { left: 14px; right: 14px; bottom: 24px; }
    .hero-bottom > span:first-child { font-size: 8px; letter-spacing: .1em; }
    .hero-scroll { font-size: 9px; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .hero-copy, .hero-details, .hero-bottom { animation: none; opacity: 1; filter: none; transform: none; }
    .hero-cta { transition: none; }
}