/* $REDBULL · wings out */
:root{
  --navy:#0a1f4d; --navy-2:#06132f; --red:#db0a40; --red-d:#9e0730; --yellow:#ffc906; --white:#fff;
  --sky-1:#1f7cf2; --sky-2:#5fb2ff; --sky-3:#bfe2ff;
  --f-d:"Anton",Impact,sans-serif; --f-c:"Barlow Condensed","Arial Narrow",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--sky-1);overflow-x:clip}
body{font-family:var(--f-c);font-weight:600;color:var(--white);overflow-x:clip;-webkit-font-smoothing:antialiased}
body.is-loading{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}

/* ---------- Sky ---------- */
.sky{position:fixed;inset:0;z-index:-1;background:linear-gradient(180deg,var(--sky-1) 0%,var(--sky-2) 55%,var(--sky-3) 100%);overflow:hidden}
.cloud{position:absolute;width:340px;height:110px;border-radius:60px;background:#fff;opacity:.9;filter:blur(2px);
  box-shadow:60px -40px 0 10px #fff,140px -20px 0 0 #fff,-50px -10px 0 -10px #fff}
.c1{top:14%;left:-5%;transform:scale(.7)} .c2{top:62%;left:70%;transform:scale(1.1)} .c3{top:34%;left:42%;transform:scale(.45);opacity:.7}
.c4{top:84%;left:8%;transform:scale(.9)} .c5{top:8%;left:78%;transform:scale(.55);opacity:.8}

/* ---------- Loader ---------- */
.loader{position:fixed;inset:0;z-index:100;display:grid;place-items:center;align-content:center;gap:18px;background:var(--navy);overflow:hidden}
.loader__stripes{position:absolute;inset:-50%;background:repeating-linear-gradient(115deg,transparent 0 70px,rgba(255,255,255,.035) 70px 140px);animation:stripes 1s linear infinite}
@keyframes stripes{to{transform:translateX(140px)}}
.loader__count{position:relative;font-family:var(--f-d);font-size:clamp(160px,30vw,320px);line-height:.85;color:var(--yellow);transform:skewX(-10deg);text-shadow:10px 10px 0 var(--red)}
.loader__rev{position:relative;width:min(70vw,420px);height:14px;background:rgba(255,255,255,.12);transform:skewX(-20deg);overflow:hidden}
.loader__rev span{position:absolute;inset:0;width:0;background:linear-gradient(90deg,var(--yellow),var(--red))}
.loader__txt{position:relative;font-family:var(--f-c);font-style:italic;font-weight:700;letter-spacing:.2em;font-size:16px;opacity:.8}
.loader__flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}

