:root{--red:#ff2d46;--red2:#9a0c20;--ice:#7dd8ff;--bg:#050506;--panel:#0b0c10;--text:#f5f6f8;--muted:#8f98a7}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden}a{color:inherit}button,a{font:inherit}
#particles{position:fixed;inset:0;width:100%;height:100%;z-index:-4;background:radial-gradient(circle at 25% 12%,#10151e,#050506 48%,#020203)}
.grain{position:fixed;inset:-50%;z-index:100;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain .25s steps(2) infinite}@keyframes grain{25%{transform:translate(2%,-3%)}50%{transform:translate(-3%,2%)}75%{transform:translate(3%,3%)}}
.nav{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;align-items:center;justify-content:space-between;padding:20px clamp(20px,5vw,76px);background:linear-gradient(#040405e8,transparent);backdrop-filter:blur(5px)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:950;letter-spacing:.22em}.wolf-mark{color:var(--red);font-size:1.65rem;filter:drop-shadow(0 0 12px var(--red))}
.nav nav{display:flex;align-items:center;gap:28px}.nav nav a{text-decoration:none;color:#c5cad3;font-size:.76rem;font-weight:800;letter-spacing:.12em}.outline{border:1px solid #ffffff28;padding:12px 17px;border-radius:999px}
.hero{position:relative;min-height:100svh;display:grid;grid-template-columns:minmax(0,1.03fr) minmax(420px,.97fr);align-items:center;padding:105px clamp(22px,6vw,96px) 48px;overflow:hidden;isolation:isolate}
.approved-art{position:absolute;inset:0;background:url("assets/scout-approved-hero.jpg") right center/cover no-repeat;opacity:.44;filter:saturate(.86) contrast(1.08);z-index:-3;animation:cameraPush 14s ease-in-out infinite alternate}@keyframes cameraPush{to{transform:scale(1.035)}}
.vignette{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#050506 2%,#050506f2 34%,#05050680 58%,#05050620 100%),linear-gradient(0deg,#050506 0%,transparent 28%),radial-gradient(circle at 30% 52%,transparent,#050506b5 78%)}
.hero-copy{max-width:770px;position:relative;z-index:10}.kicker,.section-kicker{font-size:.69rem;font-weight:850;letter-spacing:.24em;color:#aeb6c2}.kicker span{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:9px;background:var(--red);box-shadow:0 0 18px var(--red);animation:pulse 1.5s infinite}@keyframes pulse{50%{opacity:.45;transform:scale(1.5)}}
h1{font-size:clamp(3.7rem,7.4vw,8.6rem);line-height:.83;letter-spacing:-.065em;margin:24px 0 30px;font-weight:950}h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px #ff5369;background:linear-gradient(90deg,#ff2d46,#ff7888);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 30px #ff2d4633)}
.lead{max-width:640px;color:#b0b7c2;font-size:clamp(1rem,1.25vw,1.22rem);line-height:1.75}.actions{display:flex;gap:14px;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 23px;border-radius:4px;text-decoration:none;font-size:.76rem;font-weight:900;letter-spacing:.08em;cursor:pointer}.primary{border:0;color:white;background:linear-gradient(135deg,#ff4058,#a70e26);box-shadow:0 16px 54px #ff2d4638}.ghost{color:white;background:#08090ddd;border:1px solid #ffffff25}.micro{color:#747d8c;font-size:.78rem;margin-top:18px}
.stage{position:relative;z-index:11;min-height:700px;display:flex;align-items:center;justify-content:center}.run-line{position:absolute;left:4%;right:3%;bottom:125px;height:3px;background:linear-gradient(90deg,transparent,#7dd8ff55,#ff2d4677,transparent);box-shadow:0 0 28px #7dd8ff33}
.scout{position:absolute;left:50%;bottom:125px;translate:-50% 0;width:min(620px,48vw);height:585px;transform-origin:50% 88%;cursor:pointer;will-change:left,transform,opacity}.pose{position:absolute;left:50%;bottom:0;max-width:100%;max-height:100%;transform:translateX(-50%);filter:drop-shadow(0 36px 30px #000c);pointer-events:none;user-select:none}.pose2{opacity:0}
.shadow{position:absolute;left:50%;bottom:8px;translate:-50% 0;width:52%;height:42px;border-radius:50%;background:#000c;filter:blur(13px);z-index:-1}
.scout.running .pose1{animation:pose1 .18s steps(1) infinite}.scout.running .pose2{animation:pose2 .18s steps(1) infinite}@keyframes pose1{0%,49%{opacity:1}50%,100%{opacity:0}}@keyframes pose2{0%,49%{opacity:0}50%,100%{opacity:1}}
.scout.enter{animation:runIn 2.45s cubic-bezier(.18,.72,.18,1) both}@keyframes runIn{0%{left:135%;transform:translateY(15px) scale(.58)}12%{transform:translateY(-21px) scale(.63) rotate(-2deg)}24%{transform:translateY(12px) scale(.68) rotate(2deg)}38%{transform:translateY(-24px) scale(.74) rotate(-2deg)}52%{transform:translateY(9px) scale(.82) rotate(2deg)}67%{transform:translateY(-18px) scale(.9)}82%{left:52%;transform:translateY(-10px) scale(1.02)}100%{left:50%;transform:translateY(0) scale(1)}}
.scout.idle{animation:breathe 3.1s ease-in-out infinite}@keyframes breathe{50%{transform:translateY(-5px) scale(1.012)}}
.scout.tilt{animation:tilt .9s ease}@keyframes tilt{35%,70%{transform:rotate(-7deg) translateY(-7px)}}.scout.celebrate{animation:jump .9s ease}@keyframes jump{34%{transform:translateY(-65px) rotate(-4deg) scale(1.04)}60%{transform:translateY(0) rotate(4deg)}}.scout.guard{animation:guard .9s ease}@keyframes guard{45%{transform:scale(1.08) translateY(-12px)}}.scout.sprint{animation:sprint 1.3s cubic-bezier(.45,0,.1,1)}@keyframes sprint{0%{left:50%}30%{left:86%;transform:translateY(-20px) scale(.78)}42%{opacity:.1}52%{left:12%;opacity:.1}78%{opacity:1}100%{left:50%;transform:none}}
.scout.chase{animation:chase 2.25s cubic-bezier(.36,.04,.14,1) both}@keyframes chase{0%{left:50%}18%{left:20%;transform:translateY(-20px) scale(.88)}36%{left:82%;transform:translateY(9px) scale(.8)}53%{left:15%;transform:translateY(-18px) scale(.77)}72%{left:78%;transform:translateY(-8px) scale(.84)}88%{left:50%;transform:translateY(-62px) scale(1.03)}100%{left:50%;transform:translateY(0)}}
.treat{position:absolute;bottom:47px;z-index:20;display:flex;align-items:center;gap:10px;padding:14px 20px;border-radius:999px;border:1px solid #ffffff28;background:#090b10e8;color:white;letter-spacing:.09em;font-size:.7rem;cursor:pointer}.treat span{color:var(--red);filter:drop-shadow(0 0 9px var(--red))}.treat.fly{animation:treatFly 2s cubic-bezier(.35,.03,.15,1) both}@keyframes treatFly{0%{transform:translate(0,0)}18%{transform:translate(-190px,-360px) rotate(190deg)}42%{transform:translate(190px,-280px) rotate(420deg)}64%{transform:translate(-220px,-210px) rotate(660deg)}88%{transform:translate(0,-360px) scale(.7) rotate(860deg)}100%{transform:translate(0,-280px) scale(0) rotate(960deg)}}
.rule{position:absolute;bottom:10px;font-size:.61rem;letter-spacing:.24em;color:#758095}.scroll{position:absolute;left:50%;bottom:25px;translate:-50% 0;color:#687282;font-size:.58rem;letter-spacing:.22em}.scroll span{display:block;width:1px;height:32px;margin:9px auto 0;background:linear-gradient(var(--red),transparent)}
.why{padding:150px clamp(22px,7vw,112px);background:linear-gradient(#050506,#090b10)}.why h2,.core h2,.finale h2{font-size:clamp(2.7rem,5.5vw,6.5rem);line-height:.95;letter-spacing:-.05em;margin:20px 0 70px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ffffff16;border:1px solid #ffffff16}.cards article{min-height:330px;padding:42px;background:#090b10;position:relative;overflow:hidden}.cards article:after{content:"";position:absolute;inset:auto -20% -45% 15%;height:180px;background:radial-gradient(circle,#ff2d4623,transparent 67%)}.cards span,.principles span{color:var(--red);font-size:.7rem;letter-spacing:.18em}.cards h3{font-size:1.55rem;margin:85px 0 14px}.cards p{color:#8c95a4;line-height:1.7}
.core{display:grid;grid-template-columns:1.12fr .88fr;gap:80px;padding:150px clamp(22px,7vw,112px)}.principles{border-top:1px solid #ffffff18}.principles button{width:100%;display:flex;align-items:center;gap:22px;padding:25px 4px;border:0;border-bottom:1px solid #ffffff18;background:none;color:white;text-align:left;font-size:clamp(1.5rem,3vw,3.2rem);font-weight:950;letter-spacing:-.04em;cursor:pointer;transition:.2s}.principles button:hover{padding-left:20px;color:var(--red)}
.finale{min-height:80vh;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden}.finale p{font-size:.68rem;letter-spacing:.25em;color:#a0a8b4}.finale h2{margin:20px 0 40px}.glow{position:absolute;width:68vw;height:68vw;border-radius:50%;z-index:-1;background:radial-gradient(circle,#ff2d461b,transparent 67%)}
footer{display:flex;justify-content:space-between;gap:20px;padding:34px clamp(22px,5vw,74px);border-top:1px solid #ffffff13;color:#6f7887;font-size:.62rem;letter-spacing:.14em}footer a{text-decoration:none}
.toast{position:fixed;left:50%;bottom:25px;z-index:120;translate:-50% 25px;opacity:0;padding:13px 19px;border-radius:999px;background:#0b0d12f2;border:1px solid #ffffff22;box-shadow:0 20px 70px #000;color:white;font-size:.8rem;transition:.25s}.toast.show{opacity:1;translate:-50% 0}
@media(max-width:1000px){.hero{grid-template-columns:1fr;padding-top:125px}.hero-copy{text-align:center;margin:auto}.lead{margin:auto}.actions{justify-content:center}.stage{min-height:630px}.scout{width:min(600px,78vw)}.approved-art{opacity:.25;background-position:66% center}.cards{grid-template-columns:1fr}.core{grid-template-columns:1fr}.nav nav a:not(.outline){display:none}}
@media(max-width:620px){.nav{padding:15px}.logo{font-size:.78rem}.hero{padding-inline:16px}.actions{flex-direction:column}.button{width:100%}.stage{min-height:520px}.scout{height:430px;width:92vw;bottom:108px}.why,.core{padding:95px 18px}.cards article{min-height:250px}.cards h3{margin-top:52px}.rule{font-size:.49rem}footer{flex-direction:column;text-align:center}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}