/* Finnsight Marketing. Layout and components. Values come from tokens.css. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-body);font-kerning:normal;text-rendering:optimizeLegibility}
img,svg{max-width:100%;height:auto}
h1,h2,h3,h4{font-family:var(--font-serif);font-weight:500;line-height:var(--leading-tight);margin:0 0 var(--space-4);letter-spacing:-0.01em;text-wrap:balance}
h1{font-size:var(--text-3xl);letter-spacing:-0.02em;line-height:1.06}
h2{font-size:var(--text-2xl)}
h3{font-size:var(--text-xl)}
h4{font-family:var(--font-sans);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-weight:700;color:var(--color-muted);margin:var(--space-5) 0 var(--space-2)}
p{margin:0 0 var(--space-4);max-width:var(--measure);text-wrap:pretty}
a{color:var(--color-green);text-decoration-thickness:1px;text-underline-offset:0.2em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px;border-radius:2px}
.container{width:min(100% - 2.5rem,var(--container));margin-inline:auto}
@media (min-width:48rem){.container{width:min(100% - 4rem,var(--container))}}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:var(--space-4);top:-4rem;background:var(--color-green);color:#fff;padding:var(--space-2) var(--space-4);z-index:100;border-radius:var(--radius)}
.skip:focus{top:var(--space-4)}
.muted{color:var(--color-muted)}.small{font-size:var(--text-sm)}
.list-reset{list-style:none;padding:0;margin:0}

/* Header */
.preview-strip{margin:0;max-width:none;background:var(--color-ink);color:var(--color-paper);font-size:var(--text-xs);text-align:center;padding:var(--space-1) var(--space-4);letter-spacing:0.04em}
.site-header{background:var(--color-paper);border-bottom:1px solid var(--color-rule);position:relative;z-index:20}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:4.5rem}
.brand{display:flex;align-items:center;gap:var(--space-3);text-decoration:none;color:var(--color-ink)}
.brand-mark{width:var(--logo-size);height:var(--logo-size)}
.brand-logo{display:block;height:var(--logo-h);width:auto;max-width:none;margin-left:calc(var(--logo-h) * -0.2056)} /* the SVG view box carries the clear space; pull it back so the mark lines up with the page edge */
.nav-toggle{display:none}
.site-nav ul{display:flex;align-items:center;gap:var(--space-5);list-style:none;margin:0;padding:0}
.site-nav a:not(.btn){color:var(--color-ink);text-decoration:none;font-size:var(--text-sm);font-weight:500;white-space:nowrap;padding:var(--space-2) 0;background:linear-gradient(var(--color-brass),var(--color-brass)) 0 100%/0 1px no-repeat;transition:background-size var(--motion-base) var(--ease)}
.site-nav a:not(.btn):hover,.site-nav a[aria-current="page"]{background-size:100% 1px}
.site-nav a[aria-current="page"]{color:var(--color-green)}
@media (max-width:80rem){
  .js .nav-toggle{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--space-4);border:1px solid var(--color-ink);background:transparent;color:var(--color-ink);font:inherit;font-size:var(--text-sm);font-weight:600;border-radius:var(--radius);cursor:pointer}
  .js .site-nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--color-paper);border-bottom:1px solid var(--color-rule);box-shadow:0 18px 30px -24px rgba(29,36,32,.5)}
  .js .site-nav.open{display:block}
  .site-nav ul{flex-direction:column;align-items:stretch;gap:0;padding:var(--space-2) 1.25rem var(--space-5)}
  .site-nav li a:not(.btn){display:block;padding:var(--space-3) 0;border-bottom:1px solid var(--color-rule);font-size:var(--text-base)}
  .nav-cta{margin-top:var(--space-4)}.nav-cta .btn{width:100%;justify-content:center}
  html:not(.js) .site-nav ul{flex-direction:row;flex-wrap:wrap;gap:var(--space-3);padding:0 0 var(--space-3)}
  html:not(.js) .header-inner{flex-wrap:wrap}
}
@media (max-width:26rem){:root{--logo-h:52px}}