/* ---------- Buttons: racing livery ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;transform:skewX(-12deg);background:var(--red);
  box-shadow:6px 6px 0 var(--navy);transition:transform .15s,box-shadow .15s,background .15s}
.btn>span{display:flex;align-items:center;gap:10px;transform:skewX(12deg);font-family:var(--f-d);letter-spacing:.03em;color:#fff}
.btn::after{content:"";position:absolute;top:0;bottom:0;right:14px;width:10px;background:var(--yellow);box-shadow:-16px 0 0 var(--yellow)}
.btn:hover{background:#f01450;transform:skewX(-12deg) translate(-2px,-2px);box-shadow:8px 8px 0 var(--navy)}
.btn:active{transform:skewX(-12deg) translate(4px,4px);box-shadow:2px 2px 0 var(--navy)}
.btn--lg>span{font-size:28px;padding:16px 64px 16px 30px}
.btn--sm>span{font-size:18px;padding:8px 50px 8px 20px}
.btn--icon{background:var(--navy);box-shadow:6px 6px 0 var(--red)}
.btn--icon:hover{background:#13306e;box-shadow:8px 8px 0 var(--red)}
.btn--icon::after{display:none}
.btn--icon>span{padding:16px 20px}

/* ---------- Nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px clamp(16px,4vw,48px);transition:background .3s,padding .3s}
.nav.is-stuck{background:var(--navy);padding-top:10px;padding-bottom:10px;box-shadow:0 4px 0 var(--red)}
.logo{font-family:var(--f-d);font-size:30px;transform:skewX(-10deg);color:#fff;text-shadow:3px 3px 0 var(--red)}
.nav__links{display:flex;gap:26px;font-style:italic;font-weight:700;font-size:19px;letter-spacing:.06em;text-transform:uppercase}
.nav__links a{position:relative}
.nav__links a::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:3px;background:var(--yellow);transition:right .25s}
.nav__links a:hover::after{right:0}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100vh;display:grid;grid-template-columns:1fr 1.15fr;align-items:center;gap:20px;padding:110px clamp(16px,4vw,48px) 80px;max-width:1440px;margin:0 auto}
.kicker{font-style:italic;font-weight:700;letter-spacing:.18em;font-size:16px;color:var(--navy);margin-bottom:10px}
.hero__title{font-family:var(--f-d);font-weight:400;line-height:.86;margin-bottom:22px}
.hero__title .ln{display:block;overflow:hidden;padding:0 .08em .04em 0}
.hero__title .sl{display:inline-block;transform:skewX(-10deg);font-size:clamp(76px,10.5vw,170px);color:#fff;
  text-shadow:5px 5px 0 var(--navy),9px 9px 0 var(--red)}
.hero__title .ln--y .sl{color:var(--yellow);font-size:clamp(54px,7vw,112px)}
.hero__sub{font-size:clamp(19px,1.6vw,23px);line-height:1.3;max-width:470px;color:var(--navy);margin-bottom:28px}
.hero__cta{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:24px}
.ca{display:inline-flex;align-items:center;gap:10px;background:rgba(10,31,77,.85);padding:10px 16px;transform:skewX(-10deg);font-weight:700;letter-spacing:.08em;transition:background .2s}
.ca>*{transform:skewX(10deg)}
.ca code{font-family:ui-monospace,Consolas,monospace;color:var(--yellow);font-size:14px;letter-spacing:0}
.ca:hover{background:var(--navy)}
.hero__car{position:relative;height:min(62vw,640px)}
.scrollhint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);font-style:italic;font-weight:700;letter-spacing:.2em;color:var(--navy);font-size:15px}

/* ---------- Rig (car + wings) ---------- */
.rig{position:absolute;width:min(100%,760px);aspect-ratio:1195/681;left:50%;top:50%;translate:-50% -50%;will-change:transform}
.rig__car{position:relative;z-index:1;width:100%;height:100%;filter:drop-shadow(0 30px 30px rgba(6,19,47,.35))}
.wing{position:absolute;width:46%;aspect-ratio:300/190;left:72%;top:-12%;transform-origin:6% 90%;overflow:visible}
.wing--back{z-index:0;left:67%;top:-18%;filter:brightness(.82)}
.wing--front{z-index:2}
.trail{position:absolute;inset:0;pointer-events:none}
.trail i{position:absolute;height:4px;border-radius:4px;background:linear-gradient(90deg,rgba(255,255,255,.95),rgba(255,255,255,0))}

/* ---------- Tape ---------- */
.tape{position:relative;z-index:3;background:var(--yellow);color:var(--navy);transform:rotate(-2deg);margin:0 -20px;overflow:hidden;border-block:4px solid var(--navy)}
.tape__track{display:flex;width:max-content;align-items:center;gap:26px;padding:12px 0}
.tape span{font-family:var(--f-d);font-size:30px;letter-spacing:.03em;white-space:nowrap}
.tape i{font-style:normal;color:var(--red);font-size:22px}

