/* Native video layer: preserve the existing poster, crop, dimming and loop. */
.hero--video{background:#171a1d;isolation:isolate}
.hero--video .hero__bg{display:none!important;background-image:none!important}
.hero__video{position:absolute;inset:0;overflow:hidden;z-index:0}
.hero--video .hero__dim{z-index:1;background:rgba(0,0,0,.25)!important;pointer-events:none;transition:none!important}
.hero--video .wrap{position:relative;z-index:2}
.hero__poster,.hero__native,.hero__native-hold{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;pointer-events:none}
.hero__native{z-index:1;opacity:0;transition:none!important}
.hero__native-hold{z-index:2}
.hero--video:not(.is-video-ready) .wrap{visibility:hidden}
.hero--video [hidden]{display:none!important}

/* Precision-style 82 x 6px progress bars; invisible 44px click targets. */
.hero__controls{position:absolute;z-index:4;left:50%;bottom:12px;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:0;border:0;background:transparent;color:#fff}
.hero__controls button,.hero__toggle{appearance:none;box-sizing:border-box;border:0;margin:0;padding:0;color:inherit;font-family:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.hero__chapter{position:relative;display:flex;align-items:center;justify-content:center;width:82px;height:44px;background:transparent}
.hero__chapter-track{display:block;overflow:hidden;width:82px;height:6px;border-radius:2px;background:rgba(255,255,255,.20)}
.hero__chapter-track b{display:block;width:100%;height:100%;background:#fff;transform:scaleX(0);transform-origin:left center}
.hero__chapter:hover .hero__chapter-track{background:rgba(255,255,255,.32)}
.hero__controls button:disabled{opacity:.35;cursor:default}

/* Hover reveals pause at the exact video centre; paused/keyboard/touch stays operable. */
.hero__toggle{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:60px;height:60px;border:0;border-radius:50%;color:#fff;background:rgba(20,24,30,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .18s ease,background .18s ease}
.hero--video:hover .hero__toggle,.hero__toggle:focus-visible,.hero__toggle[data-paused="true"]{opacity:1;pointer-events:auto}
.hero__toggle:hover{background:rgba(20,24,30,.26)}
.hero__toggle svg{display:block;width:22px;height:22px;fill:currentColor}
.hero__toggle[data-paused="false"] .hero__icon-play,.hero__toggle[data-paused="true"] .hero__icon-pause{display:none}
.hero__controls button:focus-visible,.hero__toggle:focus-visible,.hero__error:focus-visible{outline:2px solid #fff;outline-offset:3px}
.hero__error{position:absolute;z-index:4;bottom:76px;left:50%;transform:translateX(-50%);border:1px solid #ffffff80;border-radius:20px;padding:8px 16px;color:#fff;background:#242a30d9;font:inherit}
@media(hover:none),(pointer:coarse){.hero__toggle{opacity:1;pointer-events:auto}}
@media(max-width:767px){.hero__toggle{width:52px;height:52px}.hero__toggle svg{width:20px;height:20px}}

/* Staggered line/pill motion is driven by JS; a short sheen accents the words. */
.mission--revealed .hl:not(.hl--img)::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:999px;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.38) 50%,transparent 65%);background-size:250% 100%;background-position:140% 0;opacity:0;animation:wooseok-mission-sheen 1.4s ease-in-out .55s 1}
.mission--revealed .ln--2 .hl::after{animation-delay:.73s}
.mission--revealed .ln--3 .hl::after{animation-delay:.91s}
@keyframes wooseok-mission-sheen{0%{background-position:140% 0;opacity:0}25%{opacity:1}75%{opacity:1}100%{background-position:-140% 0;opacity:0}}
@media(prefers-reduced-motion:reduce){.hero__toggle{transition:none}.mission__text .hl::after{animation:none!important;opacity:0!important}}