/* Layered scenery and transparent foreground vehicles. */
.model-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:39% 61%;min-height:660px;margin:24px 3% 0;background:transparent;border:0;border-radius:0;overflow:visible;color:white;--pointer-x:0px;--pointer-y:0px}
.hero-scenery{position:absolute;inset:0 0 100px;z-index:-1;overflow:hidden;border-radius:10px;background:#142034}
.landscape{position:absolute;inset:-3%;background:url('assets/mountain-action.webp') center 56%/cover no-repeat;animation:landscape-drift 12s ease-in-out infinite alternate;transform-origin:75% 55%;transition:filter 1s ease}
.scene-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,17,29,.98) 0%,rgba(10,17,29,.88) 28%,rgba(10,17,29,.3) 59%,rgba(10,17,29,.05)),linear-gradient(0deg,rgba(11,22,39,.6),transparent 55%)}
.light-trail{position:absolute;width:60%;height:2px;background:linear-gradient(90deg,transparent,#7ba6ff,transparent);left:55%;top:68%;opacity:.5;transform:rotate(-13deg);animation:light-pass 6s ease-in-out infinite;pointer-events:none}
.model-hero[data-featured="J5"] .landscape{filter:brightness(1.15) saturate(.75)}.model-hero[data-featured="J8"] .landscape{filter:brightness(.85) saturate(1.2)}
.model-hero:not(.is-running) .landscape,.model-hero:not(.is-running) .light-trail{animation-play-state:paused}
.model-hero .hero-copy{position:relative;z-index:3;padding:64px 0 165px 9%;justify-content:center;pointer-events:none}.model-hero .hero-copy a{pointer-events:auto}.model-hero .eyebrow{color:#b9ccff;font-size:10px;letter-spacing:1.5px}.model-hero .dash{background:#8eafff}.model-hero h1{font-size:clamp(42px,4.8vw,76px);letter-spacing:-3px;line-height:1.02;color:#fff;margin-bottom:24px}.model-hero .intro{color:#d3dce9;max-width:350px;line-height:1.75;font-size:16px}.model-hero .actions{gap:20px}.model-hero .text-link{color:#f0f4ff;font-size:13px}.model-hero .hero-note{color:#a6b5ce;font-size:12px;margin-top:26px}
.model-stage{position:relative;min-width:0;background:transparent;padding:0;overflow:visible}
.model-feature{position:absolute;top:32px;left:55px;right:34px;display:flex;align-items:center;justify-content:space-between;gap:15px;z-index:3}.feature-kicker{font-size:10px;letter-spacing:1.8px;color:#b7c9e4}.model-feature h2{font-size:38px;letter-spacing:2px;line-height:1.2;margin:6px 0 4px;color:white;font-weight:500}.model-feature p{font-size:13px;color:#c4d0e2;margin:0}.model-explore{padding:11px 17px;border:1px solid #8094b0;border-radius:3px;background:#15243b55;color:white;font-size:13px;white-space:nowrap}.model-explore:hover{background:#315ce8;border-color:#7395ff}
.model-slides{position:absolute;inset:125px -18px 55px -52px;overflow:visible;z-index:2;perspective:1200px}
.model-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s;pointer-events:none;display:flex;align-items:center;--entry-x:100px;--entry-angle:-2deg}.model-slide[data-car="J8"]{--entry-x:-75px;--entry-angle:2deg}.model-slide.is-active{opacity:1;visibility:visible}
.car-depth{width:100%;height:100%;transform:translate3d(var(--pointer-x),var(--pointer-y),0);transition:transform .35s ease-out}
.model-slide img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:normal;filter:drop-shadow(0 32px 16px #02091688);transform-origin:55% 65%;will-change:transform}
.model-slide.is-active img{animation:car-arrive 1.35s cubic-bezier(.16,.85,.27,1) both}
.carousel-bar{position:absolute;left:40px;right:32px;bottom:24px;display:flex;justify-content:space-between;align-items:center;gap:20px;z-index:4;color:#20262d}.model-selectors{display:flex;gap:26px}.model-selectors button{border:0;border-top:3px solid #d5deeb;background:none;padding:10px 10px 7px;font-size:14px;min-width:58px;color:#606e81}.model-selectors button.is-active{color:#234acb;border-top-color:#315ce8;font-weight:700}.rotation-toggle{border:1px solid #bdc9da;background:#fff;border-radius:3px;padding:7px 12px;font-size:12px;min-width:64px;color:#263447}.rotation-toggle:hover{background:#edf2ff}.studio-note{position:absolute;left:40px;bottom:0;font-size:10px;color:#667389;margin:0;letter-spacing:.2px}.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}
.models{gap:25px}.models button{overflow:visible;border-radius:7px;background:#fff;transition:box-shadow .3s,border-color .3s}.model-image{position:relative;padding:0;background:radial-gradient(ellipse at 60% 40%,#e4ecfa,#eef2f7 70%);border-radius:6px 6px 0 0;aspect-ratio:1.6;overflow:visible}.model-image img{object-fit:contain;mix-blend-mode:normal;border-radius:0;width:104%;max-width:none;margin-left:-2%;filter:drop-shadow(0 16px 8px #27395535);transition:transform .5s cubic-bezier(.2,.75,.3,1)}.models button:hover{box-shadow:0 18px 35px #233c6914;border-color:#88a7f2}.models button:hover .model-image img{transform:translateY(-12px) scale(1.07)}.model-copy{position:relative;background:white;border-radius:0 0 7px 7px}.news-lead img{background:radial-gradient(ellipse at center,#dbe5f6,#f1f4fa);aspect-ratio:1.85;object-fit:contain;mix-blend-mode:normal;padding:12px;filter:none}.hub-photo{background:radial-gradient(ellipse at center,#dae5f8,#f2f5fa);mix-blend-mode:normal}
@keyframes car-arrive{0%{transform:translate3d(var(--entry-x),30px,-140px) scale(.8) rotate(var(--entry-angle));opacity:0}24%{opacity:1}72%{transform:translate3d(-5px,-8px,0) scale(1.035) rotate(0)}100%{transform:translate3d(0,0,0) scale(1) rotate(0)}}
@keyframes landscape-drift{from{transform:scale(1.04) translateX(0)}to{transform:scale(1.13) translateX(-1%)}}
@keyframes light-pass{0%,22%{opacity:0;transform:translateX(20%) rotate(-13deg)}35%{opacity:.45}70%,100%{opacity:0;transform:translateX(-85%) rotate(-13deg)}}
@media(min-width:1450px){.model-hero{min-height:740px}.hero-scenery{bottom:110px}.model-slides{inset:130px -22px 45px -80px}.model-hero .hero-copy{padding-left:10%;padding-bottom:170px}}
@media(max-width:1050px){.model-hero{grid-template-columns:40% 60%;min-height:620px}.model-hero .hero-copy{padding:52px 0 155px 8%}.model-hero h1{font-size:48px;letter-spacing:-2px}.model-hero .intro{font-size:15px}.model-feature{left:28px;right:24px}.model-feature h2{font-size:31px}.model-feature p{font-size:12px}.model-slides{inset:150px -15px 58px -30px}.carousel-bar{left:24px;right:24px}.studio-note{left:24px}.model-explore{padding:9px 12px;font-size:12px}}
@media(max-width:800px){.model-hero{display:block;min-height:0}.hero-scenery{bottom:95px}.scene-shade{background:linear-gradient(180deg,#0a111de8 0%,#0a111dc9 32%,#0a111d15 75%),linear-gradient(90deg,#0a111d66,transparent)}.model-hero .hero-copy{padding:36px 30px 20px;justify-content:start;max-width:580px}.model-hero h1{font-size:52px}.model-hero .intro{max-width:460px}.model-hero .hero-note{margin-top:18px}.model-stage{height:450px}.model-feature{left:30px;right:30px;top:12px}.model-slides{inset:80px -10px 48px -10px}.carousel-bar{left:30px;right:30px;bottom:22px}.studio-note{left:30px;font-size:10px}.model-feature h2{font-size:30px}.landscape{background-position:65% center}}
@media(max-width:580px){.model-hero{margin:14px 4% 0}.hero-scenery{border-radius:7px;bottom:94px}.model-hero .hero-copy{padding:30px 23px 15px}.model-hero h1{font-size:clamp(36px,10vw,53px);letter-spacing:-1.8px;margin-bottom:20px}.model-hero .intro{font-size:15px;line-height:1.65}.model-hero .eyebrow{font-size:9px;letter-spacing:1px}.model-hero .actions{gap:14px}.model-hero .hero-note{font-size:11px}.model-stage{height:340px}.model-feature{left:22px;right:22px;top:0}.feature-kicker{font-size:8px;letter-spacing:1px}.model-feature h2{font-size:25px;letter-spacing:.7px}.model-feature p{display:none}.model-explore{font-size:12px;padding:8px 10px}.model-slides{inset:57px -10px 45px -10px}.carousel-bar{left:12px;right:12px;bottom:20px}.model-selectors{gap:16px}.model-selectors button{min-width:46px;padding:9px 6px 6px}.studio-note{left:12px;font-size:9px;bottom:0}.model-image{aspect-ratio:1.6}.model-slide img{filter:drop-shadow(0 18px 10px #02091666)}}
@media(prefers-reduced-motion:reduce){.landscape,.light-trail,.model-slide.is-active img{animation:none!important}.model-slide,.car-depth,.model-image img{transition:none}.car-depth{transform:none!important}.models button:hover .model-image img{transform:none}}
/* Keep copy clear of the foreground vehicle at every desktop width. */
@media(min-width:801px){.model-hero .actions{flex-direction:column;align-items:flex-start;gap:16px}.model-hero .hero-copy{padding-bottom:145px}.model-slides{top:145px;bottom:35px}}