/* Buttons and links */
.btn{display:inline-flex;align-items:center;gap:var(--space-3);min-height:48px;padding:0 var(--space-5);background:var(--color-green);color:#fff;border:1px solid var(--color-green);border-radius:var(--radius);font:inherit;font-size:var(--text-sm);font-weight:600;letter-spacing:0.01em;text-decoration:none;cursor:pointer;transition:background-color var(--motion-fast) var(--ease),color var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease)}
.btn:hover{background:var(--color-green-hover);border-color:var(--color-green-hover)}
.btn .arr{transition:transform var(--motion-base) var(--ease)}
.btn:hover .arr,.text-link:hover .arr,.tool-card:hover .arr,.method-links a:hover .arr{transform:translateX(4px)}
.btn-quiet{background:transparent;color:var(--color-green);border-color:var(--color-green)}
.btn-quiet:hover{background:var(--color-green);color:#fff}
.btn-sm{min-height:44px;padding:0 var(--space-4)}
.btn-sm .arr{display:none}
.btn-brass{background:var(--color-brass-on-green);border-color:var(--color-brass-on-green);color:var(--color-ink)}
.btn-brass:hover{background:#D9C38E;border-color:#D9C38E}
.btn-on-dark{color:var(--color-paper);border-color:rgba(247,244,238,.55)}
.btn-on-dark:hover{background:var(--color-paper);color:var(--color-green);border-color:var(--color-paper)}
.text-link{display:inline-flex;align-items:center;gap:var(--space-2);font-weight:600;font-size:var(--text-sm);color:var(--color-green);background:none;border:0;padding:0;font-family:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:0.25em}
.actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin:var(--space-6) 0 var(--space-3)}
.actions-row{display:flex;flex-wrap:wrap;gap:var(--space-5);max-width:none}
.cta-note{font-size:var(--text-sm);color:var(--color-muted)}

/* Typographic details */
.eyebrow{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--color-brass-text);margin-bottom:var(--space-4)}
.eyebrow::before{content:"";display:inline-block;width:2rem;height:1px;background:currentColor;vertical-align:middle;margin-right:var(--space-3)}
.lede{font-size:var(--text-lg);line-height:1.55;color:var(--color-ink)}
.num,.tl-num,.tc-num{font-family:var(--font-serif);font-style:italic;font-size:var(--text-lg);color:var(--color-brass-text)}

/* Home hero */
.hero-home{background:var(--color-green);color:var(--color-paper);position:relative;overflow:hidden;isolation:isolate}
.hero-home::after{content:"";position:absolute;inset:auto 0 0;height:24px;background:url(/assets/img/band.svg) repeat-x;opacity:.55}
.hero-grid{display:grid;gap:var(--space-7);padding:var(--space-8) 0 var(--space-9);align-items:center}
@media (min-width:62rem){.hero-grid{grid-template-columns:1.15fr .85fr;padding:var(--space-9) 0 var(--space-10)}}
.hero-home h1{font-size:var(--text-4xl);font-weight:400;line-height:1.02;letter-spacing:-0.025em;max-width:13ch;color:var(--color-paper)}
.hero-home h1 em{font-style:italic;color:var(--color-brass-on-green);font-weight:400}
.hero-home .lede{color:rgba(247,244,238,.88);max-width:54ch}
.hero-home .cta-note{color:rgba(247,244,238,.78)}
.eyebrow-on-dark{color:var(--color-brass-on-green)}
.hero-art{position:relative;display:grid;place-items:center;min-height:20rem}
@media (min-width:62rem){.hero-art{min-height:34rem;justify-items:end}.hero-art .seal{width:min(100%,34rem)}}
.hero-art .seal{width:min(100%,32rem);height:auto}
.seal{color:var(--color-brass-on-green)}
.seal *{fill:none;stroke:currentColor;vector-effect:non-scaling-stroke}
.seal-rules{stroke-width:.6;opacity:.6}
.seal-band{stroke-width:.7;opacity:.85}
.seal-fine{stroke-width:.5;opacity:.6}
.seal-rosette{stroke-width:.5;opacity:.7}
.seal-spin{transform-box:view-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){
  .js .seal-spin-a{animation:spin 240s linear infinite}
  .js .seal-spin-b{animation:spin 300s linear infinite reverse}
  .js .seal-spin-c{animation:spin 180s linear infinite}
  .js .hero-home .seal{animation:seal-in 1.6s var(--ease) both}
  .js .hero-card{animation:card-in .9s .35s var(--ease) both}
}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes seal-in{from{opacity:0;transform:scale(.94) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes card-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.hero-card{position:absolute;bottom:-2.5rem;left:-3rem;width:min(18rem,88%);background:var(--color-paper);color:var(--color-ink);border-radius:var(--radius);padding:var(--space-5);box-shadow:0 30px 60px -30px rgba(0,0,0,.6),0 0 0 1px rgba(166,138,78,.35)}
@media (max-width:61.99rem){.hero-art{min-height:auto}.hero-art .seal{width:min(80%,22rem)}.hero-card{position:relative;bottom:auto;margin-top:-5rem;width:100%;max-width:22rem}}
.hc-title{font-family:var(--font-serif);font-size:var(--text-lg);margin-bottom:var(--space-3)}
.hc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);margin:0 0 var(--space-3);padding:var(--space-3) 0;border-block:1px solid var(--color-rule)}
.hc-stats dt{font-size:var(--text-xs);color:var(--color-muted)}
.hc-stats dd{margin:0;font-family:var(--font-serif);font-size:var(--text-2xl);line-height:1.1}
.hc-line{display:flex;justify-content:space-between;gap:var(--space-3);font-size:var(--text-sm);align-items:baseline}
.hc-line strong{font-family:var(--font-serif);font-size:var(--text-xl);font-weight:500}
.hc-link{font-size:var(--text-sm);font-weight:600}

/* Data labels */
.data-tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.05em;white-space:normal;max-width:100%;line-height:1.5;text-transform:uppercase;color:var(--color-brass-text);border:1px solid var(--color-brass);border-radius:.8rem;padding:.15rem .7rem;margin-bottom:var(--space-3)}
.data-banner{position:sticky;top:0;z-index:15;background:#F3E7C9;border-bottom:1px solid var(--color-brass);color:var(--color-ink)}
.data-banner p{margin:0;max-width:none;padding:var(--space-2) 0;font-size:var(--text-sm)}


/* Scores */

/* Sections */
.section{padding:var(--space-9) 0}
@media (max-width:47.99rem){.section{padding:var(--space-8) 0}}
.section-alt{background:var(--color-paper-alt)}
.section-head{margin-bottom:var(--space-7);max-width:44rem}
.section-head.center{margin-inline:auto;text-align:center}
.section-head h2{font-size:var(--text-3xl);letter-spacing:-0.02em}
.section-sub{font-size:var(--text-lg);color:var(--color-muted)}
.grid{display:grid;gap:var(--space-6)}
@media (min-width:48rem){.grid-2{grid-template-columns:repeat(2,1fr);gap:var(--space-8)}.grid-3{grid-template-columns:repeat(2,1fr)}.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:62rem){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}
.reveal{transition:opacity .7s var(--ease),transform .7s var(--ease)}
@media (prefers-reduced-motion:no-preference){.js .reveal.pre{opacity:0;transform:translateY(24px)}}

/* Page hero */
.page-hero{padding:var(--space-8) 0 var(--space-8);position:relative}
.page-hero h1{max-width:20ch}
.page-hero .lede{max-width:60ch}
.band{height:24px;background:url(/assets/img/band.svg) repeat-x;opacity:.5;position:absolute;inset:auto 0 0}
.crumbs ol{display:flex;gap:var(--space-2);list-style:none;margin:0;padding:var(--space-4) 0 0;font-size:var(--text-xs);color:var(--color-muted)}
.crumbs li+li::before{content:"/";margin-right:var(--space-2)}
.crumbs a{color:var(--color-muted)}

/* Cards */
.tool-card{display:block;padding:var(--space-6);background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);text-decoration:none;color:var(--color-ink);position:relative;transition:border-color var(--motion-base) var(--ease),transform var(--motion-base) var(--ease),box-shadow var(--motion-base) var(--ease)}
.tool-card:hover{border-color:var(--color-brass);transform:translateY(-3px);box-shadow:0 22px 40px -30px rgba(29,36,32,.55)}
.tool-card h3{font-size:var(--text-2xl);margin:var(--space-3) 0}
.tc-link{display:inline-flex;gap:var(--space-2);align-items:center;font-weight:600;font-size:var(--text-sm);color:var(--color-green)}
.ledger{list-style:none;padding:0;margin:0}
.ledger-item{border-top:1px solid var(--color-ink);padding-top:var(--space-4)}
.ledger-item h3{margin-top:var(--space-3)}
.ledger-item p{color:var(--color-muted)}
.tier-card,.tier-full{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);padding:var(--space-6);display:flex;flex-direction:column;position:relative}
.tier-card::before,.tier-full::before{content:"";position:absolute;inset:6px;border:1px solid rgba(166,138,78,.35);border-radius:2px;pointer-events:none}
.tier-tag{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--color-brass-text);margin-bottom:var(--space-2)}
.tier-card h3,.tier-full h3{font-size:var(--text-3xl);font-weight:400}
.price{font-family:var(--font-serif);font-size:var(--text-xl);color:var(--color-green);border-top:1px solid var(--color-rule);padding-top:var(--space-4);margin-top:auto}
.tier-full .price{margin-top:0}
.tier-card .text-link{margin-top:var(--space-2)}
.tier-full .btn{margin-top:auto;align-self:flex-start}
.tier-full ul{margin-bottom:var(--space-5)}
.fits span{font-weight:700;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--color-muted);display:block}
.price-line{color:var(--color-muted)}
.list-plain{list-style:none;padding:0;margin:0}
.list-plain li{padding:var(--space-3) 0}
.list-rule li{border-top:1px solid var(--color-rule)}
.list-rule li:last-child{border-bottom:1px solid var(--color-rule)}
.list-check,.list-cross{list-style:none;padding:0;margin:0 0 var(--space-4)}
.list-check li,.list-cross li{padding:var(--space-1) 0 var(--space-1) 1.5rem;position:relative;font-size:var(--text-sm)}
.list-check li::before{content:"";position:absolute;left:0;top:.75em;width:.6rem;height:.35rem;border-left:2px solid var(--color-green);border-bottom:2px solid var(--color-green);transform:rotate(-45deg)}
.list-cross li::before{content:"";position:absolute;left:.1rem;top:.85em;width:.6rem;height:2px;background:var(--color-muted)}
.method-links{list-style:none;padding:0;margin:0}
.method-links a{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);padding:var(--space-5) 0;border-top:1px solid var(--color-ink);text-decoration:none;color:var(--color-ink)}
.method-links li:last-child a{border-bottom:1px solid var(--color-ink)}
.method-links strong{font-family:var(--font-serif);font-weight:500;font-size:var(--text-xl)}
.method-links span{color:var(--color-muted);flex:1 1 14rem}
.method-links .arr{color:var(--color-green)}

