/* The Used Car Buyers — "Lights On" homepage layer.
   Everything here is prefixed lx- (or scoped under .lx-hero) so it cannot collide with the page's own styles. */
:root{
  --lx-paint:#131c2b;
  --lx-carw:clamp(600px,min(78vw,calc((100vh - 470px)/.273)),1100px);
  --lx-sidew:clamp(520px,74vw,1060px);
  --lx-mx:0; --lx-my:0;
  --lx-inst:'Barlow Semi Condensed','Arial Narrow',Arial,sans-serif;
  --lx-amber:#ff8a00; --lx-tail:#ff2a3c; --lx-ok:#16a34a;
}
.lx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* ───────── hero ───────── */
.hero.lx-hero{min-height:0;display:block;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#035591 0%,#02487f 55%,var(--B1) 100%);--lx-px:50%;--lx-py:50%;scroll-margin-top:70px}
.lx-hero .orb1{background:radial-gradient(circle,rgba(22,135,255,.55) 0%,transparent 62%)}
.lx-hero .orb,.lx-hero .hgrid{z-index:0}
.lx-nightsky{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity 1.4s;background:radial-gradient(1.5px 1.5px at 8% 14%,#fff 50%,transparent 52%),radial-gradient(1.5px 1.5px at 19% 31%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 31% 9%,#fff 50%,transparent 52%),radial-gradient(1.5px 1.5px at 44% 22%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 57% 7%,#fff 50%,transparent 52%),radial-gradient(1.5px 1.5px at 66% 27%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 76% 12%,#fff 50%,transparent 52%),radial-gradient(1.5px 1.5px at 88% 20%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 94% 36%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 50% 38%,#fff 50%,transparent 52%),linear-gradient(180deg,#012446 0%,#011a31 58%,#010f1f 100%)}
.lx-hero[data-sky="night"] .lx-nightsky{opacity:1}
.lx-torch{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .9s;background-image:linear-gradient(rgba(255,217,110,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(255,217,110,.5) 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:radial-gradient(300px circle at var(--lx-px) var(--lx-py),#000,transparent);mask-image:radial-gradient(300px circle at var(--lx-px) var(--lx-py),#000,transparent)}
.lx-hero.lx-pointer .lx-torch{opacity:1}
.lx-mist{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}
.lx-sky{position:absolute;z-index:7;right:max(16px,calc((100% - 1200px)/2));top:12px;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 13px;border-radius:999px;background:rgba(1,36,70,.6);color:#fff;font-size:13px;font-weight:700;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.lx-sky svg{width:17px;height:17px;color:var(--Y4)}
.lx-sky .lx-moon{display:none}
.lx-sound{right:calc(max(16px,(100% - 1200px)/2) + 98px);padding:0 11px}
.lx-sound .lx-soff,.lx-sound[aria-pressed="false"] .lx-son{display:none}
.lx-sound[aria-pressed="false"] .lx-soff{display:block}
.lx-sound[aria-pressed="false"] svg{color:#9fb4cd}
.lx-sky[aria-pressed="true"] .lx-moon{display:block}
.lx-sky[aria-pressed="true"] .lx-sun{display:none}

.lx-form{display:block;position:relative;z-index:2;margin:0}
.lx-grid{position:relative;display:grid;grid-template-columns:max-content minmax(0,1fr);grid-template-areas:"h l" "h c" "s s";column-gap:clamp(32px,5vw,72px);padding-top:clamp(30px,3.8vw,56px)}
.lx-grid .hc{grid-area:h;position:relative;z-index:5;padding-bottom:0}
.lx-hero h1.hh{font-size:clamp(44px,6vw,88px);margin-bottom:0;text-shadow:0 12px 50px rgba(1,30,58,.45)}
.lx-hero .eb{margin-bottom:16px}
.lx-grid .hsub{grid-area:l;position:relative;z-index:5;align-self:end;max-width:480px;margin:0;font-size:15.5px;line-height:1.7;color:rgba(255,255,255,.78);font-weight:400}
.lx-controls{grid-area:c;position:relative;z-index:5;align-self:start;max-width:480px;padding-top:16px}
.lx-controls .hbtns{margin-bottom:12px;gap:10px}
.lx-controls .btn-y,.lx-controls .btn-w{padding:15px 22px;font-size:14.5px;cursor:pointer;border:0;font-family:inherit}
.lx-controls .btn-w{border:1px solid rgba(255,255,255,.16)}
.lx-status{min-height:1.6em;font-size:14.5px;font-weight:600;line-height:1.55;color:rgba(255,255,255,.85)}
.lx-status.lx-warn{color:var(--Y4)}

/* the number plate */
.lx-plate{--ph:76px;position:relative;display:flex;align-items:stretch;overflow:hidden;height:var(--ph);border-radius:calc(var(--ph)*.13);background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.85) 50%,transparent 58%) no-repeat calc(50% - var(--lx-mx)*45%) 0/260% 100% #f4f4ee;color:#0b0f16;box-shadow:inset 0 0 0 calc(var(--ph)*.035) #0b0f16,0 14px 40px rgba(1,20,40,.45);transition:box-shadow .25s}
.lx-band{flex:none;width:calc(var(--ph)*.5);background:#0b3a8f;color:#fff;font:700 calc(var(--ph)*.17)/1 var(--lx-inst);letter-spacing:.04em;display:flex;align-items:flex-end;justify-content:center;padding-bottom:calc(var(--ph)*.12)}
.lx-plate input,.lx-plate-text{flex:1;min-width:0;width:100%;border:0;padding:0;margin:0;background:transparent;outline:none;font:700 calc(var(--ph)*.62)/1 var(--lx-inst);letter-spacing:.045em;text-align:center;text-transform:uppercase;color:#0b0f16;caret-color:var(--B3);border-radius:0;min-height:0}
.lx-plate-text{display:flex;align-items:center;justify-content:center;white-space:nowrap}
.lx-plate input::placeholder{color:rgba(11,15,22,.34)}
.lx-plate-input:focus-within{box-shadow:inset 0 0 0 calc(var(--ph)*.035) #0b0f16,0 0 0 4px var(--Y3),0 0 60px rgba(255,217,110,.75)}
.lx-plate-input{grid-area:s;justify-self:center;align-self:start;z-index:6;width:calc(var(--lx-carw)*.2476);--ph:calc(var(--lx-carw)*.05286);margin-top:calc(var(--lx-carw)*.2157)}
.lx-plate-input.lx-nudge{animation:lx-ring 1.8s ease-out infinite}
@keyframes lx-ring{0%{box-shadow:inset 0 0 0 calc(var(--ph)*.035) #0b0f16,0 0 0 0 rgba(244,198,50,.85)}100%{box-shadow:inset 0 0 0 calc(var(--ph)*.035) #0b0f16,0 0 0 20px rgba(244,198,50,0)}}
.lx-hint{grid-area:s;justify-self:center;align-self:start;z-index:6;position:relative;margin-top:calc(var(--lx-carw)*.2157 - 50px);padding:8px 15px;border-radius:999px;background:var(--Y3);color:var(--T);font-size:13.5px;font-weight:800;line-height:1;white-space:nowrap;box-shadow:0 8px 24px rgba(1,20,40,.45);pointer-events:none;animation:lx-bob 1.6s ease-in-out infinite;transition:opacity .4s}
.lx-hint::after{content:"";position:absolute;left:50%;top:100%;margin-left:-7px;border:7px solid transparent;border-top-color:var(--Y3)}
@keyframes lx-bob{50%{transform:translateY(-5px)}}
.lx-hero.lx-typed .lx-hint{opacity:0}

/* what the record says, right under the plate */
.lx-found{grid-area:s;justify-self:center;align-self:start;z-index:6;display:none;width:min(600px,calc(100% - 32px));margin-top:calc(var(--lx-carw)*.2157 + var(--lx-carw)*.05286 + 16px);padding:14px 16px;border-radius:16px;background:#fff;color:var(--T);box-shadow:0 18px 50px rgba(1,20,40,.5),0 0 0 1px rgba(255,255,255,.4);animation:lx-pop .4s cubic-bezier(.2,.9,.3,1.2) both}
.lx-found.lx-on{display:block}
@keyframes lx-pop{0%{opacity:0;transform:translateY(14px) scale(.96)}100%{opacity:1;transform:none}}
.lx-found-top{display:flex;align-items:flex-start;gap:12px}
.lx-found-ic{flex:none;width:34px;height:34px;border-radius:50%;background:var(--lx-ok);color:#fff;font:900 18px/34px Arial,sans-serif;text-align:center;box-shadow:0 0 0 4px rgba(22,163,74,.18)}
.lx-found.lx-no .lx-found-ic{background:var(--Y3);color:var(--T)}
.lx-found.lx-busy .lx-found-ic{background:transparent;box-shadow:none;border:3px solid var(--BR);border-top-color:var(--B3);animation:lx-rot .8s linear infinite}
.lx-found-t{min-width:0;flex:1}
.lx-found-t b{display:block;font-size:20px;line-height:1.2;font-weight:800;letter-spacing:-.2px}
.lx-found-t span{display:block;margin-top:3px;font-size:13.5px;line-height:1.5;color:var(--M)}
.lx-found-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.lx-found-chips:empty{display:none}
.lx-found-act{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:12px}
.lx-found-btn{padding:13px 20px;font-size:14.5px;border:0;font-family:inherit;cursor:pointer}
.lx-found-edit{padding:4px 0}
.lx-found.lx-busy .lx-found-act,.lx-found.lx-busy .lx-found-chips{display:none}

/* the car you type on */
.lx-car{grid-area:s;position:relative;z-index:2;width:var(--lx-carw);left:50%;margin-left:calc(var(--lx-carw)/-2);margin-top:calc(var(--lx-carw)*-.07);margin-bottom:calc(var(--lx-carw)*.05)}
.lx-car::after{content:"";position:absolute;z-index:-1;left:50%;width:100vw;margin-left:-50vw;top:calc(100% - var(--lx-carw)*.0143);height:calc(var(--lx-carw)*.08);border-top:1px solid rgba(255,255,255,.22);background:linear-gradient(180deg,rgba(1,30,58,.5),transparent);pointer-events:none}
.lx-car-svg{display:block;width:100%;height:auto;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 15%);mask-image:linear-gradient(180deg,transparent 0,#000 15%)}
.lx-drl{fill:none;stroke:var(--Y5);stroke-linecap:round;stroke-linejoin:round;opacity:.3;transition:opacity .5s}
.lx-lens{opacity:.15;transition:opacity .5s}
.lx-hero.is-on .lx-drl,.lx-hero.is-on .lx-lens{opacity:1}
.lx-beam,.lx-flare,.lx-amber,.lx-puddle,.lx-lampglow,.lx-tailglow{position:absolute;pointer-events:none;mix-blend-mode:screen}
.lx-beam{top:35.5%;width:calc(var(--lx-carw)*0.7);height:calc(var(--lx-carw)*0.44);margin:calc(var(--lx-carw)*-0.22) 0 0 calc(var(--lx-carw)*-0.35);border-radius:50%;background:radial-gradient(closest-side,rgba(255,252,235,1) 0,rgba(255,236,160,.78) 5%,rgba(255,217,110,.34) 20%,rgba(255,217,110,.13) 46%,transparent 74%);opacity:.08;translate:calc(var(--lx-mx)*calc(var(--lx-carw)*0.014)) calc(var(--lx-my)*calc(var(--lx-carw)*0.007))}
.lx-flare{top:35.5%;width:calc(var(--lx-carw)*0.52);height:calc(var(--lx-carw)*0.0042);margin:calc(var(--lx-carw)*-0.0021) 0 0 calc(var(--lx-carw)*-0.26);background:linear-gradient(90deg,transparent,rgba(255,244,200,.95),transparent);filter:blur(calc(var(--lx-carw)*0.0012));opacity:0;transition:opacity .6s .5s}
.lx-amber{top:35.5%;width:calc(var(--lx-carw)*0.32);height:calc(var(--lx-carw)*0.22);margin:calc(var(--lx-carw)*-0.11) 0 0 calc(var(--lx-carw)*-0.16);border-radius:50%;background:radial-gradient(closest-side,rgba(255,138,0,.85),transparent 70%);opacity:0}
.lx-puddle{top:97.5%;width:calc(var(--lx-carw)*0.38);height:calc(var(--lx-carw)*0.09);margin-left:calc(var(--lx-carw)*-0.19);border-radius:50%;background:radial-gradient(closest-side,rgba(255,217,110,.5),transparent);filter:blur(calc(var(--lx-carw)*0.01));opacity:.1;transition:opacity 1s}
.lx-l{left:15.7%}.lx-r{left:84.3%}
.lx-amber.lx-l{left:10%}.lx-amber.lx-r{left:90%}
.lx-hero.is-on .lx-beam{opacity:1;animation:lx-ignite 1.1s ease-out both}
.lx-hero.is-on .lx-flare{opacity:.9}
.lx-hero.is-on .lx-puddle{opacity:1}
.lx-hero[data-sky="day"].is-on .lx-beam{animation:none;opacity:.34}
.lx-hero[data-sky="day"].is-on .lx-flare{opacity:.5}
.lx-hero[data-sky="day"].is-on .lx-puddle{opacity:.35}
@keyframes lx-ignite{0%{opacity:.08}16%{opacity:.95}24%{opacity:.3}38%{opacity:1}50%{opacity:.65}100%{opacity:1}}
.lx-hero.lx-blink .lx-drl:not(.lx-bar){animation:lx-indicate .9s steps(1,end) both}
.lx-hero.lx-blink .lx-amber{animation:lx-amberflash .9s steps(1,end) both}
@keyframes lx-indicate{0%,50%{stroke:var(--lx-amber);opacity:1}25%,75%{stroke:var(--lx-amber);opacity:.12}100%{stroke:var(--Y5);opacity:1}}
@keyframes lx-amberflash{0%,50%{opacity:1}25%,75%,100%{opacity:0}}
.lx-car .lx-plate-mirror{position:absolute;left:37.62%;top:58.25%;width:24.76%;--ph:calc(var(--lx-carw)*0.05286);display:none}

/* pills and numbers under the car */
.lx-under{position:relative;z-index:4;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding-top:6px}
.lx-under .tpills{margin-bottom:0;flex:1 1 420px}
.lx-under .hstats{flex:0 1 430px}

/* the form card, now a wide card under the car */
.lx-cardwrap{position:relative;z-index:5;width:min(1100px,calc(100% - 160px));margin:36px auto 0}
.lx-hero .fcard{animation:none;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-areas:"top perks" "body body";scroll-margin-top:86px}
.lx-hero .fcard-top{grid-area:top}
.lx-hero .fperks{grid-area:perks;align-content:center;border-bottom:0}
.lx-hero .fbody{grid-area:body}
.lx-hero .scrl{padding:18px 0 22px}

/* step 1: the car we found */
.lx-veh{display:none;margin-bottom:14px;padding:14px 16px;border-radius:14px;background:var(--OF);border:1.5px solid var(--BR)}
.lx-veh.lx-show{display:block}
.lx-veh-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.lx-veh .lx-plate{--ph:40px;box-shadow:inset 0 0 0 1.5px #0b0f16;flex:none;width:150px}
.lx-veh-name{font-weight:800;font-size:15.5px;color:var(--T);flex:1 1 160px;min-width:0}
.lx-veh-name small{display:block;font-weight:500;font-size:12.5px;color:var(--M)}
.lx-link{font-size:12.5px;font-weight:700;color:var(--B2);text-decoration:underline;cursor:pointer;background:none;border:0;padding:6px 0}
.lx-lamps{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.lx-lampchip{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;background:#fff;border:1px solid var(--BR);font-size:12.5px;font-weight:700;color:var(--T)}
.lx-lampchip::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--lx-ok);box-shadow:0 0 8px rgba(22,163,74,.7)}
.lx-lampchip.lx-off::before{background:var(--lx-amber);box-shadow:0 0 8px rgba(255,138,0,.7)}
.lx-motline{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));row-gap:18px;margin-top:16px}
.lx-motline li{position:relative;padding:12px 6px 0 0;border-top:2px solid var(--BR);font-size:11.5px;color:var(--M);display:grid;gap:1px}
.lx-motline li::before{content:"";position:absolute;left:0;top:-6px;width:10px;height:10px;border-radius:50%;background:var(--lx-ok)}
.lx-motline li.lx-fail::before{background:var(--lx-amber)}
.lx-motline b{font:700 14px/1.2 var(--lx-inst);letter-spacing:.04em;color:var(--T)}
.lx-motline i{font-style:normal;font-weight:700;color:var(--B2)}
.lx-vehnote{margin-top:10px;font-size:12px;line-height:1.55;color:var(--M)}
.lx-fielderr{display:none;margin-top:10px;padding:10px 13px;border-radius:10px;background:#fff4e5;border:1px solid #ffd9a8;color:#7a4100;font-size:13px;font-weight:600}
.lx-fielderr.lx-show{display:block}
.lx-mothint{font-size:12px;color:var(--M);margin-top:2px}

/* step 3: quick taps */
.lx-quick{gap:16px;margin-bottom:14px}
.lx-q{display:grid;gap:8px;align-content:start}
.lx-q[hidden],.lx-chip[hidden]{display:none}
.lx-wide{grid-column:1/-1}
.lx-fin input{width:100%;max-width:280px;min-height:48px;padding:12px 14px;border:1.5px solid var(--BR);border-radius:10px;font:inherit;font-size:16px;color:var(--T);background:var(--OF)}
.lx-fin input:focus{outline:none;border-color:var(--B3);background:#fff;box-shadow:0 0 0 3px rgba(4,114,196,.1)}
.lx-fin > span{font-weight:600;color:var(--M)}
/* extras that only work with the script: hidden until it is running */
.fg.lx-jsonly{display:none}
.lx-js .fg.lx-jsonly{display:flex}
.lx-q > span,.lx-qlabel{font-size:12.5px;font-weight:700;color:var(--T);letter-spacing:.2px}
.lx-chips{display:flex;flex-wrap:wrap;align-items:flex-start;align-content:flex-start;gap:8px}
.lx-chip{min-height:44px;padding:0 16px;border-radius:999px;background:var(--OF);border:1.5px solid var(--BR);font-size:14px;font-weight:700;color:var(--T);transition:background .15s,border-color .15s,color .15s}
.lx-chip:hover{border-color:var(--B3)}
.lx-chip[aria-pressed="true"]{background:var(--B2);border-color:var(--B2);color:#fff}
.lx-cond{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start;padding:16px;border-radius:14px;background:var(--OF);border:1.5px solid var(--BR)}
.lx-plan{display:block;width:100%;height:auto;overflow:visible}
.lx-plan-t{fill:var(--M);font:700 25px 'Manrope',sans-serif}
.lx-plan-body{fill:var(--lx-paint);stroke:#0b2a4d;stroke-width:2}
.lx-plan-glass{fill:#0b2a4d}
.lx-plan-tyre{fill:#06101d}
.lx-part{cursor:pointer;outline:none}
.lx-part path{fill:rgba(255,255,255,.14);stroke:rgba(255,255,255,.85);stroke-width:2;stroke-linejoin:round;transition:fill .2s}
.lx-part:hover path{fill:rgba(255,255,255,.4)}
.lx-part:focus-visible path{stroke:var(--Y3);stroke-width:4}
.lx-part[aria-pressed="true"] path{fill:var(--lx-amber);stroke:#fff}
.lx-part rect{fill:#06101d;stroke:rgba(255,255,255,.85);stroke-width:2;transition:fill .2s}
.lx-part rect.lx-hit{fill:transparent;stroke:none}
.lx-part:hover rect:not(.lx-hit){fill:#24364d}
.lx-part[aria-pressed="true"] rect:not(.lx-hit){fill:var(--lx-amber);stroke:#fff}
.lx-part.lx-active rect:not(.lx-hit){stroke:var(--Y3);stroke-width:5}
.lx-part[data-kind="glass"]:not([aria-pressed="true"]) path{fill:rgba(255,255,255,.06)}
.lx-condside{display:grid;gap:12px;min-width:0}
.lx-dash{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px 8px;max-width:640px}
.lx-condside > .lx-chip{justify-self:start}
.lx-dl{display:grid;justify-items:center;gap:6px;color:var(--M);font-size:12px;font-weight:600;line-height:1.2;text-align:center}
.lx-dl .lx-ic{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#011d38;color:#8fa8c4;transition:box-shadow .2s,color .2s}
.lx-dl svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lx-dl-t{fill:currentColor;stroke:none;font:700 7.5px var(--lx-inst);text-anchor:middle}
.lx-dl[aria-pressed="true"]{color:var(--T)}
.lx-dl[aria-pressed="true"] .lx-ic{color:var(--lx-amber);box-shadow:0 0 0 2px var(--lx-amber),0 0 20px rgba(255,138,0,.7)}
.lx-dl[data-c="red"][aria-pressed="true"] .lx-ic{color:var(--lx-tail);box-shadow:0 0 0 2px var(--lx-tail),0 0 20px rgba(255,42,60,.7)}
.lx-advis{padding:10px 12px;border-radius:10px;background:#fffbea;border:1px solid var(--Y4);font-size:12.5px;line-height:1.55;color:#5a3800}
.lx-advis b{display:block;margin-bottom:2px}
/* the quick taps only take over once the script is running; without it the form shows its ordinary boxes */
.lx-quick{display:none}
.lx-js .lx-quick{display:grid}
.lx-js .lx-shadow{display:none}
.lx-more{display:contents}
.lx-js .lx-more:not(.lx-open){display:none}
.lx-typed-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lx-typed-fields .fg.full{grid-column:1/-1}
.lx-hidefield{display:none!important}
.lx-hidefield + .fg{grid-column:1/-1}

/* ───────── four steps as a road ───────── */
section.sec.lx-journey{background:linear-gradient(180deg,var(--B1),#02447a);overflow:hidden;padding-bottom:0}
.lx-journey .sh h2{color:#fff}
.lx-journey .sh p{color:rgba(255,255,255,.72)}
.lx-route{position:relative}
.lx-route-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.lx-rd-edge,.lx-rd-base,.lx-rd-dash,.lx-rd-lit{fill:none;stroke-linecap:round}
.lx-rd-edge{stroke:rgba(255,255,255,.3)}
.lx-rd-base{stroke:#011d38}
.lx-rd-dash{stroke:rgba(255,255,255,.5);stroke-width:2;stroke-dasharray:12 16;stroke-linecap:butt}
.lx-rd-lit{stroke:var(--Y3);stroke-width:3;filter:drop-shadow(0 0 6px rgba(244,198,50,.9))}
.lx-pin circle{fill:var(--B1);stroke:#b4cbe5;stroke-width:2;transition:fill .4s,stroke .4s}
.lx-pin text{fill:#cfe0f3;font:700 18px var(--lx-inst);text-anchor:middle;dominant-baseline:central;transition:fill .4s}
.lx-pin.lx-lit circle{fill:var(--Y3);stroke:var(--Y5)}
.lx-pin.lx-lit text{fill:var(--T)}
.lx-tcar-body{fill:var(--Y3);stroke:rgba(255,255,255,.75);stroke-width:1.5}
.lx-stops{list-style:none;position:relative;display:grid;grid-template-columns:minmax(0,1fr) clamp(240px,28vw,360px) minmax(0,1fr);row-gap:clamp(28px,5vw,64px);padding:100px 0 220px}
.lx-stop{max-width:440px;padding:8px 0}
.lx-stop:nth-child(odd){grid-column:1;justify-self:end;text-align:right}
.lx-stop:nth-child(even){grid-column:3}
.lx-stop:nth-child(1){grid-row:1}.lx-stop:nth-child(2){grid-row:2}.lx-stop:nth-child(3){grid-row:3}.lx-stop:nth-child(4){grid-row:4}
.lx-stop h3{font-size:clamp(19px,2vw,25px);font-weight:800;line-height:1.2;color:#cfe0f3;transition:color .5s}
.lx-stop p{margin-top:10px;font-size:15px;line-height:1.75;color:#b4cbe5;font-weight:400;transition:color .5s}
.lx-stop.lx-lit h3{color:var(--Y4)}
.lx-stop.lx-lit p{color:#f2f7fd}

/* ───────── odometer numbers ───────── */
.lx-odo{display:inline-flex!important;align-items:center;gap:.045em;font-family:var(--lx-inst)!important;font-variant-numeric:tabular-nums;letter-spacing:0}
.lx-drum{display:inline-block;height:1em;overflow:hidden;border-radius:.09em;padding:0 .07em;background:linear-gradient(180deg,#011427 0%,#03386a 50%,#011427 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.lx-strip{display:block;transform:translateY(calc(var(--d)*-1em));transition:transform 2.2s cubic-bezier(.16,.84,.24,1)}
.lx-strip.lx-noanim{transition:none}
.lx-strip b{display:block;height:1em;font-weight:700;line-height:1}
.lx-strip b::before,.lx-odo-ch::before{content:attr(data-n)}
/* the banner styles every span as a small label: put the drum parts back to the size of the number */
.sbs .lx-odo span{font-size:inherit;font-weight:inherit;color:inherit;letter-spacing:0;text-transform:none;margin-top:0}
.sbs .lx-odo .lx-drum{display:inline-block}
.sbs .lx-odo .lx-odo-ch{display:inline}

/* ───────── closing scene ───────── */
.lx-finale{position:relative;overflow:hidden;background:linear-gradient(180deg,#02447a 0%,var(--B1) 100%);padding-top:clamp(28px,4vw,56px)}
.lx-drive{position:relative;z-index:2;width:var(--lx-sidew);margin-left:calc((100% - var(--lx-sidew))/2 - 3vw)}
.lx-drive-in{position:relative}
.lx-coupe{display:block;width:100%;height:auto;overflow:visible;-webkit-box-reflect:below calc(var(--lx-sidew)*-0.04) linear-gradient(transparent 58%,rgba(0,0,0,.26))}
.lx-coupe .lx-ind{opacity:0}
.lx-coupe .lx-tail{opacity:.8}
.lx-finale .lx-coupe .lx-drl{fill:none;stroke:#fff;opacity:1}
.lx-lampglow{left:96.4%;top:52.4%;width:calc(var(--lx-sidew)*0.3);height:calc(var(--lx-sidew)*0.3);margin:calc(var(--lx-sidew)*-0.15) 0 0 calc(var(--lx-sidew)*-0.15);border-radius:50%;background:radial-gradient(closest-side,rgba(255,252,235,.95) 0,rgba(255,236,160,.5) 14%,rgba(244,198,50,.16) 45%,transparent 72%);opacity:.8}
.lx-tailglow{left:6.5%;top:45%;width:calc(var(--lx-sidew)*0.2);height:calc(var(--lx-sidew)*0.14);margin:calc(var(--lx-sidew)*-0.07) 0 0 calc(var(--lx-sidew)*-0.1);border-radius:50%;background:radial-gradient(closest-side,rgba(255,42,60,.7),transparent 70%);opacity:.45}
.lx-floor{position:relative;z-index:1;height:calc(var(--lx-sidew)*.105);margin-top:calc(var(--lx-sidew)*-.02);border-top:1px solid rgba(255,255,255,.2);background:linear-gradient(180deg,rgba(1,30,58,.55),transparent)}
.lx-floor::before{content:"";position:absolute;left:0;right:0;top:42%;height:3px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.4) 0 38px,transparent 38px 86px)}
.lx-finale.lx-go .lx-drive-in{animation:lx-driveby 8s infinite both}
.lx-finale.lx-go .lx-spin-in{animation:lx-rollby 8s infinite both}
.lx-finale.lx-go .lx-tailglow{animation:lx-brake 8s infinite both}
@keyframes lx-driveby{0%{transform:translateX(-150%);animation-timing-function:cubic-bezier(.18,.82,.25,1)}28%{transform:none}60%{transform:none;animation-timing-function:cubic-bezier(.6,0,.9,.4)}88%,100%{transform:translateX(170%)}}
@keyframes lx-rollby{0%{transform:rotate(-1228deg);animation-timing-function:cubic-bezier(.18,.82,.25,1)}28%{transform:none}60%{transform:none;animation-timing-function:cubic-bezier(.6,0,.9,.4)}88%,100%{transform:rotate(1392deg)}}
@keyframes lx-brake{0%,12%{opacity:.4}20%,58%{opacity:1}64%,100%{opacity:.4}}

/* the unstyled button in the comparison block gets the site's yellow button look */
.vs-cta .btn-primary{display:inline-flex;align-items:center;gap:9px;background:var(--Y3);color:var(--T);padding:15px 28px;border-radius:12px;font-weight:800;font-size:15px;box-shadow:0 8px 28px rgba(244,198,50,.38);transition:all .22s}
.vs-cta .btn-primary:hover{background:var(--Y2);transform:translateY(-2px)}
.vs-cta .btn-primary svg{width:16px;height:16px}

/* ───────── tablet and phone ───────── */
@media(max-width:1100px){
  :root{--lx-carw:min(118vw,900px)}
  .lx-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"h" "p" "f" "c" "s" "l"}
  .lx-found{grid-area:f;justify-self:stretch;width:auto;max-width:520px;margin-top:12px;padding:12px 14px;box-shadow:0 10px 30px rgba(1,20,40,.35)}
  .lx-found-t b{font-size:18px}
  .lx-found-act{display:none}
  .lx-found-chips{margin-top:8px}
  .lx-plate-input{grid-area:p;justify-self:stretch;width:auto;max-width:520px;margin-top:16px;--ph:72px}
  .lx-hint{display:none}
  .lx-controls{max-width:520px;padding-top:12px}
  .lx-controls .hbtns{flex-direction:column}
  .lx-controls .btn-y,.lx-controls .btn-w{width:100%;justify-content:center}
  .lx-car{margin-top:calc(var(--lx-carw)*-.03)}
  .lx-car .lx-plate-mirror{display:flex}
  .lx-grid .hsub{max-width:none;padding-top:4px}
  .lx-cardwrap{width:min(680px,calc(100% - 32px))}
  .lx-hero .fcard{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "perks" "body";grid-template-rows:auto;margin-bottom:0;border-radius:28px 28px 0 0}
  .lx-sky .lx-sky-t{display:none}
  .lx-sound{right:calc(max(16px,(100% - 1200px)/2) + 52px)}
  .lx-stops{grid-template-columns:64px minmax(0,1fr);padding:80px 0 190px}
  .lx-stop:nth-child(n){grid-column:2;justify-self:start;text-align:left}
}
@media(max-width:700px){
  .lx-grid{padding:22px 16px 0}
  .lx-grid .hc{order:0;padding:0;width:auto}
  .lx-hero h1.hh{font-size:clamp(34px,10.4vw,44px);letter-spacing:-.5px;line-height:1}
  .lx-hero .eb{margin-bottom:10px}
  .lx-grid .hsub{font-size:14px;margin-bottom:8px}
  .lx-under{display:none}
  .lx-cardwrap{width:100%;margin-top:18px}
  .lx-hero .fcard{border-radius:0;order:0}
  .lx-sky{top:56px;right:12px}
  .lx-sound{right:60px}
  .lx-cond{grid-template-columns:minmax(0,1fr)}
  .lx-cond .lx-plan{max-width:200px;margin:0 auto}
  .lx-typed-fields{grid-template-columns:1fr}
  .lx-chip{min-height:44px;padding:0 13px}
  .lx-quick{gap:14px}
  .lx-qgrid{gap:12px}
  .lx-q{gap:6px}
  .lx-cond{padding:14px;gap:16px}
  .lx-condbody{grid-template-columns:minmax(0,1fr)}
  .lx-condbody .lx-plan{max-width:224px;margin:0 auto}
  .lx-q{grid-column:1/-1}
  .lx-q.lx-half{grid-column:auto}
  .lx-dmg{padding:10px}
  .lx-dmg .lx-chip{min-height:40px;padding:0 11px}
  .lx-dash{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lx-dl .lx-ic{width:48px;height:48px}
  .lx-dash{gap:10px 6px}
  .lx-hero .eb{flex-wrap:wrap;row-gap:4px;padding-right:52px}
  .lx-veh{padding:12px 13px}
  .lx-motline{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){
  .lx-hero.is-on .lx-beam,.lx-hero.lx-blink .lx-drl:not(.lx-bar),.lx-hero.lx-blink .lx-amber,.lx-plate-input.lx-nudge,.lx-hint{animation:none}
  .lx-finale.lx-go .lx-drive-in,.lx-finale.lx-go .lx-spin-in,.lx-finale.lx-go .lx-tailglow{animation:none}
  .lx-strip{transition:none}
}

/* step 3 layout helpers */
.lx-quicknote{font-size:13px;line-height:1.55;color:var(--M)}
.lx-qgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px 22px}
.lx-condbody{display:grid;grid-template-columns:210px minmax(0,1fr);gap:10px 22px;align-items:start;min-width:0}
.lx-condbody > .lx-qlabel{grid-column:1/-1}
.lx-dmgside{display:grid;gap:12px;justify-items:start;min-width:0}
.lx-dmg{display:grid;gap:9px;justify-items:start;padding:12px 13px;border-radius:12px;background:#fff;border:1.5px solid var(--Y3);box-shadow:0 6px 18px rgba(9,30,58,.08);width:100%}
.lx-dmg[hidden]{display:none}
.lx-dmg-t{font-size:13px;color:var(--T)}
.lx-dmg .lx-chip{min-height:38px;padding:0 13px;font-size:13px;background:#fff}
.lx-dmg .lx-chip[aria-pressed="true"]{background:var(--lx-amber);border-color:var(--lx-amber);color:#2b1700}
.lx-dmglist{list-style:none;display:grid;gap:6px;width:100%}
.lx-dmglist:empty{display:none}
.lx-dmgitem{display:block;width:100%;text-align:left;padding:8px 11px;border-radius:9px;background:#fff;border:1px solid var(--BR);border-left:4px solid var(--lx-amber);font-size:13px;line-height:1.45;color:var(--M)}
.lx-dmgitem b{color:var(--T)}
.lx-dmgitem.lx-on{border-color:var(--Y3);border-left-color:var(--lx-amber);box-shadow:0 0 0 2px rgba(244,198,50,.35)}
.lx-part.lx-active path{stroke:var(--Y3);stroke-width:5}
.lx-condside{padding-top:16px;border-top:1px solid var(--BR)}
.lx-condbody .lx-plan{max-width:210px}
.lx-condhelp{font-size:12.5px;line-height:1.55;color:var(--M)}
.lx-morerow{display:none}
.lx-js .lx-morerow{display:flex}
@media(max-width:700px){
  .lx-qgrid{grid-template-columns:1fr 1fr}
}

/* the condition step as two short screens (only once the script is running; without it everything simply shows) */
.lx-partaactions,.lx-partbnote{display:none}
.lx-js .lx-partaactions{display:flex}
.lx-js #step3:not(.lx-b) .lx-partb{display:none!important}
.lx-js #step3.lx-b .lx-parta{display:none!important}
.lx-js #step3.lx-b .lx-partbnote{display:block}
@media(max-width:700px){
  .lx-condbody{grid-template-columns:minmax(0,1fr)}
  .lx-condbody .lx-plan{max-width:224px;margin:0 auto}
  .lx-dmgside{justify-items:stretch}
  .lx-dmgside > .lx-chip{justify-self:start}
}

/* the form card stays out of the way until the customer has put their reg in and pressed the button */
.lx-js:not(.lx-started) .lx-cardwrap{display:none}
.lx-js:not(.lx-started) .scrl{padding-top:26px}

/* finance amount with a "Not sure" way out */
.lx-finrow{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.lx-finrow input{flex:1 1 180px}

/* photos (optional) */
.lx-photos{display:none;gap:10px;justify-items:start;padding:16px;border-radius:14px;background:var(--OF);border:1.5px dashed #b4c7e2}
.lx-js .lx-photos{display:grid}
.lx-photos .lx-qlabel em{font-style:normal;font-weight:600;color:var(--M)}
.lx-thumbs{display:flex;flex-wrap:wrap;gap:8px}
.lx-thumbs:empty{display:none}
.lx-thumb{position:relative;width:88px;height:66px;border-radius:10px;overflow:hidden;background:#d9e4f2;border:1px solid var(--BR)}
.lx-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.lx-thumb img:not([src]){visibility:hidden}
.lx-thumb::after{content:"";position:absolute;inset:0;background:rgba(9,30,58,.42);transition:opacity .3s}
.lx-thumb.lx-done::after{opacity:0}
.lx-thumb.lx-fail::after{background:rgba(150,20,20,.6)}
.lx-spin{position:absolute;z-index:1;left:50%;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;border:3px solid rgba(255,255,255,.4);border-top-color:#fff;animation:lx-rot .8s linear infinite}
.lx-thumb.lx-done .lx-spin,.lx-thumb.lx-fail .lx-spin{display:none}
.lx-tick{position:absolute;z-index:1;left:4px;bottom:4px;width:18px;height:18px;border-radius:50%;background:var(--lx-ok);color:#fff;font:700 12px/18px Arial,sans-serif;text-align:center;display:none}
.lx-thumb.lx-done .lx-tick{display:block}
.lx-thumb button{position:absolute;z-index:2;right:3px;top:3px;width:24px;height:24px;border-radius:50%;background:rgba(9,30,58,.78);color:#fff;font:700 15px/24px Arial,sans-serif;text-align:center;padding:0}
.lx-addphoto{display:inline-flex;align-items:center;gap:8px;cursor:pointer;background:#fff}
.lx-addphoto svg{width:19px;height:19px;color:var(--B2)}
#lxPhotoIn:focus-visible + .lx-addphoto{border-color:var(--B3);box-shadow:0 0 0 3px rgba(4,114,196,.15)}
.lx-photostatus{font-size:12.5px;line-height:1.5;color:var(--M)}
.lx-photostatus:empty{display:none}
@keyframes lx-rot{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.lx-spin{animation-duration:2.4s}}