:root {
  --nav-height: 58px;
  --paper: #f7f5ef;
  --muted: #b5b4b0;
  color-scheme: dark;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}
@font-face { font-family:"Cruise UltraLight"; src:local("Helvetica Neue UltraLight"),local("HelveticaNeue-UltraLight"); font-style:normal; font-weight:100; font-display:swap; }

* { box-sizing: border-box; }
html { background: #090909; scroll-behavior: auto; scrollbar-gutter: stable; }
body { margin: 0; color: var(--paper); background: #090909; }
body.project-open { overflow: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; }
button, [role="button"] { touch-action: manipulation; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }
button:focus-visible, a:focus-visible { outline: 2px solid #fff; outline-offset: 6px; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  z-index: 200;
  top: 8px;
  left: 12px;
  padding: 12px 18px;
  color: #111;
  background: #fff;
  transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }

.vegas-nav {
  position: fixed;
  z-index: 120;
  inset: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--nav-height);
  padding: 0 3.7%;
  border-bottom: 1px solid #ffffff15;
  background: #080808;
}
.vegas-brand {
  flex-shrink: 0;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.3px;
  text-decoration: none;
}
.vegas-nav nav { display: flex; align-items: center; gap: clamp(18px, 2.7vw, 40px); height: 100%; }
.vegas-nav nav a {
  display: inline-flex;
  align-items: center;
  height: 100%;
  color: #bcbcbc;
  font-size: 12px;
  text-decoration: none;
  transition: color 160ms ease;
}
.vegas-nav nav a:hover, .vegas-nav nav a[aria-current="page"] { color: #fff; }

.vegas-journey { position: relative; height: 3385vh; height: 3385svh; padding-top: var(--nav-height); }
.vegas-stage {
  position: sticky;
  top: var(--nav-height);
  height: calc(100vh - var(--nav-height));
  height: calc(100svh - var(--nav-height));
  overflow: hidden;
  isolation: isolate;
  background: #111;
}
/* Scroll locking must not move the sticky stage out of the viewport. */
.project-open .vegas-stage { position: fixed; inset: var(--nav-height) 0 0; height: auto; }
.vegas-scenery { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.vegas-backdrop {
  position:absolute;
  inset:0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center 55%;
  transform-origin: 50% 43%;
  filter: grayscale(1) contrast(1.08) brightness(.75);
  will-change: transform;
}
.vegas-city-photo,.crowd-walk-frame { position:absolute; inset:0; display:block; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center 55%; }
.vegas-city-photo { z-index:0; }
.crowd-walk-frame { z-index:1; pointer-events:none; opacity:0; will-change:opacity;
  /* Only dissolve the sidewalk crowd strips; keep the skyline and road locked. */
  -webkit-mask-image:linear-gradient(to right,#000 0%,#000 31%,transparent 43%,transparent 57%,#000 69%,#000 100%),linear-gradient(to bottom,transparent 35%,#000 43%,#000 68%,transparent 77%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,#000 0%,#000 31%,transparent 43%,transparent 57%,#000 69%,#000 100%),linear-gradient(to bottom,transparent 35%,#000 43%,#000 68%,transparent 77%);
  mask-composite:intersect;
}
.crowd-walk-a { animation:crowd-crossfade-a 6s ease-in-out infinite; }
.crowd-walk-b { animation:crowd-crossfade-b 6s ease-in-out infinite; }
.street-atmosphere { position:absolute; pointer-events:none; overflow:hidden; }
.street-atmosphere { z-index:2; }
.luxor-motion { transform-box:view-box; transform-origin:830px 478px; opacity:.5; animation:luxor-drift 37s ease-in-out infinite alternate; }
.luxor-sweep { transform-box:view-box; transform-origin:835px 486px; mix-blend-mode:screen; }
.luxor-sweep-left { animation:luxor-left-sweep 28s cubic-bezier(.45,0,.55,1) infinite alternate; }
.luxor-sweep-right { animation:luxor-right-sweep 34s cubic-bezier(.45,0,.55,1) -17s infinite alternate; }
.casino-shimmer { opacity:.045; animation:casino-breathe 23s ease-in-out infinite; }
.desert-clouds { opacity:.03; animation:desert-drift 95s ease-in-out infinite alternate; }
.desert-stars { opacity:.14; animation:desert-twinkle 31s ease-in-out infinite alternate; }
.traffic-pair { opacity:.09; animation:traffic-haze 17s ease-in-out infinite; }
.traffic-b { animation-duration:21s; animation-delay:-7s; }
.traffic-c { animation-duration:26s; animation-delay:-12s; }
@keyframes luxor-drift { from {transform:rotate(-.4deg);opacity:.34;} to {transform:rotate(.4deg);opacity:.58;} }
@keyframes luxor-left-sweep { from {transform:rotate(-1.6deg);opacity:.2;} to {transform:rotate(1.5deg);opacity:.46;} }
@keyframes luxor-right-sweep { from {transform:rotate(1.5deg);opacity:.2;} to {transform:rotate(-1.6deg);opacity:.46;} }
@keyframes casino-breathe { 0%,100% {opacity:.035;} 42% {opacity:.085;} 67% {opacity:.045;} }
@keyframes desert-drift { from {transform:translate(-4px,0);} to {transform:translate(5px,1px);} }
@keyframes desert-twinkle { from {opacity:.10;} to {opacity:.18;} }
@keyframes traffic-haze { 0%,100% {opacity:.08;transform:translate(0,0);} 55% {opacity:.22;transform:translate(.5px,1.5px);} }
/* Swap the sidewalk crowd plates every three seconds with a soft cross-dissolve. */
@keyframes crowd-crossfade-a { 0%,100% {opacity:.41;} 4.167%,41.667% {opacity:.82;} 58.333%,95.833% {opacity:0;} }
@keyframes crowd-crossfade-b { 0%,100% {opacity:.41;} 4.167%,41.667% {opacity:0;} 58.333%,95.833% {opacity:.82;} }
.atmosphere-paused .street-atmosphere * { animation-play-state:paused !important; }
.atmosphere-paused .crowd-walk-frame { animation-play-state:paused !important; }
.vegas-vignette {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #0009 0%, #0000 24%, #0000 62%, #000b 100%), radial-gradient(ellipse at 50% 47%, transparent 30%, #0006 100%);
  pointer-events: none;
}
.intro-layer { position: absolute; inset: 0; z-index: 2; }
.intro-layer[inert], .intro-layer.inert { pointer-events: none; }
.intro-eyebrow {
  position: absolute;
  z-index: 3;
  top: 28px;
  left: 4%;
  right: 4%;
  margin: 0;
  color: #f6f5efc7;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .2em;
  text-align: center;
  text-transform: uppercase;
}
.portrait-plane {
  position: absolute;
  left: 50%;
  width: 100%;
  bottom: 0;
  height: 95%;
  transform: translateX(-50%);
  transform-origin: 50% 37%;
  will-change: transform, opacity;
  pointer-events: none;
}
.portrait-plane img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  filter: grayscale(1);
}
.name-plane {
  position: absolute;
  z-index: 2;
  left: 50%;
  width: 94%;
  bottom: 17%;
  text-align: center;
  transform: translateX(-50%);
  transform-origin: 50% 50%;
  will-change: transform, opacity;
  pointer-events: none;
}
.name-plane h1 {
  margin: 0;
  color: #eeeae3;
  font-family: "Helvetica Neue", "Arial", sans-serif;
  font-size: clamp(62px, 13.9vw, 228px);
  font-weight: 200;
  line-height: .82;
  letter-spacing: -.065em;
  white-space: nowrap;
  text-shadow: 0 2px 28px #0007;
}
.intro-footer {
  position: absolute;
  z-index: 3;
  bottom: 3.5%;
  left: 5%;
  right: 5%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
  will-change: opacity, transform;
}
.intro-footer p { margin: 0; font-size: 11px; font-weight: 500; letter-spacing: .23em; }
.intro-footer p span { padding: 0 11px; color: #aaa; }
.enter-drive {
  position: absolute;
  top: auto;
  bottom: clamp(34px, 6svh, 64px);
  left: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 116px;
  height: 56px;
  padding: 0 0 13px;
  border: 0;
  clip-path: polygon(0 0,100% 0,50% 100%);
  color: #fff;
  background: linear-gradient(165deg,#bb3226 0%,#aa241b 42%,#86160f 100%);
  font-family: "Arial Narrow","Helvetica Neue",Arial,sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -.02em;
  text-decoration: none;
  text-shadow: 0 1px 2px #420800;
  pointer-events: auto;
  filter: drop-shadow(0 5px 6px #000b);
  transform: translateX(-50%);
  animation: scroll-triangle-bob 2.1s ease-in-out infinite;
  transition: opacity 140ms ease-out,background 140ms ease-out;
}
.enter-drive span { position:relative; top:-5px; white-space:nowrap; }
.enter-drive:hover { background: linear-gradient(165deg,#d23d2e,#ad2117 65%,#85140c); }
.enter-drive:focus-visible { outline: 2px solid #fff; outline-offset: 6px; }
@keyframes scroll-triangle-bob { 0%,100% { transform:translate(-50%,0); } 50% { transform:translate(-50%,7px); } }
.journey-cue {
  position: absolute;
  z-index: 4;
  bottom: 19px;
  left: 4%;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #d2d2cf;
  pointer-events: none;
  transition: opacity 250ms ease;
}
.journey-cue > span { width: 29px; height: 1px; background: currentColor; }
.journey-cue p { margin: 0; font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.journey-progress { position: absolute; z-index: 8; left: 0; right: 0; bottom: 0; height: 2px; background: #ffffff12; pointer-events: none; }
.journey-progress span { display: block; width: 100%; height: 100%; background: #e7e2d6; transform: scaleX(0); transform-origin: left; }
.is-gallery .journey-cue, .is-driving .journey-cue, .is-viewing .journey-cue { opacity: 0; }

.drive-gallery { position: absolute; inset: 0; z-index: 5; opacity: 0; pointer-events: none; }
.is-gallery .drive-gallery { pointer-events: auto; }
.drive-gallery[inert] { pointer-events: none; }
.gallery-heading {
  position: absolute;
  z-index: 6;
  top: 24px;
  left: 4%;
  right: 4%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: 0 2px 15px #000;
  pointer-events: none;
}
.eyebrow { margin: 0 0 8px; color: #c5c2bd; font-size: 9px; letter-spacing: .18em; text-transform: uppercase; }
.gallery-heading h2 { width:100%; margin:0; color:#eeeae3; font-family:"Cruise UltraLight","Helvetica Neue",Arial,sans-serif; font-size:clamp(42px,7vw,115px); font-weight:100; letter-spacing:-.055em; line-height:.92; text-align:center; white-space:nowrap; text-shadow:0 2px 18px #0007; }
.gallery-heading h2 span { display:block; }
.gallery-heading { top:clamp(40px,10svh,100px); }
.gallery-heading h2 { width:min(40vw,48svh,480px); font-size:100px; line-height:.84; }
.gallery-heading h2 span { width:max-content; max-width:none; margin:0 auto; line-height:.84; }
@media(max-width:700px) { .gallery-heading h2 { width:min(70vw,42svh); } }
.gallery-instruction { margin: 1px 0 0; color: #c5c2bd; font-size: 11px; line-height: 1.6; text-align: right; }
.billboard-world {
  position: absolute;
  inset: 0;
  isolation: isolate;
}
.billboard {
  position: absolute;
  left: 0;
  top: 0;
  width: 1369px;
  height: 1149px;
  color: #111;
  text-decoration: none;
  padding: 0;
  transform-origin: 0 0;
  will-change: transform;
  transition: filter 220ms ease, opacity 240ms ease;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  outline-offset: 10px;
  pointer-events: none;
}
.billboard:hover { filter: brightness(1.1); }
.billboard:focus-visible { outline: none; }
.billboard:focus-visible > .billboard-display { outline: 3px solid #fff; outline-offset: 10px; }
/* The entire freestanding rig is photography, not a CSS frame. Right-hand
   hardware is mirrored; the independently mounted artwork/text never is. */
.billboard-rig { position: absolute; inset: 0; width: 1369px; height: 1149px; max-width: none; pointer-events: none; }
.billboard-foot-angles { position:absolute; inset:0; width:1369px; height:1149px; max-width:none; pointer-events:none; filter:grayscale(1) contrast(1.08) brightness(.78); }
/* Photoshop-style input black point 15/255 on the metal rig only.
   The separate face material, artwork, and warm lamp layer keep their values. */
.billboard-rig { filter: grayscale(1) contrast(1.133333) brightness(.9375) brightness(.86); }
/* Keep the photographed underframe intact. Cutting a diagonal strip through it
   also severs the posts from the board, leaving visibly floating feet. */
.billboard-contact-shadow { position:absolute; inset:0; width:1369px; height:1149px; max-width:none; pointer-events:none; }
.billboard-contact-shadow { fill:#000; opacity:.23; filter:blur(3px); }
.billboard-warm-lights { position: absolute; inset: 0; width: 1369px; height: 1149px; max-width: none; pointer-events: none;
  mask-image: radial-gradient(ellipse 45px 42px at 402px 78px,#000 45%,transparent),radial-gradient(ellipse 30px 27px at 873px 335px,#000 45%,transparent),radial-gradient(ellipse 23px 22px at 1243px 546px,#000 45%,transparent),radial-gradient(ellipse 40px 26px at 458px 700px,#000 45%,transparent),radial-gradient(ellipse 30px 23px at 736px 754px,#000 45%,transparent),radial-gradient(ellipse 24px 21px at 1103px 825px,#000 45%,transparent),radial-gradient(ellipse 22px 20px at 1288px 864px,#000 45%,transparent); }
.side-right .billboard-rig,.side-right .billboard-foot-angles,.side-right .billboard-warm-lights { transform: scaleX(-1); }
.billboard > .billboard-display { position: absolute; top: 0; left: 0; transform-origin: 0 0; pointer-events: auto; }
.billboard-display { position: relative; display: block; width: 640px; height: 455px; overflow: hidden; border: 0; border-radius: 0; padding: 0; background: #f5f3ef; isolation:isolate; }
/* One continuous photographic surface retains the reference's warm light pools,
   slight edge shading and real fixture reflections. Nothing splits the title off. */
.billboard-face-material { position:absolute; z-index:0; top:0; left:0; width:1369px; height:1149px; max-width:none; transform-origin:0 0; pointer-events:none; }
.billboard .billboard-art { position:absolute; inset:18px 30px 88px; width:auto; height:auto; aspect-ratio:auto; background:transparent; overflow:visible; }
.billboard .billboard-art::before,.billboard-display::after,.billboard-caption::before { content:none; }
.billboard-art img,.billboard-art svg { mix-blend-mode:multiply; }
.billboard-art.is-cutout img,.billboard-art.is-cutout svg { mix-blend-mode:normal; }
.billboard-art img,.billboard-art svg,.billboard-caption strong { position: relative; z-index: 1; }
.billboard-caption { position:absolute; z-index:1; left:0; right:0; bottom:28px; display:flex; align-items:center; justify-content:center; height:54px; padding:0 22px; border:0; border-radius:0; color:#25231f; background:transparent; line-height:1.1; text-align:center; }
.billboard-caption strong { display:block; font-family:"Avenir Next Condensed","Arial Narrow","Helvetica Neue",Arial,sans-serif; font-size:48px; font-weight:300; letter-spacing:.015em; text-transform:uppercase; white-space:nowrap; }
.billboard-caption small { display: none; }
.is-driving .billboard { opacity: .2; }
.is-driving .billboard.is-selected { opacity: 1; }
.is-viewing .gallery-heading, .is-viewing .gallery-controls { visibility: hidden; }
.gallery-controls { position: absolute; z-index: 9; bottom: 22px; left: 4%; right: 4%; display: flex; align-items: center; justify-content: space-between; gap: 22px; opacity: 0; pointer-events: none; transition: opacity 200ms ease; }
.is-gallery .gallery-controls { opacity: 1; pointer-events: auto; }
.is-driving .gallery-controls { opacity: 0; pointer-events: none; }
.gallery-controls[inert] { pointer-events: none; }
.portfolio-index-link { padding: 14px 0 14px 12px; color: #e3e1da; font-size: 11px; text-decoration: none; }
.portfolio-index-link span { display: inline-block; margin-left: 15px; }
.portfolio-index-link:hover { text-decoration: underline; text-underline-offset: 5px; }
.drive-instruction { margin: 0; color: #ccc; font-size: 11px; letter-spacing: .03em; }
.ending-menu { position:absolute; z-index:10; top:40%; left:50%; display:flex; flex-direction:column; gap:14px; align-items:center; opacity:0; transform:translate(-50%,-70px); text-align:center; }
.ending-menu a { display:block; color:#f3eee4; text-decoration:none; font-family:"Helvetica Neue",Arial,sans-serif; font-weight:200; font-size:clamp(28px,4.5vw,74px); letter-spacing:-.055em; line-height:.94; text-shadow:0 2px 16px #000; white-space:nowrap; }
.ending-menu a span { display:block; }
.ending-menu a span:first-child { margin-bottom:.08em; font-size:.58em; font-weight:400; letter-spacing:.16em; }
.ending-menu a:hover { color:#fff; text-shadow:0 0 16px #ffffff60; }
.ending-menu[inert] { pointer-events:none; }
.is-driving .sammy-start,.is-viewing .sammy-start { visibility:hidden; }

.drive-car {
  position: absolute;
  z-index: 7;
  left: 50%;
  bottom: -48px;
  width: min(66vw, 102svh, 1080px);
  opacity: 0;
  transform: translateX(-50%);
  transform-origin: 50% 100%;
  will-change: transform, opacity;
  pointer-events: none;
}
.car-body { position:relative; display:block; width:100%; isolation:isolate; }
.car-body .car-base { position:relative; z-index:1; }
.car-body .passenger-grade { position:absolute; z-index:1; inset:0; display:block; width:100%; height:100%; overflow:visible; pointer-events:none; }
.car-body .passenger-grade image { filter:contrast(1.17) brightness(.88); }
.car-body .windshield-plane { position:absolute; z-index:0; inset:0; width:100%; height:100%; opacity:.58; filter:grayscale(1); pointer-events:none; }
.car-body .car-plate,.car-body .tail-glow { z-index:3; }
.car-layer-defs { position:absolute; pointer-events:none; }
.car-plate { position: absolute; left: 42.5%; top: 74.3%; width: 15%; height: 11.7%; display: block; pointer-events: none; }
.car-body .car-plate img { position: static; display: block; width: 100%; height: 100%; object-fit: fill; filter: none; }
.car-body .passenger-pose { position:absolute; z-index:2; inset:0; width:100%; height:100%; object-fit:fill; opacity:0; clip-path:url(#passenger-left-only); filter:contrast(1.17) brightness(.88); pointer-events:none; }
.car-body .pose-right { clip-path:url(#passenger-right-only); }
.is-gallery .pose-left { opacity: var(--point-left,0); }
.is-gallery .pose-right { opacity: var(--point-right,0); }
.car-body .passenger-heads { position:absolute; z-index:2; inset:0; width:100%; height:100%; object-fit:fill; opacity:0; clip-path:url(#passenger-front-heads); filter:contrast(1.17) brightness(.88); pointer-events:none; }
.car-body .heads-rear-left,.car-body .heads-rear-right { clip-path:url(#passenger-rear-heads); }
.is-gallery .heads-front-left { opacity:var(--front-left,0); }
.is-gallery .heads-front-right { opacity:var(--front-right,0); }
.is-gallery .heads-rear-left { opacity:var(--rear-left,0); }
.is-gallery .heads-rear-right { opacity:var(--rear-right,0); }
.drive-car img, .backup-car img { width: 100%; height: auto; filter: drop-shadow(0 10px 14px #0008); }
.drive-car.is-arriving .car-body { animation: road-rumble 720ms ease-in-out infinite; }
@keyframes road-rumble { 0%,100% { transform: translateY(0); } 50% { transform: translateY(.4px); } }
.tail-glow { position: absolute; top: 56%; width: 2.8%; height: 13%; border-radius: 40%; opacity: .28; background: linear-gradient(90deg, #e30b02, #ff7060 45%, #e71b0b); box-shadow: 0 0 8px 3px #ff2c21bb, 0 0 22px 8px #ff271588, 0 0 42px 15px #ff160d44; pointer-events: none; transition: opacity 180ms ease; }
.tail-glow::after { content: ""; position: absolute; inset: -60% -130%; border-radius: 50%; background: radial-gradient(ellipse, #ff1d1359, transparent 70%); filter: blur(4px); }
.drive-car .tail-glow { opacity: .48; }
.tail-glow-left { left: 6%; transform: translate(-50%, -50%) rotate(-9deg); }
.tail-glow-right { left: 94%; transform: translate(-50%, -50%) rotate(9deg); }
.is-driving .drive-car .tail-glow { opacity: .6; }

.project-panel {
  position: fixed;
  z-index: 70;
  top: calc(var(--nav-height) + 18px);
  bottom: 0;
  left: 6vw;
  right: 6vw;
  display: flex;
  flex-direction: column;
  color: #171717;
  background: #fff;
  box-shadow: 0 0 0 1px #ffffff24, 0 0 60px 20px #0008;
}
.project-toolbar { display: flex; align-items: center; gap: 20px; flex-shrink: 0; height: var(--project-toolbar-height,58px); padding: 0 15px; color: #ccc; background: #151515; }
.project-toolbar button, .project-toolbar a { display: inline-flex; align-items: center; flex-shrink: 0; min-height: 36px; padding: 0; border: 0; color: #fff; background: none; font-size: 10px; text-decoration: none; }
.project-toolbar button:hover, .project-toolbar a:hover { text-decoration: underline; text-underline-offset: 4px; }
#project-panel-title { flex: 1; overflow: hidden; font-size: 10px; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
#project-frame { display: block; width: 100%; flex: 1; min-height: 0; border: 0; color-scheme: light; background: #fff; }
.project-loading, .project-load-error { position: absolute; z-index: 2; inset: var(--project-toolbar-height,58px) 0 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px; color: #444; background: #fff; text-align: center; }
.project-loading p, .project-load-error p { font-size: 14px; line-height: 1.6; }
.project-loading::before { content: ""; display: block; width: 22px; height: 22px; border: 1px solid #ccc; border-top-color: #111; border-radius: 50%; animation: vegas-loading 900ms linear infinite; }
.project-load-error a { color: #111; font-size: 13px; text-underline-offset: 5px; }
@keyframes vegas-loading { to { transform: rotate(360deg); } }
.backup-car {
  --footer-light-delay: 0ms;
  position: fixed;
  z-index: 100;
  left: 50%;
  bottom: -65px;
  width: 230px;
  height: auto;
  padding: 0;
  border: 0;
  color: #fff;
  background: none;
  transform: translate(-50%, 0px) scale(1);
  transform-origin: center bottom;
  /* Only the explicit transfer animation owns this transform. */
  transition: none;
}
.backup-car .car-body { isolation:isolate; transform-origin:center bottom; filter:grayscale(1); transition:transform 300ms cubic-bezier(.2,.65,.2,1),filter 160ms ease var(--footer-light-delay); }
.backup-car .car-body > img { position:relative; z-index:1; }
.backup-car .car-plate,.backup-car .tail-glow { z-index:3; }
.backup-car .tail-glow { opacity:0; transition:opacity 160ms ease var(--footer-light-delay); }
.footer-smoking { position:absolute; z-index:4; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; opacity:0; }
/* Register the original 1536×1024 cabin animation to the wider rear artwork.
   Width/height use one uniform .95 scale, preserving the men's proportions. */
.car-body :is(.passenger-pose,.passenger-heads,.windshield-plane,.footer-smoking) { inset:auto; left:7.513%; top:-3.821%; width:84.985%; height:106.201%; }
.backup-car:not(.is-transferring) .footer-smoking { opacity:1; }
.footer-smoke-trail { opacity:0; animation:footer-smoke-rise 2.2s ease-out infinite; }
.smoke-two { animation-duration:2.5s; animation-delay:-.9s; }
.smoke-three { animation-duration:1.9s; animation-delay:-1.3s; }
.smoke-four { animation-duration:2.3s; animation-delay:-.4s; }
.smoke-five { animation-duration:2.6s; animation-delay:-1.7s; }
@keyframes footer-smoke-rise { 0% { opacity:0; transform:translateY(8px); } 20% { opacity:.34; } 55% { opacity:.18; } 85%,100% { opacity:0; transform:translateY(-50px); } }
.backup-car.is-transferring .footer-smoke-trail,.atmosphere-paused .footer-smoke-trail { animation-play-state:paused; }
/* Lift in monochrome first. Lighting begins only after the 300ms lift;
   leaving early cancels the delay, including keyboard and touch previews. */
.backup-car:not(.is-transferring):hover, .backup-car:not(.is-transferring):focus-visible, .backup-car.is-raised:not(.is-transferring) { --footer-light-delay:300ms; }
.backup-car:not(.is-transferring):hover .car-body, .backup-car:not(.is-transferring):focus-visible .car-body, .backup-car.is-raised:not(.is-transferring) .car-body { transform: translateY(-65px) scale(1.12); filter:grayscale(0); }
.backup-car:not(.is-transferring):hover .tail-glow, .backup-car:not(.is-transferring):focus-visible .tail-glow, .backup-car.is-raised:not(.is-transferring) .tail-glow { opacity: 1; }
.backup-car.is-transferring { transition: none; pointer-events: none; }
.backup-car.is-transferring .car-body { transform:none; transition:none; }
.backup-car.is-transferring .tail-glow { transition:none; }
.reverse-badge { position: absolute; z-index:5; top:44%; left:50%; width:65%; height:auto; overflow:visible; opacity:0; transform:translate(-50%,5px) scale(.96); filter:drop-shadow(0 2px 3px #000b); transition:opacity 160ms ease,transform 200ms ease; }
.gear-letters text { fill:#d4d2cb; font-family:"Arial Narrow","Helvetica Neue",Arial,sans-serif; font-size:31px; font-weight:600; }
.gear-letters .gear-reverse { fill:#ece8de; font-weight:800; transition:fill 160ms ease var(--footer-light-delay),filter 160ms ease var(--footer-light-delay); }
.reverse-selector { transform:translateX(-64px); transition:transform 420ms cubic-bezier(.2,.72,.2,1),filter 200ms ease; }
.backup-car:not(.is-transferring):hover .reverse-badge, .backup-car:not(.is-transferring):focus-visible .reverse-badge, .backup-car.is-raised:not(.is-transferring) .reverse-badge { opacity: 1; transform: translate(-50%, 0) scale(1); }
.backup-car:not(.is-transferring):hover .reverse-selector,.backup-car:not(.is-transferring):focus-visible .reverse-selector,.backup-car.is-raised .reverse-selector,.backup-car.is-reversing .reverse-selector { transform:translateX(0); }
.backup-car:not(.is-transferring):hover .reverse-selector,.backup-car:not(.is-transferring):focus-visible .reverse-selector,.backup-car.is-raised .reverse-selector,.backup-car.is-reversing .reverse-selector { filter:drop-shadow(0 0 6px #f04b38); }
.backup-car.is-reversing .reverse-badge { opacity:1; transform:translate(-50%,0) scale(1); }
.backup-car.is-reversing .car-body { filter:grayscale(0); }
.backup-car:not(.is-transferring):hover .gear-reverse, .backup-car:not(.is-transferring):focus-visible .gear-reverse, .backup-car.is-raised:not(.is-transferring) .gear-reverse, .backup-car.is-reversing .gear-reverse { fill:#fff6ec; filter:drop-shadow(0 0 5px #e8402c); }
.backup-car.is-reversing .tail-glow { opacity:1; }
.approach-screen.white-project-transition { position: fixed; left: 0; top: 0; width: 640px; height: 455px; display: block; z-index: 90; overflow: hidden; border: 0; border-radius: 0; background: #fff; background-image: none; box-shadow: none; pointer-events: none; transform-origin: 0 0; }
.no-script { position: fixed; z-index: 110; right: 20px; bottom: 20px; left: 20px; max-width: 450px; margin: auto; padding: 22px; background: #111f; border: 1px solid #777; text-align: center; }
.no-script h1 { margin: 0 0 8px; font-size: 24px; font-weight: 400; }
.no-script p { color: #aaa; font-size: 12px; }
.no-script a { display: block; margin-top: 18px; font-size: 14px; }

@media (min-width: 1600px) {
  .gallery-heading, .gallery-controls { left: 5%; right: 5%; }
}

@media (max-width: 700px) {
  :root { --nav-height: 54px; }
  .vegas-nav { padding: 0 18px; }
  .vegas-brand { font-size: 13px; }
  .vegas-nav nav { gap: 17px; }
  .vegas-nav nav a { font-size: 10px; }
  .intro-eyebrow { top: 24px; font-size: 8px; letter-spacing: .12em; }
  .portrait-plane { height: 89%; width: 142%; }
  .name-plane { bottom: 24%; width: 96%; }
  .name-plane h1 { font-size: 14.3vw; letter-spacing: -.055em; }
  .intro-footer { bottom: 10%; gap: 17px; }
  .intro-footer p { font-size: 9px; letter-spacing: .15em; }
  .intro-footer p span { padding: 0 7px; }
  .enter-drive { width: 110px; height: 54px; min-height: 43px; font-size: 11px; }
  .journey-cue { bottom: 22px; left: 5%; }
  .journey-cue p { font-size: 8px; }
  .gallery-heading { top: 22px; }
  .gallery-heading h2 { font-size: 10.2vw; }
  .gallery-heading .eyebrow { font-size: 8px; margin-bottom: 6px; }
  .gallery-instruction { max-width: 135px; font-size: 9px; }
  .billboard-display { border: 0; }
  .drive-car { width: min(96vw, 520px); bottom: -38px; }
  .gallery-controls { bottom: 18px; left: 5%; right: 5%; }
  .portfolio-index-link { position: absolute; right: 0; bottom: 44px; padding: 10px; border-radius: 2px; background: #090909b0; font-size: 10px; }
  .portfolio-index-link span { margin-left: 6px; }
  .project-panel { left: 3vw; right: 3vw; top: calc(var(--nav-height) + 10px); }
  .project-toolbar { gap: 12px; padding: 0 11px; }
  .project-toolbar button, .project-toolbar a { font-size: 9px; }
  #project-panel-title { font-size: 9px; }
  .backup-car { width: 210px; bottom: -52px; }
}

@media (max-width: 450px) {
  .vegas-nav { padding: 0 12px; }
  .vegas-brand { font-size: 12px; }
  .vegas-nav nav { gap: 12px; }
  .vegas-nav nav a { font-size: 9px; }
  .vegas-nav nav a:first-child { display: none; }
  .portrait-plane { height: 84%; width: 164%; }
  .name-plane { bottom: 28%; }
  .intro-footer { bottom: 12%; }
  .gallery-heading h2 { max-width: none; font-size: 10.2vw; }
  .gallery-instruction { max-width: 106px; font-size: 8px; }
  .gallery-controls { gap: 9px; }
  .portfolio-index-link { font-size: 9px; }
  #project-panel-title { max-width: 43%; margin: auto; }
  .project-toolbar { gap: 7px; padding: 0 8px; }
}

@media (max-height: 630px) and (min-width: 701px) {
  .intro-eyebrow { top: 18px; font-size: 8px; }
  .name-plane { bottom: 22%; }
  .name-plane h1 { font-size: min(13vw, 22vh); }
  .intro-footer { bottom: 5%; gap: 8px; }
  .intro-footer p { font-size: 9px; }
  .enter-drive { height: 52px; min-height: 34px; }
  .gallery-heading { top: 16px; }
  .gallery-heading h2 { font-size: min(6.5vw,8svh); }
  .drive-car { width: min(66vw, 102svh); bottom: -70px; }
  .gallery-controls { bottom: 13px; }
}

@media (max-height: 480px) and (orientation: landscape) {
  :root { --nav-height: 44px; }
  .intro-eyebrow { top: 15px; font-size: 7px; }
  .portrait-plane { height: 99%; }
  .name-plane { bottom: calc(26% + 20px); }
  .name-plane h1 { font-size: 19vh; }
  .intro-footer { bottom: 5%; gap: 5px; }
  .intro-footer p { font-size: 8px; }
  .enter-drive { height: 48px; min-height: 30px; padding: 0 14px 11px; font-size: 9px; }
  .journey-cue { bottom: 16px; }
  .gallery-heading { top: 12px; }
  .gallery-heading h2 { font-size: min(6.5vw,9svh); }
  .gallery-heading .eyebrow { font-size: 7px; margin-bottom: 4px; }
  .gallery-instruction { font-size: 8px; }
  .drive-car { width: min(60vw, 106svh); bottom: -55px; }
  .gallery-controls { bottom: 11px; }
}

/* Navigation and directions stay readable, including at compact breakpoints. */
.vegas-brand { font-size:18px; }
.vegas-nav nav a { font-size:16px; color:#dedede; }
.intro-eyebrow,.intro-footer p,.enter-drive,.journey-cue p,.gallery-instruction { font-size:14px; }
.enter-drive { min-height:44px; }
.portfolio-index-link,.drive-instruction { font-size:16px; color:#f1eee8; }
.project-toolbar { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:20px; }
.project-toolbar button,.project-toolbar a { font-size:16px; min-height:44px; }
#project-panel-title { min-width:0; font-size:18px; font-weight:600; color:#fff; }
.project-load-error a { font-size:16px; min-height:44px; display:inline-flex; align-items:center; }
@media(max-width:1100px) {
  .vegas-nav { align-items:flex-start; padding-top:9px; }
  .vegas-brand { display:inline-flex; align-items:center; min-height:44px; }
  .vegas-nav nav { height:44px; gap:clamp(12px,2vw,22px); }
}
@media(max-width:600px) {
  .vegas-nav { padding:0 12px; }
  .vegas-brand { position:absolute; top:6px; left:16px; font-size:16px; min-height:32px; }
  .vegas-nav nav { position:absolute; top:40px; left:16px; right:16px; height:44px; justify-content:space-between; gap:8px; }
  .vegas-nav nav a,.vegas-nav nav a:first-child { display:inline-flex; font-size:14px; }
  .intro-eyebrow,.intro-footer p,.journey-cue p,.gallery-instruction { font-size:12px; }
  .enter-drive,.portfolio-index-link,.drive-instruction { font-size:14px; }
  .drive-instruction { max-width:155px; line-height:1.4; }
  .project-panel { --project-toolbar-height:96px; }
  .project-toolbar { grid-template-columns:1fr 1fr; grid-template-rows:minmax(24px,1fr) 44px; gap:4px 12px; padding:8px 12px; }
  #project-panel-title { grid-column:1 / -1; grid-row:1; max-width:none; margin:0; font-size:16px; line-height:1.15; white-space:normal; }
  .project-toolbar button { grid-column:1; grid-row:2; font-size:14px; }
  .project-toolbar a { grid-column:2; grid-row:2; justify-content:flex-end; font-size:14px; }
}

/* Absolute Beauty lettering is outlined artwork, not a redistributed font. */
.gallery-heading { top:clamp(36px,5svh,60px); }
.gallery-heading h2 { width:min(44vw,44svh,440px); max-width:none; font-size:100px; letter-spacing:0; }
.gallery-heading h2 span { line-height:1.18; }
.gallery-heading h2 .gallery-script {
  width:96%;
  margin:0 auto;
  line-height:0;
}
.gallery-script img { display:block; width:100%; height:auto; filter:drop-shadow(0 2px 8px #0008); }
.gallery-heading h2 .gallery-role { font-family:"Helvetica Neue",Arial,sans-serif; font-weight:200; color:#f2f0ec; }
.gallery-heading h2 .gallery-tagline {
  margin-top:.55em;
  font-family:"Helvetica Neue",Arial,sans-serif;
  font-weight:300;
  font-style:italic;
  color:#e6e3de;
}
@media(max-width:700px) {
  .gallery-heading { top:clamp(42px,8svh,70px); }
  .gallery-heading h2 { width:min(76vw,42svh); }
}
@media(max-height:630px) and (min-width:701px) {
  .gallery-heading { top:clamp(24px,7svh,50px); }
  .gallery-heading h2 { width:min(30vw,40svh); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; transition-delay:0ms !important; }
  .portrait-plane, .name-plane, .vegas-backdrop, .intro-footer, .drive-car { will-change: auto; }
  .car-body .passenger-pose,.car-body .passenger-heads { display: none; }
  .footer-smoke-trail { animation:none !important; display:none; }
  .street-atmosphere * { animation:none !important; }
  .crowd-walk-frame { animation:none !important; opacity:0 !important; }
}