/* Timeline */
.timeline{list-style:none;margin:0;padding:0;counter-reset:t;max-width:52rem}
.timeline li{display:grid;grid-template-columns:3.5rem 1fr;gap:var(--space-4);padding:var(--space-5) 0;border-top:1px solid var(--color-rule);position:relative}
.timeline li:last-child{border-bottom:1px solid var(--color-rule)}
.timeline h3{font-size:var(--text-xl);margin-bottom:var(--space-2)}
.timeline p{margin:0}
.tl-num{font-size:var(--text-2xl);line-height:1}

/* Close band */
.close-band{background:var(--color-green);color:var(--color-paper);overflow:hidden;position:relative}
.close-inner{display:grid;gap:var(--space-6);align-items:center;padding:var(--space-9) 0;position:relative}
@media (min-width:62rem){.close-inner{grid-template-columns:22rem 1fr;gap:var(--space-9)}}
.seal-close{width:min(60vw,22rem);opacity:.9}
@media (max-width:61.99rem){.seal-close{position:absolute;right:-6rem;top:-4rem;opacity:.25;width:18rem}}
.close-copy{position:relative}
.close-band h2{font-size:var(--text-3xl);color:var(--color-paper);max-width:20ch}
.close-band .lede{color:rgba(247,244,238,.88)}
.close-band .cta-note{color:rgba(247,244,238,.78)}
.close-band .btn{background:var(--color-brass-on-green);border-color:var(--color-brass-on-green);color:var(--color-ink)}
.close-band .btn:hover{background:#D9C38E}
.close-band .btn-quiet{background:transparent;color:var(--color-paper);border-color:rgba(247,244,238,.55)}
.close-band .btn-quiet:hover{background:var(--color-paper);color:var(--color-green)}
.close-band :focus-visible,.hero-home :focus-visible,.site-footer :focus-visible{outline-color:var(--color-brass-on-green)}

/* Tables and report */
.table-wrap{overflow-x:auto;margin:0 0 var(--space-5)}
table{border-collapse:collapse;width:100%;font-size:var(--text-sm);font-variant-numeric:tabular-nums}
caption{text-align:left;font-size:var(--text-xs);color:var(--color-muted);padding-bottom:var(--space-2);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
th,td{padding:var(--space-3);border-bottom:1px solid var(--color-rule);text-align:left}
thead th{border-bottom:1px solid var(--color-ink);font-weight:700}
.n{text-align:right}
tr.total th,tr.total td{font-weight:700;border-top:1px solid var(--color-ink)}
.report{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);padding:clamp(1.25rem,4vw,4rem);max-width:58rem;margin-inline:auto;box-shadow:0 40px 80px -60px rgba(29,36,32,.6);position:relative}
.report::before{content:"";position:absolute;inset:8px;border:1px solid rgba(166,138,78,.35);pointer-events:none}
.report h2{font-size:var(--text-xl);margin-top:var(--space-7);padding-top:var(--space-4);border-top:1px solid var(--color-rule)}
.report-cols h2{margin-top:var(--space-6)}
.report-title{font-family:var(--font-serif);font-size:var(--text-3xl);line-height:1.1;margin-bottom:var(--space-2)}
.chart{margin:0 0 var(--space-5)}
.chart .cl{font:500 13px var(--font-sans);fill:var(--color-ink)}
.chart .cv{font:600 13px var(--font-sans);fill:var(--color-ink)}
.chart .cx{font:700 11px var(--font-sans);letter-spacing:.12em;fill:#7A5F28}

/* Portal */
.js .p-panel[hidden]{display:none}
.p-greet{font-family:var(--font-serif);font-size:var(--text-2xl)}
.p-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3);margin:0 0 var(--space-4)}
@media (min-width:62rem){.p-cards{grid-template-columns:repeat(4,1fr)}}
.p-cards div{border:1px solid var(--color-rule);border-radius:var(--radius);padding:var(--space-4)}
.p-cards dt{font-size:var(--text-xs);color:var(--color-muted)}
.p-cards dd{margin:0;font-family:var(--font-serif);font-size:var(--text-3xl);line-height:1.1}
.p-status{display:flex;gap:var(--space-2);align-items:center}
.dot{width:8px;height:8px;border-radius:50%;background:var(--color-green)}
.p-filters{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-bottom:var(--space-4)}
.pf{display:grid;gap:4px;font-size:var(--text-xs);font-weight:700}
.pf select{font:inherit;font-size:var(--text-sm);font-weight:400;min-height:40px;padding:0 var(--space-2);border:1px solid var(--color-muted);border-radius:var(--radius);background:#fff}
.p-work,.p-files{list-style:none;padding:0;margin:0}
.p-work li{display:grid;grid-template-columns:8rem 1fr auto;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--color-rule);font-size:var(--text-sm)}
@media (max-width:40rem){.p-work li{grid-template-columns:1fr}}
.p-files li{padding:var(--space-3) 0;border-bottom:1px solid var(--color-rule)}
.p-confirm{color:var(--color-green);font-weight:600;margin-top:var(--space-3)}
.signin{margin:var(--space-8) auto 0;max-width:24rem}
.signin-card{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:8px;padding:var(--space-6)}
.si-h{font-family:var(--font-serif);font-size:var(--text-xl)}
.si-l{font-size:var(--text-sm);font-weight:600;margin:var(--space-3) 0 var(--space-1)}
.si-in{height:44px;border:1px solid var(--color-muted);border-radius:var(--radius);background:#fff}
.si-err{color:#9B2C1F;font-size:var(--text-sm);margin-top:var(--space-3)}
.si-btn{height:44px;background:var(--color-green);border-radius:var(--radius);margin:var(--space-3) 0}
.si-link{font-size:var(--text-sm);text-decoration:underline;color:var(--color-green);margin:0}

/* Teardown */
.facts{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);padding:var(--space-5)}
.found{display:grid;gap:0;margin:0}
.found div{display:grid;gap:var(--space-2);padding:var(--space-5) 0;border-top:1px solid var(--color-rule)}
@media (min-width:48rem){.found div{grid-template-columns:16rem 1fr;gap:var(--space-6)}}
.found dt{font-family:var(--font-serif);font-size:var(--text-xl)}
.found dd{margin:0;max-width:var(--measure)}

/* Forms */
.form-card{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2.5rem)}
.field{margin-bottom:var(--space-5)}
label{display:block;font-weight:600;margin-bottom:var(--space-1)}
.opt-label{font-weight:400;color:var(--color-muted)}
.hint{display:block;font-size:var(--text-sm);color:var(--color-muted);margin-bottom:var(--space-2)}
input[type=text],input[type=email],select,textarea{width:100%;min-height:48px;font:inherit;padding:var(--space-2) var(--space-3);border:1px solid var(--color-muted);border-radius:var(--radius);background:#fff;color:var(--color-ink)}
textarea{min-height:7rem;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--color-green);box-shadow:0 0 0 1px var(--color-green)}
.error{color:#9B2C1F;font-size:var(--text-sm);font-weight:600;margin:0 0 var(--space-1)}
.error:empty{display:none}
[aria-invalid=true]{border-color:#9B2C1F!important;box-shadow:0 0 0 1px #9B2C1F}
.error-summary{border:2px solid #9B2C1F;border-radius:var(--radius);padding:var(--space-4);margin-bottom:var(--space-5);background:#fff}
.error-summary h3{font-size:var(--text-lg)}
.req{font-size:var(--text-sm);color:var(--color-muted)}
.next-steps h2{font-size:var(--text-2xl)}
.timeline-sm li{grid-template-columns:2.5rem 1fr;padding:var(--space-4) 0}
.timeline-sm .tl-num{font-size:var(--text-lg)}

/* Check */
.check-wrap{max-width:46rem}
.check-form{display:none}
.js .check-form.on{display:block}
html:not(.js) .check-start{display:none}
.check-bar{height:3px;background:var(--color-rule);margin-bottom:var(--space-6);border-radius:2px;overflow:hidden}
.check-bar span{display:block;height:100%;width:0;background:var(--color-green);transition:width var(--motion-base) var(--ease)}
.q{border:0;margin:0;padding:0}
.js .q:not(.on){display:none}
.q legend{padding:0;margin-bottom:var(--space-5);display:grid;gap:var(--space-2)}
.q-meta{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--color-brass-text)}
.q-progress{font-size:var(--text-sm);color:var(--color-muted);font-weight:400}
.q-text{font-family:var(--font-serif);font-size:var(--text-2xl);font-weight:500;line-height:1.2}
.opts{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}
@media (min-width:40rem){.opts{grid-template-columns:repeat(4,1fr)}}
.opt{position:relative;margin:0;font-weight:500}
.opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.opt span{display:flex;align-items:center;justify-content:center;min-height:56px;border:1px solid var(--color-muted);border-radius:var(--radius);background:var(--color-paper);transition:background-color var(--motion-fast),border-color var(--motion-fast)}
.opt input:checked+span{background:var(--color-green);border-color:var(--color-green);color:#fff}
.opt input:focus-visible+span{outline:3px solid var(--color-focus);outline-offset:3px}
.q-help{margin-top:var(--space-4);font-size:var(--text-sm)}
.q-help summary{cursor:pointer;color:var(--color-green);font-weight:600;min-height:44px;display:flex;align-items:center}
.check-nav{display:flex;justify-content:space-between;gap:var(--space-3);margin-top:var(--space-6)}
.check-result{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);padding:clamp(1.25rem,4vw,3rem);position:relative}
.check-result:focus{outline:none}
.score-big{font-family:var(--font-serif);font-size:var(--text-4xl);line-height:1;margin:0 0 var(--space-2)}
.areas{display:grid;gap:var(--space-3);margin:var(--space-5) 0;list-style:none;padding:0}
.areas li{display:grid;grid-template-columns:1fr auto;gap:var(--space-2) var(--space-4);font-size:var(--text-sm)}
.areas .meter{grid-column:1/-1;height:6px;background:var(--color-rule);border-radius:3px;overflow:hidden}
.areas .meter i{display:block;height:100%;background:var(--color-green)}
.fixes{counter-reset:f;list-style:none;padding:0;margin:var(--space-4) 0}
.fixes li{padding:var(--space-3) 0 var(--space-3) 2.5rem;border-top:1px solid var(--color-rule);position:relative}
.fixes li::before{counter-increment:f;content:counter(f,decimal-leading-zero);position:absolute;left:0;font-family:var(--font-serif);font-style:italic;color:var(--color-brass-text)}
.fixes .tagp{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-muted);font-weight:700;margin-left:var(--space-2)}
.check-prefill{margin-top:var(--space-6)}
.check-prefill .contact-form{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2.5rem)}
.check-after{margin-top:var(--space-5)}
.footnote{font-size:var(--text-sm);color:var(--color-muted)}
.psi{margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--color-ink)}
.psi h2{font-size:var(--text-2xl)}
.psi-disclosure{font-size:var(--text-sm);color:var(--color-muted)}
.psi-out .legal-label{margin-top:var(--space-4)}
.psi-rows{list-style:none;padding:0;margin:0}
.psi-rows li{display:flex;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--color-rule);font-size:var(--text-sm)}
.legal-label{font-weight:600;font-size:var(--text-sm);border-left:3px solid var(--color-brass);padding-left:var(--space-3)}

