/* MotorMate visual system refresh: local imagery and a unified design across every tool. */
:root{--accent:#1268d8;--accent2:#12a8a0;--panel:#fff;--line:#e0e7f1;--muted:#64748b;--ink:#152238;--soft:#eff6ff}
body{background:#f6f8fc!important;color:#17243b!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif!important}
body.dark{--accent:#60a5fa;--accent2:#2dd4bf;--panel:#172437;--line:#34445a;--muted:#a7b6ca;--ink:#ecf4ff;--soft:#1f344e;background:#0c1422!important;color:#ecf4ff!important}
html{scrollbar-color:#b7c8df transparent;scrollbar-width:thin}*{scrollbar-width:thin;scrollbar-color:#b7c8df transparent}*::-webkit-scrollbar{width:7px;height:7px}*::-webkit-scrollbar-thumb{background:#b7c8df;border-radius:30px}
.content{max-width:1580px;margin:auto;width:100%;padding-top:28px!important;padding-bottom:65px!important}
.topbar{background:rgba(255,255,255,.96)!important;border-bottom:1px solid #e7edf6!important;box-shadow:0 3px 24px #17263d08;backdrop-filter:blur(14px)}
body.dark .topbar{background:rgba(18,30,48,.96)!important;border-color:#33445c!important}
.top-brand-mark{color:#1368df!important}.top-brand-mark span{color:#0daaa3!important}.top-brand,.main-links a{color:var(--ink)!important}
.main-links a.current{background:#ebf4ff!important;color:#1163d1!important;border-radius:10px}.main-links a:hover{color:#1474e5!important}
.all-menu-btn,.theme-icon{border-radius:12px!important}.all-menu-btn{background:#1668d7!important;color:#fff!important;border-color:#1668d7!important}
.card,.primary-task,.secondary-task,.feature-tile,.vehicle-type-tile,.studio-kind-picker{border-color:var(--line)!important;background:var(--panel)!important;border-radius:18px!important;box-shadow:0 7px 27px #10274709!important}
.card{padding:clamp(18px,2.2vw,30px)!important}.card h2,.card h3{letter-spacing:-.035em}.card h2{font-size:clamp(19px,2vw,25px)!important}
.card:hover{border-color:#c8d7ea!important}.section{margin-top:25px}
.mm-page-banner{min-height:235px;position:relative;display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(220px,.75fr);align-items:center;overflow:hidden;border-radius:26px!important;background:linear-gradient(118deg,#e9f3ff 0%,#f8fbff 62%,#deecfa 100%)!important;border:1px solid #dbe8f6!important;margin-bottom:22px;padding:0!important;isolation:isolate}
.mm-banner-copy{padding:clamp(26px,4vw,54px);position:relative;z-index:2;min-width:0}
.mm-page-banner .eyebrow{color:#1165cc!important;letter-spacing:.14em;font-size:11px!important;font-weight:850!important}
.mm-page-banner h1{font-size:clamp(29px,3.25vw,48px)!important;letter-spacing:-.055em!important;line-height:1.1!important;max-width:760px;overflow-wrap:break-word;margin:11px 0 13px!important;color:#132d4f!important}
.mm-page-banner p{max-width:660px;line-height:1.65!important;color:#4d647f!important;font-size:clamp(13px,1.1vw,16px)!important;margin:0!important}
.mm-banner-action{margin-top:20px;display:flex;gap:10px;flex-wrap:wrap}
.mm-banner-art{height:100%;min-height:235px;position:relative;overflow:hidden;background:linear-gradient(145deg,#d9ecff,#bed6ea)}
.mm-banner-art:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#e9f3ff 0%,#e9f3ff00 40%);pointer-events:none}
.mm-banner-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.mm-page-banner:hover .mm-banner-art img{transform:scale(1.045)}
.mm-banner-art img[src$=".svg"]{object-fit:contain;padding:18px;background:radial-gradient(circle at center,#daeaff,#bed6f5)}
.page-help{background:var(--panel)!important;border:1px solid var(--line)!important;border-radius:14px!important;margin-top:0!important;margin-bottom:22px!important}
.page-help summary{font-weight:750;color:var(--ink)!important}
input,textarea,select{max-width:100%;min-width:0}.field input,.field select,.field textarea{border-radius:11px!important;border:1px solid #d3deec!important;background:var(--panel)!important;color:var(--ink)!important;min-height:46px}.field input:focus,.field select:focus,.field textarea:focus{border-color:#3186eb!important;box-shadow:0 0 0 3px #3186eb22!important}
.btn{border-radius:11px!important;font-weight:750!important;transition:transform .2s,box-shadow .2s,background .2s!important}.btn:hover{transform:translateY(-2px);box-shadow:0 9px 18px #0a3e7922}.btn:not(.secondary):not(.danger){background:linear-gradient(130deg,#1668d7,#0e82db)!important;color:white!important}
.grid,.twocol{min-width:0}.grid>*{min-width:0}.form-grid>*{min-width:0}.table-wrap{max-width:100%;overflow-x:auto}
.editorial-hero{border-radius:26px!important;background:linear-gradient(120deg,#0c2845,#153b62)!important;color:#fff!important;min-height:470px!important;overflow:hidden}
.editorial-hero h1,.editorial-hero h1 em{color:#fff!important}.editorial-hero h1 em{color:#62d5ec!important}.editorial-hero-copy>p{color:#d9e8f4!important}.hero-proof{color:#bed5e9!important}.hero-overline{color:#b2e9fa!important}
.editorial-art{background:#0b2038!important}.editorial-art img{object-fit:cover!important;width:100%!important;height:100%!important;filter:saturate(1.1);animation:mm-hero-drift 9s ease-in-out infinite alternate}
.editorial-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#153b62,#153b6200 52%);pointer-events:none}
@keyframes mm-hero-drift{from{transform:scale(1.02)}to{transform:scale(1.11) translateX(-1.5%)}}
.primary-task{position:relative;overflow:hidden!important;min-height:290px!important;isolation:isolate}
.primary-task:before{content:"";position:absolute;inset:0 0 auto 0;height:115px;background-size:cover;background-position:center;opacity:.92;z-index:-1}
.primary-task[href="#/fuel-trip"]:before{background-image:url('photography/road-trip.jpg')}
.primary-task[href="#/customizer"]:before{background-image:url('photography/custom-wrap.jpg')}
.primary-task[href="#/maintenance"]:before{background-image:url('photography/touring-suv.jpg')}
.primary-task-top{margin-top:94px!important}.primary-icon{background:#edf5ff!important;color:#1266ce!important}.task-cta{color:#116ad3!important}
.secondary-task:hover,.primary-task:hover,.feature-tile:hover,.vehicle-type-tile:hover{transform:translateY(-5px)!important;box-shadow:0 19px 40px #123a671b!important}
.vehicle-type-tile img{object-fit:contain;background:#e9f4ff!important;transition:transform .5s}.vehicle-type-tile:hover img{transform:scale(1.06)}
.section-heading h2,.reading-section h2{font-family:inherit!important;font-weight:850;letter-spacing:-.04em}
.editorial-insight{background:#e9f1fd!important;color:#173455!important}.insight-stats a{background:#fff!important}.insight-stats strong{color:#1159b1!important}
.reading-feature{background:#10345a!important}.reading-side{background:#e1edf9!important}
.welcome-editorial{background:#07172a!important}.mm-welcome-photo{position:absolute;inset:0;background:url('photography/sport-coupe.jpg') center 60%/cover no-repeat;opacity:.45;animation:mm-welcome-zoom 2s ease-out both}.mm-welcome-shine{position:absolute;inset:0;background:linear-gradient(90deg,#07172af2 0%,#07172a9c 52%,#07172a65)}
.welcome-editorial-inner{margin-right:auto;margin-left:clamp(20px,7vw,100px);text-align:left!important;max-width:560px!important}.welcome-editorial h2{font-family:inherit!important;font-weight:850!important;letter-spacing:-.065em!important}.welcome-subtitle{color:#8fd9ff!important}.welcome-wordmark span{color:#52d9d2!important}.welcome-progress{margin-left:0!important;background:#42607d!important}.welcome-progress span{background:#40cee2!important}.welcome-editorial p{color:#ddeaf9!important}.welcome-enter{background:#ffffff!important;color:#0d2a47!important;border-color:#fff!important;border-radius:10px!important;padding:13px 21px!important}
@keyframes mm-welcome-zoom{from{transform:scale(1.18);filter:blur(9px)}to{transform:scale(1);filter:blur(0)}}
.content>.heading,.content>.section,.content>.grid,.content>.twocol{animation:mm-page-enter .42s cubic-bezier(.2,.8,.2,1) both}
@keyframes mm-page-enter{from{opacity:.4;transform:translateY(13px)}to{opacity:1;transform:none}}
body.dark .mm-page-banner{background:linear-gradient(120deg,#172943,#1e3853)!important;border-color:#324b67!important}body.dark .mm-page-banner h1{color:#f1f7ff!important}body.dark .mm-page-banner p{color:#c2d4e9!important}body.dark .mm-banner-art:before{background:linear-gradient(90deg,#1e3853,#1e385300 40%)}body.dark .mm-page-banner .eyebrow{color:#72bcff!important}body.dark .editorial-insight{background:#1a344f!important}body.dark .insight-stats a{background:#244565!important}body.dark .insight-stats strong{color:#d2ecff!important}body.dark .card,body.dark .primary-task,body.dark .secondary-task{color:#ecf4ff!important}body.dark .reading-side{background:#243d57!important;color:#eef6ff!important}
@media(max-width:1000px){.mm-page-banner{grid-template-columns:minmax(0,1fr) 34%}.mm-banner-art{min-height:210px}}
@media(max-width:700px){.mm-page-banner{grid-template-columns:1fr!important;min-height:0}.mm-banner-copy{padding:25px 23px}.mm-banner-art{min-height:165px;height:175px}.mm-banner-art:before{background:linear-gradient(180deg,#e9f3ff 0%,transparent 55%)}.mm-page-banner h1{font-size:clamp(29px,8vw,40px)!important}.content{padding:16px 14px 45px!important}.editorial-hero{min-height:0!important}.primary-task{min-height:270px!important}.mm-welcome-photo{background-position:62% center}.welcome-editorial-inner{margin:0 20px!important;max-width:92%!important}}
@media(prefers-reduced-motion:reduce){.content>.heading,.content>.section,.content>.grid,.content>.twocol,.editorial-art img,.mm-welcome-photo{animation:none!important}}
