/* Homepage v3 (layout modelled on complion.io section flow; Backfill copy, green brand, no images). */
.home h1,.home h2{letter-spacing:-.02em;color:var(--bf-color-brand-ink)}
.home h2{font-size:clamp(1.7rem,3.2vw,2.5rem);line-height:1.12;margin:0 0 .75rem}
.v3-eyebrow{font-family:var(--mono);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brand);margin:0 0 .75rem;font-weight:600}
.v3-lead{color:var(--ink-2);font-size:1.06rem;max-width:42rem;margin:0 0 1.25rem}
.v3-section{padding:5rem 0}
.v3-tint{background:var(--bf-color-brand-tint-2)}
.v3-split{display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center}
.v3-card{background:#fff;border:1px solid var(--bf-color-line);border-radius:16px;padding:1.4rem 1.5rem}
.v3-card h3{margin:.25rem 0 .4rem;font-size:1.1rem;color:var(--bf-color-brand-ink)}
.v3-card p{margin:0;color:var(--ink-2)}
.v3-card-t{font-weight:750;font-size:1.15rem;color:var(--bf-color-brand-ink);display:flex;align-items:center;gap:.5rem;justify-content:space-between}
.v3-card-sub{display:block;color:var(--brand);font-weight:650;margin:.25rem 0 .5rem}
.v3-card-big{font-size:1.6rem;font-weight:800;color:#fff!important;margin:.1rem 0 .5rem!important;line-height:1.15}
.v3-card-brand{background:var(--brand);border-color:var(--brand)}
.v3-card-brand p,.v3-card-brand .v3-eyebrow{color:#d6efe5}
.v3-tag{font-family:var(--mono);font-size:.7rem;font-weight:700;background:var(--brand-tint);color:var(--brand-2);border-radius:999px;padding:.15rem .55rem;letter-spacing:.04em}
.v3-list{margin:0;padding:0;list-style:none;display:grid;gap:.45rem}
.v3-list li{padding-left:1.1rem;position:relative;color:var(--ink-2)}
.v3-list li::before{content:"";position:absolute;left:0;top:.6em;width:.45rem;height:.45rem;border-radius:50%;background:var(--crit)}
.v3-two{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:0;padding:0;list-style:none}
.v3-two-lg{gap:1.5rem}
.v3-card-lg{padding:2rem}
.v3-card-lg h2{font-size:clamp(1.5rem,2.6vw,2rem)}
.v3-btn-lg{min-height:48px;padding:.85rem 1.4rem;font-size:1rem}
.v3-cta-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;margin:1.5rem 0 0}
.v3-center{justify-content:center}

/* hero */
.v3-hero{padding:4.5rem 0 3.5rem}
.v3-hero-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:3.5rem;align-items:center}
.v3-hero h1{font-size:clamp(2.3rem,5.4vw,4.1rem);line-height:1.04;margin:0 0 1.25rem;font-weight:850}
.v3-mark{background:linear-gradient(transparent 62%,#bfe6d4 62%);padding:0 .1em}
.v3-sub{font-size:1.15rem;color:var(--ink-2);max-width:36rem;margin:0}
.v3-note{color:var(--muted);font-size:.9rem;margin:.9rem 0 1.25rem}
.v3-chip-link{display:inline-flex;align-items:center;gap:.6rem;border:1px solid var(--line);border-radius:12px;padding:.55rem .85rem;color:var(--ink-2);text-decoration:none;font-size:.92rem;min-height:44px}
.v3-chip-link:hover{border-color:var(--brand)}
.v3-chip{font-family:var(--mono);font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;background:var(--brand-tint);color:var(--brand-2);border-radius:6px;padding:.2rem .45rem}
.v3-panel{border:2px solid var(--bf-color-brand-ink);border-radius:6px;background:#fff;padding:1.1rem 1.25rem}
.v3-panel-h{font-size:1.6rem;font-weight:850;color:var(--bf-color-brand-ink);margin:0 0 .5rem;padding-bottom:.4rem;border-bottom:8px solid var(--bf-color-brand-ink);letter-spacing:-.02em}
.v3-panel-rows{margin:0}
.v3-panel-rows div{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--bf-color-line-strong);font-size:.95rem}
.v3-panel-rows div:last-child{border-bottom:5px solid var(--bf-color-brand-ink)}
.v3-panel-rows dt{font-weight:700}
.v3-panel-rows dd{margin:0;text-align:right;color:var(--ink-2)}

/* strip + facts */
.v3-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.1rem 0}
.v3-strip-row{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 2rem}
.v3-strip .v3-eyebrow{margin:0}
.v3-strip ul{display:flex;flex-wrap:wrap;gap:.5rem 1.75rem;margin:0;padding:0;list-style:none;font-weight:650;color:var(--bf-color-brand-ink)}
.v3-facts{padding:3.5rem 0}
.v3-facts-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin:0;padding:0;list-style:none}
.v3-facts-grid b{display:block;font-size:1.9rem;font-weight:850;color:var(--brand);letter-spacing:-.02em}
.v3-facts-grid span{color:var(--ink-2);font-size:.95rem}

/* stakes */
.v3-stakes{display:grid;grid-template-columns:1fr 1fr;gap:1rem}

/* demo */
.demo{display:grid;grid-template-columns:1.15fr 1fr;gap:2rem;align-items:start;background:#fff;border:1px solid var(--bf-color-line);border-radius:20px;padding:2rem;margin-top:1.5rem}
.demo-stage{display:grid;gap:1rem}
.lbl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;padding:1rem .5rem 1.5rem;background:radial-gradient(ellipse at 50% 40%,#f3f7f4,#e6eee9);border-radius:16px}
.pouch{position:relative;margin:0}
.pouch-front{transform:rotate(-4deg) translateY(6px)}
.pouch-back{transform:rotate(3deg)}
.pouch-svg{display:block;width:100%;height:auto;overflow:visible}
.pouch-tag{position:absolute;top:-.4rem;left:50%;transform:translateX(-50%);font:600 .68rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#4b5b53}
.ps-ridge{stroke:#000;stroke-opacity:.12;stroke-width:1}
.ps-fold{fill:none;stroke:#000;stroke-opacity:.18;stroke-width:1.2}
.ps-crinkle{fill:none;stroke:#fff;stroke-opacity:.22;stroke-width:1.4;stroke-linecap:round}
.ps-crinkle-d{fill:none;stroke:#000;stroke-opacity:.1;stroke-width:1.4;stroke-linecap:round}
.pouch-svg text{font-family:inherit}
.pf-brand{fill:#cfe3ef;font:700 11px var(--mono);letter-spacing:.2em;text-anchor:middle}
.pf-name{fill:#fff;font-size:27px;font-weight:850;text-anchor:middle}
.pf-flav{fill:#f6d38b;font-size:14px;font-weight:650;text-anchor:middle}
.pf-wt{fill:#fff;font-size:15px;font-weight:700;text-anchor:middle}
.pf-fop-miss{fill:none;stroke:#f6d38b;stroke-width:2;stroke-dasharray:5 4}
.pf-q{fill:#f6d38b;font-size:22px;font-weight:800;text-anchor:middle}
.pf-sym{fill:#000;font-size:10px;font-weight:800}.pf-sym-b{font-size:12px}
.pb-brand{fill:#6b6252;font:600 8.5px var(--mono);letter-spacing:.06em}
.pb-h{fill:#1f1f1f;font-size:11px;font-weight:800;letter-spacing:.05em}
.pb-t{fill:#2a2a2a;font-size:12px}.pb-c{font-size:11.2px}.pb-m{fill:#555}.pb-b{font-weight:800}
.pb-small{fill:#666;font-size:8.5px}.pb-nf{fill:#111;font-size:9.5px;font-weight:800}
.pb-hl{fill:#fde7e4;stroke:#e5484d;stroke-width:1.5}
.lbl-fixed-only{display:none}
.is-fixed .lbl-fixed-only{display:inline}
.is-fixed .lbl-before-only{display:none}
.pin{position:absolute;width:32px;height:32px;border-radius:50%;border:2px solid #fff;font-weight:800;font-size:.9rem;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px rgba(0,0,0,.25);font-family:inherit;color:#fff}
.pin.is-crit{background:var(--bf-color-crit)}
.pin.is-warn{background:var(--bf-color-warn)}
.pin:hover,.pin.is-open{transform:scale(1.12)}
.pin:focus-visible{outline:3px solid var(--bf-color-brand-ink);outline-offset:2px}
.pin-1{left:62%;top:57%}
.pin-2{left:86%;top:35.5%}
.pin-3{left:6%;top:70%}
.pin-4{left:3%;top:52%}
.pin[hidden]{display:none}
.demo-bar{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.demo-bar .btn{min-height:44px}
.demo-status{margin:0;color:var(--muted);font-size:.9rem}
.demo-cards{min-height:100%}
.demo-hint{border:1px dashed var(--bf-color-line-strong);border-radius:14px;padding:1.5rem;color:var(--muted);margin:0;text-align:center}
.demo-hint[hidden]{display:none}
.pin-card{border:1.5px solid var(--bf-color-brand-ink);border-radius:14px;padding:1.2rem 1.25rem;background:#fff;box-shadow:var(--bf-shadow-md)}
.pin-card h3{margin:.35rem 0 .75rem;font-size:1.15rem;color:var(--bf-color-brand-ink)}
.pc-eyebrow{display:flex;align-items:center;gap:.5rem;margin:0;font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.pc-num{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;color:#fff;font-weight:800;font-size:.78rem;flex:none;font-family:var(--font);letter-spacing:0}
.pc-num.is-crit{background:var(--bf-color-crit)}
.pc-num.is-warn{background:var(--bf-color-warn)}
.pc-fix{margin:0 0 .75rem;display:grid;gap:.5rem}
.pc-fix dt{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.pc-fix dd{margin:.15rem 0 0;padding:.45rem .6rem;border-radius:8px;font-size:.93rem}
.pc-before{background:var(--bf-color-crit-bg);color:#7a271a;text-decoration:line-through;text-decoration-color:rgba(122,39,26,.5)}
.pc-after{background:var(--bf-color-ok-bg);color:#05603a}
.pc-cite{margin:0;font-size:.88rem;color:var(--ink-2)}
.pc-src{font-family:var(--mono);font-size:.82rem;color:var(--brand)}
.v3-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:2rem 0 0;padding:0;list-style:none}

/* rule section */
.v3-excerpt{display:grid;gap:.75rem}
.v3-ex-label{background:#fff;border:2px solid var(--bf-color-brand-ink);border-radius:6px;padding:1rem 1.1rem}
.v3-ex-label p{margin:0 0 .3rem}
.v3-ex-hl{background:#fff4d6;outline:2px solid #e8a33d;border-radius:2px;color:inherit}
.v3-ex-note{display:flex;gap:.6rem;align-items:flex-start;margin:0;background:#fff;border:1.5px solid var(--bf-color-brand-ink);border-radius:12px;padding:.75rem .9rem}

/* review/privacy */
.v3-dl{margin:1rem 0;display:grid}
.v3-dl div{border-top:1px solid var(--line);padding:.75rem 0}
.v3-dl dt{font-weight:700}
.v3-dl dd{margin:.15rem 0 0;color:var(--ink-2);font-size:.95rem}

/* how */
.v3-how{display:grid;grid-template-columns:1fr 1.2fr;gap:1.5rem;align-items:stretch}
.v3-steps{display:grid;gap:.75rem}
.v3-step{display:flex;gap:1rem;align-items:center;text-align:left;background:#fff;border:1.5px solid var(--bf-color-line-strong);border-radius:14px;padding:1rem 1.2rem;font:inherit;color:inherit;cursor:pointer;min-height:44px}
.v3-step b{display:block;font-size:1.05rem}
.v3-step span span{color:var(--ink-2);font-size:.9rem}
.v3-step-n{font-family:var(--mono);font-size:.85rem;color:var(--muted)}
.v3-step[aria-selected=true]{background:var(--brand);border-color:var(--brand);color:#fff}
.v3-step[aria-selected=true] span span,.v3-step[aria-selected=true] .v3-step-n{color:#d6efe5}
.v3-step:focus-visible{outline:3px solid var(--bf-color-brand-ink);outline-offset:2px}
.v3-panels{background:#fff;border-radius:18px;box-shadow:var(--bf-shadow-md);padding:1.75rem;display:grid}
.v3-pane h3{margin:.5rem 0;font-size:1.3rem;color:var(--bf-color-brand-ink)}
.v3-pane p{color:var(--ink-2)}
.v3-pane .pc-after{padding:.6rem .75rem;border-radius:8px}
.v3-file{font-family:var(--mono);font-size:.85rem;display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:.75rem}
.v3-bar{display:block;height:8px;border-radius:99px;background:var(--brand-tint);margin-top:1rem}
.v3-bar i{display:block;height:100%;width:100%;border-radius:99px;background:var(--brand)}

/* comparison */
.v3-table-wrap{overflow-x:auto;border:1px solid var(--bf-color-line);border-radius:16px;background:#fbfcfb}
.v3-table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:560px}
.v3-table th,.v3-table td{padding:1rem 1.2rem;text-align:left;border-bottom:1px solid #e6ece9;vertical-align:top}
.v3-table tbody tr:last-child th,.v3-table tbody tr:last-child td{border-bottom:0}
.v3-table thead th{font-weight:650;color:var(--ink-2)}
.v3-table td{color:var(--ink-2)}
.v3-table .is-us{background:#fff;color:var(--bf-color-brand-ink);font-weight:650}
.v3-table thead .is-us{color:var(--brand)}

/* tools + faq + close */
.v3-head-row{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap;margin-bottom:1.25rem}
.v3-head-row h2{margin:0}
.v3-card-link{display:grid;gap:.25rem;text-decoration:none;color:var(--ink-2);height:100%}
.v3-card-link:hover{border-color:var(--brand)}
.v3-faq{display:grid;grid-template-columns:1fr 1.6fr;gap:3rem}
.v3-faq details{padding:1.1rem 0}
.v3-close{padding:5rem 0;text-align:center;background:var(--bf-color-brand-ink);color:#d6efe5}
.v3-close h2{color:#fff}
.v3-close p{margin:0}
.v3-close .btn-ghost{background:transparent;color:#fff;border-color:#5c8f7b}

/* mobile sticky CTA (shown <=640px only) */
.h-sticky-cta{display:none}
@media (prefers-reduced-motion:no-preference){.h-sticky-cta{transition:transform .2s ease,visibility .2s}.pin{transition:transform .15s}}
@media (max-width:960px){
  .v3-hero-grid,.v3-split,.demo,.v3-how,.v3-faq{grid-template-columns:1fr}
  .v3-facts-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
  .v3-tools{grid-template-columns:1fr}
}
@media (max-width:640px){
  .v3-facts-grid{grid-template-columns:1fr;gap:1rem}
  .v3-section{padding:3.5rem 0}
  .v3-two,.v3-stakes{grid-template-columns:1fr}
  .demo{padding:1rem}
  .lbl{grid-template-columns:1fr;gap:1.5rem;padding:1.25rem .5rem 1.25rem;justify-items:center}
  .pouch{width:88%}
  .pin{width:28px;height:28px;font-size:.8rem}
  .h-sticky-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:40;padding:.75rem 1.25rem;background:#fff;border-top:1px solid var(--line);box-shadow:0 -6px 16px rgba(15,27,45,.06)}
  .h-sticky-cta .btn{width:100%;min-height:48px}
  .h-sticky-cta.is-hidden{transform:translateY(100%);visibility:hidden}
}
@media (forced-colors:active){.lbl-hl,.v3-ex-hl{outline:2px solid Mark}.pin{border:2px solid ButtonText}.v3-card,.pin-card{border:1px solid CanvasText}}

/* ---- v4 ---- */
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
main [id],main section{scroll-margin-top:84px}
.v4-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none}
.v4-chips li{border:1px solid var(--bf-color-line-strong);background:var(--bf-color-brand-tint-2);color:var(--bf-color-brand-ink);border-radius:999px;padding:.4rem .8rem;font-weight:600;font-size:.92rem}
.v4-refs{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.5rem 0;text-align:center}
.v4-refs h2{margin:0 0 .75rem}
.v4-logos{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;align-items:center;justify-items:center;margin:0;padding:0;list-style:none}
.v4-logos img{width:100%;max-width:200px;height:auto;filter:grayscale(1);opacity:.85}
.v4-fine{margin:.75rem 0 0;color:var(--muted);font-size:.82rem}
.v4-tabs{margin-top:1.25rem;max-width:640px}
.v4-tablist{display:inline-flex;flex-wrap:wrap;gap:.25rem;background:var(--bf-color-brand-tint);border-radius:999px;padding:.3rem}
.v4-tablist [role=tab]{min-height:44px;border:0;background:transparent;border-radius:999px;padding:.5rem 1rem;font:inherit;font-weight:650;color:var(--bf-color-brand-ink);cursor:pointer}
.v4-tablist [role=tab][aria-selected=true]{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.v4-tablist [role=tab]:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
.v4-pane{margin-top:1rem;background:#fff;border:1px solid var(--bf-color-line);border-radius:16px;padding:1.25rem 1.5rem}
.v4-pane:not([hidden]){animation:v4in .25s ease-out}
.v4-pane.is-us{border-color:var(--brand)}
.v4-big{font-size:1.6rem;font-weight:800;color:var(--bf-color-crit);margin:0 0 .25rem}
.v4-pane p{margin:0}
.v4-ticks,.v4-x{margin:0;padding:0;list-style:none;display:grid;gap:.5rem;font-weight:600}
.v4-ticks li::before{content:"✓ ";color:var(--brand)}
.v4-x li::before{content:"– ";color:var(--muted)}
@keyframes v4in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.v4-pane:not([hidden]){animation:none}}
/* demo: pack left, list right */
.v4-demo{grid-template-columns:1.2fr 1fr}
.v4-list-h{margin:0 0 .75rem;font-size:1.05rem;color:var(--bf-color-brand-ink)}
.iss-list{margin:0;padding:0;list-style:none;display:grid;gap:.5rem}
.iss{border:1px solid var(--bf-color-line);border-radius:12px;background:#fff;transition:border-color .15s,box-shadow .15s}
.iss.is-open{border-color:var(--bf-color-brand-ink);box-shadow:var(--bf-shadow-md)}
.iss-btn{display:flex;align-items:center;gap:.65rem;width:100%;min-height:48px;padding:.6rem .8rem;border:0;background:transparent;font:inherit;font-weight:650;color:var(--bf-color-brand-ink);text-align:left;cursor:pointer;border-radius:12px}
.iss-btn:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
.iss-btn::after{content:"+";margin-left:auto;font-weight:700}
.iss-btn[aria-expanded=true]::after{content:"–"}
.iss .pin-card{border:0;box-shadow:none;padding:0 .8rem .8rem;background:transparent}
.pin.is-open{transform:scale(1.18);box-shadow:0 0 0 4px #fff,0 0 0 7px var(--bf-color-brand-ink)}
@media (prefers-reduced-motion:reduce){.iss,.pin{transition:none}}
/* before/after slider */
.v4-ba{display:grid;gap:.75rem}
.v4-ba-view{position:relative;border:1px solid var(--bf-color-line);border-radius:14px;overflow:hidden;background:#fff;min-height:150px}
.v4-ba-layer{position:absolute;inset:0;padding:1rem 1.25rem}
.v4-ba-layer p{margin:0 0 .4rem}
.v4-ba-after{background:var(--bf-color-ok-bg);border-left:3px solid var(--bf-color-ok)}
.v4-ba-ctl{display:grid;gap:.25rem;font-weight:600;font-size:.9rem}
.v4-ba-ctl input{width:100%;min-height:44px;accent-color:var(--brand)}
@media (max-width:860px){.v4-logos{grid-template-columns:1fr 1fr}.v4-demo{grid-template-columns:1fr}.v4-ba-view{min-height:190px}}
.v4-refs h2.v3-eyebrow{font-size:.8rem;letter-spacing:.12em;margin:0 0 .75rem}
.v4-ba-layer .lbl-h{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.v4-ba-after .lbl-h{text-align:right;color:var(--bf-color-ok)}

/* ---- v5: built on design/tokens.json (public/css/tokens.css). Overrides earlier one-off values. ---- */
.v3-section{padding:var(--bf-space-section) 0}
.v3-tint{background:var(--bf-color-brand-tint-2)}
.v3-eyebrow{font:600 var(--bf-text-xs)/1.2 var(--bf-font-mono);letter-spacing:var(--bf-tracking-eyebrow);color:var(--bf-color-brand);margin:0 0 var(--bf-space-3)}
.v3-lead{font-size:var(--bf-text-lg);line-height:var(--bf-leading-body);max-width:var(--bf-measure-sub);margin:0 0 var(--bf-space-6)}
.home h2{font-family:var(--bf-font-display);font-size:clamp(var(--bf-text-2xl),3.4vw,var(--bf-text-3xl));line-height:var(--bf-leading-snug);letter-spacing:var(--bf-tracking-heading);color:var(--bf-color-brand-ink);font-weight:800}
.v3-facts-grid b{font-variant-numeric:tabular-nums;font-size:var(--bf-text-3xl)}
.btn{transition:background-color var(--bf-dur-fast) var(--bf-ease-out),transform var(--bf-dur-fast) var(--bf-ease-out),box-shadow var(--bf-dur-fast) var(--bf-ease-out)}
.btn:active{transform:translateY(1px) scale(.98)}
.btn:focus-visible,.v5-stage:focus-visible{outline:none;box-shadow:var(--bf-shadow-focus)}
/* hero (arena winner A) */
.v3-hero{padding:var(--bf-space-16) 0 var(--bf-space-24)}
.v3-hero-grid{grid-template-columns:1fr 1.05fr;gap:var(--bf-space-12)}
.v3-hero h1{font-size:clamp(var(--bf-text-3xl),5.2vw,var(--bf-text-5xl));line-height:var(--bf-leading-tight);letter-spacing:var(--bf-tracking-display);color:var(--bf-color-brand-ink);max-width:14ch;margin:0 0 var(--bf-space-5)}
.v3-mark{background:linear-gradient(transparent 62%,var(--bf-color-brand-tint) 62%)}
.v3-sub{font-size:var(--bf-text-lg);max-width:var(--bf-measure-sub);margin:0}
.v3-hero .v3-cta-row{margin-top:var(--bf-space-8)}
.v5-stage{position:relative;display:block;height:520px;border-radius:var(--bf-radius-xl);background:radial-gradient(120% 90% at 60% 40%,var(--bf-color-brand-tint),var(--bf-color-brand-tint-2) 60%,var(--bf-color-surface));text-decoration:none;color:var(--bf-color-ink)}
.v5-pack{position:absolute;width:250px;height:auto;filter:drop-shadow(0 24px 30px rgba(10,61,44,.18));transition:transform var(--bf-dur-reveal) var(--bf-ease-out)}
.v5-pack-f{left:8%;top:40px;transform:rotate(-6deg)}
.v5-pack-b{right:6%;top:70px;transform:rotate(5deg)}
.v5-stage:hover .v5-pack-f{transform:rotate(-8deg) translate(-6px,-6px)}
.v5-stage:hover .v5-pack-b{transform:rotate(7deg) translate(6px,-6px)}
.v5-flag{position:absolute;display:flex;gap:var(--bf-space-2);align-items:center;background:var(--bf-color-surface);border-radius:var(--bf-radius-pill);padding:var(--bf-space-2) var(--bf-space-4) var(--bf-space-2) var(--bf-space-2);box-shadow:var(--bf-shadow-lg);font-weight:650;font-size:var(--bf-text-sm);white-space:nowrap}
.v5-f1{right:var(--bf-space-2);top:150px}.v5-f2{left:var(--bf-space-2);bottom:120px}.v5-f3{right:12%;bottom:52px}
.v5-stage-cta{position:absolute;left:50%;bottom:var(--bf-space-3);transform:translateX(-50%);font:600 var(--bf-text-xs) var(--bf-font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--bf-color-brand)}
@media (prefers-reduced-motion:no-preference){
  .v5-flag{animation:v5pop var(--bf-dur-reveal) var(--bf-ease-spring) both}
  .v5-f2{animation-delay:120ms}.v5-f3{animation-delay:240ms}
}
@keyframes v5pop{from{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:none}}
/* #check graft (from candidate C): the selected issue's pouch steps forward, the other recedes */
.lbl .pouch{transition:transform var(--bf-dur-slow) var(--bf-ease-out),opacity var(--bf-dur-slow) var(--bf-ease-out)}
.lbl.v5-focus-front .pouch-back,.lbl.v5-focus-back .pouch-front{opacity:.55}
.lbl.v5-focus-front .pouch-front{transform:rotate(-4deg) translateY(6px) scale(1.04)}
.lbl.v5-focus-back .pouch-back{transform:rotate(3deg) scale(1.04)}
.iss{transition:border-color var(--bf-dur-base) var(--bf-ease-out),box-shadow var(--bf-dur-base) var(--bf-ease-out)}
.iss:hover{border-color:var(--bf-color-line-strong)}
@media (max-width:860px){
  .v3-hero{padding:var(--bf-space-8) 0 var(--bf-space-12)}
  .v5-stage{height:360px;margin-top:var(--bf-space-8)}
  .v5-pack{width:160px}.v5-pack-f{left:4%;top:28px}.v5-pack-b{right:4%;top:48px}
  .v5-f1{right:var(--bf-space-1);top:96px}.v5-f2{left:var(--bf-space-1);bottom:96px}.v5-f3{right:6%;bottom:40px}
  /* graft from candidate B: pouches side by side on mobile so the list starts sooner */
  .lbl{grid-template-columns:1fr 1fr;gap:var(--bf-space-2)}
  .pouch{width:100%}
}
.v3-mark{background:none;color:var(--bf-color-brand);padding:0}
@media (max-width:860px){.v3-hero-grid{grid-template-columns:1fr;gap:0}.v3-hero h1{max-width:none}}

/* ---- v5 round 2 (Critiquito fixes) ---- */
.pf-fr{fill:#e6f0f5;font-size:10.5px;font-weight:600;text-anchor:middle}
.pb-fr{fill:#3a3a3a;font-size:8.6px}
.pb-m2{fill:#555;font-size:8.2px}
.pin-1{top:60%}.pin-4{top:55%}
.pin::after{content:"";position:absolute;inset:-6px;border-radius:50%}
.pin-card,.iss{scroll-margin-top:calc(var(--bf-size-header) + var(--bf-space-4))}
.pc-note{margin:var(--bf-space-2) 0 0;font-size:var(--bf-text-xs);color:var(--bf-color-muted)}
/* close band: tint, visible headline */
.home .v3-close{background:var(--bf-color-brand-tint);color:var(--bf-color-ink-2);padding:var(--bf-space-section) 0}
.home .v3-close h2{color:var(--bf-color-brand-ink)}
.home .v3-close .btn-ghost{background:var(--bf-color-surface);color:var(--bf-color-ink);border-color:var(--bf-color-line-strong)}
/* hero highlighter in green tint */
.v3-mark{background:linear-gradient(transparent 60%,var(--bf-color-brand-tint) 60%);color:var(--bf-color-brand-ink);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .08em}
/* single accent: highlight in green tokens */
.v3-ex-hl{background:var(--bf-color-brand-tint);outline:2px solid var(--bf-color-brand);border-radius:var(--bf-radius-sm);color:inherit}
/* rules we cite */
.v4-refs{text-align:left;padding:var(--bf-space-5) 0}
.v5-cite-line{margin:0;color:var(--bf-color-muted);font-size:var(--bf-text-sm)}
.v5-cite-line strong{color:var(--bf-color-ink-2)}
.v5-cite-line a{color:var(--bf-color-ink-2);font-weight:600;text-decoration-color:var(--bf-color-line-strong);text-underline-offset:3px}
.v5-cite-line a:hover{text-decoration-color:currentColor}
.v5-cite-line a.v5-cite-faq{color:var(--bf-color-brand);margin-left:var(--bf-space-2);white-space:nowrap}
.v5-cite-sep,.v5-cite-disc,.v5-cite-more{color:var(--bf-color-muted)}
.v5-cite-more{font-size:var(--bf-text-xs);margin-left:var(--bf-space-1)}
.v5-cite-line abbr{text-decoration:none}
.v5-cite-disc{margin-left:var(--bf-space-2)}
@media (max-width:640px){.v5-cite-disc{display:block;margin:var(--bf-space-2) 0 0;font-size:var(--bf-text-xs)}.v5-cite-line a.v5-cite-faq{display:inline-block;margin:var(--bf-space-2) 0 0}}
/* facts: display-size numbers, no count-up */
.v3-facts-grid b{font-size:var(--bf-text-3xl);line-height:1.1;color:var(--bf-color-brand-ink);font-variant-numeric:tabular-nums}
/* split layout uses the full desktop width */
.v5-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:var(--bf-space-16);align-items:start}
.v5-src{font-size:var(--bf-text-sm);color:var(--bf-color-muted)}
.v5-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--bf-space-4)}
.v5-cards li{background:var(--bf-color-surface);border:1px solid var(--bf-color-line);border-radius:var(--bf-radius-lg);padding:var(--bf-space-5);display:grid;gap:var(--bf-space-2);align-content:start;transition:transform var(--bf-dur-base) var(--bf-ease-out),box-shadow var(--bf-dur-base) var(--bf-ease-out)}
.v5-cards li:hover{transform:translateY(-2px);box-shadow:var(--bf-shadow-md)}
.v5-cards b{font-size:var(--bf-text-xl);color:var(--bf-color-crit)}
.v5-cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--bf-space-4)}
.v5-cols .v4-pane{margin:0}
.v5-cols h3{margin:0 0 var(--bf-space-3);font-size:var(--bf-text-lg);color:var(--bf-color-brand-ink)}
.v5-ba{display:grid;grid-template-columns:1fr 1fr;gap:var(--bf-space-3)}
.v5-ba-p{border:1px solid var(--bf-color-line);border-radius:var(--bf-radius-lg);padding:var(--bf-space-4) var(--bf-space-5);background:var(--bf-color-surface)}
.v5-ba-p p{margin:0 0 var(--bf-space-2)}
.v5-ba-after{background:var(--bf-color-ok-bg);border-color:var(--bf-color-ok)}
.v5-ba .lbl-h{font:700 var(--bf-text-xs) var(--bf-font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--bf-color-muted)}
.v5-ba-after .lbl-h{color:var(--bf-color-ok)}
.v5-cmp{width:100%;border-collapse:separate;border-spacing:0;background:var(--bf-color-surface);border:1px solid var(--bf-color-line);border-radius:var(--bf-radius-lg);overflow:hidden}
.v5-cmp th,.v5-cmp td{padding:var(--bf-space-4);text-align:left;border-bottom:1px solid var(--bf-color-line);vertical-align:top}
.v5-cmp tr:last-child th,.v5-cmp tr:last-child td{border-bottom:0}
.v5-cmp thead th{font-size:var(--bf-text-sm);color:var(--bf-color-muted)}
.v5-cmp .is-us{background:var(--bf-color-brand-tint-2);color:var(--bf-color-brand-ink);font-weight:650}
.v5-cmp thead .is-us{color:var(--bf-color-brand)}
.v5-noacct{font:600 var(--bf-text-xs) var(--bf-font-mono);color:var(--bf-color-brand);margin-top:var(--bf-space-2)}
.nav-toggle{font-family:inherit;min-height:var(--bf-size-tap);min-width:var(--bf-size-tap)}
@media (prefers-reduced-motion:reduce){.v5-stage:hover .v5-pack-f,.v5-stage:hover .v5-pack-b{transform:none}.v5-cards li:hover{transform:none}}
@media (max-width:860px){
  .v5-split{grid-template-columns:1fr;gap:var(--bf-space-6)}
  .v5-cards,.v5-cols,.v5-ba{grid-template-columns:1fr}
  .v5-stage{height:420px}.v5-pack{width:185px}
  .v5-cmp th,.v5-cmp td{padding:var(--bf-space-3);font-size:var(--bf-text-sm)}
}
.v5-ba-wrap{display:grid;gap:var(--bf-space-3)}.v5-ba-wrap .v3-ex-note{margin:0}
.iss-list[hidden]{display:none}

/* ---- v6: source strip (mark on top, name underneath, disclosure) ---- */
.v6-refs{padding:var(--bf-space-10) 0;text-align:center;border-top:1px solid var(--bf-color-line);border-bottom:1px solid var(--bf-color-line)}
.v6-refs h2.v3-eyebrow{font-size:var(--bf-text-xs);margin:0 0 var(--bf-space-6);color:var(--bf-color-muted)}
.v6-src-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--bf-space-4)}
.v6-src{position:relative}
.v6-src-btn{width:100%;height:100%;display:grid;justify-items:center;align-content:start;gap:var(--bf-space-2);padding:var(--bf-space-4) var(--bf-space-3);background:transparent;border:1px solid transparent;border-radius:var(--bf-radius-lg);font:inherit;color:var(--bf-color-ink-2);cursor:pointer;min-height:var(--bf-size-tap);transition:border-color var(--bf-dur-fast) var(--bf-ease-out),background-color var(--bf-dur-fast) var(--bf-ease-out)}
.v6-src-btn img{width:140px;height:42px;filter:grayscale(1)}
.v6-src-name{font-size:var(--bf-text-sm);font-weight:600;line-height:1.3;max-width:24ch}
.v6-src-more{font:600 var(--bf-text-xs) var(--bf-font-mono);color:var(--bf-color-muted);letter-spacing:.04em}
.v6-src-btn:hover,.v6-src-btn[aria-expanded=true]{border-color:var(--bf-color-line-strong);background:var(--bf-color-surface-2)}
.v6-src-btn:focus-visible{outline:none;box-shadow:var(--bf-shadow-focus)}
.v6-src-pop{position:absolute;z-index:5;left:50%;top:calc(100% + var(--bf-space-2));transform:translateX(-50%);width:min(300px,90vw);text-align:left;background:var(--bf-color-surface);border:1px solid var(--bf-color-line-strong);border-radius:var(--bf-radius-lg);box-shadow:var(--bf-shadow-lg);padding:var(--bf-space-4)}
.v6-src-pop:not([hidden]){animation:v4in var(--bf-dur-base) var(--bf-ease-out)}
.v6-src-pop ul{margin:0;padding-left:var(--bf-space-5);display:grid;gap:var(--bf-space-2);font-size:var(--bf-text-sm)}
.v6-fine{margin:var(--bf-space-5) 0 0;font-size:var(--bf-text-xs);color:var(--bf-color-muted)}
@media (max-width:860px){.v6-src-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--bf-space-2)}.v6-src-btn img{width:112px;height:34px}.v6-src-btn{height:auto}.v6-src-pop{position:static;transform:none;width:auto;margin-top:var(--bf-space-2)}}
@media (prefers-reduced-motion:reduce){.v6-src-pop:not([hidden]){animation:none}}

/* round 4: hero Front/Back toggle (mobile only) */
.v5-face{display:none}
@media (max-width:640px){
  .v5-stage{height:auto;padding:var(--bf-space-4) var(--bf-space-4) var(--bf-space-10)}
  .v5-pack{position:static;width:100%;transform:none}
  .v5-stage:hover .v5-pack-f,.v5-stage:hover .v5-pack-b{transform:none}
  .v5-stage-wrap[data-face=back] .v5-pack-f,.v5-stage-wrap[data-face=front] .v5-pack-b{display:none}
  .v5-flag{display:none}
  .v5-face{display:flex;justify-content:center;gap:0;margin-top:var(--bf-space-3)}
  .v5-face-btn{min-height:var(--bf-size-tap);min-width:96px;padding:0 var(--bf-space-4);font:inherit;font-weight:600;background:var(--bf-color-surface);color:var(--bf-color-ink-2);border:1px solid var(--bf-color-line-strong);cursor:pointer}
  .v5-face-btn:first-child{border-radius:var(--bf-radius-pill) 0 0 var(--bf-radius-pill)}
  .v5-face-btn:last-child{border-radius:0 var(--bf-radius-pill) var(--bf-radius-pill) 0;border-left:0}
  .v5-face-btn[aria-pressed=true]{background:var(--bf-color-brand);color:var(--bf-color-on-brand,#fff);border-color:var(--bf-color-brand)}
  .v5-face-btn:focus-visible{outline:none;box-shadow:var(--bf-shadow-focus)}
}
/* round 4: sticky CTA is fixed (not in flow), so no white strip above the footer; footer keeps room for it */
@media (max-width:860px){.home .site-footer{padding-bottom:calc(2rem + 76px)}}
/* round 5b: disclaimer = muted microcopy on its own line at every width */
.v5-cite-line .v5-cite-disc{display:block;margin:var(--bf-space-2) 0 0;font-size:var(--bf-text-xs);color:var(--bf-color-muted)}
/* round 6: pins re-seated on the new back-panel layout */
.pouch-back .pin-2{left:88%;top:23%}
.pouch-back .pin-1{left:88%;top:39%}
.pouch-back .pin-4{left:3%;top:37%}
/* round 6b: back-panel zoom dialog, fixes list, pins */
.zoom{border:0;border-radius:var(--bf-radius-xl);padding:0;width:min(720px,94vw);max-height:92vh;background:var(--bf-color-surface);box-shadow:var(--bf-shadow-lg);color:var(--bf-color-ink)}
.zoom::backdrop{background:rgba(10,30,22,.6)}
.zoom-head{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:var(--bf-space-3);padding:var(--bf-space-3) var(--bf-space-4);background:var(--bf-color-surface);border-bottom:1px solid var(--bf-color-line);z-index:1}
.zoom-head h3{margin:0;font-size:var(--bf-text-base)}
.zoom-close{min-height:44px}
.zoom-crop{overflow:hidden;aspect-ratio:224/292;background:#fbf8f1}
/* the pack SVG is 300x440; show x 38..262, y 66..358 */
.zoom-img{display:block;width:133.93%;height:auto;max-width:none;margin:-29.46% 0 0 -16.96%}
.pouch-svg.is-zoomable{cursor:zoom-in}
.demo-fixes{list-style:none;text-align:left;display:grid;gap:var(--bf-space-2);border:1px solid var(--bf-color-line);border-style:solid;padding:var(--bf-space-4);color:var(--bf-color-ink-2)}
.demo-fixes li{display:flex;gap:var(--bf-space-2);align-items:flex-start}
.demo-fixes svg{flex:none;margin-top:.2em;color:var(--bf-color-brand)}
.pouch-back{transform:rotate(1.5deg)}
.lbl.v5-focus-back .pouch-back{transform:rotate(1.5deg) scale(1.04)}
.pouch-back .pin-1{left:88%;top:52%}
/* round 6c: zoom view toggle (narrow screens), table-only crop, pinch-zoom */
.zoom-crop{touch-action:pinch-zoom}
.zoom-views{display:none}
/* table crop: x 44..176, y 201..352 of the 300x440 pack */
.zoom-crop[data-view=table]{aspect-ratio:132/151;background:#fff}
.zoom-crop[data-view=table] .zoom-img{width:227.27%;margin:-152.27% 0 0 -33.33%}
@media (max-width:640px){
  .zoom-views{display:flex;margin:var(--bf-space-3) var(--bf-space-4)}
  .zoom-view-btn{flex:1;min-height:44px;font:inherit;font-weight:600;background:var(--bf-color-surface);color:var(--bf-color-ink-2);border:1px solid var(--bf-color-line-strong);cursor:pointer}
  .zoom-view-btn:first-child{border-radius:var(--bf-radius-pill) 0 0 var(--bf-radius-pill)}
  .zoom-view-btn:last-child{border-radius:0 var(--bf-radius-pill) var(--bf-radius-pill) 0;border-left:0}
  .zoom-view-btn[aria-pressed=true]{background:var(--bf-color-brand);color:#fff;border-color:var(--bf-color-brand)}
  .zoom-view-btn:focus-visible{outline:none;box-shadow:var(--bf-shadow-focus)}
}