/* ROI */
.roi-grid{display:grid;gap:var(--space-7)}
@media (min-width:62rem){.roi-grid{grid-template-columns:1fr 1fr;align-items:start}}
.roi-form{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2.5rem)}
.pk-fill{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-2)}
.chip{font:inherit;font-size:var(--text-sm);min-height:40px;padding:0 var(--space-4);border:1px solid var(--color-green);border-radius:999px;background:transparent;color:var(--color-green);cursor:pointer}
.chip:hover{background:var(--color-green);color:#fff}
.roi-out-wrap{position:sticky;top:var(--space-5)}
.roi-out:focus{outline:none}
.roi-out dl{margin:0}
.roi-out dl div{display:flex;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) 0;border-bottom:1px solid var(--color-rule)}
.roi-out dd{margin:0;font-family:var(--font-serif);font-size:var(--text-xl);font-variant-numeric:tabular-nums}
.roi-out h2{font-size:var(--text-xl)}
.roi-summary{font-family:var(--font-serif);font-size:var(--text-xl);margin:var(--space-5) 0}

/* FAQ */
.faq{max-width:52rem}
.faq details{border-top:1px solid var(--color-ink)}
.faq details:last-child{border-bottom:1px solid var(--color-ink)}
.faq summary{cursor:pointer;list-style:none;font-family:var(--font-serif);font-size:var(--text-xl);padding:var(--space-5) 3rem var(--space-5) 0;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:.5rem;top:50%;width:12px;height:12px;border-right:1.5px solid var(--color-green);border-bottom:1.5px solid var(--color-green);transform:translateY(-70%) rotate(45deg);transition:transform var(--motion-base) var(--ease)}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.faq details div{padding-bottom:var(--space-5)}

