/* Avante / road cinema. Movement enhances a complete, readable static page. */
:root { --cinema-ease: cubic-bezier(.22,.8,.2,1); }
.fleet .fleet-carousel,html.motion-ready .fleet .fleet-carousel.reveal,html.motion-ready .fleet .fleet-carousel.reveal.is-visible { width: 100%; max-width: 1440px; margin: 72px auto 0; left: auto; right: auto; transform: none; }
.fleet .fleet-experience { display: block; min-height: 0; overflow: hidden; border-radius: 24px; background: #100c12; }
.fleet .cinematic-stage { height: clamp(520px,48vw,740px); min-height: 0; overflow: hidden; margin: 0; isolation: isolate; touch-action: pan-y; background: radial-gradient(ellipse at 50% 36%,#422039 0, #19111c 43%,#0c090e 78%); }
.cinematic-stage > #fleet-main,.cinematic-stage > #fleet-next { display: none; }
.fleet .cinematic-stage::before { inset: 0; z-index: -1; background: radial-gradient(ellipse at var(--light-x,50%) var(--light-y,40%),rgba(221,126,209,.19),transparent 50%); }
.fleet .cinematic-stage::after { inset: auto 10% 18%; height: 1px; background: linear-gradient(90deg,transparent,#b667a6,transparent); opacity: .35; }
.cinema-deck { position: absolute; inset: 0 0 130px; perspective: 1500px; }
.cinema-card { position: absolute; left: 50%; top: 50%; width: 62%; height: 78%; padding: 0; border: 1px solid rgba(255,255,255,.22); border-radius: 14px; overflow: hidden; background: #211b22; cursor: pointer; transform: translate(-50%,-50%) translateX(calc(var(--slot) * 40%)) translateZ(calc(var(--depth) * -210px)) rotateY(var(--turn)); filter: blur(calc(var(--depth) * 1.3px)) brightness(calc(1 - var(--depth) * .19)); opacity: max(0,calc(1 - var(--depth) * .28)); box-shadow: 0 32px 65px #0008; transition: transform .85s var(--cinema-ease),filter .85s var(--cinema-ease),opacity .7s,border-color .4s; }
.cinema-card img { width: 100%; height: 100%; object-fit: cover; object-position: center; pointer-events: none; transform: scale(1.045); transition: transform .8s var(--cinema-ease); }
.cinema-card::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(135deg,#ffffff13,transparent 40%,#0002); }
.cinema-card.is-active { border-color: #d99ace; box-shadow: 0 28px 70px #0009,0 0 46px #ad549824; }
@media (hover:hover) and (pointer:fine) {
 .cinema-card.is-active img { transform: scale(1.075) translate(var(--parallax-x,0px),var(--parallax-y,0px)); }
 .cinema-card:hover { border-color: #f4d9ef; }
}
.fleet .cinematic-stage figcaption { bottom: 30px; left: 5%; right: 19%; max-width: none; display: flex; align-items: flex-start; gap: 24px; pointer-events: none; }
.fleet .cinematic-stage figcaption h3 { font-size: clamp(28px,3.2vw,46px); line-height: 1.12; margin-bottom: 8px; }
.fleet .cinematic-stage figcaption p { max-width: 64ch; font-size: 16px; line-height: 1.5; }
.fleet .cinematic-stage #fleet-count { font-size: 13px; padding-top: 9px; white-space: nowrap; color: #dc9ed2; }
.fleet .cinematic-stage .fleet-arrow { top: auto; bottom: 34px; width: 48px; height: 48px; border-radius: 50%; background: #ffffff0a; border: 1px solid #ffffff36; transform: none; }
.fleet .cinematic-stage .fleet-arrow.prev { left: auto; right: 82px; }
.fleet .cinematic-stage .fleet-arrow.next { right: 24px; }
.fleet .cinematic-stage #fleet-expand { top: 22px; right: 24px; }
.fleet .fleet-browser { display: block; border: 0; border-top: 1px solid #ffffff18; padding: 20px 24px; background: #130e16; }
.fleet .fleet-browser-rule { display: none; }
.fleet .fleet-thumbs { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; padding: 0; overflow: visible; }
.fleet .fleet-thumbs button { display: flex; flex-direction: column; align-items: stretch; gap: 10px; min-height: 0; min-width: 0; padding: 8px; width: 100%; transform: none; border-radius: 9px; opacity: .68; filter: none; background: transparent; box-shadow: none; }
.fleet .fleet-thumbs button:is(.active,:hover,:focus-visible) { transform: none; opacity: 1; background: #b557a419; border-color: #d18dc3; }
.fleet .fleet-cover { width: 100%; height: auto; aspect-ratio: 1.7; border-radius: 5px; }
.fleet .fleet-card-copy { gap: 5px; padding: 0 3px 3px; }
.fleet .fleet-card-copy small { font-size: 12px; }
.fleet .fleet-card-copy strong { font-size: 14px; line-height: 1.3; white-space: normal; }
.fleet .fleet-play { display: none; }
.cinema-motion-control { position: fixed; z-index: 35; left: 20px; bottom: 20px; border: 1px solid #ffffff40; border-radius: 999px; padding: 11px 16px; color: #fff; background: #201324e8; font: 600 12px/1.2 Manrope,sans-serif; backdrop-filter: blur(12px); cursor: pointer; }
.cinema-motion-control:focus-visible { outline: 3px solid #e9a2dc; outline-offset: 3px; }
.kinetic-title { perspective: 900px; }
.kinetic-title [data-text-id] { display: inline-block; transform-origin: 50% 100%; }
.motion-enabled .kinetic-title.is-kinetic-visible [data-text-id] { animation: title-arrive 1.05s var(--cinema-ease) both; }
@keyframes title-arrive { from { opacity: .25; transform: translateY(28px) rotateX(12deg); filter: blur(3px); } to { opacity: 1; transform: none; filter: none; } }
.brand-marquee { overflow: hidden; padding: clamp(24px,4vw,58px) 0; margin-top: 52px; border-block: 1px solid #8b41882b; color: var(--purple); }
.marquee-track { display: flex; width: max-content; animation: route-marquee 38s linear infinite; }
.marquee-set { display: flex; align-items: center; gap: 44px; padding-right: 44px; font: 500 clamp(30px,4.4vw,70px)/1.2 Manrope,sans-serif; letter-spacing: -.045em; white-space: nowrap; }
.marquee-set span::after { content: ' /'; margin-left: 44px; font-weight: 400; opacity: .35; }
@keyframes route-marquee { to { transform: translateX(-50%); } }
.brand-marquee:hover .marquee-track { animation-play-state: paused; }
.motion-enabled .section.story-scene > .index { opacity: calc(.4 + var(--scene-progress,.5) * .6); }
.motion-enabled .section.story-scene .heading { transform: translateY(calc((.5 - var(--scene-progress,.5)) * 24px)); }
.motion-enabled .control > img,.motion-enabled .security > img { transform: scale(1.08) translateY(calc((.5 - var(--scene-progress,.5)) * 50px)); }
.section.story-scene { scroll-margin-top: 80px; }
.section.story-scene > .index { font-variant-numeric: tabular-nums; letter-spacing: .14em; }
.cinema-paused .marquee-track { animation-play-state: paused; }
.cinema-paused .kinetic-title [data-text-id] { animation: none !important; }
.cinema-paused .cinema-card,.cinema-paused .cinema-card img { transition: none; }
.cinema-paused .cinema-card.is-active img { transform: none; }
@media(max-width:760px) {
 .fleet .cinematic-stage { height: 480px; }
 .cinema-deck { bottom: 185px; }
 .cinema-card { width: 78%; height: 76%; }
 .fleet .cinematic-stage figcaption { bottom: 76px; left: 22px; right: 22px; gap: 13px; }
 .fleet .cinematic-stage figcaption h3 { font-size: 28px; }
 .fleet .cinematic-stage figcaption p { font-size: 14px; }
 .fleet .cinematic-stage .fleet-arrow { bottom: 16px; width: 44px; height: 44px; }
 .fleet .fleet-thumbs { grid-template-columns: repeat(3,minmax(0,1fr)); }
 .fleet .fleet-browser { padding: 14px; }
 .fleet .fleet-thumbs button { padding: 5px; }
 .fleet .fleet-card-copy strong { font-size: 12px; }
 .fleet .fleet-card-copy small { display: none; }
 .cinema-motion-control { left: 12px; bottom: 12px; padding: 10px 12px; }
 .vehicle-intro { position: static; }
}
@media(prefers-reduced-motion:reduce) {
 .marquee-track { animation: none; width: auto; }
 .marquee-set { flex-wrap: wrap; white-space: normal; gap: 16px; font-size: 24px; padding-inline: 20px; }
 .marquee-set + .marquee-set { display: none; }
 .marquee-set span::after { margin-left: 16px; }
 .cinema-card,.cinema-card img { transition: none; }
 .cinema-card.is-active img { transform: none; }
 .kinetic-title [data-text-id] { animation: none !important; }
}