/* EV Studio: a small front door for two independent engineering experiences. */
body[data-mode=studio],body[data-mode=tools]{overflow:auto;position:static;background:#080e14}
.studio-page{min-height:100svh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 80% 0,#20344477,transparent 60%),#080e14}
.studio-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:32px 5vw;border-bottom:1px solid #b8d7e514}
.studio-header .hedin-logo{width:200px;height:auto;display:block}
.studio-tools{display:inline-flex;gap:10px;align-items:center;color:#cbdce6;font-size:12px;text-decoration:none;min-height:44px;white-space:nowrap}
.studio-tools svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.5}
.studio-main{width:min(1200px,90%);margin:0 auto;padding:55px 0 30px;flex:1}
.studio-intro{margin-bottom:36px}.studio-intro h1,.tools-main h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(38px,4vw,64px);line-height:1.1;letter-spacing:-1.6px;margin:19px 0 16px}
.studio-intro p,.tools-intro{color:#acbecb;font-size:15px;line-height:1.7;margin:0}
.studio-cars{display:grid;grid-template-columns:1fr 1fr;gap:26px}.car-card{min-width:0;background:#101d28;border:1px solid #c7e5ed26;border-radius:8px;overflow:hidden}
.car-photo{position:relative;display:block;overflow:hidden;aspect-ratio:16/9;background:#223443}.car-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}.car-photo:hover img{transform:scale(1.025)}
.car-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 65%,#08121bd9)}.car-photo>span{position:absolute;bottom:19px;left:26px;z-index:1;font-size:9px;letter-spacing:1.8px;color:#e1eef6}
.car-card-copy{padding:24px 26px 26px}.car-card h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:34px;letter-spacing:-.5px;margin:0 0 10px}.car-card p{font-size:12px;color:#aebfca;margin:0 0 24px;line-height:1.6}
.car-card .button{width:100%;display:flex;justify-content:space-between;font-size:12px;min-height:53px;text-decoration:none;padding:15px 20px}
.button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.brand-header>.studio-tools{margin-left:auto}.welcome-copy{right:auto}.welcome-actions #welcome-activities{border:1px solid #bcdce33d;background:#10202cb8;padding:14px 20px}
.studio-help{display:flex;align-items:center;justify-content:center;gap:13px;margin:29px 0 0;color:#aebfca}.studio-help svg{width:18px;height:18px;stroke:#9feaf2;fill:none;stroke-width:1.5;flex:none}.studio-help p{font-size:12px;line-height:1.7;margin:0}
.studio-footer{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:22px 5vw;font-size:10px;color:#7e94a5;line-height:1.6;border-top:1px solid #b8d7e514}.studio-footer a{color:#b2c9d6;text-underline-offset:4px}
.tools-main{width:min(850px,90%);margin:0 auto;padding:44px 0 50px;flex:1}.back-link{display:inline-block;margin:0 0 30px;color:#bacbd7;font-size:12px;text-decoration:none;min-height:32px}.tool-list{margin:34px 0 25px;display:grid;gap:14px}
.tool-card{display:flex;gap:26px;padding:26px;border:1px solid #c7e5ed26;background:#12233080;border-radius:7px;text-decoration:none;color:inherit}.tool-card:hover{background:#1b3343}.tool-number{font-size:12px;letter-spacing:1px;color:#93dce7;padding-top:5px}.tool-card h2{font-family:Georgia,'Times New Roman',serif;font-size:27px;font-weight:400;margin:0 0 12px}.tool-card p{font-size:13px;color:#b2c5d2;line-height:1.7;margin:0 0 15px}.tool-card div>span{font-size:11px;color:#aceaf1}
#welcome{display:flex;flex-direction:column;min-height:760px;height:auto;min-height:100svh}.brand-header{position:relative;z-index:1}.welcome-copy{position:relative;top:auto;bottom:auto;left:auto;transform:none;margin:auto 0 0;padding:80px 6vw 32px;max-width:720px}.welcome-copy h1{font-size:clamp(48px,5vw,78px)}.welcome-actions{display:grid;grid-template-columns:minmax(240px,340px);gap:10px}.welcome-actions .button{justify-content:space-between;min-height:48px}.welcome-actions #welcome-exterior{border:0;justify-content:flex-start;padding-left:0;min-height:35px;font-size:11px}.welcome-footer{position:relative;margin-top:20px;z-index:1}.welcome-footer .welcome-format{color:#bad5e2!important;text-underline-offset:5px}.welcome-copy .camera-note{margin-top:16px}.back-button svg{transform:none!important}
#highlights-activities{border-top:1px solid var(--line);margin:0 26px 30px}#highlights-activities>summary{display:flex;align-items:center;justify-content:space-between;padding:22px 0;color:var(--accent);font-size:16px;cursor:pointer;list-style:none;gap:18px}#highlights-activities>summary::-webkit-details-marker{display:none}#highlights-activities>summary span{font-size:24px}#highlights-activities[open]>summary span{transform:rotate(45deg)}
.activity-intro{padding:15px 18px;border-left:2px solid #9feaf2;background:#9feaf20a;font-size:13px!important;color:#d5e6ee!important;line-height:1.65}.activity-progress{font-size:10px!important;color:#9edee8!important;letter-spacing:1px;margin:20px 0}.activity-card{padding:22px 0;border-top:1px solid var(--line)}.activity-heading{display:flex;align-items:baseline;gap:13px}.activity-number{color:#96dce9;font-size:10px;letter-spacing:1px}.activity-heading h3{font-family:Georgia,'Times New Roman',serif;font-size:24px;margin:0!important;font-weight:400}.activity-card p,.activity-card li{font-size:13px;color:#b9ccd9;line-height:1.7}.activity-card ol{padding-left:20px;margin:15px 0}.activity-card li+li{margin-top:10px}.activity-check{display:inline-flex;gap:10px;align-items:center;color:#d2e6ed;font-size:12px;min-height:44px;cursor:pointer}.activity-check input{height:19px;width:19px;accent-color:#9feaf2}.activity-card:has(input:checked) .activity-number{background:#9feaf21c;border-radius:4px;padding:3px}
.detail-options{position:absolute;top:12px;left:50%;transform:translateX(-50%);display:flex;border:1px solid var(--line);border-radius:6px;background:#0a1b28ed;z-index:2;white-space:nowrap}.detail-options button{min-height:44px;padding:10px 17px;color:#aec2d1;font-size:11px}.detail-options button.active{background:#9feaf21c;color:#b1f5ff}.detail-options button+button{border-left:1px solid var(--line)}
#info-panel[data-component=transmission] #detail-scene,#info-panel[data-component=transmission] #detail-labels,#info-panel[data-component=thermal] #detail-scene,#info-panel[data-component=thermal] #detail-labels{top:65px}
body[data-car=cla] #topic-nav{overflow-x:auto;justify-content:flex-start;scrollbar-width:thin;padding-bottom:3px}body[data-car=cla] #topic-nav button{flex:none}
body[data-car=cla] .spec-table{min-width:620px}
@media(max-width:700px){
.studio-header{padding:18px 6vw}.studio-header .hedin-logo{width:154px}.studio-tools{font-size:10px;gap:7px}.studio-main{width:88%;padding:32px 0 26px}.studio-intro{margin-bottom:26px}.studio-intro .eyebrow{font-size:8px;line-height:1.7;letter-spacing:1.4px}.studio-intro h1{max-width:330px;letter-spacing:-1px;font-size:42px;line-height:1.05}.studio-intro p{font-size:13px}.desktop-break{display:none}.studio-cars{grid-template-columns:1fr;gap:23px}.car-card-copy{padding:21px}.car-card h2{font-size:30px}.car-card p{font-size:11px;margin-bottom:19px}.car-photo>span{left:21px;bottom:16px;font-size:8px}.car-card .button{font-size:11px;padding-inline:14px}.studio-help{align-items:flex-start;margin-top:25px;gap:10px}.studio-help svg{margin-top:3px}.studio-help p{font-size:11px}.studio-footer{font-size:9px;padding:20px 6vw;gap:12px}.tools-main{width:88%;padding:28px 0 35px}.tools-main h1{font-size:43px}.tools-main>.eyebrow{font-size:8px;letter-spacing:1.5px}.tools-intro{font-size:13px}.tool-card{gap:16px;padding:22px 18px}.tool-card h2{font-size:25px}.tool-card p{font-size:12px}.tool-number{font-size:10px}
#welcome{min-height:100svh}.brand-header{padding:20px 22px;background:linear-gradient(#08131dd9,transparent)}.brand-header .edition{display:none}.brand-header .hedin-logo{width:153px}.welcome-image{height:340px;object-position:60% 50%}.welcome-shade{background:linear-gradient(0deg,#080c10 40%,#080c10ee 52%,#080c1000 80%)}.welcome-copy{padding:225px 24px 15px;margin:0;max-width:none}.welcome-copy .eyebrow{font-size:8px;letter-spacing:1.7px}.welcome-copy h1{font-size:49px;margin:17px 0}.welcome-copy>p{font-size:13px}.welcome-actions{grid-template-columns:1fr;gap:9px;margin-top:22px;max-width:420px}.welcome-actions .button{min-height:49px;font-size:12px}.welcome-actions #welcome-exterior{min-height:33px}.welcome-copy .camera-note{font-size:9px}.welcome-footer{padding:18px 24px;gap:16px;flex-wrap:wrap;margin-top:auto}.welcome-footer>span:first-child{display:none}.welcome-footer .text-button{font-size:10px}.welcome-footer .welcome-format{font-size:8px}
body[data-car=cla] #topic-nav{width:100%;gap:6px}body[data-car=cla] #topic-nav button{width:76px;white-space:normal;font-size:9px}#highlights-activities{margin:0 20px 25px}#highlights-activities>summary{font-size:14px}.activity-heading h3{font-size:23px}.activity-card p,.activity-card li{font-size:12px}.detail-options{top:7px}.detail-options button{font-size:10px;padding:10px 12px}
}
@media(orientation:landscape) and (max-height:600px){
.welcome-actions #welcome-activities{display:flex}
.studio-header{padding:16px 5vw}.studio-main{padding-top:24px}.studio-intro h1{font-size:42px}.studio-cars{grid-template-columns:1fr 1fr}.car-card-copy{padding:18px}.car-card h2{font-size:28px}.car-card .button{font-size:10px;padding:12px}.car-card p{font-size:10px}
#welcome{min-height:510px}.welcome-image{height:100%}.welcome-copy{padding:20px 6vw 15px;max-width:500px}.welcome-copy h1{font-size:45px;margin:12px 0}.welcome-copy .eyebrow{font-size:8px}.welcome-actions{margin-top:12px;gap:7px}.welcome-actions .button{min-height:42px;font-size:11px}.welcome-actions #welcome-exterior{display:none}.welcome-footer{margin-top:auto;padding:10px 6vw}.brand-header .edition{display:none}
body[data-car=cla] #topic-nav{width:calc(100vw - 240px);max-width:calc(100vw - 240px)}body[data-car=cla] #topic-nav button{min-height:38px;width:auto;flex-direction:row;font-size:9px;padding:8px 10px;white-space:nowrap}.detail-options{top:3px}.detail-options button{min-height:36px;padding:8px 12px;font-size:10px}#info-panel[data-component=transmission] #detail-scene,#info-panel[data-component=transmission] #detail-labels,#info-panel[data-component=thermal] #detail-scene,#info-panel[data-component=thermal] #detail-labels{top:47px}
}
@media(prefers-reduced-motion:reduce){.car-photo img{transition:none}.car-photo:hover img{transform:none}}
