/* Buyer Solutions: overview + four buyer pages. Shared layouts only; site.css supplies the base system. */
.bs section[id]{scroll-margin-top:60px}
.bs-h{font:600 clamp(2.2rem,3.6vw,3.4rem)/1 var(--d);text-transform:uppercase;max-width:20ch;text-wrap:balance}
.bs-intro{margin-top:16px;color:var(--ink-2);max-width:62ch}
.bs-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:20px 56px;align-items:end;margin-bottom:clamp(28px,3.4vw,48px)}
.bs-head .bs-intro{margin-top:0;justify-self:end}
.bs-band{padding-block:clamp(64px,8vw,112px)}
.bs-tint{background:var(--haze-3)}

/* dark band */
.bs-dark{background:var(--asphalt);color:var(--white);padding-block:clamp(64px,8vw,112px)}
.bs-dark .bs-intro,.bs-dark .load-lead{color:var(--haze)}
.bs-dark .note-line{border-top-color:var(--asphalt-3);color:var(--haze)}
.bs-dark .note-line .link,.bs-dark .link{color:var(--white)}
.bs-dark .link:hover{color:var(--haze)}
.bs-dark .mini-h{color:var(--white)}
.bs-dark .checklist li{border-top-color:var(--asphalt-3);color:var(--haze-2)}
.bs-dark .flow{border-top-color:var(--haze)}
.bs-dark .flow li{color:var(--haze-2)}
.bs-dark .flow li+li{border-left-color:var(--asphalt-3)}
.bs-dark .ticks{border-top-color:var(--haze)}
.bs-dark .ticks li{border-bottom-color:var(--asphalt-3);color:var(--haze-2)}
.bs-dark .ticks strong{color:var(--white)}

/* overview: four doors */
.bs-doors{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.bs-door{display:flex;flex-direction:column;background:var(--haze-3);border-top:3px solid var(--asphalt)}
.bs-door:hover{border-top-color:var(--amber)}
.bs-door figure{margin:0;aspect-ratio:4/5;overflow:hidden;background:var(--asphalt)}
.bs-door figure img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.bs-door figure.plate{background:#fff}
.bs-door figure.plate img{object-fit:contain;padding:18px}
.bs-door:hover figure img{transform:scale(1.03)}
.bs-door-body{display:flex;flex-direction:column;gap:10px;padding:18px 18px 22px;flex:1}
.bs-door h3{font:600 1.7rem/1.02 var(--d);text-transform:uppercase}
.bs-door h3 a{text-decoration:none}
.bs-door h3 a::after{content:"";position:absolute;inset:0}
.bs-door{position:relative}
.bs-door h3 a:hover{text-decoration:underline;text-decoration-color:var(--amber);text-decoration-thickness:3px}
.bs-door p{color:var(--ink-2);font-size:.95rem}
.bs-door dl{margin-top:auto;padding-top:12px;border-top:1px solid var(--rule);font-size:.88rem}
.bs-door dt{font-weight:600;color:var(--ink)}
.bs-door dd{color:var(--ink-2)}

/* chain: a horizontal run of stages joined by one line */
.bs-chain{list-style:none;padding:0;display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));gap:0;margin-top:40px;position:relative}
.bs-chain::before{content:"";position:absolute;left:0;right:0;top:22px;height:3px;background:var(--asphalt-3)}
.bs-chain li{position:relative;padding:62px 18px 0 0}
.bs-chain li::before{content:attr(data-n);position:absolute;left:0;top:0;width:47px;height:47px;border-radius:50%;display:grid;place-items:center;font:600 1.1rem/1 var(--d);background:var(--asphalt);border:3px solid var(--amber);color:var(--white)}
.bs-chain b{display:block;font:600 1.3rem/1.05 var(--d);text-transform:uppercase}
.bs-chain p{margin-top:8px;font-size:.92rem;color:var(--haze);max-width:30ch}
.bs-chain .who{display:inline-block;margin-top:10px;font-size:.76rem;font-weight:600;padding:2px 8px;border-radius:2px;background:var(--asphalt-2);color:var(--haze-2)}
.bs-chain .who.us{background:var(--amber);color:var(--amber-ink)}
.bs-light .bs-chain::before{background:var(--rule)}
.bs-light .bs-chain li::before{background:var(--haze-2)}
.bs-light .bs-chain li::before{color:var(--ink)}
.bs-light .bs-chain p{color:var(--ink-2)}
.bs-light .bs-chain .who{background:var(--haze);color:var(--ink)}
.bs-light .bs-chain .who.us{background:var(--amber);color:var(--amber-ink)}

