/* DC tuning selector — shared by index.html and check-my-car.html.
   Single source of truth: edit here, not in either page. */
.dcs{margin-top:22px}
.dcs-selects{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:860px){.dcs-selects{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.dcs-selects{grid-template-columns:1fr}}
.dcs-f{display:flex;flex-direction:column;gap:6px}
.dcs-f>span{font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.dcs-f select{appearance:none;-webkit-appearance:none;width:100%;padding:13px 15px;border-radius:10px;
  background:var(--ink-2) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239a9aa6' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center;
  border:1px solid var(--line-2);color:var(--text);font:inherit;font-size:.95rem;cursor:pointer}
.dcs-f select:disabled{opacity:.45;cursor:not-allowed}
.dcs-f select:focus{outline:2px solid var(--red);outline-offset:2px}
.dcs-msg{margin:16px 0 0;color:var(--muted);font-size:.9rem}
.dcs-msg[hidden]{display:none}
.dcs-head{margin:26px 0 14px;font-size:1.02rem;color:var(--muted)}
.dcs-head strong{color:var(--text)}
.dcs-sub{color:var(--faint);font-size:.85em}


/* gauges */
.dcg-wrap{margin:22px 0 4px}
.dcg-toggle{display:flex;justify-content:center;gap:8px;margin-bottom:16px}
.dcg-tb{cursor:pointer;border:1px solid var(--line-2);background:transparent;color:var(--muted);
  font:800 .78rem/1 var(--body);letter-spacing:.05em;text-transform:uppercase;padding:9px 20px;border-radius:100px;transition:.15s}
.dcg-tb:hover{border-color:var(--red);color:var(--text)}
.dcg-tb.on{background:var(--red);border-color:var(--red);color:#fff}
.dcg-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dcg{border:1px solid var(--line-2);border-radius:16px;padding:16px 12px 14px;background:var(--ink-2);text-align:center}
.dcg-ring{width:100%;max-width:224px;height:auto}
.dcg-track,.dcg-stock,.dcg-molt{fill:none;stroke-width:11;stroke-linecap:round}
/* travelling sheen. Deliberately CSS stroke-dashoffset, NOT a SMIL gradientTransform:
   WebKit/iOS Safari does not animate gradientTransform, so the old version was dead on
   every iPhone while working fine in Chrome. dasharray sums to pathLength(100) so exactly
   one highlight is on the arc at a time. */
.dcg-track{stroke:#17171d}
.dcg-stock{stroke:#33333e}
/* bloom removed 2026-08-04 - the drop-shadow read as gaming-PC RGB */
.dcg-num{fill:var(--text);font-family:var(--display);font-size:56px;letter-spacing:.02em}
.dcg-unit{fill:var(--faint);font-family:var(--body);font-size:11px;font-weight:800;letter-spacing:.26em}
.dcg-foot{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:6px;font-size:.82rem;color:var(--muted);flex-wrap:wrap}
.dcg-foot b{color:var(--text)}
.dcg-gain{background:rgba(232,0,15,.16);color:var(--red);font-weight:800;padding:4px 12px;border-radius:100px;font-size:.8rem}
/* delivery curve */
.dcc{margin-top:16px;border:1px solid var(--line);border-radius:16px;padding:16px 16px 13px;background:var(--ink-2);position:relative}
.dcc-h{font:800 .74rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.dcc-sub{display:block;margin-top:5px;font-weight:600;letter-spacing:.02em;text-transform:none;font-size:.76rem;color:var(--faint)}
.dcc-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.dcc-svg{width:100%;height:auto;display:block}
.dcc-svg.is-narrow .dcc-ax{font-size:17px}
.dcc-svg.is-narrow .dcc-l{stroke-width:3}
.dcc-svg.is-narrow .dcc-l.c-hp0,.dcc-svg.is-narrow .dcc-l.c-nm0{stroke-width:2.4}
.dcc-svg.is-narrow .dcc-dot{stroke-width:1.3}
.dcc-grid{stroke:#6a6a76;stroke-width:1;stroke-dasharray:6 6;opacity:.5}
.dcc-axis{stroke:#6a6a76;stroke-width:1;opacity:.7}
.dcc-ax{fill:#8a8a96;font-family:var(--body);font-size:13px}
.dcc-l{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.dcc-dot{stroke:#eef0f4;stroke-width:1.6}
/* stock - dashed so "before vs after" reads instantly */
.dcc-l.c-hp0,.dcc-l.c-nm0{stroke-dasharray:7 5;stroke-width:2}
.dcc-l.c-hp0{stroke:#9aa3b2} .dcc-dot.c-hp0{fill:#9aa3b2;r:3.5}
.dcc-l.c-nm0{stroke:#5f6b7a} .dcc-dot.c-nm0{fill:#5f6b7a;r:3.5}
/* stage 1 */
.dcc-l.c-hp1{stroke:#e8000f} .dcc-dot.c-hp1{fill:#e8000f}
.dcc-l.c-nm1{stroke:#f5c518} .dcc-dot.c-nm1{fill:#f5c518}
/* stage 2 */
.dcc-l.c-hp2{stroke:#ff7a45} .dcc-dot.c-hp2{fill:#ff7a45}
.dcc-l.c-nm2{stroke:#36d07a} .dcc-dot.c-nm2{fill:#36d07a}
.dcc-key{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:14px;font-size:.82rem;color:var(--muted)}
.dcc-key .k{display:inline-flex;align-items:center;gap:8px;color:var(--muted)}
.dcc-key .k::before{content:"";width:20px;height:3px;border-radius:2px}
.dcc-key .c-hp0::before{background:repeating-linear-gradient(90deg,#9aa3b2 0 6px,transparent 6px 10px)}
.dcc-key .c-nm0::before{background:repeating-linear-gradient(90deg,#5f6b7a 0 6px,transparent 6px 10px)}
.dcc-key .c-hp1::before{background:#e8000f} .dcc-key .c-nm1::before{background:#f5c518}
.dcc-key .c-hp2::before{background:#ff7a45} .dcc-key .c-nm2::before{background:#36d07a}

/* --- motion ------------------------------------------------------------- */
.dcc-wipe{transform-box:fill-box;transform-origin:left center;animation:dccWipe 1.15s cubic-bezier(.22,.61,.36,1) both}
@keyframes dccWipe{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.dcc-dot{opacity:0;animation:dccDot .35s ease-out forwards}
@keyframes dccDot{to{opacity:1}}
.dcg-stock,.dcg-molt{animation:dcgSweep 1.1s cubic-bezier(.22,.61,.36,1) forwards}
@keyframes dcgSweep{to{stroke-dashoffset:0}}
.dcg-num{animation:dcgPop .5s ease-out both;animation-delay:.35s}
@keyframes dcgPop{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .dcc-wipe,.dcc-dot,.dcg-stock,.dcg-molt,.dcg-num{animation:none!important}
  .dcc-dot{opacity:1}
  .dcg-stock,.dcg-molt{stroke-dashoffset:0!important}
}
.dcc-note{margin-top:10px;font-size:.75rem;color:var(--faint);line-height:1.55}
@media(max-width:520px){.dcg-row{grid-template-columns:1fr}.dcg-num{font-size:46px}}
/* flex, not 1fr grid: with only two cards (no Stage 2) each 1fr track stretched to ~570px on a 1440 screen - two numbers marooned in a huge empty box. flex-basis grows them evenly but max-width caps them at the width they already have in the 3-card case. */
.dcs-cards{display:flex;flex-wrap:wrap;gap:12px;align-items:stretch}
.dcs-card{flex:1 1 190px;min-width:0;max-width:380px}
.dcs-card{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:17px 16px;background:#0f0f13}
.dcs-card.is-s1{border-color:rgba(232,0,15,.55);background:linear-gradient(180deg,rgba(232,0,15,.06),#0f0f13 62%)}
.dcs-card.is-s2{border-color:rgba(255,255,255,.09)}
.dcs-card.is-pending{border-style:dashed;border-color:var(--line-2)}
.dcs-card.is-pending .dcs-ct{color:var(--muted)}
.dcs-pend{font-size:.95rem;font-weight:700;color:var(--gold);margin-bottom:2px}
.dcs-ct{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.dcs-card.is-s1 .dcs-ct{color:var(--red)}
.dcs-card.is-s2 .dcs-ct{color:var(--muted)}
.dcs-row{display:flex;align-items:baseline;gap:6px;margin-bottom:4px}
.dcs-n{font-family:var(--display);font-size:1.9rem;line-height:1;color:var(--text);font-variant-numeric:tabular-nums}
.dcs-u{font-size:.78rem;color:var(--muted)}
.dcs-d{margin-left:auto;font-size:.8rem;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.dcs-card.is-s1 .dcs-d{color:var(--red)}
.dcs-ptag{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.07)}
.dcs-ptag .p{font-family:var(--display);font-size:1.6rem;color:var(--text);letter-spacing:.02em}
.dcs-ptag .vat{font-size:.68rem;color:var(--faint);margin-left:6px}
.dcs-fin{display:block;font-size:.72rem;color:var(--muted);margin-top:4px;letter-spacing:.01em}
.dcs-fin b{color:var(--text);font-weight:700}


.dcs-book{display:block;margin-top:11px;text-align:center;padding:9px 8px;border-radius:8px;border:1px solid rgba(255,255,255,.15);color:var(--text);text-decoration:none;font-size:.78rem;font-weight:700;letter-spacing:.03em;transition:border-color .15s,background .15s}
.dcs-book.is-primary{background:var(--red);border-color:var(--red)}
.dcs-book:hover{border-color:var(--red)}
.dcs-slot{margin-top:10px}
.dcs-slot:empty{margin-top:0}
.dcs-foot-note{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.07);font-size:.76rem;color:var(--faint);line-height:1.5}

.dcs-note{margin-top:9px;font-size:.76rem;color:var(--muted);line-height:1.5}
.dcs-note b{color:var(--text);font-weight:700;display:block;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;margin-bottom:2px}
.dcs-note a{color:var(--muted);text-decoration:underline}
.dcs-pricing{margin-top:20px;border:1px solid var(--line-2);border-radius:14px;overflow:hidden;background:var(--ink-2)}
.dcs-prow{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:12px 16px;border-bottom:1px solid var(--line)}
.dcs-prow.is-bundle{background:rgba(232,0,15,.07);border-bottom:0}
.dcs-pl{color:var(--muted);font-size:.9rem}
.dcs-prow.is-bundle .dcs-pl{color:var(--text);font-weight:700}
.dcs-save{display:inline-block;margin-left:6px;font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--green)}
.dcs-pv{font-family:var(--display);font-size:1.25rem;color:var(--text);white-space:nowrap;font-variant-numeric:tabular-nums}
.dcs-prow.is-bundle .dcs-pv{color:var(--red)}
/* Scoped to .dcs-pricing on purpose. This block is a leftover from a pricing
   table the selector no longer renders, and an unscoped .dcs-fin here was
   winning over the one in the price card above - turning the "£74.84/mo at 0%"
   line into a padded flex row with its own background. */
.dcs-pricing .dcs-fin{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 14px;padding:12px 16px;background:var(--ink-3);font-size:.86rem;color:var(--muted);border-top:1px solid var(--line)}
.dcs-pricing .dcs-fin b{color:var(--text)}
.dcs-k{color:var(--muted)}
.dcs-pricing .dcs-fin a{color:var(--red);text-decoration:none;margin-left:auto;white-space:nowrap}
.dcs-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:20px}
.dcs-price{margin-right:auto;font-size:.95rem;color:var(--muted)}
.dcs-price strong{font-family:var(--display);font-size:1.4rem;color:var(--red);letter-spacing:.02em}
.dcs-disc{margin-top:14px;font-size:.78rem;color:var(--faint);line-height:1.6}

.vstat-cta{flex-direction:column;align-items:stretch;text-align:left;}
      .vstat-price{margin:8px 0 0;}
      .vp-health{display:flex;align-items:center;gap:9px;font-size:.82rem;color:var(--muted);margin:2px 0 0;padding:10px 13px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;line-height:1.4;}
      .vp-health b{color:var(--text);}
      .vp-health .ic{color:var(--red);flex-shrink:0;}
      .vp-tiers{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
      /* Three tiers go straight from 3-up to stacked. There is deliberately no
         2-up state: three cards in two columns strands the third on its own row,
         which is exactly what the .tm-inc grid did before it was pinned. */
      .vp-tiers.is-3{grid-template-columns:repeat(3,minmax(0,1fr));}
      @media(max-width:960px){.vp-tiers.is-3{grid-template-columns:1fr;}}
      @media(max-width:560px){.vp-tiers{grid-template-columns:1fr;}}
      .vp-s2mods{font-size:11.5px;color:var(--muted);line-height:1.5;margin:2px 0 13px;}
      .vp-s2mods b{color:#fff;font-weight:700;}
      .vp-s2mods a{color:var(--muted);text-decoration:underline;}
      .vp-tier{background:var(--ink);border:1px solid var(--line);border-radius:14px;padding:18px 18px 16px;display:flex;flex-direction:column;}
      .vp-tier.best{position:relative;border-color:var(--red);background:var(--ink);}.vp-pop{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--red);color:#fff;font-size:9.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;padding:4px 12px;border-radius:20px;white-space:nowrap;box-shadow:0 3px 10px rgba(0,0,0,.45);z-index:2;}.vp-break{font-size:11.5px;color:var(--muted);margin:-4px 0 13px;}.vp-break b{color:#fff;font-weight:700;}
      .vp-tcap{display:flex;align-items:center;gap:8px;flex-wrap:wrap;row-gap:7px;}
.vp-tcap .vp-save{flex:0 0 auto;}
      .vp-tname{font-size:13px;font-weight:800;letter-spacing:.3px;color:#fff;}
      .vp-tsub{font-size:12px;color:var(--muted);margin:3px 0 12px;}
      .vp-tprice{display:flex;align-items:baseline;gap:9px;margin-bottom:14px;}.vp-vat{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.03em;}
      .vp-tprice .amt{font-family:var(--display);font-size:2rem;color:#fff;line-height:1;letter-spacing:.5px;}
      .vp-was{color:var(--faint);text-decoration:line-through;font-size:.95rem;font-weight:600;}
      .vp-mo{display:inline-block;margin:-6px 0 12px;font-size:.76rem;color:var(--muted);text-decoration:none;}
      .vp-mo b{color:#fff;font-weight:700;}
      .vp-mo .lnk{color:var(--red);font-weight:700;white-space:nowrap;}
      .vp-mo:hover{color:var(--muted);}
      .vp-mo:hover .lnk{text-decoration:underline;}
      .vp-single .vp-mo{margin:6px 0 0;}
      /* The saving badge, matched to the lit treatment on pricing.html so the same offer
         looks the same wherever a customer meets it. Deliberately LIT rather than solid:
         it sits inches from the solid red "Most Popular" pill, and two solid red pills
         would compete. Outlined-and-glowing vs solid keeps the hierarchy readable.
         It replaced a stock #36d07a success-green pill, which was the only non-brand
         colour on the card. */
      .vp-save{margin-left:0;font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;
        color:#ff7d84;background:linear-gradient(180deg,rgba(232,0,15,.17),rgba(232,0,15,.06));
        border:1px solid rgba(232,0,15,.34);padding:3px 9px;border-radius:20px;white-space:nowrap;
        box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 0 16px -7px rgba(232,0,15,.7);
        text-shadow:0 0 12px rgba(232,0,15,.45);}
      .vp-tico{width:28px;height:28px;border-radius:8px;background:var(--ink-4);border:1px solid var(--line-2);display:grid;place-items:center;color:var(--red);flex-shrink:0;}
      .vp-tier.best .vp-tico{background:rgba(232,0,15,.14);border-color:rgba(232,0,15,.4);}
      .vp-tico svg{width:16px;height:16px;}
      .vp-inc{display:flex;flex-direction:column;gap:7px;font-size:11.5px;color:var(--muted);line-height:1.35;margin:0 0 13px;padding:11px 12px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:9px;}.vp-inc-h{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--red);margin:0 0 1px;}.vp-incrow{display:flex;align-items:flex-start;gap:7px;}.vp-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;}.vp-tag{font-size:10.5px;font-weight:700;color:rgba(255,255,255,.86);background:rgba(224,32,32,.08);border:1px solid rgba(224,32,32,.22);border-radius:999px;padding:4px 10px;display:inline-flex;align-items:center;line-height:1.2;}.vp-tag::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--red);margin-right:6px;flex:0 0 auto;}.vp-gproof{margin:14px 0 2px;padding:14px 16px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;text-align:center;}.vp-gp-top{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:var(--muted);flex-wrap:wrap;}.vp-gp-top b{color:#fff;font-size:14px;}.vp-gp-stars{color:#f5b800;font-size:14px;letter-spacing:2px;}.vp-gp-g{width:18px;height:18px;flex:0 0 auto;}.vp-gp-quote{font-size:12.5px;color:var(--muted);line-height:1.55;margin:8px auto 0;max-width:520px;}.vp-gp-quote span{color:rgba(255,255,255,.75);font-weight:600;white-space:nowrap;}.vp-gp-link{display:inline-block;margin-top:7px;font-size:12px;color:var(--red);text-decoration:none;font-weight:700;letter-spacing:.02em;}.vp-gp-link:hover{text-decoration:underline;}.vp-fin{display:flex;align-items:center;gap:11px;margin:0 0 12px;padding:10px 12px;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;text-decoration:none;transition:border-color .2s,background .2s;}.vp-fin:hover{border-color:rgba(232,0,15,.55);background:rgba(232,0,15,.05);}.vp-fin-badge{flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:rgba(232,0,15,.12);border:1px solid rgba(232,0,15,.45);color:var(--red);font-weight:800;font-size:12.5px;display:flex;align-items:center;justify-content:center;letter-spacing:-.02em;}.vp-fin-txt{display:flex;flex-direction:column;gap:1px;font-size:12.5px;color:var(--muted);line-height:1.45;text-align:left;}.vp-fin-txt b{color:#fff;font-size:13.5px;}.vp-fin-sub{font-size:11px;color:var(--red);font-weight:700;letter-spacing:.02em;}
.vp-klarna{margin:-4px 0 13px;font-size:11.5px;color:var(--muted);text-align:left;display:flex;align-items:center;gap:6px;flex-wrap:wrap;line-height:1.4;}
.vp-klarna b{color:var(--text);font-weight:700;}
.vp-ktag{display:inline-block;background:#ffb3c7;color:#0a0a0a;font-weight:800;font-size:10.5px;padding:2px 7px;border-radius:5px;letter-spacing:.2px;}
      .vp-inc svg{width:13px;height:13px;color:var(--red);flex-shrink:0;margin-top:1px;}
      .vp-inc b{color:#fff;font-weight:700;}
      .vp-tbtn{margin-top:auto;text-align:center;background:var(--ink-4);border:1px solid var(--line-2);color:var(--text);font-weight:700;font-size:13.5px;padding:11px;border-radius:9px;text-decoration:none;}
      .vp-tier.best .vp-tbtn{background:var(--red);border-color:var(--red);color:#fff;}
      .vp-tbtn:hover{color:var(--text);border-color:var(--muted);}
      .vp-tier.best .vp-tbtn:hover{color:#fff;background:#ff1420;border-color:#ff1420;}
      /* Neutral surface, matching .vp-gproof. The red gradient wash and red border made
   this read as a second primary CTA competing with Book Stage 1 and the sticky
   bar, and tinted the panel muddy. The accent is now spent once, on the button. */
.vp-qpanel{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:14px;padding:18px 20px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;}.vp-qp-ic{width:42px;height:42px;border-radius:11px;background:rgba(232,0,15,.09);border:1px solid rgba(232,0,15,.22);display:flex;align-items:center;justify-content:center;flex:0 0 auto;}.vp-qp-ic svg{width:21px;height:21px;stroke:var(--red);fill:none;stroke-width:2;}.vp-qp-txt{flex:1;min-width:230px;display:flex;flex-direction:column;gap:3px;}.vp-qp-txt b{font-size:14.5px;color:#fff;letter-spacing:.1px;}.vp-qp-txt span{font-size:12.5px;color:var(--muted);line-height:1.55;}.vp-qp-act{display:flex;flex-direction:column;align-items:center;gap:6px;}.vp-qp-btn{display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;font-weight:800;font-size:13px;letter-spacing:.02em;padding:12px 20px;border-radius:9px;text-decoration:none;white-space:nowrap;transition:background .2s;}.vp-qp-btn:hover{background:#ff1420;}.vp-qp-alt{font-size:11.5px;color:var(--muted);}.vp-qp-alt a{color:rgba(255,255,255,.85);font-weight:700;text-decoration:none;}.vp-qp-alt a:hover{color:#fff;}@media (max-width:560px){.vp-qpanel{justify-content:center;text-align:center;}.vp-qp-txt{align-items:center;}.vp-qp-act{width:100%;}.vp-qp-btn{width:100%;justify-content:center;}}
      .vp-single{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--ink);border:1px solid var(--line);border-radius:14px;padding:18px 20px;}
      .vp-single .vp-cap{font-size:.72rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted);}
      .vp-single .amt{font-family:var(--display);font-size:2.4rem;color:#fff;line-height:1;letter-spacing:.5px;}
      .vp-single-sub{font-size:12px;color:var(--muted);margin-top:3px;}
      .vp-single-btns{display:flex;gap:10px;flex-wrap:wrap;}
      .vp-quote{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--ink);border:1px dashed var(--line-2);border-radius:14px;padding:16px 20px;}
      .vp-q-ic{width:42px;height:42px;border-radius:50%;background:rgba(232,0,15,.12);border:1px solid rgba(232,0,15,.3);display:grid;place-items:center;color:var(--red);font-size:20px;font-weight:800;flex-shrink:0;}
      .vp-q-t{flex:1;min-width:200px;font-size:.9rem;color:var(--muted);line-height:1.5;}
      .vp-q-t strong{color:#fff;}
      .vp-s2note{display:flex;align-items:center;gap:11px;margin-top:14px;padding:12px 15px;background:rgba(245,197,24,.08);border:1px solid rgba(245,197,24,.32);border-radius:11px;font-size:.83rem;color:#e6d6a0;line-height:1.45;}
      .vp-s2note b{color:#f5c518;}
      .vp-s2note .ic{color:#f5c518;flex-shrink:0;}
      .vp-s1note{display:flex;align-items:center;gap:11px;margin-top:14px;padding:12px 15px;background:rgba(54,208,122,.08);border:1px solid rgba(54,208,122,.3);border-radius:11px;font-size:.83rem;color:#bfe6cf;line-height:1.45;}
      .vp-s1note b{color:#36d07a;}
.vp-s1note .ic{color:#36d07a;flex-shrink:0;}
      .vp-lock{display:flex;align-items:center;gap:11px;margin-top:14px;padding:12px 15px;background:rgba(232,0,15,.06);border:1px solid rgba(232,0,15,.28);border-radius:11px;font-size:.83rem;color:var(--muted);line-height:1.45;}
      .vp-lock b{color:#fff;}
      .vp-lock .ic{color:var(--red);flex-shrink:0;}
      .vp-lock a{color:var(--red);font-weight:700;text-decoration:none;}
      .vp-lock a:hover{text-decoration:underline;}
      .vstat-cta-foot{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);}
      .vstat-cta-feats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
      .vcf{display:flex;gap:10px;align-items:flex-start;}
      .vcf-ic{color:var(--red);flex-shrink:0;line-height:0;margin-top:1px;}
      .vcf b{display:block;color:#fff;font-size:.9rem;font-weight:700;letter-spacing:.2px;}
      .vcf span{display:block;color:var(--muted);font-size:.8rem;line-height:1.45;margin-top:3px;}
      .vstat-cta-meta{display:flex;justify-content:space-between;align-items:center;gap:10px 18px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);}
      @media(max-width:620px){.vstat-cta-feats{grid-template-columns:1fr;gap:13px;}}
      @media(max-width:560px){.vp-single{flex-direction:column;align-items:flex-start;}}

/* "what's included" panel — copy injected from dc-tuning-build/inclusions.json */
.dcs-inc{margin:18px 0 0;padding:18px 20px;border:1px solid var(--line-2);border-radius:13px;background:var(--ink-2)}
.dcs-inc h4{font-size:.98rem;margin:0 0 4px;color:var(--text)}
.dcs-inc>p{margin:0 0 14px;font-size:.85rem;color:var(--muted);line-height:1.7;max-width:74ch}
.dcs-inc ul{list-style:none;margin:0;padding:0;display:grid;gap:9px 26px;grid-template-columns:repeat(2,minmax(0,1fr))}
.dcs-inc li{position:relative;padding-left:25px;font-size:.88rem;color:var(--text);line-height:1.5}
.dcs-inc li::before{content:"";position:absolute;left:2px;top:5px;width:11px;height:6px;
  border-left:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(-45deg)}
@media(max-width:600px){.dcs-inc ul{grid-template-columns:1fr}}

/* ---- self-sufficiency ----------------------------------------------------
   The selector now also renders on the 13 vehicle pages and 42 location pages.
   Those use a different shell with no global `a { color }`, so links inside the
   output fell back to browser-default blue (#0000ee). Scope the colours to the
   widget so it no longer depends on whatever page it is dropped into. */
.dcs a:not([class]){color:rgba(255,255,255,.85);}
.dcs a:not([class]):hover{color:#fff;}
.dcs .vp-fin{color:#e8000f;}
.dcs .vp-qp-alt a{color:#e8000f;}
