/* Exterior first, then a scroll-driven entry into the interactive interior. */
.troc-experience{height:330vh;height:330svh;position:relative;margin:0;--journey:0;--car-opacity:1;--car-scale:1;--cockpit-opacity:0;--cockpit-scale:1.16;--inside-opacity:0;--copy-opacity:1}
.troc-scene{height:100vh;height:100svh;position:sticky;top:0;overflow:hidden;isolation:isolate;background:#edf3f8;color:#001e50}
.troc-studio{position:absolute;inset:0;display:grid;place-items:center;padding-left:28%;background:radial-gradient(ellipse at 60% 50%,#fff,#dce6f1 95%);opacity:var(--car-opacity)}
.troc-wordmark{position:absolute;top:7%;left:0;width:100%;text-align:center;font-size:clamp(110px,20vw,280px);font-weight:600;letter-spacing:-.075em;line-height:1;color:#001e5010}
.troc-reveal-car{position:relative;width:100%;height:88%;object-fit:contain;mix-blend-mode:multiply;transform:scale(var(--car-scale));transform-origin:60% 42%;will-change:transform}
.troc-cockpit{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 50%;transform:scale(var(--cockpit-scale));opacity:var(--cockpit-opacity);will-change:transform,opacity}
.troc-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#00143566,transparent 45%);opacity:var(--cockpit-opacity)}
.troc-intro-copy{position:absolute;z-index:3;left:max(6%,calc((100vw - 1240px)/2));bottom:20%;right:6%;opacity:var(--copy-opacity);pointer-events:none;transform:translateY(calc(var(--journey)*-55px))}
.troc-kicker{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:#234366}
.troc-intro-copy h2{color:#001e50;font-size:clamp(52px,6.6vw,94px);line-height:1.02;letter-spacing:-.065em;font-weight:600;margin:18px 0;text-shadow:0 2px 20px #edf3f8cc}
.troc-intro-copy p{font-size:17px;color:#234366;margin:0}
.troc-scene-bottom{position:absolute;z-index:5;bottom:6%;left:max(6%,calc((100vw - 1240px)/2));right:max(6%,calc((100vw - 1240px)/2));display:flex;align-items:center;gap:14px}
.troc-build-link,.troc-explore-button,.troc-exterior-button{display:flex;align-items:center;gap:20px;border-radius:32px;background:#001e50;color:#fff;padding:16px 24px;text-decoration:none;font-weight:600;font-size:14px;border:1px solid #001e50;cursor:pointer;transition:background .2s,transform .2s}
.troc-build-link:hover,.troc-explore-button:hover,.troc-exterior-button:hover{background:#12477c;transform:translateY(-2px)}
.troc-build-link:focus-visible,.troc-explore-button:focus-visible,.troc-exterior-button:focus-visible{outline:3px solid #85bcff;outline-offset:5px}
.troc-build-link span{font-size:21px;line-height:1}.troc-explore-button{background:#ffffffb8;color:#001e50;border-color:#001e5040}
.troc-explore-button[hidden],.troc-exterior-button[hidden],.troc-loading[hidden]{display:none!important}
.troc-scroll-cue{margin-left:auto;font-size:12px;color:#234366;background:#ffffffa8;padding:10px 14px;border-radius:22px;display:flex;align-items:center;gap:14px}
.troc-scene-label{position:absolute;z-index:4;right:6%;top:7%;font-size:11px;letter-spacing:.12em;text-transform:uppercase;background:#001435a8;color:#fff;padding:8px 12px;border-radius:22px}
.troc-progress{position:absolute;z-index:5;bottom:0;left:0;right:0;height:3px;background:#001e5024}.troc-progress i{display:block;height:100%;width:100%;transform:scaleX(var(--journey));transform-origin:left;background:#78b5ff}
#troc-opening-interior{position:absolute;inset:0;z-index:2;width:100%;height:100%;aspect-ratio:auto;border-radius:0;opacity:var(--inside-opacity);pointer-events:none}
#troc-opening-interior:not([inert]){pointer-events:auto}
#troc-opening-interior .interior-badge{top:24px;left:24px;font-size:12px;padding:10px 16px}
#troc-opening-interior .interior-tools{top:24px;right:24px;gap:7px}
#troc-opening-interior .interior-tools button{font-size:13px;padding:12px 16px;min-height:44px;border-radius:28px}
#troc-opening-interior .interior-directions{bottom:105px;right:24px;gap:7px}
#troc-opening-interior .interior-directions button{font-size:21px;padding:10px 15px;min-height:44px;border-radius:28px}
#troc-opening-interior .interior-help{bottom:107px;left:24px;font-size:12px;padding:9px 12px;max-width:50%}
#troc-opening-interior:fullscreen{opacity:1;pointer-events:auto}
.troc-inside .troc-scene-label,.troc-inside .troc-scroll-cue{display:none}
.troc-inside .troc-scene-bottom{justify-content:center;pointer-events:none}
.troc-inside .troc-build-link{background:#fff;color:#001e50;border-color:#ffffffa8;pointer-events:auto}
.troc-exterior-button{position:absolute;z-index:5;left:24px;top:78px;font-size:11px;padding:9px 13px;background:#001435b8;color:#fff;border-color:#ffffff60;backdrop-filter:blur(8px)}
.troc-loading{position:absolute;z-index:4;top:24px;left:24px;padding:12px 16px;background:#001435d9;border-radius:24px;color:#fff;font-size:13px}
.troc-inside:not(.troc-viewer-available) #troc-opening-interior .interior-tools,.troc-inside:not(.troc-viewer-available) #troc-opening-interior .interior-directions{display:none}
#build-start{scroll-margin-top:28px}#build-title:focus{outline:none}
body.troc-intro-active .mobile-total{visibility:hidden;pointer-events:none}
.troc-scene-bottom{animation:none}
.troc-kicker,.troc-intro-copy h2,.troc-intro-copy p{animation:none;translate:none}
.troc-scene-bottom{animation-delay:.24s}
@keyframes troc-arrive{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}
.troc-slide-in{opacity:0;translate:0 42px;transition:opacity .65s ease,translate .75s cubic-bezier(.16,1,.3,1);transition-delay:var(--slide-delay,0ms)}
.troc-slide-in[data-slide-from=left]{translate:-48px 0}.troc-slide-in[data-slide-from=right]{translate:48px 0}.troc-slide-in.troc-in-place{opacity:1;translate:0 0}
@media(max-width:600px){.troc-experience{height:300svh}.troc-studio{padding-left:0}.troc-reveal-car{width:100%;height:57%;align-self:start;margin-top:7%}.troc-wordmark{top:15%;font-size:110px}.troc-intro-copy{left:7%;bottom:29%;right:7%}.troc-intro-copy h2{font-size:clamp(44px,12vw,66px);margin:12px 0}.troc-intro-copy p{font-size:13px;max-width:26ch}.troc-kicker{font-size:9px}.troc-scene-bottom{left:7%;right:7%;bottom:6%;align-items:flex-start;flex-direction:column;gap:10px}.troc-build-link,.troc-explore-button{font-size:12px;padding:13px 18px}.troc-scroll-cue{font-size:10px;margin-left:0;padding:7px 10px}.troc-scene-label{font-size:9px;top:4%;right:7%}.troc-inside .troc-scene-bottom{align-items:center;bottom:24px}.troc-exterior-button{top:65px;left:14px;font-size:10px;padding:8px 11px}#troc-opening-interior .interior-badge{top:14px;left:14px;font-size:10px;padding:9px 10px}#troc-opening-interior .interior-tools{top:14px;right:12px;gap:4px}#troc-opening-interior .interior-tools button{font-size:10px;padding:9px 10px;min-height:36px}#troc-opening-interior .interior-directions{right:14px;bottom:96px;gap:5px}#troc-opening-interior .interior-directions button{font-size:17px;padding:9px 12px;min-height:40px}#troc-opening-interior .interior-help{left:14px;bottom:149px;font-size:10px;max-width:calc(100% - 28px);padding:7px 10px}.troc-loading{top:70px;left:14px;font-size:11px}.troc-slide-in[data-slide-from]{translate:0 34px}.troc-slide-in.troc-in-place{translate:0 0}}
@media(prefers-reduced-motion:reduce){.troc-experience{height:auto}.troc-scene{position:relative}.troc-reveal-car,.troc-cockpit,.troc-intro-copy{transform:none!important;will-change:auto}.troc-scroll-cue{display:none}.troc-kicker,.troc-intro-copy h2,.troc-intro-copy p,.troc-scene-bottom{animation:none}.troc-build-link,.troc-explore-button,.troc-exterior-button{transition:none}.troc-slide-in{opacity:1!important;translate:none!important;transition:none!important}}
@media print{.troc-experience{display:none!important}.troc-slide-in{opacity:1!important;translate:none!important;transition:none!important}}
/* Keep the visual change beside the photograph, including functional options. */
.option-visual-note{position:absolute;left:12px;bottom:12px;right:110px;display:flex;gap:10px;align-items:center;text-align:left;background:#001435e8;color:#d6e1ed;border:1px solid #ffffff35;border-radius:12px;padding:10px 12px;pointer-events:none;line-height:1.35}
.option-visual-note b{font-size:11px;font-weight:600;display:block}.option-visual-note small{font-size:9px;display:block;color:#c1ceda;margin-top:3px}
.option-visual-note[data-feature-selected=true]{background:#003875ed;color:#fff;border-color:#8dbdf1}
.option-visual-note svg{width:65px;height:42px;flex-shrink:0;color:#8c9dab}.option-visual-note[data-feature-selected=true] svg{color:#85cfff}.feature-signal{stroke:currentColor;stroke-width:3;opacity:0}.option-visual-note[data-feature-selected=true] .feature-signal{opacity:1}
.functional-demo{right:12px;bottom:12px}.has-function-preview .photo-zoom{bottom:100px}.has-function-preview>img{object-position:center 45%;}
.photo-dialog-caption .option-visual-note{position:static;width:fit-content;max-width:100%;margin:0 0 18px;padding:14px 18px;pointer-events:auto}.photo-dialog-caption .option-visual-note b{font-size:16px}.photo-dialog-caption .option-visual-note small{font-size:11px}.photo-dialog-caption .option-visual-note svg{width:90px;height:60px}
@media(max-width:600px){.option-visual-note{left:7px;right:7px;bottom:7px;padding:7px;gap:5px;border-radius:8px}.option-visual-note b{font-size:9px}.option-visual-note small{font-size:7px}.option-visual-note svg{width:34px;height:27px}.accessory-photo:has(.option-visual-note) .photo-zoom{bottom:68px}.has-function-preview .photo-zoom{bottom:85px}.accessory-paint-label{max-width:calc(100% - 15px);font-size:8px}}
@media print{.option-visual-note{display:none}}
/* Both selection states retain the original colours; zoom into the equipment. */
:is(.accessory-card,.selected-accessory) .accessory-photo[data-preview-area=roof]>img,.comparison-frame[data-preview-area=roof]>img{transform:scale(1.8);transform-origin:43% 23%}
:is(.accessory-card,.selected-accessory) .accessory-photo[data-preview-area=lights]>img,.comparison-frame[data-preview-area=lights]>img{transform:scale(1.7);transform-origin:65% 54%}
:is(.accessory-card,.selected-accessory) .accessory-photo[data-preview-area=towbar]>img,.comparison-frame[data-preview-area=towbar]>img{transform:scale(2.3);transform-origin:10% 93%}
:is(.accessory-card,.selected-accessory) .accessory-photo[data-preview-area=navigation]>img,.comparison-frame[data-preview-area=navigation]>img{transform:scale(1.75);transform-origin:46% 40%}
.option-comparison{grid-template-columns:1fr 1fr;gap:16px;padding:20px;background:var(--bg)}
.option-comparison figure{margin:0;min-width:0}.option-comparison figcaption{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:10px}
.comparison-frame{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:14px;background:#fff}.comparison-frame>img{width:100%;height:100%;max-height:none;object-fit:cover}
.comparison-frame .option-visual-note{right:12px}.comparison-frame .option-visual-note b{font-size:12px}
.functional-demo[data-feature-selected=true]{background:#003875f5;border-color:#97cfff;box-shadow:0 5px 20px #00143530}
.functional-demo[data-feature-selected=true] svg{width:92px;height:60px}
@media(max-width:600px){.option-comparison{grid-template-columns:1fr;padding:12px;gap:20px}.functional-demo[data-feature-selected=true] svg{width:44px;height:35px}.comparison-frame .functional-demo svg{width:85px;height:55px}}

/* Clip entrances during a phone resize while preserving vertical sticky scrolling. */
.workspace{overflow-x:clip}
.photo-dialog{background:var(--white)}
/* Functional packages retain the real cockpit; selected views focus on the controls. */
:is(.accessory-photo,.comparison-frame)[data-preview-area=assist]>img{transform:scale(1.55);transform-origin:65% 50%}
:is(.accessory-photo,.comparison-frame)[data-preview-area=camera]>img{transform:scale(1.65);transform-origin:40% 43%}
:is(.accessory-photo,.comparison-frame)[data-preview-area=keyless]>img{transform:scale(1.5);transform-origin:53% 63%}
:is(.accessory-photo,.comparison-frame)[data-preview-area=chassis]>img{transform:scale(1.5);transform-origin:47% 58%}
/* Keep standard pedal/mat references focused on the footwell. */
.accessory-photo:is([data-preview-area=pedals],[data-preview-area=floor]):has([data-feature-selected=false])>img{transform:scale(1.8);transform-origin:40% 70%}

@media(max-width:360px){#troc-opening-interior .interior-tools{top:62px}.troc-exterior-button{top:112px}}

.troc-paint-picker,.troc-trim-picker{position:absolute;z-index:4;opacity:var(--copy-opacity)}
.troc-paint-name{display:block}.troc-paint-picker[inert],.troc-trim-picker[inert]{visibility:hidden}

/* One navigation and one vehicle stage, with clear space for each control. */
.demo-topbar.simple-topbar{position:sticky;top:0;z-index:20;max-width:none;height:76px;padding:0 max(5vw,24px);margin:0;display:flex;flex-wrap:nowrap;justify-content:space-between;background:var(--bg);border-bottom:1px solid var(--border);box-sizing:border-box}
.demo-topbar .simple-brand{color:var(--ink);text-decoration:none;flex-shrink:0;gap:12px}
.demo-topbar .vw-roundel{width:40px;height:40px}.demo-topbar .vw-brand-name{font-size:15px}.demo-topbar .brand-caption{font-size:10px}
.demo-topbar .simple-nav{width:auto;margin:0;gap:8px;align-items:center;flex-wrap:nowrap}
.demo-topbar .simple-nav>button{font-size:12px;padding:10px 14px;white-space:nowrap}
.demo-topbar .simple-nav>.active{background:#001e50;color:white;border-radius:24px;padding:11px 18px}
.demo-topbar .simple-nav>.demo-theme-toggle{font-size:20px;width:40px;height:40px;padding:0;border:1px solid var(--border);border-radius:50%;margin:0}
.troc-scene{top:76px;height:calc(100svh - 76px)}
.troc-studio{padding:0}.troc-wordmark{top:12%;left:35%;width:62%;font-size:clamp(110px,18vw,260px)}
.troc-reveal-car{position:absolute;left:38%;top:10%;width:60%;height:64%;margin:0;align-self:auto}
.troc-intro-copy{top:22%;bottom:auto;left:6%;right:auto;width:34%;max-width:460px}
.troc-intro-copy h2{font-size:clamp(48px,5.5vw,80px);margin:18px 0;line-height:1.04}
.troc-intro-copy p{font-size:15px;max-width:28ch;line-height:1.5}
.troc-trim-picker{top:65%;left:6%;width:34%;max-width:460px;margin:0}
.troc-trim-picker label{font-size:11px}.troc-trim-picker select,:root[data-theme=dark] .troc-trim-picker select{background:#ffffffd9;color:#001e50;border:1px solid #001e5029;height:50px;padding:12px;border-radius:12px;font-size:12px;color-scheme:light}
.troc-trim-picker small{font-size:9px;color:#536a81}
.troc-paint-picker{left:46%;right:6%;bottom:17%;top:auto;padding:16px 20px;background:#ffffffbb;border:1px solid #ffffffdb;border-radius:18px;box-shadow:0 10px 35px #001e5005;backdrop-filter:blur(12px)}
.troc-paint-name{font-size:12px;line-height:1.4;color:#234366;margin-bottom:12px}.troc-paint-picker .paint-swatches{gap:10px}.troc-paint-picker .paint-swatch{width:28px;height:28px;flex-basis:28px}
.troc-scene-label{top:5%;right:6%;font-size:9px;background:#ffffffb8;color:#536a81;border:1px solid #001e5014}
.troc-scene-bottom{left:6%;right:6%;bottom:6%;gap:12px}.troc-scroll-cue{font-size:11px;background:transparent}
#build-start{scroll-margin-top:100px}.build-section-head h1{font-size:36px;letter-spacing:-.04em;margin:6px 0 0;color:var(--ink);font-weight:600;line-height:1.15}
.build-section-head{margin-top:8px}.build-toolbar{margin-bottom:24px}
@media(max-width:1000px){.demo-topbar .vw-brand-name{font-size:13px}.demo-topbar .simple-nav{gap:2px}.demo-topbar .simple-nav>button{font-size:11px;padding:10px}.troc-intro-copy{width:37%;top:23%}.troc-intro-copy h2{font-size:clamp(44px,6vw,62px)}.troc-trim-picker{width:37%}.troc-paint-picker{left:47%;padding:14px}.troc-paint-picker .paint-swatch{width:24px;height:24px;flex-basis:24px}.troc-paint-picker .paint-swatches{gap:8px}}
@media(max-width:600px){
 .demo-topbar.simple-topbar{height:64px;padding:0 18px;gap:8px}.demo-topbar .vw-roundel{width:32px;height:32px}.demo-topbar .simple-brand{gap:8px}.demo-topbar .vw-brand-name{font-size:12px}.demo-topbar .vw-brand-name span{display:block;font-size:9px;font-weight:400}.demo-topbar .brand-caption{display:none}.demo-topbar .simple-nav>[data-discover],.demo-topbar .simple-nav>[data-tour]{display:none}.demo-topbar .simple-nav>.active{font-size:10px;padding:10px 12px}.demo-topbar .simple-nav>.demo-theme-toggle{width:32px;height:32px;font-size:18px}
 .troc-scene{top:64px;height:calc(100svh - 64px)}.troc-wordmark{left:0;width:100%;top:34%;font-size:110px}.troc-scene-label{display:none}
 .troc-intro-copy{left:7%;right:7%;width:auto;top:6%;max-width:none;bottom:auto}.troc-intro-copy h2{font-size:clamp(32px,8vw,46px);margin:10px 0}.troc-intro-copy h2 br{display:none}.troc-kicker{font-size:8px}.troc-intro-copy p{font-size:11px;max-width:none}.troc-trim-picker{left:7%;right:7%;top:25%;width:auto;max-width:none}.troc-trim-picker select,:root[data-theme=dark] .troc-trim-picker select{height:44px;font-size:10px;padding:10px}.troc-trim-picker label{font-size:10px}.troc-trim-picker small{font-size:8px;margin-top:5px}
 .troc-reveal-car{left:0;top:36%;width:100%;height:35%;margin:0}.troc-paint-picker{left:7%;right:7%;top:70%;bottom:auto;padding:12px 14px;border-radius:14px}.troc-paint-name{font-size:9px;margin-bottom:9px}.troc-paint-picker .paint-swatches{gap:8px}.troc-paint-picker .paint-swatch{width:22px;height:22px;flex-basis:22px}
 .troc-scene-bottom{left:7%;right:7%;bottom:3%;gap:8px;flex-direction:row;flex-wrap:nowrap;align-items:center}.troc-scroll-cue{display:none}.troc-build-link,.troc-explore-button{font-size:10px;padding:11px 12px;gap:7px;justify-content:center}.troc-explore-button{font-size:0;gap:0}.troc-explore-button::before{content:'360° interior';font-size:10px}.troc-explore-button span{font-size:12px;margin-left:8px}.troc-inside .troc-scene-bottom{bottom:24px}
 #build-start{scroll-margin-top:84px}.build-section-head h1{font-size:28px}
}
@media(max-width:360px){.demo-topbar.simple-topbar{padding-inline:12px}.troc-intro-copy h2{font-size:30px}.troc-trim-picker{top:28%}.troc-reveal-car{top:39%;height:30%}.troc-paint-picker{top:69%;padding:10px 12px}.troc-paint-picker .paint-swatch{width:20px;height:20px;flex-basis:20px}.troc-paint-picker .paint-swatches{gap:7px}.troc-paint-name{font-size:8px}}
@media print{.demo-topbar{display:none!important}.build-section-head h1{font-size:24px}}
@media(min-width:601px){.troc-reveal-car{left:36%;width:64%;top:6%;height:76%}.troc-trim-picker{top:61%}}
@media(max-width:600px){.troc-reveal-car{left:-13%;width:126%;top:34%;height:42%}}
@media(max-width:360px){.troc-reveal-car{top:38%;height:33%}}

.troc-experience{scroll-margin-top:76px}@media(max-width:600px){.troc-experience{scroll-margin-top:64px}}

/* Keep model and paint choices in the navigation, leaving the studio uncluttered. */
.demo-topbar.simple-topbar{height:88px;gap:24px;padding-inline:5%}
.troc-nav-controls{display:flex;gap:10px;flex:1;max-width:560px;min-width:0}
.troc-nav-selector{position:relative;flex:1;min-width:0;color:var(--ink)}
.troc-nav-selector>summary{display:grid;grid-template-columns:minmax(0,1fr) 16px;gap:3px 8px;list-style:none;cursor:pointer;border:1px solid var(--border);border-radius:14px;background:var(--white);padding:10px 14px;min-height:58px;box-sizing:border-box}
.troc-nav-selector>summary::-webkit-details-marker{display:none}
.troc-nav-selector>summary>span{font-size:10px;color:var(--muted)}
.troc-nav-selector>summary>strong{font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;grid-column:1}
.troc-nav-selector>summary>i{grid-column:2;grid-row:1/3;align-self:center;font-style:normal;font-size:20px}
.troc-nav-selector[open]>summary{border-color:var(--blue);box-shadow:0 0 0 3px #1672c51a}
.troc-nav-selector>summary:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.demo-topbar .troc-trim-picker,.demo-topbar .troc-paint-picker{position:absolute;left:0;right:auto;top:calc(100% + 12px);bottom:auto;width:440px;max-width:calc(100vw - 32px);margin:0;padding:12px;opacity:1;background:var(--white);color:var(--ink);border:1px solid var(--border);border-radius:18px;box-shadow:0 16px 45px #001e5026;backdrop-filter:none;z-index:25}
.demo-topbar .troc-trim-picker>label,.demo-topbar .troc-trim-picker>select,.demo-topbar .troc-trim-picker>small{display:none}
.troc-trim-choices{display:grid;gap:4px;max-height:60vh;overflow:auto}
.troc-trim-choices>button{display:grid;grid-template-columns:1fr 20px;gap:6px;text-align:left;padding:13px;background:transparent;color:var(--ink);border:0;border-radius:10px;cursor:pointer}
.troc-trim-choices>button strong{font-size:13px;font-weight:600;line-height:1.4}
.troc-trim-choices>button span{font-size:12px;color:var(--muted);grid-column:1}
.troc-trim-choices>button i{grid-column:2;grid-row:1/3;font-style:normal;align-self:center}
.troc-trim-choices>button:hover,.troc-trim-choices>button[aria-pressed=true]{background:var(--bg)}
.troc-nav-selector:last-child .troc-paint-picker{left:auto;right:0;width:360px;padding:20px}
.demo-topbar .troc-paint-name{color:var(--ink);font-size:13px;margin-bottom:16px}
.demo-topbar .paint-swatches{gap:14px;flex-wrap:wrap}
.demo-topbar .paint-swatch{width:36px;height:36px;flex-basis:36px}
.troc-scene{top:var(--troc-nav-height,88px);height:calc(100svh - var(--troc-nav-height,88px))}
.troc-experience{scroll-margin-top:var(--troc-nav-height,88px)}
.troc-reveal-car{left:28%;top:10%;width:72%;height:86%;transform-origin:56% 42%}
.troc-intro-copy{top:24%;width:29%}
.troc-intro-copy h2{font-size:clamp(48px,5.4vw,88px)}
@media(max-width:1200px){.demo-topbar .simple-nav>[data-discover],.demo-topbar .simple-nav>[data-tour]{display:none}.demo-topbar.simple-topbar{gap:16px;padding-inline:24px}.troc-nav-controls{max-width:560px}}
@media(max-width:760px){
 .demo-topbar.simple-topbar{height:132px;padding:12px 18px;display:grid;grid-template-columns:1fr auto;gap:10px 12px}
 .troc-nav-controls{grid-column:1/3;grid-row:2;max-width:none;width:100%;gap:10px}
 .demo-topbar .simple-nav{grid-column:2;grid-row:1}
 .demo-topbar .simple-brand{grid-column:1;grid-row:1}
 .demo-topbar .vw-brand-name{font-size:12px}.demo-topbar .vw-brand-name span{display:block;font-size:9px}.demo-topbar .brand-caption{display:none}
 .demo-topbar .vw-roundel{width:32px;height:32px}.demo-topbar .simple-brand{gap:8px}
 .demo-topbar .simple-nav>.active{font-size:10px;padding:10px 12px}.demo-topbar .simple-nav>.demo-theme-toggle{width:32px;height:32px;font-size:18px}
 .troc-nav-selector>summary{min-height:50px;padding:8px 11px;border-radius:11px}.troc-nav-selector>summary>strong{font-size:10px}
 .demo-topbar .troc-trim-picker,.demo-topbar .troc-paint-picker,.troc-nav-selector:last-child .troc-paint-picker{position:fixed;top:calc(var(--troc-nav-height,132px) + 8px);left:16px;right:16px;width:auto;max-width:none}
 .troc-scene{top:var(--troc-nav-height,132px);height:calc(100svh - var(--troc-nav-height,132px))}
 .troc-intro-copy{top:7%;left:7%;right:7%;width:auto}.troc-intro-copy h2{font-size:clamp(30px,8vw,48px)}
 .troc-reveal-car{left:-14%;top:27%;width:128%;height:62%}
 .troc-scene-bottom{bottom:4%;left:7%;right:7%}.troc-scroll-cue{display:none}
}
/* Manufacturer renders include studio margins; bring the actual car forward. */
.troc-reveal-car{top:0;transform:scale(calc(var(--car-scale) * 1.5))}
@media(max-width:760px){.troc-reveal-car{top:23%;transform:scale(calc(var(--car-scale) * 1.4))}}
@media(prefers-reduced-motion:reduce){.troc-reveal-car{transform:scale(1.5)!important}}
@media(max-width:760px) and (prefers-reduced-motion:reduce){.troc-reveal-car{transform:scale(1.4)!important}}

/* The header keeps only the brand, vehicle choices and appearance toggle. */
.demo-topbar.simple-topbar{gap:28px}
.demo-topbar .troc-nav-controls{margin-left:auto;max-width:720px}
.demo-topbar .simple-nav{flex:0 0 auto}
@media(max-width:760px){
 .demo-topbar.simple-topbar{height:132px;gap:10px 12px}
 .demo-topbar .troc-nav-controls{margin-left:0;max-width:none}
}

/* Compact trim cards echo the studio's soft surfaces and Volkswagen blue. */
.demo-topbar .troc-trim-picker{padding:8px;width:420px;border-radius:16px;background:var(--white);box-shadow:0 20px 50px #001e5020}
.troc-trim-choices{gap:5px;padding:2px;max-height:min(520px,calc(100svh - var(--troc-nav-height,88px) - 32px));scrollbar-width:thin}
.troc-trim-choices>button{position:relative;grid-template-columns:minmax(0,1fr) 24px;gap:5px 12px;padding:13px 14px;border:1px solid transparent;border-radius:12px;transition:background .15s,border-color .15s}
.troc-trim-choices>button strong{font-size:12px;font-weight:600;line-height:1.45;letter-spacing:-.01em}
.troc-trim-choices>button span{font-size:11px;line-height:1.4;font-variant-numeric:tabular-nums}
.troc-trim-choices>button i{display:grid;place-items:center;width:22px;height:22px;font-size:12px;border-radius:50%;color:transparent}
.troc-trim-choices>button[aria-pressed=true]{background:#eaf2fc;border-color:#b7d3f1;color:#001e50}
.troc-trim-choices>button[aria-pressed=true] span{color:#335778}
.troc-trim-choices>button[aria-pressed=true] i{background:#001e50;color:#fff}
.troc-trim-choices>button:hover:not([aria-pressed=true]){background:var(--bg);border-color:var(--border)}
.troc-trim-choices>button:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
:root[data-theme=dark] .troc-trim-choices>button[aria-pressed=true]{background:#1d3d60;border-color:#5789b9;color:#e5f0ff}
:root[data-theme=dark] .troc-trim-choices>button[aria-pressed=true] span{color:#b9d4f0}
:root[data-theme=dark] .troc-trim-choices>button[aria-pressed=true] i{background:#a5ceff;color:#001e50}
@media(prefers-reduced-motion:reduce){.troc-trim-choices>button{transition:none}}
@media(max-width:760px){.demo-topbar .troc-trim-picker{width:auto}}

/* Keep the complete car inside phone screens, including both bumpers. */
@media(max-width:760px){
 .troc-reveal-car{left:0;top:25%;width:100%;height:61%;transform:scale(calc(var(--car-scale) * 1.12));transform-origin:50% 42%}
}
@media(max-width:760px) and (prefers-reduced-motion:reduce){.troc-reveal-car{transform:scale(1.12)!important}}
/* The current paint is visible even while its menu is closed. */
.troc-nav-selector:last-child>summary{grid-template-columns:30px minmax(0,1fr) 16px;gap:3px 10px}
.troc-selected-paint{grid-column:1;grid-row:1/3;width:28px;height:28px;align-self:center;border-radius:50%;border:1px solid #001e5040;background:linear-gradient(145deg,#ffffff50,transparent 50%,#0002),var(--paint);box-shadow:inset 0 0 0 1px #ffffff40}
.troc-selected-paint[data-two-tone=true]{background:linear-gradient(145deg,#ffffff40,transparent 55%),linear-gradient(135deg,var(--paint) 60%,var(--roof) 60%)}
.troc-nav-selector:last-child>summary>span:not(.troc-selected-paint){grid-column:2}
.troc-nav-selector:last-child>summary>strong{grid-column:2}
.troc-nav-selector:last-child>summary>i{grid-column:3}
@media(max-width:760px){.troc-nav-selector:last-child>summary{grid-template-columns:22px minmax(0,1fr) 12px;column-gap:7px}.troc-selected-paint{width:21px;height:21px}}
/* Give the desktop headline more space beside the car. */
@media(min-width:761px){.troc-reveal-car{left:32%}}
@media(min-width:761px){.troc-reveal-car{top:6%}}

/* Align the visible vehicle, independently of transparent render margins. */
.troc-reveal-car{display:flex;align-items:center;justify-content:center}
.troc-aligned-render{display:block;width:100%;height:auto;max-width:none;flex:none;transform-origin:50% 50%}