/* MotorMate clarity repair — source-preserving layout update, 2026-11-04 */
:root{--mm-ref-lime:#6af54d;--mm-ref-forest:#06462f;--mm-ref-page:#f7f9fb}
html{scroll-padding-top:84px}
body{overflow-x:hidden}
.main,.layout,.content{min-width:0}
.topbar{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:clamp(8px,1.2vw,18px)!important;min-height:76px!important;height:76px!important;padding:0 clamp(14px,2.4vw,42px)!important;overflow:visible!important}
.top-brand{flex:0 0 auto!important;min-width:0!important;margin:0!important;gap:8px!important}
.top-brand-mark{font-size:34px!important}
.top-brand>span:last-child{font-size:clamp(19px,1.5vw,25px)!important;letter-spacing:-.045em!important;white-space:nowrap!important}
.top-brand small{font-size:8px!important;letter-spacing:.075em!important}
.main-links{display:flex!important;flex:0 1 auto!important;gap:2px!important;margin:0!important;min-width:0!important;height:auto!important;align-items:center!important}
.main-links a{font-size:clamp(12px,.9vw,14px)!important;padding:11px clamp(9px,1.1vw,17px)!important;height:42px!important;min-width:0!important;white-space:nowrap!important;font-weight:750!important;line-height:1!important;flex-shrink:0}
.main-links a.current{border-radius:28px!important;background:#064d34!important;color:#fff!important}
.main-links a.current:after{display:none!important}
.header-actions{flex:0 1 auto!important;min-width:0!important;gap:8px!important;margin-left:0!important;overflow:visible!important}
.header-actions .search-wrap{width:clamp(120px,13vw,192px)!important;min-width:0!important;flex:0 1 auto!important}
.header-actions .search-top{font-size:12px!important;text-overflow:ellipsis!important}
.header-actions select{width:clamp(94px,10vw,149px)!important;max-width:149px!important;min-width:0!important;white-space:nowrap!important;text-overflow:ellipsis!important;font-size:12px!important}
.theme-icon{width:38px!important;height:40px!important;flex:0 0 38px!important;border-radius:50%!important}
.all-menu-btn{flex:0 0 auto!important;max-width:155px!important;white-space:nowrap!important;border-radius:25px!important;padding:12px 13px!important;font-size:12px!important}
.all-menu-btn span:last-child{font-size:12px!important}
/* Hero composition: stable text region, entire car visible with no oversized cropped mesh. */
.content:has(.mm-reference-home){padding:0 0 70px!important;animation:none!important;transform:none!important}
.mm-reference-home{overflow:clip!important;background:#f8fafb!important}
.mm-ref-hero{height:auto!important;min-height:490px!important;max-height:none!important;display:flex!important;align-items:center!important;isolation:isolate!important;overflow:hidden!important;background:#09232a!important}
.mm-ref-hero-ambient{inset:0!important;background:linear-gradient(90deg,#071e25 0%,#071e25ed 30%,#071e2560 65%,#071e2530 100%),url('cinematic/road-scenic.webp') right center/cover no-repeat!important;filter:none!important}
.mm-ref-hero-car{top:0!important;bottom:0!important;right:0!important;width:55%!important;height:100%!important;background:url('cinematic/road-scenic.webp') center center/cover no-repeat!important;animation:mmCarEnter .9s both!important;opacity:1!important}
.mm-ref-hero-shadow{background:linear-gradient(90deg,#071b23 0%,#071b23f8 30%,#071b23dc 42%,#071b2385 60%,transparent 82%),linear-gradient(0deg,#05192290,transparent 48%)!important}
.mm-ref-hero-content{width:59%!important;max-width:810px!important;padding:52px clamp(24px,5.1vw,88px)!important;position:relative!important;flex:none!important;animation:mmContentEnter .6s both!important}
.mm-ref-overline{font-size:11px!important;letter-spacing:.15em!important;line-height:1.35!important}
.mm-ref-hero h1{font-size:clamp(37px,3.7vw,62px)!important;line-height:1.10!important;letter-spacing:-.05em!important;margin:14px 0 15px!important;color:#fff!important;max-width:740px!important;font-weight:850!important;overflow-wrap:normal!important;text-wrap:balance!important}
.mm-ref-hero h1 em,.mm-ref-hero h1 span{color:var(--mm-ref-lime)!important}
.mm-ref-hero-content>p{font-size:clamp(13px,1.12vw,16px)!important;max-width:535px!important;line-height:1.6!important;margin:0!important;color:#e3f0ed!important}
.mm-ref-cta{margin:21px 0 19px!important;gap:10px!important}
.mm-ref-cta a{font-size:13px!important;padding:12px 19px!important;border-radius:30px!important;line-height:1.3!important}
.mm-ref-benefits{font-size:11px!important;gap:10px 17px!important}
.mm-ref-hero-spotlight{right:3.2%!important;bottom:52px!important;max-width:235px!important}
/* One visual row at desktop, 4x2 on narrower screens: no stacked pill blow-up. */
.mm-ref-quick{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:10px!important;margin:-33px clamp(18px,3.2vw,65px) 30px!important;position:relative!important;z-index:3!important}
.mm-ref-quick-card{flex-direction:column!important;align-items:flex-start!important;min-width:0!important;min-height:102px!important;padding:12px!important;gap:6px!important;border-radius:16px!important;overflow:hidden!important;box-shadow:0 10px 28px #0b223522!important}
.mm-ref-quick-card strong{font-size:clamp(11px,.85vw,13px)!important;line-height:1.28!important;overflow-wrap:anywhere!important;font-weight:800!important}
.mm-ref-quick-icon{font-size:20px!important;line-height:1!important}
.mm-ref-quick-arrow{font-size:15px!important;align-self:flex-end!important;line-height:1!important}
.mm-ref-showcase,.mm-ref-smalltools,.mm-ref-types,.mm-ref-trip-banner,.mm-ref-guides,.mm-ref-localnote{margin-left:clamp(18px,3.2vw,65px)!important;margin-right:clamp(18px,3.2vw,65px)!important}
.mm-ref-showcase{grid-template-columns:1.12fr 1fr!important;gap:16px!important}
.mm-ref-studio{min-height:330px!important}
.mm-ref-studio h2{font-size:clamp(25px,2.5vw,40px)!important;max-width:510px!important}
.mm-ref-feature-stack{gap:14px!important}
.mm-ref-feature{min-height:155px!important}
.mm-ref-feature-text{padding:16px 20px!important}
.mm-ref-feature h3{font-size:clamp(17px,1.5vw,23px)!important}
.mm-ref-section-head h2{overflow-wrap:break-word!important;text-wrap:balance!important}
.mm-ref-mini,.mm-ref-quick-card,.mm-ref-feature,.mm-ref-guide,.mm-ref-type{outline:0!important}
.mm-reference-home a:focus-visible{outline:2px solid #54d339!important;outline-offset:2px!important}
/* Responsive header progressively reduces density instead of cropping links. */
@media(max-width:1500px){.main-links a:nth-child(5){display:none!important}.header-actions .search-wrap{width:140px!important}.topbar{gap:10px!important}}
@media(max-width:1250px){.main-links a:nth-child(4){display:none!important}.header-actions .search-wrap{display:none!important}.mm-ref-quick{grid-template-columns:repeat(4,minmax(0,1fr))!important;margin-top:-27px!important}.mm-ref-quick-card{flex-direction:row!important;align-items:center!important;min-height:76px!important}.mm-ref-quick-card strong{font-size:13px!important}.mm-ref-quick-arrow{margin-left:auto!important}.mm-ref-hero-content{width:65%!important}.mm-ref-hero-car{width:58%!important}}
@media(max-width:980px){.main-links{display:none!important}.header-actions{margin-left:auto!important}.header-actions .search-wrap{display:block!important;width:170px!important}.mm-ref-hero-content{width:75%!important}.mm-ref-hero-car{width:68%!important;opacity:.80!important}.mm-ref-hero h1{font-size:clamp(37px,5vw,54px)!important}.mm-ref-showcase{grid-template-columns:1fr!important}.mm-ref-feature-stack{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:auto!important}.mm-ref-hero-spotlight{display:none!important}}
@media(max-width:680px){.topbar{height:68px!important;min-height:68px!important;padding:0 13px!important;gap:8px!important}.top-brand>span:last-child{font-size:19px!important}.top-brand small{font-size:7px!important}.top-brand-mark{font-size:28px!important}.header-actions .search-wrap,.header-actions select{display:none!important}.all-menu-btn{padding:10px!important;max-width:none!important}.all-menu-btn span:last-child{display:none!important}.theme-icon{width:34px!important;height:35px!important;flex-basis:34px!important}.mm-ref-hero{min-height:595px!important;align-items:flex-start!important}.mm-ref-hero-ambient{background:linear-gradient(180deg,#071b23 0%,#071b23ee 44%,#071b2390 68%,#071b2315 100%),url('cinematic/road-scenic.webp') center bottom/auto 60% no-repeat!important}.mm-ref-hero-car{height:45%!important;width:100%!important;top:auto!important;bottom:0!important;right:0!important;background-size:cover!important;background-position:50% 35%!important;opacity:.85!important}.mm-ref-hero-shadow{background:linear-gradient(180deg,#071b23 0%,#071b23fc 36%,#071b2387 61%,transparent 89%)!important}.mm-ref-hero-content{width:100%!important;max-width:none!important;padding:32px 20px 20px!important}.mm-ref-overline{font-size:9px!important}.mm-ref-hero h1{font-size:clamp(34px,9vw,48px)!important;margin:13px 0!important;line-height:1.09!important}.mm-ref-hero-content>p{font-size:13px!important;line-height:1.55!important}.mm-ref-cta{margin:18px 0 16px!important;gap:8px!important}.mm-ref-cta a{padding:11px 14px!important;font-size:11px!important}.mm-ref-benefits{font-size:10px!important;gap:6px 12px!important}.mm-ref-quick{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:-22px 12px 27px!important}.mm-ref-quick-card{min-height:72px!important;padding:10px!important;gap:8px!important}.mm-ref-quick-card strong{font-size:11px!important}.mm-ref-quick-icon{font-size:17px!important}.mm-ref-showcase,.mm-ref-smalltools,.mm-ref-types,.mm-ref-trip-banner,.mm-ref-guides,.mm-ref-localnote{margin-left:13px!important;margin-right:13px!important}.mm-ref-feature-stack{grid-template-columns:1fr!important}.mm-ref-studio{min-height:320px!important}.mm-ref-feature{min-height:157px!important}.mm-ref-smalltools{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(prefers-reduced-motion:reduce){.mm-ref-hero-content,.mm-ref-hero-car,.mm-ref-hero-spotlight{animation:none!important}}