/* Workshop motion: studio surfaces, precise geometry, generous negative space. */
.reading-progress{position:fixed;inset:0 0 auto;height:3px;background:var(--blue);transform:scaleX(0);transform-origin:left;z-index:110;pointer-events:none}
.cinematic-hero{position:relative}
.hero-edition{position:absolute;top:40px;left:var(--pad);font-size:12px;letter-spacing:.12em;color:#647586}
.hero-scroll{position:absolute;right:var(--pad);top:35px;width:42px;height:42px;border:1px solid #b7c2cb;border-radius:50%;display:grid;place-items:center;z-index:2;transition:background .3s,color .3s}
.hero-scroll:hover{background:var(--navy);color:white}
.hero-scroll span{animation:scroll-nudge 2s ease-in-out 2}
.cinematic-hero .reveal-heading{transform:translateY(var(--hero-drift,0px))}
.cinematic-hero .reveal-heading h1{animation:garage-title 1.15s cubic-bezier(.16,1,.3,1) both}
.cinematic-hero .reveal-heading h1>span{display:inline-block;animation:garage-title 1.3s .12s cubic-bezier(.16,1,.3,1) both}
.cinematic-hero .reveal-stage{transform:scale(var(--hero-scale,1));animation:garage-car 1.35s cubic-bezier(.16,1,.3,1) both}
.cinematic-hero .reveal-foot{animation:soft-in .8s .45s both}
.button{position:relative;overflow:hidden;isolation:isolate;transition:background .25s,color .25s,box-shadow .3s,transform .3s}
.button::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,#ffffff26 45%,transparent 70%);transform:translateX(-130%) skewX(-15deg);transition:transform .65s;z-index:-1;pointer-events:none}
.button:hover::after,.button:focus-visible::after{transform:translateX(130%) skewX(-15deg)}
.button:hover{box-shadow:0 8px 22px #08192a17;transform:translateY(-2px)}
.button:active{transform:translateY(0)}
.button>span{transition:translate .2s,transform .3s}
.note-list>a{position:relative;isolation:isolate;transition:padding .35s cubic-bezier(.2,.7,.2,1)}
.note-list>a::before{content:'';position:absolute;inset:0;background:#e5eaf0;z-index:-1;transform:scaleY(0);transform-origin:bottom;transition:transform .35s}
.note-list>a:hover,.note-list>a:focus-visible{padding-left:20px;padding-right:20px}
.note-list>a:hover::before,.note-list>a:focus-visible::before{transform:scaleY(1)}
.garage-lab{background:var(--navy);color:var(--paper);overflow:hidden}
.lab-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:36px;margin-bottom:46px}
.lab-heading h2{font-size:clamp(42px,5vw,76px);margin-top:18px;line-height:1.05}
.lab-heading .eyebrow,.lab-copy .eyebrow{color:#a7bcdc;font-size:12px;letter-spacing:.12em}
.lab-heading>p{color:#bac9d6;font-size:16px;line-height:1.8;max-width:340px}
.lab-tabs{display:flex;gap:8px;border-bottom:1px solid #ffffff26;margin-bottom:30px}
.lab-tabs button{position:relative;background:transparent;color:#b9c8d6;padding:18px 25px;font-size:15px;min-height:56px;border:0;transition:color .3s,background .3s}
.lab-tabs button span{font-size:12px;margin-right:12px;opacity:.6;font-variant-numeric:tabular-nums}
.lab-tabs button::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:3px;background:#79a0ff;transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.lab-tabs button[aria-selected=true]{color:white;background:#ffffff08}
.lab-tabs button[aria-selected=true]::after{transform:scaleX(1)}
.lab-tabs button:hover{color:white;background:#ffffff0b}
.lab-tabs button:focus-visible,.lab-panel:focus-visible{outline:2px solid #8cabff;outline-offset:4px}
.lab-panel{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(28px,5vw,80px);align-items:center;margin-bottom:30px}
.lab-panel[hidden],.lab-tabs[hidden]{display:none}
.lab-visual{position:relative;aspect-ratio:1.6;overflow:hidden;background:#ececec;border-radius:3px;isolation:isolate}
/* The body view keeps the whole car; mechanical tabs focus on their own assembly. */
.lab-visual img{width:100%;height:100%;object-fit:contain;object-position:center;transform:none}
/* Source image is 1600 × 1000. These 8:5 windows preserve the complete selected assembly. */
.lab-engine-view img{position:absolute;max-width:none;width:250%;height:auto;left:-120.3125%;top:-72.5%;transform-origin:68.125% 49%}
.lab-suspension-view img{position:absolute;max-width:none;width:285.714286%;height:auto;left:-42.857143%;top:-134.285714%;transform-origin:32.5% 64.5%}
.lab-visual::after{content:'';position:absolute;left:-10%;top:0;bottom:0;width:15%;background:linear-gradient(90deg,transparent,#326aff22,transparent);border-right:1px solid #326aff66;opacity:0;pointer-events:none}
.lab-enhanced .lab-panel:not([hidden]) .lab-visual::after{animation:garage-scan 1.2s .1s ease-in-out both}
.lab-enhanced .lab-panel:not([hidden]) .lab-visual img{animation:inspection-in .9s cubic-bezier(.16,1,.3,1) both}
.lab-enhanced .lab-panel:not([hidden]) .lab-copy{animation:panel-in .55s .08s both}
.lab-crosshair{position:absolute;inset:20px;border:1px solid #637e9326;pointer-events:none}
.lab-crosshair::before,.lab-crosshair::after{content:'+';position:absolute;color:#526a80;font:20px monospace;line-height:1}
.lab-crosshair::before{left:-6px;top:-10px}.lab-crosshair::after{right:-6px;bottom:-10px}
.lab-plate{position:absolute;bottom:36px;left:36px;letter-spacing:.15em;font-size:11px;color:#526576}
.lab-copy h3{font:500 clamp(38px,4.3vw,64px)/1.05 var(--display);margin:20px 0 24px}
.lab-copy p{font-size:16px;line-height:1.8;color:#bac9d6;max-width:370px}
.lab-copy .button{margin-top:30px;font-size:14px}
.lab-caption{display:block;font-size:12px;color:#a5b7c9;margin-top:20px}
.lab-footer{border-top:1px solid #ffffff26;padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:22px;font-size:13px;color:#bac9d6}
.lab-footer a{color:white;font-size:14px}
.motion-enter{opacity:0;translate:0 24px;transition:opacity .8s,translate .9s cubic-bezier(.16,1,.3,1)}
.motion-arrived{opacity:1;translate:0 0}
@keyframes garage-title{from{opacity:0;translate:0 45px;clip-path:inset(100% 0 0)}to{opacity:1;translate:0 0;clip-path:inset(0)}}
@keyframes garage-car{from{opacity:0;translate:35px 25px}to{opacity:1;translate:0 0}}
@keyframes scroll-nudge{50%{transform:translateY(4px)}}
@keyframes inspection-in{from{opacity:.3;scale:.94;filter:blur(5px)}to{opacity:1;scale:1;filter:blur(0)}}
@keyframes garage-scan{0%{translate:0;opacity:0}20%{opacity:1}100%{translate:750%;opacity:0}}
@media(max-width:1000px){.hero-edition{top:22px}.hero-scroll{top:18px;width:32px;height:32px}.cinematic-hero .reveal-heading{padding-top:26px}.lab-panel{grid-template-columns:1.1fr 1fr;gap:30px}.lab-visual{aspect-ratio:1.6}.lab-heading{align-items:flex-start}.lab-heading>p{max-width:260px}}
@media(max-width:700px){.hero-edition{left:22px;font-size:10px}.hero-scroll{right:22px}.cinematic-hero .reveal-heading{padding-top:22px}.lab-heading{display:block;margin-bottom:26px}.lab-heading>p{max-width:none;margin-top:22px;font-size:15px}.lab-heading h2{font-size:46px}.lab-tabs{gap:0;margin-bottom:22px}.lab-tabs button{flex:1;padding:14px 6px;font-size:14px;white-space:nowrap}.lab-tabs button span{display:block;font-size:11px;margin:0 0 3px}.lab-panel{grid-template-columns:1fr;gap:27px}.lab-visual{aspect-ratio:1.6}.lab-copy h3{font-size:45px;margin:16px 0}.lab-copy p{max-width:none;font-size:15px}.lab-copy .button{margin-top:22px}.lab-footer{align-items:flex-start;flex-direction:column;gap:12px}.lab-caption{margin-top:16px}.lab-plate{bottom:30px;left:30px}.lab-crosshair{inset:15px}}
.motion-paused .motion-enter{opacity:1;translate:none}
.motion-paused .cinematic-hero .reveal-heading,.motion-paused .cinematic-hero .reveal-stage{transform:none}
.motion-paused .button>span{translate:none!important}
.motion-paused .lab-visual::after{display:none}
@media(prefers-reduced-motion:reduce){.motion-enter{opacity:1;translate:none}.cinematic-hero .reveal-heading,.cinematic-hero .reveal-stage{transform:none}.button>span{translate:none!important}.lab-visual::after{display:none}}
/* A compact menu unfolds into the same motion language on small screens. */
.menu-toggle span{transition:transform .3s,opacity .2s}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.mobile-menu:not([hidden]){animation:menu-open .35s cubic-bezier(.16,1,.3,1) both;transform-origin:top}
.mobile-menu:not([hidden]) a{animation:panel-in .4s both}
.mobile-menu a:nth-child(2){animation-delay:.04s}.mobile-menu a:nth-child(3){animation-delay:.08s}.mobile-menu a:nth-child(4){animation-delay:.12s}.mobile-menu a:nth-child(5){animation-delay:.16s}.mobile-menu a:nth-child(6){animation-delay:.2s}
@keyframes menu-open{from{opacity:0;clip-path:inset(0 0 100%)}to{opacity:1;clip-path:inset(0)}}