/* comparison matrix */
.bs-scroll{overflow-x:auto}
.bs-matrix{width:100%;min-width:760px;border-collapse:collapse}
.bs-matrix th,.bs-matrix td{text-align:left;vertical-align:top;padding:14px 16px;border-bottom:1px solid var(--rule);font-size:.94rem}
.bs-matrix thead th{vertical-align:bottom;font:600 1.25rem/1.05 var(--d);text-transform:uppercase;border-bottom:2px solid var(--ink);padding-top:0}
.bs-matrix thead th a{text-decoration:none}
.bs-matrix thead th a:hover{text-decoration:underline;text-decoration-color:var(--amber);text-decoration-thickness:3px}
.bs-matrix thead img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;margin-bottom:12px}
.bs-matrix tbody th{font:600 1.05rem/1.15 var(--d);text-transform:uppercase;width:16%;color:var(--ink)}
.bs-matrix td{color:var(--ink-2)}
.bs-matrix td.none{color:var(--ink-2);font-size:.86rem}
.bs-matrix td.none span{display:inline-block;padding:1px 8px;border:1px dashed var(--asphalt-3)}
.bs-matrix td b{color:var(--ink);font-weight:600}
.bs-matrix .chipline{display:flex;flex-wrap:wrap;gap:6px}
.bs-matrix .chipline span{font-size:.84rem;padding:3px 8px;background:#fff;border:1px solid var(--rule);border-radius:2px;color:var(--ink)}
.bs-tint .bs-matrix .chipline span{background:#fff}

/* trio: three columns, each with a photo */
.bs-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:8px}
.bs-trio article{display:flex;flex-direction:column;background:var(--asphalt-2)}
.bs-trio article.is-us{outline:3px solid var(--amber);outline-offset:-3px}
.bs-trio figure{margin:0;aspect-ratio:16/10;overflow:hidden}
.bs-trio figure img{width:100%;height:100%;object-fit:cover}
.bs-trio h3{font:600 1.7rem/1 var(--d);text-transform:uppercase;padding:20px 22px 0}
.bs-trio ul{list-style:none;padding:10px 22px 22px}
.bs-trio li{padding:9px 0;border-bottom:1px solid var(--asphalt-3);color:var(--haze-2);font-size:.94rem}
.bs-trio li:last-child{border-bottom:0}

/* product lines with honest record (overview) */
.bs-lines{list-style:none;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.bs-lines a{display:flex;flex-direction:column;height:100%;text-decoration:none;background:#fff;color:var(--ink)}
.bs-lines figure{margin:0;aspect-ratio:1;overflow:hidden}
.bs-lines img{width:100%;height:100%;object-fit:contain;padding:14px;transition:transform .8s var(--ease)}
.bs-lines a:hover img{transform:scale(1.04)}
.bs-lines div{padding:14px 16px 18px;background:var(--haze-3);flex:1;display:flex;flex-direction:column;gap:6px}
.bs-lines b{font:600 1.35rem/1.05 var(--d);text-transform:uppercase}
.bs-lines a:hover b{text-decoration:underline;text-decoration-color:var(--amber);text-decoration-thickness:3px}
.bs-lines small{font-size:.86rem;color:var(--ink-2)}
.bs-lines .tag{margin-top:auto}

/* range chart: top speed by line, from supplier sheets */
.bs-range{margin:0}
.bs-range ol{list-style:none;padding:0;border-top:1px solid var(--asphalt-3)}
.bs-range li{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);align-items:center;gap:20px;min-height:64px;border-bottom:1px solid var(--asphalt-3)}
.bs-range li>a{font:600 1.25rem/1.05 var(--d);text-transform:uppercase;text-decoration:none;color:var(--white)}
.bs-range li>a span{display:block;font:400 .8rem/1.3 var(--f);text-transform:none;color:var(--haze)}
.bs-range li>a:hover{color:var(--amber)}
.bs-track{position:relative;height:64px;margin-right:64px;background:linear-gradient(90deg,var(--asphalt-3) 1px,transparent 1px) 0 0/16.666% 100%}
.bs-track i{position:absolute;top:50%;left:calc(var(--a)/60*100%);width:max(14px,calc((var(--b) - var(--a))/60*100%));height:12px;transform:translateY(-50%);background:var(--amber);border-radius:6px}
.bs-track i::after{content:attr(data-l);position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);white-space:nowrap;font:500 .86rem/1 var(--f);color:var(--haze-2);font-variant-numeric:tabular-nums}
.bs-axis{position:relative;height:28px;margin:0 64px 0 210px}
.bs-axis span{position:absolute;top:8px;left:calc(var(--v)/60*100%);transform:translateX(-50%);font-size:.78rem;color:var(--haze);font-variant-numeric:tabular-nums}
.bs-range figcaption{margin-top:12px;font-size:.82rem;color:var(--haze)}

/* swatch strip: one model, several finishes */
.bs-swatch{list-style:none;padding:0;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:10px}
.bs-swatch li{background:#fff;display:flex;flex-direction:column}
.bs-swatch img{width:100%;aspect-ratio:4/3;object-fit:contain;padding:8px}
.bs-swatch.wall img{object-fit:cover;padding:0}
.bs-swatch span{display:block;padding:8px 10px;font-size:.82rem;font-weight:600;color:var(--ink-2);background:var(--haze-3);border-top:3px solid var(--sw,var(--rule))}

/* parts board on asphalt */
.bs-parts{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.bs-parts li{display:flex;flex-direction:column;background:var(--asphalt-2)}
.bs-parts figure{margin:0;aspect-ratio:4/3;overflow:hidden;background:#e9ecec}
.bs-parts img{width:100%;height:100%;object-fit:cover}
.bs-parts b{display:block;padding:14px 16px 0;font:600 1.3rem/1.05 var(--d);text-transform:uppercase}
.bs-parts p{padding:6px 16px 16px;font-size:.9rem;color:var(--haze)}
.bs-parts li.text{justify-content:flex-end;background:transparent;border:1px solid var(--asphalt-3);padding:6px 0}

/* question board (first-time) */
.bs-qboard{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:2px solid var(--ink)}
.bs-qboard li{position:relative;padding:22px 22px 26px 0;border-bottom:1px solid var(--rule)}
.bs-qboard li:not(:nth-child(4n+1)){padding-left:22px;border-left:1px solid var(--rule)}
.bs-qboard .n{display:block;font:700 2.6rem/1 var(--d);color:var(--amber)}
.bs-qboard h3{font:600 1.4rem/1.05 var(--d);text-transform:uppercase;margin-top:10px}
.bs-qboard p{margin-top:8px;color:var(--ink-2);font-size:.93rem}
.bs-qboard .who{display:inline-block;margin-top:12px;font-size:.76rem;font-weight:600;padding:2px 8px;border-radius:2px;background:var(--haze);color:var(--ink)}
.bs-qboard .who.us{background:var(--amber);color:var(--amber-ink)}
.bs-qboard .who.both{background:var(--asphalt);color:var(--white)}
.bs-key{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:18px;font-size:.88rem;color:var(--ink-2)}
.bs-key span{display:inline-flex;align-items:center;gap:8px}
.bs-key i{display:inline-block;width:22px;height:12px;border-radius:2px;background:var(--haze)}
.bs-key i.us{background:var(--amber)}
.bs-key i.both{background:var(--asphalt)}

/* ledger with a thumbnail per row (importers) */
.bs-ledger{list-style:none;padding:0;border-top:2px solid var(--ink)}
.bs-ledger li{display:grid;grid-template-columns:180px minmax(0,4fr) minmax(0,6fr);gap:16px 40px;align-items:center;padding:22px 0;border-bottom:1px solid var(--rule)}
.bs-ledger figure{margin:0;aspect-ratio:4/3;background:#fff;overflow:hidden}
.bs-ledger figure img{width:100%;height:100%;object-fit:cover}
.bs-ledger figure.plate img{object-fit:contain;padding:8px}
.bs-ledger h3{font:600 clamp(1.4rem,2vw,1.85rem)/1.06 var(--d);text-transform:uppercase}
.bs-ledger p{color:var(--ink-2);max-width:60ch}
.bs-ledger .link{display:inline-block;margin-top:6px;color:var(--ink)}

/* container density on a light band */
.bs-light-load .load{border-top-color:var(--rule)}
.bs-light-load .load-row{border-bottom-color:var(--rule)}
.bs-light-load .load-name a{color:var(--ink)}
.bs-light-load .load-name a:hover{color:var(--asphalt-3)}
.bs-light-load .load-name span,.bs-light-load .load-note{color:var(--ink-2)}
.bs-light-load .load-box b{color:var(--ink)}
.bs-light-load .units i{background:var(--asphalt)}
.bs-light-load .load-row.amber .units i{background:var(--amber)}
.bs-light-load .seg{border-color:var(--asphalt-3);background:#fff}
.bs-light-load .seg button{color:var(--ink)}
.bs-light-load .seg button[aria-pressed="true"]{background:var(--asphalt);color:var(--white)}
.bs-light-load .load-lead{color:var(--ink-2)}
.load-box .na{font-size:.9rem;color:var(--ink-2);padding:2px 8px;border:1px dashed var(--asphalt-3)}

/* factor chips (local rules) */
.bs-factors{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bs-factors li{padding:14px 16px;background:var(--haze-3);border-top:1px solid var(--rule)}
.bs-factors b{display:block;font:600 1.15rem/1.1 var(--d);text-transform:uppercase}
.bs-factors span{display:block;margin-top:4px;font-size:.9rem;color:var(--ink-2)}

/* sticky figure next to a path, dark */
.bs-path-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,72px);margin-top:44px;align-items:start}
.bs-path-fig{position:sticky;top:24px;margin:0}
.bs-path-fig img{width:100%;aspect-ratio:4/5;object-fit:cover}
.bs-path-fig figcaption{font-size:.82rem;color:var(--haze);padding-top:10px}

/* split with media, generic */
.bs-split{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(28px,4vw,72px);align-items:center}
.bs-split.r{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
.bs-split.w48{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.bs-split.w57{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.bs-split .lede{margin-top:18px;max-width:56ch}
.bs-split p.more{margin-top:14px;max-width:62ch;color:var(--ink-2)}
.bs-dark .bs-split p.more{color:var(--haze)}
.bs-fig{margin:0}
.bs-fig img{width:100%;aspect-ratio:4/3;object-fit:cover}
.bs-fig.plate{background:#fff;padding:12px}
.bs-fig.plate img{object-fit:contain}
.bs-fig figcaption{font-size:.82rem;color:var(--ink-2);padding-top:10px}
.bs-dark .bs-fig figcaption{color:var(--haze)}
.bs-pair-fig{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bs-pair-fig img{width:100%;aspect-ratio:4/5;object-fit:cover}
.bs-pair-fig figcaption{grid-column:1/-1;font-size:.82rem;color:var(--ink-2)}

/* stat callout */
.bs-stat{display:flex;align-items:baseline;gap:14px;margin-top:22px;padding:16px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule)}
.bs-stat b{font:700 clamp(3rem,5vw,4.4rem)/.9 var(--d);color:var(--ink);font-variant-numeric:tabular-nums}
.bs-stat span{color:var(--ink-2);max-width:36ch;font-size:.94rem}

/* responsive */
@media (max-width:1100px){
  .bs-doors{grid-template-columns:1fr 1fr}
  .bs-lines{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bs-parts{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bs-qboard{grid-template-columns:1fr 1fr}
  .bs-qboard li:not(:nth-child(4n+1)){padding-left:0;border-left:0}
  .bs-qboard li:nth-child(2n){padding-left:22px;border-left:1px solid var(--rule)}
}
@media (max-width:1000px){
  .bs-head,.bs-split,.bs-split.r,.bs-split.w48,.bs-split.w57,.bs-path-grid{grid-template-columns:1fr}
  .bs-head .bs-intro{justify-self:start}
  .bs-path-fig{position:relative;top:auto}
  .bs-path-fig img{aspect-ratio:16/9}
  .bs-trio{grid-template-columns:1fr}
  .bs-trio article{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
  .bs-trio figure{grid-row:1/3;aspect-ratio:auto;min-height:220px}
  .bs-chain{grid-template-columns:1fr;gap:0;margin-top:28px}
  .bs-chain::before{left:22px;right:auto;top:0;bottom:0;width:3px;height:auto}
  .bs-chain li{padding:0 0 28px 72px;min-height:64px}
  .bs-chain p{max-width:56ch}
  .bs-ledger li{grid-template-columns:140px minmax(0,1fr);align-items:start}
  .bs-ledger li>div:last-child{grid-column:2}
}
@media (max-width:760px){
  .bs-swatch{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  .bs-doors,.bs-qboard,.bs-factors{grid-template-columns:1fr}
  .bs-qboard li:nth-child(2n){padding-left:0;border-left:0}
  .bs-door figure{aspect-ratio:16/10}
  .bs-lines{grid-template-columns:1fr 1fr}
  .bs-parts{grid-template-columns:1fr 1fr}
  .bs-trio article{display:flex}
  .bs-trio figure{min-height:0;aspect-ratio:16/10}
  .bs-ledger li{grid-template-columns:96px minmax(0,1fr);gap:10px 16px}
  .bs-range li{grid-template-columns:1fr;gap:0;padding-top:12px}
  .bs-track{margin-right:72px;height:44px}
  .bs-axis{margin-left:0;margin-right:72px}
  .bs-stat{flex-direction:column;gap:6px}
}

/* faq band and closing tiles */
.bs-faq{padding-block:clamp(48px,6vw,80px)}
.bs-faq .split{padding-block:0}
.bs-more{padding-block:clamp(48px,6vw,80px) clamp(64px,8vw,104px)}
.bs-dark .pair p{background:var(--asphalt-2);color:var(--haze-2)}
.bs-dark .pair strong{color:var(--white)}
.bs-dark .outcomes li{background:var(--asphalt-2);border-top-color:var(--haze)}
.bs-dark .outcomes li:nth-child(2){border-top-color:var(--amber)}
.bs-dark .outcomes p{color:var(--haze)}
.bs-dark .bars li span{color:var(--haze-2)}
.bs-dark .mosaic{height:clamp(420px,42vw,600px)}
.bs-matrix tbody th small{font:500 .78rem/1 var(--f);text-transform:none;color:var(--ink-2)}
.bs-matrix tbody th a{text-decoration:none}
.bs-matrix tbody th a:hover{text-decoration:underline;text-decoration-color:var(--amber)}
.bs-light>.bs-chain{margin-top:56px}
@media (max-width:1000px){.step .flow{grid-template-columns:1fr 1fr!important}}
@media (max-width:600px){.step .flow{grid-template-columns:1fr!important}}
.bs-light .bs-chain .who.both{background:var(--asphalt);color:var(--white)}
.bs-light .bs-chain li::before{color:var(--ink)}
/* fixes after review */
.bs .route-wrap .note-line{border-top-color:var(--asphalt-3);color:var(--haze)}
.bs .route-wrap .checklist li{border-top-color:var(--asphalt-3);color:var(--haze-2)}
.bs .route-wrap .mini-h{color:var(--white)}
.bs-matrix{table-layout:fixed}
.bs-axis span{white-space:nowrap}
.bs-chart-fig img{max-height:520px;width:auto;margin-inline:auto}
.step-wide>.wrap>.bs-split{margin-top:clamp(32px,4vw,56px)}
@media (max-width:600px){.bs-axis span.odd{display:none}.bs-chart-fig img{max-height:420px}}
/* S6 contrast pass: large amber numerals on light paper need deep amber */
.bs-qboard .n{color:var(--amber-deep)}
.bs-dark .bs-qboard .n{color:var(--amber)}