/* ---------- Premiere stage ---------- */
.premiere{position:relative}
.stage{position:relative;height:100vh;overflow:hidden}
.stage__title{position:absolute;left:clamp(16px,4vw,48px);top:110px;font-family:var(--f-d);font-weight:400;font-size:clamp(56px,8vw,120px);line-height:.9;transform:skewX(-10deg);color:#fff;text-shadow:5px 5px 0 var(--navy);opacity:.95}
.stage__title span{display:block;font-size:.45em;color:var(--yellow)}
.stage__hud{position:absolute;right:clamp(16px,4vw,48px);top:110px;display:flex;gap:10px;z-index:5}
.stage__hud div{background:var(--navy);padding:8px 14px;transform:skewX(-10deg);min-width:92px;box-shadow:4px 4px 0 var(--red)}
.stage__hud small{display:block;font-size:12px;letter-spacing:.2em;opacity:.7}
.stage__hud b{font-family:var(--f-d);font-weight:400;font-size:30px;color:var(--yellow)}
.stage__hud em{font-style:normal;font-size:13px;margin-left:3px;opacity:.7}
.ramp{position:absolute;left:4vw;bottom:7vh;width:30vw;height:22vh;z-index:1;filter:drop-shadow(8px 0 0 rgba(10,31,77,.25))}
.ground{position:absolute;left:0;right:0;bottom:0;height:7vh;background:#2b2f3a;border-top:10px solid transparent;border-image:repeating-linear-gradient(90deg,var(--red) 0 40px,#fff 40px 80px) 10;z-index:1}
.ramp svg{width:100%;height:100%}
.rig--stage{width:min(40vw,540px);left:auto;top:auto;translate:none;right:3vw;bottom:5.5vh;z-index:2}
.callout{position:absolute;left:50%;top:80%;z-index:6;font-family:var(--f-d);font-size:clamp(54px,9vw,140px);color:var(--yellow);transform:translate(-50%,-50%) skewX(-10deg);text-shadow:6px 6px 0 var(--red),10px 10px 0 var(--navy);white-space:nowrap;pointer-events:none;opacity:0}
.speedlines{position:absolute;inset:0;pointer-events:none;opacity:0;background:repeating-linear-gradient(-8deg,transparent 0 38px,rgba(255,255,255,.5) 38px 40px,transparent 40px 90px)}

/* ---------- Sections ---------- */
.sec-head{text-align:center;margin-bottom:34px}
.sec-head p{font-size:21px;color:var(--navy);margin-top:6px}
.tag{display:inline-block;background:var(--red);padding:4px 12px;transform:skewX(-12deg);font-style:italic;font-weight:700;letter-spacing:.2em;font-size:14px;margin-bottom:10px}
.h2{font-family:var(--f-d);font-weight:400;font-size:clamp(52px,7vw,104px);line-height:.92;transform:skewX(-8deg);text-shadow:5px 5px 0 var(--navy)}

/* ---------- Lab ---------- */
.lab{padding:120px clamp(16px,4vw,48px) 40px;max-width:1240px;margin:0 auto}
.lab__arena{position:relative;height:min(52vw,520px);border:5px solid var(--navy);background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.05));box-shadow:10px 10px 0 var(--navy);overflow:hidden}
.lab__arena::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(10,31,77,.12) 2px,transparent 2px),linear-gradient(90deg,rgba(10,31,77,.12) 2px,transparent 2px);background-size:60px 60px}
.rig--lab{width:min(56%,520px)}
.lab__combo{position:absolute;left:22px;top:16px;z-index:4;text-align:left;line-height:.9}
.lab__combo b{font-family:var(--f-d);font-weight:400;font-size:64px;color:var(--yellow);text-shadow:4px 4px 0 var(--navy)}
.lab__combo small{display:block;letter-spacing:.3em;font-style:italic;font-weight:700;color:var(--navy)}
.lab__best{position:absolute;right:22px;top:20px;z-index:4;background:var(--navy);padding:6px 14px;transform:skewX(-10deg);letter-spacing:.15em;font-weight:700}
.lab__best b{color:var(--yellow);font-family:var(--f-d);font-weight:400;font-size:22px;margin-left:6px}
.lab__pop{position:absolute;left:50%;top:22%;z-index:5;font-family:var(--f-d);font-size:clamp(36px,5vw,64px);color:#fff;text-shadow:4px 4px 0 var(--red),7px 7px 0 var(--navy);transform:translateX(-50%) skewX(-10deg);opacity:0;white-space:nowrap;pointer-events:none}
.lab__btns{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:30px}
.trick{display:grid;justify-items:center;gap:2px;padding:14px 8px;background:var(--navy);transform:skewX(-10deg);font-family:var(--f-d);font-size:22px;letter-spacing:.02em;box-shadow:5px 5px 0 var(--red);transition:transform .12s,box-shadow .12s,background .15s}
.trick small{font-family:var(--f-c);font-weight:700;font-style:italic;font-size:14px;color:var(--yellow);letter-spacing:.1em}
.trick:hover{background:#13306e;transform:skewX(-10deg) translateY(-3px)}
.trick:active,.trick.is-hit{transform:skewX(-10deg) translate(4px,4px);box-shadow:1px 1px 0 var(--red)}
.trick--nitro{background:var(--red);box-shadow:5px 5px 0 var(--navy)}
.trick--nitro:hover{background:#f01450}

/* ---------- Driver ---------- */
.driver{display:grid;grid-template-columns:1fr 1.1fr;gap:50px;align-items:center;padding:140px clamp(16px,4vw,48px) 40px;max-width:1240px;margin:0 auto}
.driver__pic{position:relative}
.driver__sun{position:absolute;left:12%;top:8%;width:76%;aspect-ratio:1;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 18px rgba(255,201,6,.3)}
.driver__pic img{position:relative;width:100%;filter:drop-shadow(10px 12px 0 rgba(10,31,77,.35))}
.driver__card{background:var(--navy);padding:34px 36px;box-shadow:12px 12px 0 var(--red);clip-path:polygon(0 0,100% 0,100% calc(100% - 34px),calc(100% - 34px) 100%,0 100%)}
.driver__card .h2{text-shadow:5px 5px 0 var(--red);margin-bottom:20px}
.stats{display:grid;gap:8px;margin-bottom:22px}
.stats div{display:flex;justify-content:space-between;gap:16px;border-bottom:2px dashed rgba(255,255,255,.18);padding-bottom:6px}
.stats dt{font-style:italic;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--yellow);font-size:16px}
.stats dd{font-size:19px;text-align:right}
.lore{font-size:20px;line-height:1.4;opacity:.9}

/* ---------- Flight log ---------- */
.log{padding:140px clamp(16px,4vw,48px) 40px;max-width:1000px;margin:0 auto}
.log__track{position:relative;padding-left:90px}
.log__line{position:absolute;left:34px;top:0;bottom:0;width:8px;background:rgba(10,31,77,.25);transform:skewX(-6deg)}
.log__line span{position:absolute;left:0;right:0;top:0;height:0;background:linear-gradient(var(--yellow),var(--red))}
.log__car{position:absolute;left:-6px;top:0;width:90px;z-index:2;transform:rotate(90deg) scaleY(-1);filter:drop-shadow(3px 3px 0 var(--navy))}
.log__list{list-style:none;display:grid;gap:38px}
.log__list li{position:relative;background:rgba(10,31,77,.88);padding:22px 26px;box-shadow:8px 8px 0 var(--red);transform:skewX(-4deg)}
.log__list li>*{transform:skewX(4deg)}
.log__list b{font-family:var(--f-d);font-weight:400;font-size:20px;color:var(--yellow)}
.log__list h3{font-family:var(--f-d);font-weight:400;font-size:clamp(28px,3.4vw,40px);line-height:1}
.log__list p{font-size:19px;margin-top:6px;opacity:.88}

/* ---------- Footer ---------- */
.foot{display:grid;justify-items:center;gap:30px;text-align:center;padding:160px 16px 46px}
.foot__big{font-family:var(--f-d);font-weight:400;font-size:clamp(100px,19vw,300px);line-height:.85;transform:skewX(-10deg);color:#fff;text-shadow:7px 7px 0 var(--navy),14px 14px 0 var(--red)}
.foot__big .ch{display:inline-block}
.foot__cta{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}
.foot__disc{max-width:620px;font-size:15px;color:var(--navy);opacity:.85}

.toast{position:fixed;left:50%;bottom:26px;z-index:95;background:var(--yellow);color:var(--navy);font-family:var(--f-d);font-size:22px;padding:10px 24px;box-shadow:5px 5px 0 var(--navy)}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .nav__links{display:none}
  .hero{grid-template-columns:1fr;padding-top:96px;padding-bottom:70px}
  .hero__car{height:72vw;order:2}
  .driver{grid-template-columns:1fr;gap:30px}
  .lab__btns{grid-template-columns:repeat(3,1fr)}
  .rig--stage{width:62vw;right:2vw;bottom:5.5vh}
  .ramp{width:40vw;height:16vh;left:2vw}
}
@media (max-width:560px){
  .logo{font-size:24px}
  .btn--lg>span{font-size:22px;padding:13px 50px 13px 22px}
  .btn--icon>span{padding:13px 15px}
  .hero__title .sl{font-size:clamp(64px,19vw,90px)}
  .hero__title .ln--y .sl{font-size:clamp(46px,13vw,64px)}
  .tape span{font-size:22px}
  .stage__title{top:84px}
  .callout{font-size:42px;top:74%}
  .stage__hud{top:auto;bottom:16px;right:16px;left:16px;justify-content:space-between}
  .stage__hud div{min-width:0;flex:1;padding:6px 10px}
  .stage__hud b{font-size:22px}
  .lab__arena{height:70vw;box-shadow:6px 6px 0 var(--navy)}
  .rig--lab{width:76%}
  .lab__combo b{font-size:44px}
  .lab__best{top:auto;bottom:14px;right:14px}
  .trick{font-size:18px;padding:12px 6px}
  .driver__card{padding:24px 22px}
  .stats dd{font-size:17px}
  .log__track{padding-left:64px}
  .log__line{left:22px}
  .log__car{width:66px;left:-8px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
