/* The whole driving composition folds into the mosaic, as in the reference. */
:root { --scene-height: max(740px,77.8vw); --scene-scale:1; --scene-y:0px; --ground-turn:0deg; --wheel-turn:0deg; --car-bob:0px; --car-pitch:-5deg; --car-travel:0px; --moon-scale:1; --moon-y:0px; --mosaic-scale:1.25; --tile-scale:.75; }
.site-header { position:fixed; background:linear-gradient(#0b0912a8,transparent); }
.hero,html[lang=en] .hero { height:auto; min-height:0; max-height:none; overflow:clip; isolation:isolate; padding-top:var(--scene-height); padding-bottom:20px; }
.hero-stage { position:absolute; inset:0 0 auto; height:var(--scene-height); overflow:hidden; isolation:isolate; z-index:2; transform-origin:50% 0; transform:translate3d(0,var(--scene-y),0) scale(var(--scene-scale)); will-change:transform; background:#0b0912; }
.opening-sky { position:absolute; inset:0; background:radial-gradient(ellipse at 58% 30%,#690d3a55,transparent 48%),radial-gradient(ellipse at 22% 15%,#6a225a33,transparent 44%); }
.opening-sky::after { content:'';position:absolute;inset:0;background-image:radial-gradient(1px 1px at 30% 40%,#fffc 80%,transparent),radial-gradient(1px 1px at 60% 20%,#fff7 80%,transparent),radial-gradient(2px 2px at 85% 73%,#ff149370 80%,transparent);background-size:157px 181px,229px 237px,307px 271px; }
.moon-window {position:absolute;inset:0 0 auto;height:64%;overflow:hidden;}
.opening-moon { position:absolute; width:51%; max-width:none; left:24.5%; top:53.125%; transform:translateY(var(--moon-y)) scale(var(--moon-scale)); transform-origin:50% 0; z-index:0; }
.terrain-orbit { position:absolute; width:210%; aspect-ratio:1; left:-55%; top:57.7%; transform:scaleY(.42); transform-origin:50% 0; z-index:1; mask-image:radial-gradient(closest-side,transparent 84%,#000 89%); }
.terrain-orbit>img { width:100%; height:100%; max-width:none; transform:rotate(var(--ground-turn)); will-change:transform; }
.hero .hero-copy { position:relative; padding:94px 5% 0; transform:none; opacity:1; }
.hero .hero-copy>.eyebrow { display:none; }
.hero .hero-copy h1 { font-size:clamp(45px,4.7vw,78px); line-height:1.15; transform:none; }
.hero .hero-copy h1 strong { font-size:inherit; }
html[lang=en] .hero .hero-copy h1 { font-size:clamp(68px,6.9vw,108px); line-height:.94; }
.hero .hero-intro { margin:14px auto 17px; padding:0; background:none; box-shadow:none; max-width:660px; font-size:16px; line-height:1.65; }
.hero .hero-copy .pill-button { font-size:14px; }
.hero-rover { position:absolute; width:31%; left:15%; top:64.3%; z-index:4; transform:translate3d(var(--car-travel),calc(-100% + var(--car-bob)),0) rotate(var(--car-pitch)); transform-origin:50% 86%; will-change:transform; }
.hero-rover button { display:block; position:relative; padding:0; width:100%; background:none; }
.hero-rover img { width:100%; height:auto; max-width:none; }
.rover-wheel { position:absolute;inset:0;pointer-events:none;transform:rotate(var(--wheel-turn)); }
.rover-wheel-back { clip-path:ellipse(7.2% 12.79% at 22.966% 76.09%); transform-origin:22.966% 76.09%; }
.rover-wheel-front { clip-path:ellipse(7.2% 12.79% at 77.153% 76.09%); transform-origin:77.153% 76.09%; }
.hero-rover .cat-speech { right:-8%;top:0;font-size:14px;white-space:nowrap; }
.hero .hero-origin,.hero .hero-mission { bottom:6%; }
.hero .scroll-cue { bottom:3%;font-size:13px;white-space:nowrap; }
.opening-mosaic { position:relative; width:130%; margin-left:-15%; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); grid-template-rows:21vw calc(var(--scene-height)*.423333) 21vw; gap:1.5vw; transform:scale(var(--mosaic-scale)); transform-origin:50% 50%; }
.mosaic-tile { position:relative; overflow:hidden; border-radius:14px; background:#251122; transform:scale(var(--tile-scale)); }
.mosaic-tile img { width:100%;height:100%;object-fit:cover; }
.tile-a {grid-column:1/3;grid-row:1}.tile-b{grid-column:3;grid-row:1;background:#ffa6d7}.tile-c{grid-column:4;grid-row:1}.tile-d{grid-column:5/7;grid-row:1}
.tile-e{grid-column:1/3;grid-row:2;background:#fff1e9}.tile-f{grid-column:5/7;grid-row:2}.tile-g{grid-column:1/3;grid-row:3}.tile-h{grid-column:3;grid-row:3}.tile-i{grid-column:4;grid-row:3;background:#f02195}.tile-j{grid-column:5/7;grid-row:3}
.tile-b img,.tile-e img,.tile-i img {object-fit:contain;transform:rotate(-8deg) scale(1.08)}.tile-e img{transform:rotate(12deg) scale(1.05)}
.mosaic-target {grid-column:3/5;grid-row:2;}
.story-section {padding-top:80px;}
@media(max-width:760px) {
  :root { --scene-height:max(760px,110svh); }
  .site-header {padding:20px 5%;}.header-tools{gap:10px}.language-switch{font-size:12px;}
  .hero .hero-copy,html[lang=en] .hero .hero-copy {padding:115px 5% 0;}
  .hero .hero-copy>.eyebrow{font-size:10px;letter-spacing:1.5px;margin-bottom:20px}
  .hero .hero-copy h1,.hero .hero-copy h1 strong{font-size:clamp(29px,7.8vw,55px);line-height:1.3;}
  html[lang=en] .hero .hero-copy h1,html[lang=en] .hero .hero-copy h1 strong{font-size:clamp(44px,12vw,76px);line-height:1;}
  .hero .hero-intro{font-size:14px;line-height:1.8;margin:21px auto;max-width:350px;}
  .hero .hero-intro br{display:none}
  .hero .hero-copy .pill-button{font-size:13px;min-height:46px;padding:12px 22px}
  .moon-window{height:71%;}
  .opening-moon {width:88%;left:6%;top:69.014%;}
  .terrain-orbit {width:260%;left:-80%;top:70%;}
  .hero-rover{width:66%;left:9%;top:73.2%;}
  .hero .hero-origin,.hero .hero-mission{bottom:13%;}
  .hero .hero-origin img{width:68px;height:43px}
  .hero .scroll-cue{bottom:auto;top:43%;font-size:12px;}
  .side-nav{display:none;}
  .opening-mosaic{width:158%;margin-left:-29%;grid-template-columns:40fr 74fr 40fr;grid-template-rows:42vw calc(var(--scene-height)*.74) 42vw;gap:2vw;}
  .mosaic-target{grid-column:2;grid-row:2;}
  .tile-a{grid-column:1;grid-row:1}.tile-b{grid-column:2;grid-row:1}.tile-c{grid-column:3;grid-row:1}.tile-d{display:none}.tile-e{grid-column:1;grid-row:2}.tile-f{grid-column:3;grid-row:2}.tile-g{grid-column:1;grid-row:3}.tile-h{grid-column:2;grid-row:3}.tile-i{grid-column:3;grid-row:3}.tile-j{display:none}
  .mosaic-tile{border-radius:8px;}
  .hero-rover .cat-speech{font-size:12px;padding:9px 12px;}
  .story-section{padding-top:55px}
}
html[data-motion=off] .hero-stage{transform:none;}
html[data-motion=off] .hero{padding-bottom:0;}
html[data-motion=off] .opening-mosaic{display:none;}
html[data-motion=off] .hero-rover{transform:translateY(-100%) rotate(-5deg);}
html[data-motion=off] .rover-wheel,html[data-motion=off] .terrain-orbit>img{transform:none;}
.mosaic-target { scroll-margin-top:calc(50svh - var(--scene-height)*.423333/2 - 35px); }
@media(max-width:760px){.mosaic-target{scroll-margin-top:calc(50svh - var(--scene-height)*.74/2 - 35px);}}
