/* MotorMate 2026 / editorial automotive UI, light-first with restrained motion */
:root{--accent:#117c75;--soft:#e7f1ed;--bg:#f5f5f1;--panel:#fff;--panel2:#f8f8f5;--ink:#182324;--muted:#647071;--line:#e1e6e3;--nav:#172223;--navtext:#c0ccca;--shadow:0 5px 25px #1223200b;font-family:Inter,"Segoe UI",ui-sans-serif,system-ui,sans-serif}
body:not(.dark){background:#f5f5f1}body.dark{--accent:#84d1c2;--soft:#1c3838;--bg:#101b1c;--panel:#1a2829;--panel2:#1f3031;--ink:#f3f5ef;--muted:#adbfbc;--line:#354849;--nav:#101a1b;--navtext:#bfcdca;--shadow:0 5px 25px #0002}
body{font-family:Inter,"Segoe UI",ui-sans-serif,system-ui,sans-serif}h1,h2,h3{letter-spacing:-.038em}.main{min-width:0}.content{max-width:1600px;margin-inline:auto}.topbar{border-bottom:1px solid var(--line);background:var(--panel);gap:12px}.topbar .crumb{font-weight:650}.mm-top-links{display:flex;gap:18px;align-items:center}.mm-top-links a{font-size:12px;font-weight:700;color:var(--muted);text-decoration:none;white-space:nowrap;transition:color .2s}.mm-top-links a:hover{color:var(--accent)}.top-explore{background:var(--soft);border-radius:25px;color:var(--accent)!important;padding:10px 13px;text-decoration:none;font-weight:750}.sidebar{background:var(--nav);border-right:none}.navlink{border-radius:9px!important}.navlink:hover,.navlink.active{background:#e4f0eb14!important;color:#e9fff8!important}.navlink.active{box-shadow:inset 3px 0 #62baaa}.nav-label{color:#789390!important;letter-spacing:.13em!important}.brand-icon{background:#c1e5d9!important;color:#1c4844!important;border-radius:12px!important}.brand small{letter-spacing:.09em}.btn{border-radius:9px!important;box-shadow:none!important}.btn:not(.secondary):not(.danger){background:#167a72!important;color:white!important}.btn:hover{transform:translateY(-1px)}.card{border:1px solid var(--line);box-shadow:var(--shadow);border-radius:16px!important}.heading .eyebrow{color:var(--accent)}.stat .number{font-size:clamp(22px,2.4vw,31px)!important}
.mm-home-hero{display:grid;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);background:#172525;color:#fff;border-radius:17px;min-height:440px;overflow:hidden;margin-bottom:14px}.mm-home-copy{padding:clamp(26px,4vw,65px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;position:relative;z-index:1}.mm-eyebrow,.mm-kicker{font-size:10px;font-weight:800;letter-spacing:.15em;line-height:1.6}.mm-eyebrow{color:#b3dacf;display:flex;align-items:center;gap:10px}.mm-line{width:22px;height:1px;background:#89d4bb}.mm-home-copy h1{font-size:clamp(38px,4.3vw,66px);font-weight:740;letter-spacing:-.055em;line-height:1.07;margin:25px 0 20px}.mm-home-copy h1 span{color:#c0e7d9}.mm-home-copy>p{font-size:clamp(14px,1.15vw,16px);color:#d0ded8;line-height:1.75;max-width:520px;margin:0 0 25px}.mm-hero-ctas{display:flex;gap:10px;flex-wrap:wrap}.mm-hero-ctas a{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;text-decoration:none;border-radius:8px;padding:13px 17px;font-weight:760;font-size:13px;transition:transform .25s,background .25s}.mm-hero-ctas a:hover{transform:translateY(-3px)}.mm-cta-solid{background:#d5eddf;color:#14362e}.mm-cta-outline{border:1px solid #6c8680;color:#edf6f2}.mm-home-trust{display:flex;flex-wrap:wrap;gap:12px 22px;font-size:9px;font-weight:750;letter-spacing:.105em;color:#a1bbb2;margin-top:35px}.mm-home-photo{position:relative;overflow:hidden;background:#3c4c4b}.mm-home-photo>img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:45% center;filter:saturate(.65) contrast(1.09);transition:transform 1s}.mm-home-hero:hover .mm-home-photo>img{transform:scale(1.04)}.mm-home-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#172525 0%,#17252500 22%),linear-gradient(0deg,#1323249e,transparent 37%);pointer-events:none}.mm-photo-label{position:absolute;z-index:1;bottom:24px;left:26px;right:24px;display:flex;justify-content:space-between;gap:10px;color:#f0f7f1;font-size:10px;letter-spacing:.09em}.mm-photo-label strong{font-size:11px}
.mm-spotlight-nav{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 42px}.mm-spotlight-nav a{text-decoration:none;display:inline-flex;gap:15px;justify-content:space-between;flex:1 1 auto;align-items:center;border:1px solid var(--line);color:var(--ink);background:var(--panel);border-radius:9px;padding:13px 15px;font-size:12px;font-weight:750;transition:border-color .2s,background .2s,transform .2s}.mm-spotlight-nav a span{color:var(--accent)}.mm-spotlight-nav a:hover{border-color:var(--accent);transform:translateY(-2px);background:var(--soft)}
.mm-section{margin:0 0 52px}.mm-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:19px}.mm-section-head h2{font-size:clamp(25px,2.5vw,38px);line-height:1.14;margin:7px 0 5px;color:var(--ink);letter-spacing:-.048em}.mm-section-head p{color:var(--muted);margin:7px 0 0;font-size:13px}.mm-kicker{color:var(--accent)}.mm-section-link{color:var(--ink);font-size:12px;font-weight:750;border-bottom:1px solid var(--accent);text-decoration:none;white-space:nowrap;padding-bottom:5px}
.mm-task-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.mm-task-card{min-height:215px;background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:22px;display:flex;align-items:flex-start;flex-direction:column;text-decoration:none;color:var(--ink);position:relative;overflow:hidden;transition:transform .23s ease,box-shadow .23s ease,border-color .23s ease}.mm-task-card:hover{transform:translateY(-5px);border-color:#7ab8a6;box-shadow:0 16px 32px #17252517}.mm-task-n{font-size:10px;letter-spacing:.1em;color:var(--muted);font-weight:700}.mm-task-graphic{position:absolute;right:20px;top:17px;font-size:44px;line-height:1;color:#a9d6ca;opacity:.86;font-family:Georgia,serif}.mm-task-card h3{margin:47px 0 7px;font-size:19px;line-height:1.15}.mm-task-card p{font-size:12px;color:var(--muted);max-width:225px;line-height:1.65;margin:0 0 15px}.mm-task-arrow{margin-top:auto;font-size:11px;color:var(--accent);font-weight:800}.mm-task-studio{background:#e3eae3;color:#18302b}.mm-task-studio p,.mm-task-studio .mm-task-n{color:#596c65}.mm-task-studio .mm-task-graphic{color:#4f867a}.mm-task-health{background:#ecf0ec}.mm-task-health .mm-task-n,.mm-task-health p{color:#667571}body.dark .mm-task-studio,body.dark .mm-task-health{background:#273f3a;color:#eef5f0}
.mm-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.mm-metrics a{padding:23px 18px;background:var(--panel);border-radius:12px;border:1px solid var(--line);text-decoration:none;display:flex;flex-direction:column;color:var(--ink);min-width:0}.mm-metrics small{font-size:9px;font-weight:800;color:var(--muted);letter-spacing:.08em}.mm-metrics strong{font-size:clamp(20px,2.25vw,30px);letter-spacing:-.05em;overflow-wrap:anywhere;margin:16px 0 10px}.mm-metrics a>span{font-size:11px;color:var(--accent);font-weight:700}
.mm-reading-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mm-reading-feature{display:flex;flex-direction:column;padding:34px;border-radius:13px;background:#153c37;color:#f5f9f7;text-decoration:none;min-height:260px;transition:transform .25s}.mm-reading-feature:hover{transform:translateY(-3px)}.mm-reading-feature span{font-size:10px;font-weight:800;letter-spacing:.12em;color:#b7e9d8}.mm-reading-feature h3{max-width:420px;font-size:clamp(24px,2.2vw,32px);line-height:1.14;letter-spacing:-.04em;margin:23px 0 9px}.mm-reading-feature p{max-width:410px;line-height:1.65;font-size:12px;color:#d4e4de}.mm-reading-feature b{font-size:12px;margin-top:auto}.mm-reading-secondary{background:#e9e9e3;color:#22302d}.mm-reading-secondary span{color:#59726c}.mm-reading-secondary p{color:#606f6c}.mm-data-section>.grid{margin-top:15px}
body.dark .mm-reading-secondary{background:#263c38;color:#f1f5ef}body.dark .mm-reading-secondary p{color:#bbcdc7}body.dark .mm-reading-secondary span{color:#a7d3c4}
@media(max-width:1460px){.mm-top-links{gap:10px}.mm-top-links a{font-size:11px}}@media(max-width:1270px){.mm-top-links{display:none}.mm-home-hero{min-height:390px}.mm-home-copy{padding:32px}.mm-home-copy h1{font-size:clamp(36px,4.3vw,54px)}}@media(max-width:980px){.mm-home-hero{grid-template-columns:1fr}.mm-home-photo{height:260px}.mm-task-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mm-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.mm-home-copy{padding:27px 22px}.mm-home-copy h1{font-size:38px}.mm-home-photo{height:220px}.mm-home-trust{margin-top:25px}.mm-section{margin-bottom:35px}.mm-section-head{align-items:flex-start}.mm-section-link{font-size:10px}.mm-task-grid{grid-template-columns:1fr 1fr;gap:9px}.mm-task-card{min-height:200px;padding:14px}.mm-task-n{font-size:8px}.mm-task-card h3{font-size:16px;margin-top:49px}.mm-task-card p{font-size:11px}.mm-task-graphic{font-size:30px;top:20px;right:14px}.mm-spotlight-nav{gap:7px;margin-bottom:32px}.mm-spotlight-nav a{flex:1 1 43%;padding:11px;font-size:11px}.mm-reading-grid{grid-template-columns:1fr}.mm-reading-feature{padding:25px;min-height:240px}.mm-metrics{gap:8px}.mm-metrics a{padding:16px 12px}.mm-metrics strong{font-size:19px}}@media(max-width:375px){.mm-task-grid{grid-template-columns:1fr}.mm-task-card{min-height:165px}.mm-task-card h3{margin-top:20px}}
@media(prefers-reduced-motion:reduce){.mm-home-photo>img,.mm-task-card,.mm-spotlight-nav a,.mm-reading-feature{transition:none!important}}
/* MotorMate design refinement: calmer surfaces, responsive workflows and restrained motion */
:root{--accent:#256b61;--soft:#e6f0eb;--bg:#f6f7f4;--panel:#fff;--line:#dfe7e2;--ink:#172b2a;--shadow:0 6px 28px rgba(18,42,38,.055)}
body.dark{--accent:#8ed8c8;--soft:#263b38;--bg:#101a1a;--panel:#192726;--line:#32443e;--ink:#eef5f0}
html{scroll-behavior:smooth;scrollbar-color:#a6bbb4 transparent;scrollbar-width:thin}
*{scrollbar-width:thin;scrollbar-color:#9bb5aa transparent}
*::-webkit-scrollbar{width:9px;height:8px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{border:2px solid transparent;border-radius:100px;background:#a2bdb3;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:#5b897c;background-clip:padding-box}
.sidebar{scrollbar-color:#536f69 #162322;scrollbar-width:thin}
.sidebar::-webkit-scrollbar-thumb{background:#506e65;background-clip:padding-box}
.content{animation:mm-content-enter .32s cubic-bezier(.2,.7,.2,1) both}
@keyframes mm-content-enter{from{opacity:.3;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.card,.btn,.navlink,.mm-spotlight-nav a{transition:border-color .22s ease,background-color .22s ease,box-shadow .22s ease,transform .22s ease}
.card:hover{border-color:color-mix(in srgb,var(--accent) 23%,var(--line))}
.btn:focus-visible,.navlink:focus-visible,.studio-accordion summary:focus-visible,.field input:focus-visible,.field select:focus-visible{outline:3px solid #65b9a6;outline-offset:3px}
.field input,.field select,.field textarea{transition:border-color .2s,box-shadow .2s;max-width:100%}
.mm-home-hero{border-radius:22px;box-shadow:0 16px 36px #183b3320}
.mm-home-copy h1{letter-spacing:-.05em}
.mm-task-card{border-radius:17px;box-shadow:0 7px 24px rgba(20,46,41,.04)}
.mm-task-card:hover{box-shadow:0 17px 33px rgba(20,46,41,.1)}
.studio-info-banner{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin:12px 0 22px;padding:15px 19px;background:var(--soft);border-radius:14px;color:var(--ink);font-size:12px}
.studio-info-banner strong{font-size:13px;margin-right:auto}
.studio-modes{padding:6px;display:flex;flex-wrap:wrap;gap:8px;background:var(--panel2);border:1px solid var(--line);border-radius:14px;width:fit-content}
.studio-modes .btn{margin:0}
.studio-step{display:flex;align-items:flex-start;gap:14px;margin:4px 0 16px}
.studio-step>span,.step-token{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:11px;background:var(--soft);color:var(--accent);font-size:11px;font-weight:800}
.studio-step h2,.studio-step h3{margin:0 0 5px}.studio-step p{margin:0;font-size:12px;line-height:1.65;color:var(--muted)}
.studio-model-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.studio-model-fields .field{min-width:0}
.studio-availability{font-size:12px;line-height:1.65;background:var(--soft);border-left:3px solid var(--accent);border-radius:8px;padding:10px 13px;color:var(--ink);margin:13px 0}
.studio-accordion{border:1px solid var(--line);background:var(--panel);border-radius:13px;margin:11px 0;overflow:hidden}
.studio-accordion>summary{display:flex;align-items:center;gap:12px;list-style:none;cursor:pointer;padding:15px 17px;color:var(--ink)}
.studio-accordion>summary::-webkit-details-marker{display:none}
.studio-accordion summary b{display:block;font-size:14px;line-height:1.5}
.studio-accordion summary small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.studio-accordion .chevron{margin-left:auto;color:var(--muted);transition:transform .2s}
.studio-accordion[open] .chevron{transform:rotate(180deg)}
.studio-accordion-body{padding:5px 17px 18px;border-top:1px solid var(--line)}
.studio-accordion-body>.field:first-child{margin-top:13px}
.model-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:35px 24px;min-height:385px;background:radial-gradient(circle at 50% 30%,#3b6c6334,transparent 55%),linear-gradient(150deg,#1b3230,#102120);color:#edf5f1;border-radius:15px}
.model-empty-icon{width:64px;height:64px;border:1px solid #7ab2a44a;border-radius:18px;display:grid;place-items:center;color:#9bd6be;background:#94d5bc15;font-size:29px;margin-bottom:16px}
.model-empty h3{font-size:clamp(21px,2.5vw,30px);margin:8px 0;line-height:1.2;color:white}
.model-empty p{color:#c1d1c9;max-width:440px;font-size:13px;line-height:1.75;margin:0 auto 21px}
.studio-kicker{font-size:10px;color:#a6ccbd;letter-spacing:.17em;font-weight:800}
.model-empty-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.model-empty-actions .btn{cursor:pointer}
.real3d-stage{min-height:400px;position:relative}.real3d-stage model-viewer{display:block;width:100%;height:430px}
.real3d-error{padding:14px;border-radius:9px;background:#fff4e5;color:#7c451f;font-size:13px;line-height:1.6}
.tool-clean-layout{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(0,1.3fr);gap:17px;align-items:start}
.tool-clean-layout .card{min-width:0}.tool-links{display:flex;flex-wrap:wrap;gap:8px}
.tool-links .btn{white-space:normal;text-align:left}
@media(max-width:1100px){.studio-model-fields{grid-template-columns:1fr 1fr}.tool-clean-layout{grid-template-columns:1fr}}
@media(max-width:650px){.studio-model-fields{grid-template-columns:1fr}.studio-modes{width:100%}.studio-modes .btn{flex:1 1 auto}.model-empty{min-height:360px;padding:22px 15px}.model-empty-actions .btn{font-size:12px}.studio-info-banner{gap:7px}.studio-info-banner strong{flex-basis:100%}.tool-clean-layout{gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.content{animation:none!important}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
.page-help{background:var(--soft);border-radius:12px;margin:2px 0 20px;border:1px solid color-mix(in srgb,var(--accent) 10%,var(--line));overflow:hidden}
.page-help summary{list-style:none;padding:12px 17px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:var(--ink);font-size:12px;font-weight:750}
.page-help summary::-webkit-details-marker{display:none}
.page-help-arrow{transition:transform .2s;color:var(--accent)}.page-help[open] .page-help-arrow{transform:rotate(180deg)}
.page-help-content{padding:0 17px 15px;color:var(--ink)}.page-help-content strong{font-size:13px}.page-help-content p{font-size:13px;margin:6px 0;line-height:1.6}.page-help-content small{font-size:11px;color:var(--muted)}
.studio-model-fields .field:has(#custom-manualModel){grid-column:1/-1}