/* Treadwell Tyres. Industrial dashboard, forest green. Big Shoulders Display + Schibsted Grotesk */
:root{
  --ground:#e7ebe6; --surface:#ffffff; --panel:#12201a; --panel2:#1a2d24; --forest:#1e4d33; --forest2:#2b6a47;
  --yellow:#f2c230; --ink:#0f1a14; --muted:#4f5c54; --line:rgba(15,26,20,.14); --lined:rgba(233,239,233,.14);
  --hd:'Big Shoulders Display', Impact, sans-serif; --bd:'Schibsted Grotesk', system-ui, sans-serif;
  --r:10px; --wrap:1280px;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:130px}
body{margin:0;background:var(--ground);color:var(--ink);font:400 16px/1.6 var(--bd);overflow-x:clip;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;background-attachment:fixed}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--hd);font-weight:800;line-height:.98;margin:0 0 .45em;text-transform:uppercase;letter-spacing:.005em}
h1{font-size:clamp(2.6rem,6vw,5rem)}
h2{font-size:clamp(2rem,4vw,3.3rem)}
h3{font-size:1.5rem;font-weight:700}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:12px;top:-60px;z-index:300;background:var(--yellow);color:var(--ink);padding:10px 16px;border-radius:6px}
.skip:focus{top:60px}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lbl{display:block;font:700 .72rem/1.3 var(--bd);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.code{font:700 .78rem/1.3 var(--bd);letter-spacing:.16em;text-transform:uppercase;color:var(--forest);margin-bottom:12px;display:flex;align-items:center;gap:10px}
.code::before{content:"";width:22px;height:6px;background:repeating-linear-gradient(90deg,currentColor 0 4px,transparent 4px 7px)}
.cy{color:var(--yellow)}
.lede{font-size:1.12rem;max-width:56ch;color:#26332b}
.muted{color:var(--muted)}
.small{font-size:.88rem}
.lnk{font-weight:700;color:var(--forest);text-underline-offset:4px;text-decoration-thickness:2px;background:none;border:0;font-family:inherit;font-size:inherit;cursor:pointer;padding:0;min-height:44px;display:inline-flex;align-items:center}
.lnk-h{text-decoration:none}
.lnk-h:hover{color:var(--forest)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:6px;border:2px solid var(--forest);background:var(--forest);color:#fff;font:700 .98rem/1 var(--bd);text-decoration:none;cursor:pointer;letter-spacing:.02em;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-2px);background:var(--forest2)}
.btn-y{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}
.btn-y:hover{background:#ffd34d}
.btn-line{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.btn-line:hover{background:rgba(255,255,255,.08)}
.btn-sm{min-height:44px;padding:8px 16px;font-size:.9rem}
.ph{margin:0;overflow:hidden;background:linear-gradient(135deg,#9aa79f,#c9d1cb);border-radius:var(--r);position:relative}
.ph img{width:100%;height:100%;object-fit:cover;color:transparent}
.r43{aspect-ratio:4/3}.r11{aspect-ratio:1}.r169{aspect-ratio:16/9}.r21{aspect-ratio:21/9}

/* header */
.hdr{position:sticky;top:0;z-index:100;background:var(--panel);color:#e9efe9;border-bottom:3px solid var(--yellow)}
.hdr-in{max-width:1400px;margin:0 auto;padding:0 20px;height:70px;display:flex;align-items:center;gap:24px;transition:height .25s}
.hdr.is-condensed .hdr-in{height:58px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff}
.brand .mono{width:38px;height:38px;color:var(--yellow)}
.brand span{display:flex;flex-direction:column;line-height:1}
.brand b{font:900 1.7rem/1 var(--hd);text-transform:uppercase;letter-spacing:.02em}
.brand small{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#a9b8ae;margin-top:3px}
.hnav{display:flex;gap:2px;margin-left:auto}
.hnav a{padding:8px 11px;min-height:44px;display:inline-flex;align-items:center;text-decoration:none;font-weight:600;font-size:.9rem;border-radius:6px;color:#d5ded8}
.hnav a:hover{background:var(--panel2);color:#fff}
.hnav a[aria-current=page]{color:var(--yellow);background:var(--panel2)}
.hact{display:flex;align-items:center;gap:10px}
.bays{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:6px 14px;border-radius:6px;background:var(--panel2);border:1px solid var(--lined);text-decoration:none;font-size:.85rem;white-space:nowrap}
.bays b{color:var(--yellow);font-family:var(--hd);font-size:1.25rem}
.pulse{width:10px;height:10px;border-radius:50%;background:#3fd17a;box-shadow:0 0 0 0 rgba(63,209,122,.6);animation:pl 2s infinite}
@keyframes pl{70%{box-shadow:0 0 0 10px rgba(63,209,122,0)}100%{box-shadow:0 0 0 0 rgba(63,209,122,0)}}
.menu-btn{display:none;align-items:center;gap:8px;min-height:44px;padding:6px 14px;border-radius:6px;border:1px solid var(--lined);background:none;color:#fff;font:600 .92rem var(--bd);cursor:pointer}
.menu-btn svg,.tabbar svg{width:22px;height:22px}
@media (max-width:1240px){.hnav{display:none}.hact{margin-left:auto}.menu-btn{display:inline-flex}}
@media (max-width:760px){.menu-btn{display:none}.brand small{display:none}.bays{font-size:.78rem;padding:6px 10px}}
.tabbar{display:none}
@media (max-width:760px){
  .tabbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;z-index:150;background:var(--panel);border-top:3px solid var(--yellow);padding:4px 4px calc(4px + env(safe-area-inset-bottom))}
  .tabbar a,.tabbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;color:#cbd6cf;text-decoration:none;font:600 .72rem var(--bd);background:none;border:0;cursor:pointer;border-radius:6px}
  .tabbar [aria-current=page]{color:var(--yellow)}
  body{padding-bottom:70px}
  .wa-float{bottom:84px!important}
}
.mnav{position:fixed;inset:48px 0 0 0;z-index:200;background:var(--panel);color:#e9efe9;overflow:auto;opacity:0;transition:opacity .25s}
.mnav.open{opacity:1}
.mnav-in{max-width:760px;margin:0 auto;padding:20px 20px 100px}
.mnav-top{display:flex;justify-content:space-between;align-items:center}
.mnav-top .lbl,.mnav-foot .lbl{color:#a9b8ae}
.mnav-x{min-height:44px;padding:8px 18px;border-radius:6px;border:1px solid var(--lined);background:none;color:#fff;font:600 1rem var(--bd);cursor:pointer}
.mlist{list-style:none;padding:0;margin:16px 0 28px;border-top:1px solid var(--lined)}
.mlist a{display:flex;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--lined);text-decoration:none;font:800 2rem/1 var(--hd);text-transform:uppercase}
.mlist a[aria-current=page]{color:var(--yellow)}
.mi{font:700 .75rem var(--bd);color:var(--yellow);min-width:24px}
.mnav-foot{display:grid;gap:10px}
.mnav-foot a:not(.btn){font:800 1.6rem var(--hd);color:var(--yellow);text-decoration:none}
body.lock{overflow:hidden}

/* dashboard cards */
.dc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px;position:relative}
.dc::after{content:"";position:absolute;top:8px;right:8px;width:8px;height:8px;border-top:2px solid var(--yellow);border-right:2px solid var(--yellow)}
.dc-v{display:block;font:800 clamp(2.6rem,5vw,3.8rem)/1 var(--hd);color:var(--ink);margin:10px 0 6px;font-variant-numeric:tabular-nums}
.dc-v small{font-size:.45em;color:var(--muted)}
.dc-m{font-size:.88rem;color:var(--muted)}
.dc-m b{color:var(--ink)}
.dash{padding:28px 0 32px}
.dash-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"h h h b" "h h h w" "h h h s" "h h h a" "n n n n";gap:14px}
.dc-hero{grid-area:h;background:var(--panel);color:#e9efe9;border:0;padding:40px;overflow:hidden}
.dc-hero::before{content:"";position:absolute;right:-140px;bottom:-140px;width:420px;height:420px;border-radius:50%;border:46px solid rgba(242,194,48,.08);box-shadow:inset 0 0 0 28px rgba(255,255,255,.03)}
.dc-hero .code{color:var(--yellow)}
.dc-hero h1{color:#fff;max-width:14ch}
.dc-hero h1 span{color:var(--yellow);display:block}
.dc-hero .lede{color:#c9d4cd}
.dc-bays{grid-area:b}.dc-wait{grid-area:w}.dc-stock{grid-area:s}.dc-align{grid-area:a}
.dash-note{grid-area:n;font-size:.82rem;color:var(--muted);margin:0}
.bayrow{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-top:10px}
.bayrow i{height:14px;border-radius:3px;background:#cfd8d2;transition:background .4s}
.bayrow i.on{background:#2ca35f}
.spark{width:100%;height:36px;color:var(--forest2)}
@media (max-width:1040px){.dash-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"h h" "b w" "s a" "n n"}}
@media (max-width:560px){.dc-hero{padding:24px}.dash-grid{gap:10px}.dc{padding:18px}.dc-v{font-size:2.4rem}}

/* finder */
.finder{background:var(--panel2);border:1px solid var(--lined);border-radius:var(--r);padding:18px;margin-top:24px;color:#e9efe9}
.finder:not(.finder-c){background:var(--panel);margin-top:0}
.fd-tabs{display:flex;gap:4px;background:rgba(0,0,0,.25);padding:4px;border-radius:8px;margin-bottom:14px}
.fd-tabs button{flex:1;min-height:44px;border:0;border-radius:6px;background:none;color:#cbd6cf;font:700 .92rem var(--bd);cursor:pointer}
.fd-tabs button[aria-selected=true]{background:var(--yellow);color:var(--ink)}
.fd-help{font-size:.9rem;color:#a9b8ae;margin-bottom:12px}
.fd-help b{color:#fff;font-family:var(--hd);font-size:1.1rem;letter-spacing:.04em}
.fd-sel{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:8px;align-items:end}
.fd-sl{font:800 1.8rem var(--hd);color:var(--yellow);padding-bottom:8px}
.finder .f label{color:#cbd6cf}
.finder select{background:#0b1611;color:#fff;border-color:#3a5245;font:800 1.4rem var(--hd)}
.vchips{display:flex;flex-wrap:wrap;gap:6px}
.vchip{min-height:44px;padding:8px 14px;border-radius:6px;border:1px solid #3a5245;background:none;color:#e9efe9;font:600 .88rem var(--bd);cursor:pointer}
.vchip[aria-pressed=true]{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}
.vsizes{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.vsizes button{min-height:44px;padding:8px 14px;border-radius:6px;border:1px dashed var(--yellow);background:none;color:var(--yellow);font:800 1.15rem var(--hd);cursor:pointer;letter-spacing:.04em}
.vsizes button[aria-pressed=true]{background:rgba(242,194,48,.18)}
.fd-out{margin-top:14px;border-top:1px solid var(--lined);padding-top:12px}
.fd-sum{margin:0;font-size:.95rem;color:#cbd6cf}
.fd-sum b{color:var(--yellow);font:800 1.3rem var(--hd)}
.fd-go{margin-top:12px}
.f{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;min-width:0}
.f label{font-weight:600;font-size:.88rem}
.f input,.f select,.f textarea{font:400 1rem var(--bd);padding:10px 12px;border-radius:6px;border:1.5px solid #b9c4bd;background:#fff;color:var(--ink);min-height:48px;width:100%}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--forest);box-shadow:0 0 0 3px rgba(242,194,48,.5)}
.finder .f{margin-bottom:0}
.err{color:#b3261e;font-size:.85rem}
[aria-invalid=true]{border-color:#b3261e!important}
fieldset{border:0;padding:0;margin:0 0 16px;min-width:0}
legend{font-weight:700;font-size:.88rem;margin-bottom:8px}

/* ticker */
.ticker{background:var(--yellow);color:var(--ink);overflow:hidden;border-block:2px solid var(--ink)}
.tk-track{display:flex;gap:48px;width:max-content;padding:12px 0;font:800 1.15rem var(--hd);text-transform:uppercase;letter-spacing:.04em;animation:tk 40s linear infinite}
.tk-track span::before{content:"●";margin-right:14px;font-size:.7em;vertical-align:middle}
@keyframes tk{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.tk-track{animation:none;flex-wrap:wrap;width:auto;padding:12px 20px;gap:8px 24px}.pulse{animation:none}}

/* sections */
.sec{padding:80px 0}
.sec-tight{padding:40px 0 72px}
.sec-mid{background:#dce2dc}
.sec-dark{background:var(--panel);color:#d5ded8}
.sec-dark h2,.sec-dark h3{color:#fff}
.sh{max-width:780px;margin-bottom:32px}
.sh-row{max-width:none;display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.three .ph{margin-bottom:16px}
@media (max-width:860px){.split,.three{grid-template-columns:minmax(0,1fr);gap:28px}.sec{padding:60px 0}}
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.svc{text-decoration:none;display:flex;flex-direction:column;transition:transform .2s,border-color .2s}
.svc:hover{transform:translateY(-3px);border-color:var(--forest)}
.svc .dc-v{font-size:2.1rem;color:var(--forest)}
.dc-t{position:absolute;right:22px;bottom:18px;font:800 1rem var(--hd);background:var(--ground);padding:2px 8px;border-radius:4px}
.svc .dc-m{padding-right:70px}
@media (max-width:860px){.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.svc-grid{grid-template-columns:minmax(0,1fr)}}
.chart{margin:0;background:var(--panel2);border-radius:var(--r);padding:20px;border:1px solid var(--lined)}
.chart svg{width:100%;height:auto;display:block}
.chart .grid line{stroke:var(--lined)}
.chart .ax text{fill:#a9b8ae;font:600 12px var(--bd)}
.chart .area{fill:rgba(242,194,48,.12)}
.chart .ln{fill:none;stroke:var(--yellow);stroke-width:3;stroke-linejoin:round}
.chart .mark{stroke:#fff;stroke-dasharray:4 4}
.chart .mk{fill:#fff;font:700 13px var(--bd)}
.chart figcaption{font-size:.82rem;color:#a9b8ae;margin-top:8px}
.dash-2{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:14px}
@media (max-width:860px){.dash-2{grid-template-columns:minmax(0,1fr)}}
.bars{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:6px;align-items:end;height:200px;margin:18px 0 28px}
.bars i{position:relative;display:block;height:var(--h);background:linear-gradient(var(--forest2),var(--forest));border-radius:3px 3px 0 0}
.bars i span{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font:700 .75rem var(--bd);color:var(--muted);font-style:normal}
.brandlist{list-style:none;padding:0;margin:12px 0}
.brandlist li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:2px 12px;padding:9px 0;border-bottom:1px solid var(--line)}
.brandlist b{font:800 1.15rem var(--hd);text-transform:uppercase}
.brandlist span{font-size:.85rem;color:var(--muted)}
.brandlist i{grid-column:2;height:6px;background:linear-gradient(90deg,var(--yellow) var(--q),#dfe5e0 var(--q));border-radius:3px}
@media (max-width:420px){.brandlist li{grid-template-columns:minmax(0,1fr)}.brandlist i{grid-column:1}}
.ph-pair{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:12px;align-items:end}
.ticks{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:8px}
.ticks li{padding-left:28px;position:relative}
.ticks li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:14px;background:var(--yellow);clip-path:polygon(0 50%,40% 90%,100% 10%,85% 0,40% 65%,15% 38%)}
.revs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.revs blockquote{margin:0;background:var(--surface);border-left:6px solid var(--yellow);border-radius:var(--r);padding:24px}
.revs p{font:700 1.35rem/1.15 var(--hd);text-transform:uppercase}
.revs footer{font-size:.85rem;color:var(--muted)}
@media (max-width:860px){.revs{grid-template-columns:minmax(0,1fr)}}
.tipcards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tc{text-decoration:none;background:var(--panel);color:#d5ded8;border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:8px;min-height:220px;justify-content:flex-end;transition:transform .2s}
.tc:hover{transform:translateY(-3px)}
.tc .lbl{color:var(--yellow)}
.tc b{font:800 1.9rem/1 var(--hd);text-transform:uppercase;color:#fff}
@media (max-width:760px){.tipcards{grid-template-columns:minmax(0,1fr)}}
.cta{background:var(--forest);color:#e9efe9;padding:64px 0;border-top:6px solid var(--yellow)}
.cta-in{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.cta h2{color:#fff;margin-bottom:.2em}
.cta .code{color:var(--yellow)}
.cta p{max-width:54ch;margin:0}
.cta-b{display:flex;gap:10px;flex-wrap:wrap}

/* page head */
.phead{padding:44px 0 40px;background:var(--panel);color:#d5ded8;border-bottom:3px solid var(--yellow)}
.phead .code{color:var(--yellow)}
.phead h1{color:#fff;max-width:18ch;font-size:clamp(2.4rem,5.4vw,4.4rem)}
.phead .lede{color:#c9d4cd;margin:0}
.phead-in{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:32px;align-items:end}
.ph-stats{display:grid;gap:8px}
.ph-stat{background:var(--panel2);border:1px solid var(--lined);border-radius:var(--r);padding:12px 16px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.ph-stat .lbl{color:#a9b8ae}
.ph-stat b{font:800 1.6rem var(--hd);color:var(--yellow);text-transform:uppercase;text-align:right}
@media (max-width:860px){.phead-in{grid-template-columns:minmax(0,1fr)}}

/* tyre finder page */
.fd-page{display:grid;grid-template-columns:360px minmax(0,1fr);gap:20px;align-items:start}
.fd-side{position:sticky;top:110px;display:grid;gap:14px}
.fd-filter .lbl{margin-bottom:12px}
.seg{display:flex;gap:4px;background:var(--ground);padding:4px;border-radius:8px}
.seg label{flex:1;position:relative}
.seg input{position:absolute;opacity:0;inset:0}
.seg span{display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:6px;font-weight:600;font-size:.88rem;cursor:pointer;text-align:center;padding:4px 8px}
.seg input:checked+span{background:var(--forest);color:#fff}
.seg input:focus-visible+span{outline:3px solid var(--yellow)}
.seg-wrap{flex-wrap:wrap}
.brandticks{display:grid;grid-template-columns:1fr 1fr;gap:0 8px}
.tick{display:flex;gap:10px;align-items:center;min-height:44px;cursor:pointer;font-size:.92rem}
.tick input{width:20px;height:20px;accent-color:var(--forest);flex:none}
.fd-rhead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.fd-rhead h2{font-size:2.2rem;margin:0}
.tyre-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.ty{display:grid;grid-template-columns:72px minmax(0,1.3fr) minmax(0,1fr) auto;gap:18px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 18px}
.ty-ic{width:72px;height:72px;border-radius:50%;background:repeating-conic-gradient(#1a2620 0 6deg,#2b3a32 6deg 12deg);position:relative}
.ty-ic::after{content:"";position:absolute;inset:18px;border-radius:50%;background:radial-gradient(#d7dcd8 40%,#9aa79f 41%)}
.ty h3{font-size:1.35rem;margin:0}
.ty-meta{font-size:.85rem;color:var(--muted);margin:2px 0 0}
.ty-st{font-size:.82rem;font-weight:700;color:#1f7a45}
.ty-st.low{color:#a06200}
.ty-gauges{display:grid;gap:6px;font-size:.8rem}
.ty-gauges span{display:flex;justify-content:space-between;gap:8px}
.ty-gauges i{display:block;height:5px;border-radius:3px;background:linear-gradient(90deg,var(--forest2) var(--v),#e0e6e1 var(--v))}
.ty-price{text-align:right}
.ty-price b{display:block;font:800 1.7rem var(--hd)}
.ty-price span{font-size:.8rem;color:var(--muted);display:block}
.ty-price .btn{margin-top:6px}
.ty.in-q{border-color:var(--forest);box-shadow:inset 4px 0 0 var(--yellow)}
@media (max-width:1100px){.fd-page{grid-template-columns:minmax(0,1fr)}.fd-side{position:static}}
@media (max-width:640px){.ty{grid-template-columns:52px minmax(0,1fr);gap:12px}.ty-ic{width:52px;height:52px}.ty-ic::after{inset:13px}.ty-gauges,.ty-price{grid-column:1/-1}.ty-price{text-align:left;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}}
.quote{grid-column:1/-1;position:sticky;bottom:12px;z-index:20}
.q-in{background:var(--panel);color:#e9efe9;border:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:18px;box-shadow:0 20px 40px -20px rgba(0,0,0,.6)}
.q-in .lbl{color:var(--yellow)}
.q-lines{list-style:none;padding:0;margin:0;font-size:.85rem;color:#c9d4cd}
.q-total{margin:0;display:flex;flex-direction:column}
.q-total b{font:800 2rem var(--hd);color:var(--yellow)}
.q-in .small{display:none}
.q-clear{color:#fff}
@media (max-width:760px){.quote{bottom:80px}.q-in{grid-template-columns:minmax(0,1fr) auto;gap:8px 12px}.q-lines{grid-column:1/-1;order:2}.q-clear{grid-column:1/-1}}
.brand-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.brand-c h3{margin-top:6px}
.brand-c dl{display:flex;gap:24px;margin:0}
.brand-c dt{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.brand-c dd{margin:0;font-weight:700}
@media (max-width:860px){.brand-grid{grid-template-columns:minmax(0,1fr)}}
.tbl-box{overflow-x:auto;position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.tbl{width:100%;border-collapse:collapse;min-width:680px}
.tbl th,.tbl td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line)}
.tbl thead th{font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);background:#f3f5f3}
.tbl tbody th{font:800 1.15rem var(--hd);text-transform:uppercase}

/* services */
.svc-rows{display:grid;gap:12px}
.svc-row{display:grid;grid-template-columns:220px minmax(0,1fr) auto;gap:24px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px}
.svc-row h3{margin:4px 0 6px}
.svc-row p{margin:0;color:var(--muted)}
@media (max-width:760px){.svc-row{grid-template-columns:minmax(0,1fr)}.svc-row .ph{aspect-ratio:16/9}}
.bk{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr) minmax(0,.9fr);gap:14px;align-items:start}
.svc-ticks .tick{border-bottom:1px solid var(--line)}
.bk-est{font-weight:700;margin:0;padding:10px 12px;background:var(--ground);border-radius:6px}
.days{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:8px 0 16px}
.days button{min-height:56px;border-radius:6px;border:1px solid var(--line);background:var(--ground);font:600 .8rem var(--bd);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink)}
.days button b{font:800 1.3rem var(--hd)}
.days button[aria-pressed=true]{background:var(--forest);color:#fff;border-color:var(--forest)}
.slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:8px}
.slots button{min-height:44px;border-radius:6px;border:1px solid var(--line);background:#fff;font:700 .95rem var(--bd);cursor:pointer;color:var(--ink)}
.slots button:disabled{background:repeating-linear-gradient(45deg,#e5e9e6 0 6px,#eef1ee 6px 12px);color:#8b958f;cursor:not-allowed;text-decoration:line-through}
.slots button[aria-pressed=true]{background:var(--yellow);border-color:var(--ink)}
.bk-pick{font:800 1.4rem var(--hd);text-transform:uppercase;margin:8px 0 14px}
.thanks h3{margin-top:8px}
@media (max-width:1100px){.bk{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.bk-form{grid-column:1/-1}}
@media (max-width:700px){.bk{grid-template-columns:minmax(0,1fr)}.slots{grid-template-columns:repeat(3,minmax(0,1fr))}}
.signs{list-style:none;counter-reset:s;padding:0;margin:0;display:grid;gap:8px}
.signs li{counter-increment:s;display:flex;gap:14px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line)}
.signs li::before{content:counter(s,decimal-leading-zero);font:800 1.4rem var(--hd);color:var(--forest)}
.algn{width:100%;border-collapse:collapse;margin:12px 0}
.algn th,.algn td{padding:10px 8px;border-bottom:1px solid var(--line);text-align:left;font-size:.92rem}
.algn thead th{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.algn td{font:800 1.15rem var(--hd)}
.algn .bad{color:#b3261e}.algn .good{color:#1f7a45}
.ticks-l li{color:#d5ded8}
.fleet-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fleet-stats div{background:var(--panel2);border:1px solid var(--lined);border-radius:var(--r);padding:20px}
.fleet-stats b{display:block;font:800 3.2rem/1 var(--hd);color:var(--yellow)}
.fleet-stats span{font-size:.88rem}
.fleet-stats p{grid-column:1/-1;margin:0;color:#a9b8ae}
.faq details{border-bottom:1px solid var(--line);background:var(--surface);padding:0 18px;margin-bottom:6px;border-radius:var(--r)}
.faq summary{cursor:pointer;list-style:none;padding:16px 36px 16px 0;font:700 1.25rem var(--hd);text-transform:uppercase;position:relative;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:12px;font:800 1.6rem var(--hd);color:var(--forest)}
.faq details[open] summary::after{content:"−"}
.faq details p{margin:0;padding-bottom:16px;color:var(--muted)}

/* sidewall reader */
.dec{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:14px;align-items:start}
.dec-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.dec-in .lbl{margin-bottom:12px}
input[type=range]{width:100%;accent-color:var(--forest);min-height:44px}
.dec-out{background:var(--panel);color:#e9efe9;border:0;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px;align-items:center}
.tyre-svg{width:100%;height:auto}
.t-tyre{fill:#0b1611;stroke:#2b3a32;stroke-width:2;transition:r .4s}
.t-rim{fill:#c9d1cb;stroke:#8c9a92;stroke-width:3;transition:r .4s}
.t-hub{fill:#5d6b63}
.t-spokes path{stroke:#8c9a92;stroke-width:12;stroke-linecap:round}
.t-dim{stroke:var(--yellow);stroke-width:2;stroke-dasharray:4 3}
.t-lab{fill:var(--yellow);font:700 13px var(--bd)}
.t-lab-rim{fill:#0b1611}
.dec-size{font:800 2.6rem/1 var(--hd);color:var(--yellow);margin-bottom:14px;letter-spacing:.03em}
.dec-dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 14px}
.dec-dl div{background:var(--panel2);border-radius:6px;padding:10px 12px}
.dec-dl dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:#a9b8ae;font-weight:700}
.dec-dl dd{margin:0;font:800 1.4rem var(--hd)}
.age .lbl{color:#a9b8ae}
.age-v{font:800 1.8rem var(--hd);text-transform:uppercase;margin:4px 0 8px}
.meter{height:10px;border-radius:5px;background:linear-gradient(90deg,#2ca35f,#f2c230 55%,#d9483b);position:relative;margin-bottom:10px}
.meter i{position:absolute;top:-4px;width:6px;height:18px;border-radius:3px;background:#fff;left:var(--m,30%);transition:left .4s;box-shadow:0 0 0 2px var(--panel)}
.age-say{margin:0;color:#c9d4cd;font-size:.92rem}
@media (max-width:1000px){.dec{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.dec-out{grid-template-columns:minmax(0,1fr)}.tyre-svg{max-width:240px;margin:0 auto}.dec-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.dec-row .f label{font-size:.78rem}}
.parts{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.parts li{background:var(--surface);border-radius:var(--r);padding:20px;border:1px solid var(--line)}
.parts b{display:block;font:800 2.8rem/1 var(--hd);color:var(--forest);margin-bottom:6px}
.parts span{color:var(--muted)}
@media (max-width:760px){.parts{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

/* gallery */
.filters{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:18px}
.chipb{min-height:44px;padding:8px 16px;border-radius:6px;border:1px solid var(--line);background:var(--surface);font:700 .9rem var(--bd);cursor:pointer;color:var(--ink)}
.chipb[aria-pressed=true]{background:var(--forest);color:#fff;border-color:var(--forest)}
.g-count{margin-left:auto;font-size:.88rem}
.ggrid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.ggrid li:nth-child(5n+1){grid-column:span 2;grid-row:span 2}
.g-btn{display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-in;position:relative;border-radius:var(--r);overflow:hidden}
.g-btn .ph{aspect-ratio:1;height:100%}
.g-btn img{transition:transform .5s}
.g-btn:hover img{transform:scale(1.05)}
.g-tag{position:absolute;left:8px;bottom:8px;background:var(--panel);color:var(--yellow);font:700 .7rem var(--bd);letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border-radius:4px}
@media (max-width:760px){.ggrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.floor svg{width:100%;height:auto;display:block;background:var(--panel);border-radius:var(--r)}
.floor text{fill:#e9efe9;font:700 15px var(--bd)}
.fl-w{fill:none;stroke:var(--lined);stroke-width:2}
.fl-b{fill:var(--panel2);stroke:#3a5245}
.fl-a{stroke:var(--yellow);stroke-width:2}
.fl-t{fill:rgba(242,194,48,.15);stroke:var(--yellow)}
.fl-r{fill:#2b6a47}.fl-d{fill:none;stroke:#e9efe9;stroke-dasharray:6 5}
.floor .fl-s{fill:var(--yellow);font-size:12px}
.lb{position:fixed;inset:48px 0 0 0;z-index:400;background:rgba(8,14,11,.97);display:grid;grid-template-columns:64px minmax(0,1fr) 64px;align-items:center;padding:60px 12px 24px}
.lb figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.lb img{max-height:72vh;width:auto;max-width:100%;border-radius:8px;background:#2b3a32;min-width:240px;min-height:180px;color:transparent}
.lb figcaption{color:#e9efe9}
.lb-x{position:absolute;top:8px;right:16px;min-height:44px;padding:8px 18px;border-radius:6px;border:1px solid var(--lined);background:none;color:#fff;font:600 1rem var(--bd);cursor:pointer}
.lb-p,.lb-n{width:52px;height:52px;border-radius:6px;border:1px solid var(--lined);background:none;color:#fff;font-size:1.8rem;cursor:pointer}
@media (max-width:600px){.lb{grid-template-columns:1fr 1fr;grid-template-rows:1fr auto}.lb figure{grid-column:1/-1;grid-row:1}.lb-p,.lb-n{grid-row:2}.lb-p{justify-self:end;margin-right:8px}.lb-n{justify-self:start;margin-left:8px}}
.bigq{margin:0 auto;max-width:30ch;text-align:center;font:800 clamp(1.8rem,3.6vw,2.8rem)/1.05 var(--hd);text-transform:uppercase;color:#fff}
.bigq footer{font:600 .95rem var(--bd);color:var(--yellow);text-transform:none;margin-top:14px}

/* tips */
.tfeats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tfeat{text-decoration:none;display:flex;flex-direction:column;gap:8px}
.tfeat .ph{margin-bottom:6px}
.tfeat h2{font-size:2rem;margin:0}
.tfeat p{color:var(--muted)}
.tfeat .lbl{color:var(--forest)}
@media (max-width:760px){.tfeats{grid-template-columns:minmax(0,1fr)}}
.shorttips{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.shorttips h3{margin:6px 0}
.shorttips p{margin:0;color:var(--muted)}
@media (max-width:860px){.shorttips{grid-template-columns:minmax(0,1fr)}}
.news{list-style:none;padding:0;margin:0}
.news li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:2px 20px;padding:16px 0;border-top:1px solid var(--lined)}
.news time{color:var(--yellow);font-weight:700;grid-row:span 2}
.news b{font:800 1.4rem var(--hd);text-transform:uppercase;color:#fff}
@media (max-width:520px){.news li{grid-template-columns:minmax(0,1fr)}.news time{grid-row:auto}}
.art-h{padding:40px 0 28px}
.art-h h1{max-width:20ch;font-size:clamp(2.4rem,5vw,4.2rem)}
.art-media{margin-bottom:40px}
.art-grid{display:grid;grid-template-columns:280px minmax(0,1fr);gap:48px;padding-bottom:64px}
.art-toc{position:sticky;top:110px;align-self:start}
.art-toc ol{padding-left:20px;margin:10px 0 14px}
.art-toc a{display:block;padding:5px 0;color:var(--muted);text-decoration:none;font-size:.92rem}
.art-toc a:hover{color:var(--forest)}
.art-body{max-width:68ch;font-size:1.06rem}
.art-body h2{font-size:2rem;margin-top:1.2em}
.pull{margin:32px 0;padding:22px 26px;background:var(--panel);color:var(--yellow);border-radius:var(--r);font:800 1.9rem/1.05 var(--hd);text-transform:uppercase}
.pull p{margin:0}
@media (max-width:860px){.art-grid{grid-template-columns:minmax(0,1fr);gap:20px}.art-toc{position:static}}
.faq-wrap{display:grid;grid-template-columns:300px minmax(0,1fr);gap:28px;align-items:start}
.faq-search{position:sticky;top:110px;display:flex;flex-direction:column;gap:8px}
.faq-search input{font:400 1rem var(--bd);padding:10px 12px;border-radius:6px;border:1.5px solid #b9c4bd;min-height:48px;width:100%}
.faq-g{margin-bottom:28px}
.faq-g h2{font-size:1.8rem;color:var(--forest)}
@media (max-width:860px){.faq-wrap{grid-template-columns:minmax(0,1fr)}.faq-search{position:static}}
.map{padding:12px}
.map svg{width:100%;height:auto;display:block;border-radius:6px}
.m-bg{fill:#dce2dc}.m-rd{stroke:#fff;stroke-width:18}.m-rd2{stroke:#fff;stroke-width:12}.m-rb{fill:#9fb3a5;stroke:#fff;stroke-width:8}.m-rv{fill:none;stroke:#8fb3c4;stroke-width:16}
.m-t{fill:var(--ink);font:600 13px var(--bd)}.m-b{font-weight:800}.m-pin{fill:var(--panel);stroke:var(--yellow);stroke-width:3}.m-pt{fill:var(--yellow);font:800 15px var(--bd)}
.map p{margin:8px 0 0;color:var(--muted)}
.hours{list-style:none;padding:0;margin:16px 0;border-top:1px solid var(--line)}
.hours li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.hours li.today{background:rgba(242,194,48,.25);padding-inline:8px;font-weight:700}
.hours li.today span::after{content:" · today";color:var(--forest)}
.rs{margin-top:16px;border-left:6px solid var(--yellow)}

/* footer */
.ftr{background:var(--panel);color:#a9b8ae;padding:56px 0 110px;border-top:3px solid var(--yellow)}
.ftr-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:40px}
.ftr-brand p{margin-top:14px;max-width:38ch}
.ftr-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.ftr h2{font:700 .75rem var(--bd);letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin-bottom:12px}
.ftr a:not(.brand){display:block;color:#e9efe9;text-decoration:none;padding:6px 0}
.ftr a:hover{color:var(--yellow)}
.ftr-stat{display:flex;flex-wrap:wrap;gap:10px 28px;margin:32px 0;padding:14px 18px;border:1px solid var(--lined);border-radius:var(--r);font-size:.9rem}
.ftr-stat b{color:#fff}
.ftr-bot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.82rem}
.ftr-bot p{margin:0}
@media (max-width:860px){.ftr-top,.ftr-cols{grid-template-columns:minmax(0,1fr)}.ftr-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.ftr-cols{grid-template-columns:minmax(0,1fr)}}
.wa-float{position:fixed;right:18px;bottom:18px;z-index:140;width:56px;height:56px;border-radius:50%;background:#1f7a4d;color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -8px rgba(0,0,0,.5)}
.wa-float svg{width:28px;height:28px}
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.js .rv.in{opacity:1;transform:translateY(0px)}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}}
@media (max-width:420px){.bx{display:none}.brand b{font-size:1.45rem}.brand .mono{width:32px;height:32px}.hdr-in{gap:12px;padding:0 14px}}
@media (max-width:480px){.finder select{font-size:1.1rem;padding:8px 6px}.fd-sel{gap:4px}.fd-sl{font-size:1.3rem}}