/* Legal, prose */
.prose h1{font-size:var(--text-3xl)}
.prose h2{font-size:var(--text-xl);margin-top:var(--space-7)}
.legal .prose{max-width:46rem}

/* Placeholders (preview only) */
.pending{border:1px dashed var(--color-brass);background:#FBF6EA;padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--color-brass-text);border-radius:var(--radius)}
.slot{list-style:none}

/* Footer */
.site-footer{background:var(--color-ink);color:rgba(247,244,238,.85);padding:var(--space-8) 0 var(--space-6);font-size:var(--text-sm)}
.footer-grid{display:grid;gap:var(--space-6)}
@media (min-width:48rem){.footer-grid{grid-template-columns:1.4fr repeat(3,1fr)}}
.footer-brand{margin:0}.footer-brand .brand-logo{--logo-h:72px;margin-top:calc(var(--logo-h) * -0.2056)}
.footer-h{font-family:var(--font-sans);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--color-brass-on-green);font-weight:700}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:var(--space-2)}
.site-footer a{color:var(--color-paper)}
.footer-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-3);border-top:1px solid rgba(247,244,238,.2);margin-top:var(--space-7);padding-top:var(--space-4);color:rgba(247,244,238,.75)}

/* Print: banners on every printed page, plus the check result as a clean checklist */
@media print{
  .site-header,.site-footer,.close-band,.skip,.actions,.check-nav,.psi,.check-prefill,.check-start,.crumbs,.band,.pk-fill,.preview-strip{display:none!important}
  body{background:#fff;font-size:11pt}
  .data-banner{position:fixed;top:0;left:0;right:0;background:#fff;border:1px solid #000}
  .has-banner main{padding-top:3.2rem}
  .has-banner main::after{content:"EXAMPLE DATA";position:fixed;bottom:40%;left:0;right:0;text-align:center;font:700 64pt var(--font-sans);color:rgba(0,0,0,.06);transform:rotate(-20deg)}
  .section,.page-hero{padding:1rem 0}
  .section-alt{background:#fff}
  .report,.check-result{box-shadow:none;border:1px solid #999}
  .js .p-panel[hidden]{display:block!important}
  a{color:#000}
}

/* additions */
.hc-eyebrow{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.1em;color:var(--color-muted);margin:0 0 var(--space-1);font-weight:700}
.area-cards{list-style:none;padding:0;margin:0 0 var(--space-6);display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}
@media (min-width:48rem){.area-cards{grid-template-columns:repeat(4,1fr)}}
.area-cards li{background:var(--color-paper);border:1px solid var(--color-rule);border-radius:var(--radius);padding:var(--space-4);display:grid;gap:var(--space-2);font-family:var(--font-serif);font-size:var(--text-lg);line-height:1.2;min-height:7rem}
.check-wrap{max-width:52rem}
.roi-art{display:grid;place-items:center;padding:var(--space-6) 0;color:var(--color-brass)}
.roi-art .seal{color:var(--color-brass);opacity:.55;width:min(100%,18rem)}
.roi-out:not(:empty)+.roi-art{display:none}
/* Insights articles */
.article-body{max-width:44rem}
.article-body h1{font-size:var(--text-3xl);margin-bottom:var(--space-6)}
.article-body h2{font-size:var(--text-2xl);margin-top:var(--space-7)}
.article-body li{margin-bottom:var(--space-2)}
.article-card h2{margin-top:var(--space-3);font-size:var(--text-xl);line-height:1.2}

/* ================================================================ pass 2: art direction, rhythm, motion, data-viz */
/* Editorial grid: faint 12 column hairlines behind heroes */
.page-hero,.hero-home{--grid-c:rgba(166,138,78,.12)}
.hero-home{--grid-c:rgba(200,174,116,.09)}
@media (min-width:62rem){
  .page-hero::before,.hero-home::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;
    background:linear-gradient(90deg,var(--grid-c) 1px,transparent 1px) calc(50% - var(--container)/2) 0/calc(var(--container)/12) 100%;
    -webkit-mask:linear-gradient(180deg,#000 30%,transparent);mask:linear-gradient(180deg,#000 30%,transparent)}
  .page-hero{isolation:isolate}
}
/* Inner page hero: copy left, bespoke mark right */
.ph-grid{display:grid;gap:var(--space-6);align-items:center}
.page-hero.has-mark .ph-grid{grid-template-columns:1fr 6.5rem}
.page-hero h1{font-size:var(--text-4xl);font-weight:400;letter-spacing:-.025em;line-height:1.02;max-width:16ch}
.page-hero.legal h1,.article-body h1{font-size:var(--text-3xl);max-width:22ch}
.hero-mark-wrap{align-self:start;justify-self:end;width:6.5rem;margin-top:var(--space-2)}
.hero-mark{width:100%;height:auto;display:block;overflow:visible}
@media (min-width:62rem){
  .page-hero{padding:var(--space-9) 0 var(--space-9)}
  .page-hero.has-mark .ph-grid{grid-template-columns:minmax(0,1fr) minmax(18rem,26rem)}
  .hero-mark-wrap{width:100%;align-self:center;margin:0}
}
.hero-mark .a-rule{fill:none;stroke:var(--color-brass);stroke-width:.6;opacity:.55;vector-effect:non-scaling-stroke}
.hero-mark .a-rule-strong{fill:none;stroke:var(--color-green);stroke-width:1.2;opacity:.8;vector-effect:non-scaling-stroke}
.hero-mark .a-dot{fill:var(--color-brass);opacity:.35}
.hero-mark .a-trail{fill:none;stroke:var(--color-brass);stroke-width:2.2;stroke-dasharray:.012 .018;stroke-linecap:round}
.hero-mark .a-trail-faint{opacity:.55}
.hero-mark .a-step{fill:var(--color-green)}
.hero-mark .a-node{fill:var(--color-paper);stroke:var(--color-green);stroke-width:2}
.hero-mark .a-tier{fill:var(--color-paper);stroke:var(--color-green);stroke-width:1.4}
.hero-mark .a-tier-1{fill:#E9E2D2}.hero-mark .a-tier-2{fill:var(--color-green)}
.hero-mark .a-draw{fill:none;stroke:var(--color-green);stroke-width:2.4;stroke-linecap:round}
.hero-mark .a-line-up{stroke:var(--color-brass);stroke-width:3}
.hero-mark .a-tick{stroke:var(--color-rule);stroke-width:3;stroke-linecap:round}
.hero-mark .a-tick-on{stroke:var(--color-green);stroke-width:3;stroke-linecap:round}
.hero-mark .a-needle{stroke:var(--color-brass);stroke-width:3;stroke-linecap:round}
.hero-mark .a-sheet{fill:var(--color-paper);stroke:var(--color-green);stroke-width:1.4}
.hero-mark .a-bar{fill:var(--color-green)}.hero-mark .a-bar:nth-of-type(odd){fill:var(--color-brass)}
.hero-mark .a-lens{fill:none;stroke:var(--color-green);stroke-width:5;stroke-linecap:round}
.hero-mark .a-cell{fill:var(--color-brass);opacity:.8}
.hero-mark .a-bubble{fill:var(--color-paper);stroke:var(--color-green);stroke-width:1.6}
.section-alt+.page-hero .hero-mark .a-sheet{fill:var(--color-paper-alt)}
@media (prefers-reduced-motion:no-preference){
  .js .hero-mark .a-draw,.js .hero-mark .a-line-up{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.4s .2s var(--ease) forwards}
  .js .hero-mark .a-trail{animation:trail-in 1.2s .1s var(--ease) both}
  .js .hero-mark .a-node,.js .hero-mark .a-step,.js .hero-mark .a-tier,.js .hero-mark .a-bar,.js .hero-mark .a-cell,.js .hero-mark .a-bubble,.js .hero-mark .a-tick-on{animation:pop .6s calc(.25s + var(--i,0)*70ms) var(--ease) both;transform-box:fill-box;transform-origin:center}
  .js .hero-mark .a-needle{transform-origin:200px 200px;animation:needle 1.6s .3s var(--ease) both}
  .js .hero-mark{animation:mark-in 1s var(--ease) both}
}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes trail-in{from{opacity:0}to{opacity:1}}
@keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes needle{from{transform:rotate(-120deg)}to{transform:rotate(52deg)}}
@keyframes mark-in{from{opacity:0;transform:translateY(12px) rotate(-4deg)}to{opacity:1;transform:none}}

/* Type rhythm */
.section-head h2,.close-band h2{text-wrap:balance}
.lede{text-wrap:pretty}
.section{padding:clamp(4rem,3rem + 4vw,7rem) 0}
.section-head{margin-bottom:clamp(2rem,1.5rem + 2vw,3.5rem)}
.section-head .eyebrow{margin-bottom:var(--space-3)}
h3{text-wrap:balance}
.tl-num,.tc-num,.ledger-item .num,.area-cards .num{font-family:var(--font-serif);font-style:italic;color:var(--color-brass-text);font-variant-numeric:lining-nums}

/* Custom cursor on primary actions (falls back to pointer) */
.btn,.tool-card,.tier-card .text-link,.method-links a{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='14' fill='%23C8AE74' fill-opacity='.18' stroke='%23A68A4E' stroke-width='1.5'/%3E%3Ccircle cx='16' cy='16' r='2.5' fill='%231F3B2D'/%3E%3C/svg%3E") 16 16,pointer}

/* Micro-interactions */
.btn{position:relative;overflow:hidden;isolation:isolate;transition:background-color var(--motion-base) var(--ease),color var(--motion-base) var(--ease),border-color var(--motion-base) var(--ease),transform var(--motion-fast) var(--ease)}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);transform:translateX(-120%);transition:transform .6s var(--ease)}
.btn:hover::after{transform:translateX(120%)}
.btn:active{transform:translateY(1px) scale(.99)}
:focus-visible{transition:outline-offset var(--motion-fast) var(--ease)}
.btn:focus-visible,.tool-card:focus-visible,.text-link:focus-visible{outline-offset:5px}
.text-link{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size var(--motion-base) var(--ease)}
.text-link:hover{background-size:0 1px;background-position:100% 100%}
.tool-card .tc-num{display:inline-block;transition:transform var(--motion-base) var(--ease)}
.tool-card:hover .tc-num{transform:translateX(6px)}
.tier-card,.tier-full{transition:transform var(--motion-base) var(--ease),box-shadow var(--motion-base) var(--ease)}
.tier-card:hover,.tier-full:hover{transform:translateY(-4px);box-shadow:0 30px 50px -36px rgba(29,36,32,.5)}
.tier-card::before,.tier-full::before{transition:border-color var(--motion-base) var(--ease),inset var(--motion-base) var(--ease)}
.tier-card:hover::before,.tier-full:hover::before{border-color:var(--color-brass);inset:4px}
.ledger-item{border-top:0;background:linear-gradient(var(--color-ink),var(--color-ink)) 0 0/100% 1px no-repeat,linear-gradient(var(--color-brass),var(--color-brass)) 0 0/0 3px no-repeat;transition:background-size .5s var(--ease)}
.ledger-item:hover{background-size:100% 1px,100% 3px}
.method-links a{transition:padding var(--motion-base) var(--ease),color var(--motion-base) var(--ease)}
.method-links a:hover{padding-left:var(--space-3);color:var(--color-green)}
.faq summary{transition:color var(--motion-base) var(--ease)}
.faq summary:hover{color:var(--color-green)}
.faq summary::after{transition:transform var(--motion-base) var(--ease)}
@media (prefers-reduced-motion:reduce){.btn::after{display:none}.tier-card:hover,.tier-full:hover,.tool-card:hover{transform:none}}

/* Timelines: a trail connects the steps */
.timeline{position:relative}
.timeline::before{content:"";position:absolute;left:1.15rem;top:2.6rem;bottom:2.6rem;width:2px;background:radial-gradient(circle,var(--color-brass) 1.1px,transparent 1.4px) 0 0/2px 9px repeat-y;opacity:.8}
.timeline li{border-top:0;border-bottom:1px solid var(--color-rule)}
.timeline li:last-child{border-bottom:0}
.timeline .tl-num{position:relative;display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--color-paper);border:1px solid var(--color-brass);font-size:var(--text-base);font-style:normal;font-family:var(--font-sans);font-weight:700;color:var(--color-green);z-index:1}
.section-alt .timeline .tl-num{background:var(--color-paper-alt)}
.timeline-sm::before{left:1.15rem}
.timeline li:hover .tl-num{background:var(--color-green);color:var(--color-paper);border-color:var(--color-green)}
.timeline .tl-num{transition:background-color var(--motion-base) var(--ease),color var(--motion-base) var(--ease)}

/* Scroll-linked motion, only where supported and wanted */
.read-progress{position:fixed;left:0;right:0;top:0;height:3px;background:var(--color-brass);transform-origin:0 50%;transform:scaleX(0);z-index:40;pointer-events:none}
@supports (animation-timeline:scroll()){
  @media (prefers-reduced-motion:no-preference){
    .read-progress{animation:grow linear both;animation-timeline:scroll(root)}
    .hero-home .hero-art .seal{animation:seal-scroll linear both;animation-timeline:scroll(root);animation-range:0 900px}
    .page-hero .hero-mark-wrap{animation:mark-scroll linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
    .section-alt{animation:alt-in linear both;animation-timeline:view();animation-range:entry 0% entry 40%}
  }
}
@supports not (animation-timeline:scroll()){.read-progress{display:none}}
@keyframes grow{to{transform:scaleX(1)}}
@keyframes seal-scroll{to{transform:rotate(40deg) scale(.94)}}
@keyframes mark-scroll{to{transform:translateY(-40px) rotate(6deg);opacity:.4}}
@keyframes alt-in{from{background-color:var(--color-paper)}to{background-color:var(--color-paper-alt)}}
/* Staggered reveal of grid children */
@media (prefers-reduced-motion:no-preference){
  .js .reveal .grid>*,.js .reveal .timeline>li,.js .reveal .ledger>li{transition:opacity .7s var(--ease),transform .7s var(--ease)}
  .js .reveal.pre .grid>*,.js .reveal.pre .timeline>li,.js .reveal.pre .ledger>li{opacity:0;transform:translateY(18px)}
  .js .reveal .grid>:nth-child(2),.js .reveal .timeline>li:nth-child(2),.js .reveal .ledger>li:nth-child(2){transition-delay:90ms}
  .js .reveal .grid>:nth-child(3),.js .reveal .timeline>li:nth-child(3),.js .reveal .ledger>li:nth-child(3){transition-delay:180ms}
  .js .reveal .grid>:nth-child(4),.js .reveal .timeline>li:nth-child(4),.js .reveal .ledger>li:nth-child(4){transition-delay:270ms}
  .js .reveal .timeline>li:nth-child(n+5){transition-delay:340ms}
}

/* Data-viz */
.chart .bar-h,.chart .bar-v,.payback .blk,.payback .call,.gauge path{transform-box:fill-box}
.chart .bar-h{transform-origin:0 50%}
.chart .bar-v{transform-origin:50% 100%}
@media (prefers-reduced-motion:no-preference){
  .js .viz:not(.in) .bar-h{transform:scaleX(0)}
  .js .viz:not(.in) .bar-v,.js .viz:not(.in) .blk{transform:scaleY(0)}
  .js .viz:not(.in) .flow,.js .viz:not(.in) .val,.js .viz:not(.in) .call,.js .viz:not(.in) .g-on,.js .viz:not(.in) .cbig{opacity:0}
  .js .viz .bar-h,.js .viz .bar-v,.js .viz .blk{transition:transform .9s calc(var(--i,0)*90ms) var(--ease)}
  .js .viz .flow,.js .viz .val,.js .viz .cbig{transition:opacity .8s .5s var(--ease)}
  .js .viz .call,.js .viz .g-on{transition:opacity .4s calc(var(--i,0)*45ms) var(--ease)}
}
.funnel .flow{fill:var(--color-brass);opacity:.16}
.funnel .val{fill:var(--color-green)}
.funnel .cbig{font:500 30px var(--font-serif);fill:var(--color-paper)}
.funnel .fo-l{margin:0;font:500 12px/1.3 var(--font-sans);color:var(--color-ink);text-align:center}
.funnel{margin:var(--space-6) 0}
.payback{margin:var(--space-5) 0 var(--space-3);max-width:32rem}
.payback .blk{fill:var(--color-green);transform-origin:50% 100%}
.payback .cl-on{font:600 14px var(--font-sans);fill:var(--color-paper)}
.payback .cv{font:700 14px var(--font-sans);fill:var(--color-brass-text)}
.payback .cx{font:700 10px var(--font-sans);letter-spacing:.12em;fill:#7A5F28}
.payback .cost-line{stroke:var(--color-brass);stroke-width:2;stroke-dasharray:4 3}
.payback .call{fill:var(--color-paper);stroke:var(--color-green);stroke-width:1.5}
.payback .call.on{fill:var(--color-brass)}
.gauge{display:block;width:12rem;height:auto;margin-top:var(--space-4)}
.gauge .g-on{fill:var(--color-brass)}
.gauge .g-off{fill:var(--color-rule)}
.gauge .g-num{font:500 34px var(--font-serif);fill:var(--color-ink)}
.gauge .g-of{font:600 15px var(--font-sans);fill:var(--color-muted)}

/* Own performance block */
.scores-section{border-top:1px solid var(--color-rule)}
.scores{display:grid;gap:var(--space-6)}
@media (min-width:62rem){.scores{grid-template-columns:minmax(0,22rem) 1fr;align-items:start}.scores-lab{grid-column:2}}
.scores h2{font-size:var(--text-2xl)}
.fig-source{font-size:var(--text-xs);color:var(--color-muted);max-width:44ch}
.dials{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-5);list-style:none;margin:0;padding:0}
@media (min-width:48rem){.dials{grid-template-columns:repeat(4,1fr)}}
.dial{display:grid;justify-items:start;position:relative;gap:var(--space-1)}
.dial svg{width:84px;height:84px}
.dial-track{fill:none;stroke:var(--color-rule);stroke-width:4}
.dial-arc{fill:none;stroke:var(--color-green);stroke-width:4;stroke-linecap:round}
.dial-num{position:absolute;top:0;left:0;width:84px;height:84px;display:grid;place-items:center;font:500 1.45rem var(--font-serif);font-variant-numeric:tabular-nums}
.dial-lab{font-weight:700;font-size:var(--text-sm)}
.fig-meta{display:block;font-size:var(--text-xs);color:var(--color-muted);line-height:1.35}
.scores-lab h3{font-size:var(--text-lg);margin-bottom:var(--space-3)}
.scores-lab dl{display:grid;gap:var(--space-4);margin:0}
@media (min-width:48rem){.scores-lab dl{grid-template-columns:repeat(3,1fr)}}
.scores-lab dt{font-size:var(--text-sm);color:var(--color-muted)}
.scores-lab dd{margin:0}
.scores-lab dd strong{font:500 var(--text-2xl) var(--font-serif);display:block}
@media (prefers-reduced-motion:no-preference){.js .viz:not(.in) .dial-arc{stroke-dasharray:0 999!important}.js .dial-arc{transition:stroke-dasharray 1.2s var(--ease)}}

/* Speed test fallback */
.psi-fallback{display:grid;grid-template-columns:auto 1fr;gap:var(--space-5);align-items:start;background:var(--color-paper);border:1px solid var(--color-rule);border-left:3px solid var(--color-brass);border-radius:var(--radius);padding:var(--space-5)}
.psi-fb-art{fill:none;stroke:var(--color-brass);stroke-width:2;stroke-linecap:round}
.psi-fb-h{font-family:var(--font-serif);font-size:var(--text-xl);margin-bottom:var(--space-2)}
.psi-fb-score{font-weight:700;color:var(--color-green);margin:var(--space-3) 0 0}

/* Articles: related links */
.related{margin-top:var(--space-8);padding-top:var(--space-5);border-top:1px solid var(--color-ink)}
.related ul{list-style:none;padding:0;margin:0}
.related a{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-4) 0;border-bottom:1px solid var(--color-rule);font-family:var(--font-serif);font-size:var(--text-xl);color:var(--color-ink);text-decoration:none}
.related a:hover{color:var(--color-green)}
.related a:hover .arr{transform:translateX(4px)}
.related .arr{flex:none;transition:transform var(--motion-base) var(--ease)}
.found-score .gauge{margin-top:var(--space-3)}
@media print{.read-progress,.hero-mark-wrap{display:none!important}}
@media (max-width:61.99rem){
  .page-hero.has-mark .ph-grid{grid-template-columns:1fr;gap:var(--space-3)}
  .hero-mark-wrap{order:-1;justify-self:start;width:5.5rem;margin:0}
}
/* Home hero composition (pass 2) */
@media (min-width:62rem){.hero-card{left:-.5rem;bottom:-1.5rem}}
.hero-chip{position:absolute;top:1.5rem;right:-.5rem;width:15rem;background:rgba(247,244,238,.96);color:var(--color-ink);border-radius:var(--radius);padding:var(--space-4);box-shadow:0 24px 50px -30px rgba(0,0,0,.6),0 0 0 1px rgba(166,138,78,.35);display:none}
.hero-chip ul{list-style:none;margin:0 0 var(--space-3);padding:0;display:grid;gap:var(--space-2)}
.hero-chip li{display:grid;gap:3px;font-size:var(--text-xs)}
.hero-chip i{display:block;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--color-green),var(--color-green)) 0 0/calc(var(--w)*100%) 100% no-repeat,var(--color-rule)}
.hero-chip .data-tag{margin:0}
.hero-trail{position:absolute;inset:auto auto 4rem -2rem;width:70%;height:auto;pointer-events:none;display:none}
.hero-trail path{fill:none;stroke:var(--color-brass-on-green);stroke-width:2;stroke-dasharray:.008 .014;stroke-linecap:round;opacity:.75}
.hero-trail circle{fill:var(--color-brass-on-green)}
@media (min-width:62rem){.hero-chip,.hero-trail{display:block}}
@media (prefers-reduced-motion:no-preference){
  .js .hero-chip{animation:card-in .9s .6s var(--ease) both}
  .js .hero-chip i{transition:background-size 1s var(--ease)}
  .js .hero-trail{animation:trail-in 1.4s .8s var(--ease) both}
}
@media (min-width:62rem){
  .hero-chip{top:-3rem;right:-1.5rem;width:14.5rem;z-index:1}
  .hero-card{bottom:-3.5rem;z-index:2}
  .hero-trail{inset:auto -1rem 1rem auto;width:58%;z-index:0}
}
.hero-chip .data-tag{font-size:10px;letter-spacing:.06em;white-space:normal}
.hero-chip .data-tag{border-radius:3px;display:block;text-align:center}.hero-trail path{opacity:.95;stroke-width:2.6}
@media (max-width:61.99rem){.hero-card{left:auto;justify-self:center}}
/* charts: wide layout from 40rem, re-laid-out narrow layout on phones */
.cv-narrow{display:none}
@media (max-width:40rem){.cv-wide{display:none}.cv-narrow{display:block}.payback.cv-narrow{max-width:none}}
.funnel .fo-left{text-align:left}
.chart .cv-on{fill:var(--color-paper)}
.prose li,.prose blockquote{max-width:var(--measure)}
@media (max-width:30rem){.article-body h1{font-size:2rem;line-height:1.1}}
.report-article-link{margin:var(--space-6) auto 0;text-align:center;max-width:none}

.opening{font-weight:600;color:var(--color-ink,inherit);margin-block:.75rem}.hero-home .opening{color:#C8AE74}.tiers+.opening{text-align:center;margin:1.5rem auto 0;max-width:none}

/* Gold has no tier tag (hotfix g): keep its name level with Bronze and Silver */
.tier-card>h3:first-child,.tier-full>h3:first-child{margin-top:calc(var(--text-xs) * var(--leading-tag, 1.5) + var(--space-2) + 1px)}