/* ============================================================
   Self-hosted variable fonts. No external requests, no Google.
   Files under assets/fonts/, SIL Open Font License (see the
   LICENSE-*.txt files alongside them).

   These are variable fonts, so one file per family covers every
   weight the site uses, including the 550 and 650 in-between
   weights that a static font would have had to round off.
   ============================================================ */

@font-face{
  font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("../fonts/inter-var.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,
    U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,
    U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("../fonts/inter-var-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,
    U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,
    U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"JetBrains Mono";font-style:normal;font-weight:100 800;font-display:swap;
  src:url("../fonts/jetbrains-mono-var.woff2") format("woff2");
}
@font-face{
  font-family:"Newsreader";font-style:normal;font-weight:200 800;font-display:swap;
  src:url("../fonts/newsreader-var.woff2") format("woff2");
}

/* ============================================================
   ProtPTX — protptx.com
   Palette: light throughout. Paper, sage wash, eucalyptus accent.
   No dark grounds; every panel is a tint, separated by hairlines.
   ============================================================ */

:root{
  color-scheme:light;

  /* Text. Slate, not black. Text colours only, never used as a ground. */
  --ink:#0F172A;
  --ink-soft:#475569;
  --ink-mute:#5C6B80;

  /* Grounds, lightest first. All light. */
  --paper:#FFFFFF;
  --wash:#F8FAFC;
  --tint:#F1F5F9;
  --white:#fff;

  /* Hairlines */
  --rule:#E2E8F0;
  --rule-soft:#EEF2F6;

  /* Brand: blue primary, teal secondary, gradient across the two */
  --seal:#2563EB;
  --seal-deep:#1D4ED8;
  --seal-hover:#1D4ED8;
  --seal-bright:#3B82F6;
  --seal-soft:#DBEAFE;
  --teal:#0F766E;
  --teal-soft:#CCFBF1;
  --grad:linear-gradient(135deg,#3B82F6 0%,#14B8A6 100%);

  /* Status */
  --ok:#047857;
  --ok-soft:#D1FAE5;
  --flag:#B91C1C;
  --flag-soft:#FEE2E2;
  --gold:#A04A08;
  --gold-soft:#FEF3C7;

  --shadow-1:0 1px 2px rgba(15,23,42,.05), 0 2px 8px rgba(15,23,42,.04);
  --shadow-2:0 2px 4px rgba(15,23,42,.06), 0 12px 30px rgba(15,23,42,.08);

  --wrap:1160px;
  --gap:clamp(20px,4vw,40px);
  --r:10px;

  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--seal);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
hr{border:0;border-top:1px solid var(--rule);margin:0}

h1,h2,h3,h4{margin:0 0 .5em;line-height:1.14;letter-spacing:-.022em;font-weight:600;
  text-wrap:balance;color:var(--ink)}
h1{font-size:clamp(2.15rem,1.4rem + 2.9vw,3.5rem);letter-spacing:-.032em}
h2{font-size:clamp(1.6rem,1.15rem + 1.7vw,2.35rem);letter-spacing:-.028em}
h3{font-size:clamp(1.12rem,1rem + .5vw,1.35rem)}
h4{font-size:1rem;letter-spacing:-.01em}
p{margin:0 0 1.05em}
ul,ol{margin:0 0 1.05em;padding-left:1.25em}
li{margin:.3em 0}
strong{font-weight:600}
small{font-size:.86rem}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gap)}
.narrow{max-width:760px}
.mid{max-width:920px}
.center{text-align:center}
.mt0{margin-top:0}.mb0{margin-bottom:0}
.section{padding:clamp(52px,7vw,92px) 0}
.section--tight{padding:clamp(36px,5vw,60px) 0}
.section--paper2{background:var(--wash)}
.section--panel{background:var(--tint);border-block:1px solid var(--rule)}
.rule-top{border-top:1px solid var(--rule)}

/* ---------- Type utilities ---------- */
.eyebrow{
  font-family:var(--mono);font-size:.7rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--seal);
  margin:0 0 14px;display:flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:currentColor;flex:none}
.lede{font-size:clamp(1.05rem,1rem + .35vw,1.24rem);color:var(--ink-soft);line-height:1.55}
.muted{color:var(--ink-mute)}
.mono{font-family:var(--mono);font-size:.82em;letter-spacing:-.01em}
.figure{color:var(--seal-deep);font-weight:650}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-size:.94rem;font-weight:550;letter-spacing:-.01em;
  padding:12px 20px;border-radius:8px;border:1px solid transparent;
  cursor:pointer;transition:.15s ease;text-decoration:none!important;
  font-family:inherit;
  white-space:nowrap;   /* label wrapped to three lines in the header without this */
}
.btn--primary{background:var(--seal);color:#fff;border-color:var(--seal)}
.btn--primary:hover{background:var(--seal-hover);border-color:var(--seal-hover)}
.btn--ghost{background:var(--white);color:var(--ink);border-color:var(--rule)}
.btn--ghost:hover{border-color:var(--seal);color:var(--seal-deep)}
.btn--sm{padding:9px 15px;font-size:.87rem}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:26px}
.btn-note{font-size:.85rem;color:var(--ink-mute)}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:70;background:rgba(252,252,250,.9);
  backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--rule);
}
/* The header carries more than the text column does: the lockup, six nav items,
   a sign-in link and a CTA. Its content needs about 1180px, while the article
   column is 1080px, so the header gets its own wider track. Everything else on
   the page keeps the narrower measure that is comfortable to read. */
.hdr{display:flex;align-items:center;gap:22px;height:66px;max-width:1320px}
/* Logo lockup: mark, then the short name with the open name beneath it.
   Text rather than an image, so it stays selectable and sharp at any zoom. */
.logo{display:flex;align-items:center;gap:10px;color:var(--ink);
  text-decoration:none!important;flex:none}
.logo:hover{opacity:.75}
.logo-mark{width:30px;height:30px;flex:none}
.logo-text{display:flex;flex-direction:column;justify-content:center;gap:1px}
.logo-name{font-weight:700;font-size:1.14rem;line-height:1;letter-spacing:-.033em}
.logo-name b{font-weight:700;color:var(--seal-deep)}
.logo-desc{font-size:.575rem;line-height:1;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink-mute);font-weight:600;white-space:nowrap}
@media(max-width:400px){.logo-desc{display:none}}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav a{
  color:var(--ink-soft);font-size:.885rem;font-weight:500;padding:8px 9px;
  border-radius:7px;text-decoration:none!important;letter-spacing:-.008em;
  white-space:nowrap;   /* multi-word items wrapped to two lines without this */
}
.nav a:hover{background:var(--tint);color:var(--ink)}
.nav a[aria-current="page"]{color:var(--seal-deep);font-weight:600}
.hdr .btn{margin-left:10px}
.burger{display:none;margin-left:auto;background:var(--white);border:1px solid var(--rule);
  border-radius:7px;padding:8px 10px;cursor:pointer;color:var(--ink)}
.mobile-nav{display:none;border-top:1px solid var(--rule);background:var(--paper);padding:10px var(--gap) 20px}
.mobile-nav.open{display:block}
.mobile-nav a{display:block;padding:11px 0;border-bottom:1px solid var(--rule-soft);
  color:var(--ink);font-weight:500;font-size:.98rem;text-decoration:none!important}
.mobile-nav .btn{display:flex;align-items:center;justify-content:center;
  margin-top:16px;width:100%;border-bottom:0}
.mobile-nav .btn--primary{color:#fff}
/* Switch to the burger before the nav can overflow. The lockup is wider than
   a plain wordmark, so this threshold sits above the old 960px. */
@media(max-width:1360px){
  .nav,.hdr>.btn{display:none}
  .burger{display:block}
}

/* ---------- Hero ---------- */
.hero{
  background:linear-gradient(180deg,var(--wash) 0%,var(--paper) 100%);
  border-bottom:1px solid var(--rule);position:relative;overflow:hidden;
  padding:clamp(60px,8vw,104px) 0 clamp(56px,7vw,88px);
}
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:linear-gradient(rgba(15,23,42,.05) 1px,transparent 1px);
  background-size:100% 30px;
}
.hero .wrap{position:relative;z-index:1}
.hero h1{max-width:16ch}
.hero .lede{max-width:62ch;font-size:clamp(1.08rem,1rem + .5vw,1.3rem)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,64px);align-items:start}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}
.hero-badges{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0}
.hero-badge{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--seal-deep);background:var(--white);
  border:1px solid var(--rule);border-radius:100px;padding:5px 11px;
}

/* ---------- Ledger card (signature component) ---------- */
.ledger{
  background:var(--white);border:1px solid var(--rule);border-radius:var(--r);
  box-shadow:var(--shadow-2);overflow:hidden;
}
.ledger-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 16px;background:var(--wash);border-bottom:1px solid var(--rule);
}
.ledger-title{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-soft);margin:0}
.ledger-status{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ok);display:flex;align-items:center;gap:6px;margin:0}
.ledger-status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ok)}
.ledger-row{
  display:grid;grid-template-columns:88px 1fr auto;gap:14px;align-items:center;
  padding:11px 16px;border-bottom:1px solid var(--rule-soft);font-size:.88rem;
}
.ledger-row:last-child{border-bottom:0}
.ledger-date{font-family:var(--mono);font-size:.74rem;color:var(--ink-mute);letter-spacing:-.02em;
  font-variant-numeric:tabular-nums}
.ledger-what{color:var(--ink);line-height:1.35}
.ledger-what small{display:block;color:var(--ink-mute);font-size:.78rem;margin-top:2px}
.tick{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;
  padding:3px 8px;border-radius:5px;white-space:nowrap;
}
.tick--done{background:var(--ok-soft);color:var(--ok)}
.tick--due{background:var(--gold-soft);color:var(--gold)}
.tick--gap{background:var(--flag-soft);color:var(--flag)}
.ledger-foot{padding:11px 16px;background:var(--wash);border-top:1px solid var(--rule);
  font-family:var(--mono);font-size:.7rem;color:var(--ink-mute);letter-spacing:.03em}

/* ---------- Cards / grids ---------- */
.grid{display:grid;gap:20px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.g2,.g3,.g4{grid-template-columns:1fr}}

.card{
  background:var(--white);border:1px solid var(--rule);border-radius:var(--r);
  padding:24px;box-shadow:var(--shadow-1);
}
.card h3{margin-bottom:.4em}
.card p:last-child{margin-bottom:0}
.card--flat{box-shadow:none;background:transparent;border-color:var(--rule-soft)}
.card--onpanel{background:var(--white);border-color:var(--rule)}
.card-num{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--seal);
  display:block;margin-bottom:12px;
}
.card-ico{width:30px;height:30px;margin-bottom:14px;color:var(--seal)}

/* ---------- Pillars (numbered feature rows) ---------- */
.pillar{display:grid;grid-template-columns:56px 1fr;gap:20px;padding:26px 0;border-bottom:1px solid var(--rule-soft)}
.pillar:last-child{border-bottom:0}
.pillar-n{
  font-family:var(--mono);font-size:.78rem;color:var(--seal);border:1px solid var(--rule);
  border-radius:8px;width:40px;height:40px;display:grid;place-items:center;background:var(--white);
}
.pillar h3{margin-bottom:.35em}
.pillar p:last-child{margin-bottom:0}
@media(max-width:620px){.pillar{grid-template-columns:1fr;gap:12px}}

/* ---------- Citation / source blocks ---------- */
.cite{
  display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);
  font-size:.7rem;letter-spacing:.02em;color:var(--ink-mute);
  background:var(--wash);border:1px solid var(--rule-soft);
  border-radius:5px;padding:3px 8px;margin:2px 4px 2px 0;
}
.cite b{font-weight:500;color:var(--seal)}
.section--panel .cite{background:var(--white)}

.quote{
  border-left:3px solid var(--seal);background:var(--white);
  padding:20px 24px;margin:26px 0;border-radius:0 var(--r) var(--r) 0;
  font-family:var(--serif);font-size:1.14rem;line-height:1.5;color:var(--ink);
  box-shadow:var(--shadow-1);
}
.quote cite{display:block;margin-top:12px;font-family:var(--mono);font-size:.72rem;
  font-style:normal;letter-spacing:.05em;color:var(--ink-mute);text-transform:uppercase}

.callout{
  background:var(--gold-soft);border:1px solid #FDE68A;border-radius:var(--r);
  padding:20px 22px;margin:26px 0;
}
.callout .callout-label{
  color:var(--gold);font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;margin:0 0 .6em;font-weight:500;
}
.callout p:last-child{margin-bottom:0}
.callout--flag{background:var(--flag-soft);border-color:#FECACA}
.callout--flag .callout-label{color:var(--flag)}
.callout--seal{background:var(--seal-soft);border-color:#BFDBFE}
.callout--seal .callout-label{color:var(--seal)}

/* ---------- Requirement checklist tables ---------- */
.req{border:1px solid var(--rule);border-radius:var(--r);overflow:hidden;background:var(--white);margin:24px 0}
.req-head{padding:14px 18px;background:var(--wash);border-bottom:1px solid var(--rule)}
.req-head h3{margin:0;font-size:1.02rem}
.req-head p{margin:4px 0 0;font-size:.85rem;color:var(--ink-mute)}
.req-item{display:grid;grid-template-columns:74px 1fr;gap:16px;padding:14px 18px;
  border-bottom:1px solid var(--rule-soft);font-size:.93rem;align-items:start}
.req-item:last-child{border-bottom:0}
.req-key{font-family:var(--mono);font-size:.72rem;color:var(--seal);padding-top:3px;letter-spacing:-.01em}
.req-item b{font-weight:600;display:block;margin-bottom:2px}
.req-item span{color:var(--ink-soft);font-size:.88rem;line-height:1.5}
@media(max-width:620px){.req-item{grid-template-columns:1fr;gap:4px}}

/* ---------- Comparison table ---------- */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:26px 0;
  border:1px solid var(--rule);border-radius:var(--r);background:var(--white)}
table{border-collapse:collapse;width:100%;min-width:640px;font-size:.9rem}
th,td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--rule-soft);vertical-align:top}
thead th{background:var(--wash);font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-soft);font-weight:500;border-bottom:1px solid var(--rule)}
tbody tr:last-child td{border-bottom:0}
td b{font-weight:600}
.yes{color:var(--ok);font-weight:600}
.no{color:var(--ink-mute)}

/* ---------- Video placeholder ---------- */
.video{
  position:relative;background:var(--wash);border-radius:var(--r);overflow:hidden;
  aspect-ratio:16/9;display:grid;place-items:center;text-align:center;
  border:1px dashed var(--rule);
}
.video::after{
  content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background-image:linear-gradient(rgba(15,23,42,.04) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(15,23,42,.04) 1px,transparent 1px);
  background-size:34px 34px;
}
.video-inner{position:relative;z-index:1;padding:24px}
.video-play{
  width:56px;height:56px;border-radius:50%;border:1px solid var(--rule);
  background:var(--white);display:grid;place-items:center;margin:0 auto 16px;color:var(--seal);
}
.video-label{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--seal);margin:0 0 6px}
.video-title{color:var(--ink);font-weight:600;font-size:1.02rem;margin:0 0 4px;letter-spacing:-.02em}
.video-meta{color:var(--ink-mute);font-size:.82rem;margin:0;font-family:var(--mono)}

.video-card{background:var(--white);border:1px solid var(--rule);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--shadow-1);display:flex;flex-direction:column}
.video-card .video{border-radius:0;border:0;border-bottom:1px solid var(--rule)}
.video-card-body{padding:20px;flex:1;display:flex;flex-direction:column}
.video-card-body h3{font-size:1.04rem;margin-bottom:.35em}
.video-card-body p{font-size:.9rem;color:var(--ink-soft);flex:1}
.video-card-body p:last-of-type{margin-bottom:14px}
.kicker{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--seal);margin:0 0 8px}

/* ---------- Pricing ---------- */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
@media(max-width:900px){.price-grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto}}
.plan{background:var(--white);border:1px solid var(--rule);border-radius:var(--r);
  padding:26px;box-shadow:var(--shadow-1);display:flex;flex-direction:column}
.plan--feature{border-color:var(--seal);box-shadow:var(--shadow-2);position:relative}
.plan-flag{position:absolute;top:-11px;left:26px;background:var(--seal);color:#fff;
  font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;
  padding:4px 10px;border-radius:5px}
.plan h2{font-size:clamp(1.12rem,1rem + .5vw,1.35rem);letter-spacing:-.022em;margin-bottom:.25em}
.plan-for{font-size:.87rem;color:var(--ink-mute);margin-bottom:18px;min-height:2.6em}
.plan-price{font-size:2rem;font-weight:650;letter-spacing:-.035em;line-height:1;margin:0 0 4px;
  display:flex;align-items:baseline;gap:6px}
.plan-price .unit{font-size:.86rem;font-weight:400;color:var(--ink-mute);letter-spacing:0}
.plan-setup{font-family:var(--mono);font-size:.76rem;color:var(--ink-mute);margin:0 0 20px}
.plan ul{list-style:none;padding:0;margin:0 0 22px;flex:1}
.plan li{padding:8px 0 8px 26px;position:relative;font-size:.9rem;border-bottom:1px solid var(--rule-soft);
  line-height:1.45}
.plan li:last-child{border-bottom:0}
.plan li::before{content:"";position:absolute;left:4px;top:15px;width:11px;height:6px;
  border-left:1.8px solid var(--seal);border-bottom:1.8px solid var(--seal);transform:rotate(-45deg)}
.plan li.off{color:var(--ink-mute)}
.plan li.off::before{content:"\2014";transform:none;width:auto;height:auto;border:0;
  left:3px;top:7px;color:var(--rule);font-family:var(--mono);font-size:.8rem}
.plan .btn{width:100%;justify-content:center}
.tbd{background:var(--gold-soft);color:var(--gold);border-radius:5px;padding:1px 7px;
  font-family:var(--mono);font-size:.62em;letter-spacing:.06em;text-transform:uppercase;
  vertical-align:middle;font-weight:500}

/* ---------- Assessment tool ---------- */
.assess{background:var(--white);border:1px solid var(--rule);border-radius:var(--r);
  box-shadow:var(--shadow-2);overflow:hidden;margin:32px 0}
.assess-head{padding:20px 24px;background:var(--wash);border-bottom:1px solid var(--rule);
  display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.assess-head h2{margin:0;font-size:1.06rem;letter-spacing:-.02em}
.assess-head p{margin:3px 0 0;font-size:.84rem;color:var(--ink-mute)}
.assess-meter{font-family:var(--mono);font-size:.78rem;color:var(--ink-soft);white-space:nowrap;
  font-variant-numeric:tabular-nums}
.assess-meter b{font-size:1.5rem;color:var(--ink);letter-spacing:-.03em;font-weight:650}
.assess-group{border-bottom:1px solid var(--rule)}
.assess-group:last-of-type{border-bottom:0}
.assess-group > h3{margin:0;padding:14px 24px;background:var(--tint);font-family:var(--mono);
  font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);
  border-bottom:1px solid var(--rule-soft)}
.q{display:grid;grid-template-columns:1fr 148px;gap:16px;padding:14px 24px;
  border-bottom:1px solid var(--rule-soft);align-items:center}
.q:last-child{border-bottom:0}
.q-text{font-size:.93rem;line-height:1.45}
.q-text .cite{margin-top:6px}
.q-opts{display:flex;gap:6px;justify-content:flex-end}
.q-opts label{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;
  border:1px solid var(--rule);border-radius:6px;padding:6px 9px;cursor:pointer;
  color:var(--ink-mute);background:var(--paper);transition:.12s;user-select:none;
}
.q-opts input{position:absolute;opacity:0;width:0;height:0}
.q-opts label:hover{border-color:var(--ink-mute)}
.q-opts label.sel-yes{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
.q-opts label.sel-no{background:var(--flag-soft);border-color:var(--flag);color:var(--flag)}
.q-opts label.sel-unsure{background:var(--gold-soft);border-color:var(--gold);color:var(--gold)}
@media(max-width:620px){.q{grid-template-columns:1fr}.q-opts{justify-content:flex-start}}
.assess-foot{padding:20px 24px;background:var(--wash);border-top:1px solid var(--rule)}
#result{display:none;padding:22px 24px;border-top:1px solid var(--rule);background:var(--white)}
#result.show{display:block}
#result h4{font-size:1.02rem;margin-bottom:.5em}
.gap-list{list-style:none;padding:0;margin:14px 0 0}
.gap-list li{padding:10px 0 10px 22px;border-bottom:1px solid var(--rule-soft);position:relative;font-size:.9rem}
.gap-list li:last-child{border-bottom:0}
.gap-list li::before{content:"";position:absolute;left:0;top:17px;width:9px;height:9px;
  border-radius:2px;background:var(--flag)}
.gap-list li.unsure::before{background:var(--gold)}
.gap-list li b{display:block}
.gap-list li .cite{margin-top:5px}

/* ---------- FAQ ---------- */
.faq details{border-bottom:1px solid var(--rule);padding:0}
.faq details:first-of-type{border-top:1px solid var(--rule)}
.faq summary{
  cursor:pointer;padding:18px 34px 18px 0;font-weight:550;font-size:1.02rem;
  position:relative;list-style:none;letter-spacing:-.015em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:6px;top:26px;width:9px;height:9px;
  border-right:1.8px solid var(--ink-mute);border-bottom:1.8px solid var(--ink-mute);
  transform:rotate(45deg);transition:.18s;
}
.faq details[open] summary::after{transform:rotate(-135deg);top:30px}
.faq .faq-body{padding:0 40px 20px 0;color:var(--ink-soft);font-size:.96rem}
.faq .faq-body p:last-child{margin-bottom:0}

/* ---------- Steps / timeline ---------- */
.timeline{position:relative;padding-left:28px;margin:30px 0}
.timeline::before{content:"";position:absolute;left:5px;top:8px;bottom:8px;width:1px;background:var(--rule)}
.tl{position:relative;padding:0 0 26px}
.tl:last-child{padding-bottom:0}
.tl::before{content:"";position:absolute;left:-27px;top:7px;width:11px;height:11px;
  border-radius:50%;background:var(--paper);border:2px solid var(--seal)}
.tl-when{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--seal);margin:0 0 4px}
.tl h3{font-size:1.06rem;margin-bottom:.3em}
.tl p{font-size:.94rem;color:var(--ink-soft);margin-bottom:0}

/* ---------- Forms ---------- */
.form{background:var(--white);border:1px solid var(--rule);border-radius:var(--r);
  padding:26px;box-shadow:var(--shadow-1)}
.field{margin-bottom:16px}
.field label{display:block;font-size:.82rem;font-weight:550;margin-bottom:6px;color:var(--ink-soft);
  letter-spacing:-.005em}
.field input,.field select,.field textarea{
  width:100%;padding:11px 13px;border:1px solid var(--rule);border-radius:8px;
  font-family:inherit;font-size:.95rem;background:var(--paper);color:var(--ink);
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--seal);box-shadow:0 0 0 3px var(--seal-soft);background:#fff}
.field textarea{min-height:110px;resize:vertical}
.form .btn{width:100%;justify-content:center;margin-top:6px}
.form-note{font-size:.8rem;color:var(--ink-mute);margin:12px 0 0;line-height:1.5}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.f2{grid-template-columns:1fr}}

/* ---------- Stat strip ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);
  border:1px solid var(--rule);border-radius:var(--r);overflow:hidden}
@media(max-width:800px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{background:var(--white);padding:22px 20px}
.stat b{display:block;font-size:1.7rem;font-weight:650;letter-spacing:-.035em;line-height:1.1;margin-bottom:4px}
.stat span{display:block;font-size:.85rem;color:var(--ink-soft);line-height:1.4}
.stat .cite{margin-top:8px;display:inline-flex;flex-wrap:wrap;row-gap:2px}
.stat .cite b{display:inline;font-size:inherit;font-weight:500;margin:0;letter-spacing:0;line-height:inherit}

/* ---------- Breadcrumb ---------- */
.crumb{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--ink-mute);
  padding:16px 0;border-bottom:1px solid var(--rule-soft)}
.crumb a{color:var(--ink-mute)}
.crumb a:hover{color:var(--seal)}

/* ---------- CTA band ---------- */
.cta-band{background:var(--tint);border:1px solid var(--rule);color:var(--ink);
  border-radius:14px;padding:clamp(32px,5vw,52px);text-align:center;position:relative;overflow:hidden}
.cta-band::after{content:"";position:absolute;inset:0;opacity:.55;pointer-events:none;
  background-image:linear-gradient(rgba(15,23,42,.05) 1px,transparent 1px);background-size:100% 30px}
.cta-band > *{position:relative;z-index:1}
.cta-band h2{max-width:20ch;margin-inline:auto}
.cta-band p{color:var(--ink-soft);max-width:56ch;margin-inline:auto}
.cta-band .btn-row{justify-content:center}
.cta-band .btn--ghost{background:var(--white)}

/* ---------- Footer ---------- */
.site-footer{background:var(--wash);border-top:1px solid var(--rule);
  padding:clamp(44px,5vw,64px) 0 32px}
.foot-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:32px}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr;gap:28px}}
@media(max-width:520px){.foot-grid{grid-template-columns:1fr}}
.foot-brand p{font-size:.86rem;color:var(--ink-mute);max-width:34ch;margin:14px 0 0;line-height:1.55}
.foot-col h2{font-family:var(--mono);font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-mute);margin-bottom:14px;font-weight:500}
.foot-col a{display:block;padding:5px 0;font-size:.88rem;color:var(--ink-soft);text-decoration:none!important}
.foot-col a:hover{color:var(--seal)}
/* Company line: entity now, address and phone once they are filled in. */
.foot-company{font-size:.83rem;color:var(--ink-mute);margin:0 0 10px;line-height:1.6}
.foot-company b{color:var(--ink-soft);font-weight:600}
.foot-company a{color:var(--ink-mute);text-decoration:underline;text-underline-offset:2px}
.foot-company a:hover{color:var(--seal-deep)}
.foot-bottom{margin-top:40px;padding-top:22px;border-top:1px solid var(--rule);
  display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center;
  font-size:.8rem;color:var(--ink-mute)}
.foot-bottom a{color:var(--ink-mute)}
.disclaimer{font-size:.78rem;color:var(--ink-mute);line-height:1.6;margin-top:20px;
  padding-top:18px;border-top:1px solid var(--rule);max-width:78ch}

/* ---------- Prose (legal pages) ---------- */
.prose h2{margin-top:1.8em;font-size:1.4rem}
.prose h3{margin-top:1.5em;font-size:1.1rem}
.prose ul{padding-left:1.3em}
.prose > p:first-child{font-size:1.05rem;color:var(--ink-soft)}

/* ---------- Misc ---------- */
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:200;background:#fff;padding:10px 16px;
  border:1px solid var(--seal);border-radius:8px}
:focus-visible{outline:2px solid var(--seal);outline-offset:2px;border-radius:4px}
[id]{scroll-margin-top:86px}
@media print{.site-header,.site-footer,.btn{display:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ============================================================
   Components added for the quiz, the single-plan pricing,
   the referral ladder and the segment pages.
   ============================================================ */

/* Gradient accents. The one place the brand gradient is used. */
.grad-rule{height:3px;border-radius:3px;background:var(--grad);width:56px;margin-bottom:20px}
.hero{border-top:3px solid transparent;border-image:var(--grad) 1}

/* ---------- Stepped quiz ---------- */
.quiz{background:var(--white);border:1px solid var(--rule);border-radius:14px;
  box-shadow:var(--shadow-2);overflow:hidden;margin:32px 0}
.quiz-top{padding:18px 24px;background:var(--wash);border-bottom:1px solid var(--rule)}
.quiz-meta{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  font-family:var(--mono);font-size:.74rem;color:var(--ink-soft);
  letter-spacing:.04em;margin-bottom:10px;font-variant-numeric:tabular-nums}
.quiz-meta b{color:var(--ink);font-weight:600}
.quiz-bar{height:6px;border-radius:6px;background:var(--rule);overflow:hidden}
.quiz-bar i{display:block;height:100%;width:0;border-radius:6px;background:var(--grad);
  transition:width .28s ease}
.quiz-body{padding:clamp(26px,4vw,42px) clamp(20px,4vw,40px)}
.quiz-tag{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--seal);background:var(--seal-soft);
  border-radius:5px;padding:4px 9px;margin-bottom:14px}
.quiz-q{font-size:clamp(1.2rem,1rem + 1vw,1.6rem);font-weight:600;letter-spacing:-.025em;
  line-height:1.3;margin:0 0 10px;max-width:32ch;text-wrap:balance}
.quiz-why{font-size:.92rem;color:var(--ink-soft);margin:0 0 6px;max-width:60ch}
.quiz-cite{margin-bottom:24px}
.quiz-answers{display:flex;flex-wrap:wrap;gap:10px}
.quiz-answers button{
  flex:1 1 150px;min-height:56px;padding:14px 18px;border-radius:10px;
  border:1.5px solid var(--rule);background:var(--white);cursor:pointer;
  font-family:inherit;font-size:.98rem;font-weight:550;color:var(--ink);
  text-align:left;transition:.14s;display:flex;align-items:center;gap:10px;
}
.quiz-answers button:hover{border-color:var(--seal);background:var(--wash)}
.quiz-answers button .k{font-family:var(--mono);font-size:.7rem;color:var(--ink-mute);
  border:1px solid var(--rule);border-radius:4px;padding:2px 6px;flex:none}
.quiz-answers button:hover .k{border-color:var(--seal);color:var(--seal)}
.quiz-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:16px 24px;background:var(--wash);border-top:1px solid var(--rule)}
.quiz-back{background:none;border:0;font-family:var(--mono);font-size:.76rem;
  color:var(--ink-mute);cursor:pointer;padding:6px 0;letter-spacing:.04em}
.quiz-back:hover{color:var(--seal)}
.quiz-back[disabled]{opacity:.35;cursor:default}
.quiz-hint{font-family:var(--mono);font-size:.7rem;color:var(--ink-mute);letter-spacing:.03em}

/* ---------- Grade card ---------- */
.grade-wrap{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:center;
  padding:clamp(24px,4vw,36px);border-bottom:1px solid var(--rule)}
@media(max-width:620px){.grade-wrap{grid-template-columns:1fr;gap:18px}}
.grade{
  width:118px;height:118px;border-radius:20px;display:grid;place-items:center;
  font-size:3.6rem;font-weight:800;letter-spacing:-.05em;line-height:1;
  border:2px solid currentColor;
}
.grade small{display:block;font-family:var(--mono);font-size:.62rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;margin-top:6px;opacity:.85}
.grade--a{color:var(--ok);background:var(--ok-soft)}
.grade--b{color:var(--teal);background:var(--teal-soft)}
.grade--c{color:var(--gold);background:var(--gold-soft)}
.grade--d,.grade--f{color:var(--flag);background:var(--flag-soft)}
.grade-say h3{font-size:clamp(1.15rem,1rem + .7vw,1.5rem);margin-bottom:.35em}
.grade-say p{margin-bottom:0;color:var(--ink-soft)}
.grade-score{font-family:var(--mono);font-size:.78rem;color:var(--ink-mute);
  margin-top:10px;font-variant-numeric:tabular-nums}

/* ---------- Single-plan pricing ---------- */
.oneplan{
  background:var(--white);border:1px solid var(--rule);border-radius:16px;
  box-shadow:var(--shadow-2);overflow:hidden;max-width:880px;margin:0 auto;
}
.oneplan-top{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--rule)}
@media(max-width:680px){.oneplan-top{grid-template-columns:1fr}}
.oneplan-cell{padding:clamp(24px,4vw,34px)}
.oneplan-cell + .oneplan-cell{border-left:1px solid var(--rule)}
@media(max-width:680px){.oneplan-cell + .oneplan-cell{border-left:0;border-top:1px solid var(--rule)}}
.oneplan-label{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--seal);margin:0 0 12px}
.oneplan-num{font-size:clamp(2.4rem,2rem + 2vw,3.4rem);font-weight:800;letter-spacing:-.045em;
  line-height:1;margin:0 0 6px;display:flex;align-items:baseline;gap:8px}
.oneplan-num .unit{font-size:.9rem;font-weight:500;color:var(--ink-mute);letter-spacing:0}
.oneplan-cell p{margin:0;font-size:.92rem;color:var(--ink-soft)}
.oneplan-list{padding:clamp(24px,4vw,34px);display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
@media(max-width:680px){.oneplan-list{grid-template-columns:1fr}}
.oneplan-list ul{list-style:none;padding:0;margin:0}
.oneplan-list li{padding:9px 0 9px 26px;position:relative;font-size:.92rem;line-height:1.45;
  border-bottom:1px solid var(--rule-soft)}
.oneplan-list li::before{content:"";position:absolute;left:4px;top:16px;width:11px;height:6px;
  border-left:2px solid var(--ok);border-bottom:2px solid var(--ok);transform:rotate(-45deg)}
.oneplan-foot{padding:0 clamp(24px,4vw,34px) clamp(24px,4vw,34px)}
.oneplan-foot .btn{width:100%;justify-content:center;font-size:1rem;padding:15px 20px}
.oneplan-note{font-size:.82rem;color:var(--ink-mute);margin:14px 0 0;text-align:center}
.no-per-seat{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);
  font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ok);
  background:var(--ok-soft);border-radius:100px;padding:5px 12px;margin-bottom:18px}

/* ---------- Referral ladder ---------- */
.ladder{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;margin:28px 0 10px}
@media(max-width:760px){.ladder{grid-template-columns:repeat(5,1fr)}}
.rung{border:1px solid var(--rule);border-radius:7px;background:var(--white);
  padding:12px 6px;text-align:center}
.rung b{display:block;font-family:var(--mono);font-size:.7rem;color:var(--ink-mute);
  font-weight:500;letter-spacing:.04em}
.rung span{display:block;font-size:.94rem;font-weight:650;letter-spacing:-.02em;margin-top:5px;
  font-variant-numeric:tabular-nums}
.rung--free{border-color:var(--ok);background:var(--ok-soft)}
.rung--free span{color:var(--ok)}
.ladder-cap{font-family:var(--mono);font-size:.74rem;color:var(--ink-mute);
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* ---------- Segment cards ---------- */
.seg{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:980px){.seg{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.seg{grid-template-columns:1fr}}
.seg a{
  display:block;background:var(--white);border:1px solid var(--rule);border-radius:var(--r);
  padding:22px;text-decoration:none!important;transition:.15s;box-shadow:var(--shadow-1);
}
.seg a:hover{border-color:var(--seal);box-shadow:var(--shadow-2);transform:translateY(-2px)}
.seg h3{font-size:1.02rem;margin-bottom:.4em;color:var(--ink)}
.seg p{font-size:.88rem;color:var(--ink-soft);margin-bottom:12px}
.seg .go{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--seal)}
@media (prefers-reduced-motion:reduce){.seg a:hover{transform:none}}

/* ---------- Cost comparison rows ---------- */
.cost-row{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:baseline;
  padding:16px 0;border-bottom:1px solid var(--rule-soft)}
.cost-row:last-child{border-bottom:0}
.cost-row b{font-weight:600}
.cost-row small{display:block;color:var(--ink-mute);font-size:.85rem;margin-top:3px;font-weight:400}
.cost-fig{font-family:var(--mono);font-size:.95rem;white-space:nowrap;color:var(--ink);
  font-variant-numeric:tabular-nums}

/* ============================================================
   Contrast corrections after the blue/teal palette pass
   ============================================================ */

/* Brand blue on a brand-blue tint, and links on the status tints,
   both landed just under 4.5:1. Step to blue-700 in those contexts. */
.callout--seal .callout-label,
.quiz-tag{color:var(--seal-deep)}
.callout a,
.callout--flag a,
.callout--seal a{color:var(--seal-deep)}
.tick--gap{color:var(--flag)}

/* Cost rows: let the figure wrap under its label on narrow screens */
@media(max-width:560px){
  .cost-row{grid-template-columns:1fr;gap:6px}
  .cost-fig{white-space:normal}
}

/* ============================================================
   Pricing tiers, billing toggle, partner programme, seasonal
   banner and the readiness-check report.
   ============================================================ */

/* ---------- Seasonal banner ---------- */
.seasonal{background:var(--seal-soft);color:var(--ink);
  border-bottom:1px solid #BFDBFE;position:relative}
.seasonal::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad)}
.seasonal-in{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;
  justify-content:center;padding-top:13px;padding-bottom:11px;text-align:center}
.seasonal p{margin:0;font-size:.9rem;font-weight:500;letter-spacing:-.005em;max-width:70ch}
.seasonal .btn--light{background:var(--seal);color:#fff;border-color:var(--seal);flex:none}
.seasonal .btn--light:hover{background:var(--seal-deep);border-color:var(--seal-deep)}

/* ---------- Flat-rate banner ---------- */
.flat-banner{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:22px;
  font-family:var(--mono);font-size:.78rem;letter-spacing:.04em;color:var(--ink)}
.flat-banner b{font-weight:500;display:inline-flex;align-items:center;gap:8px}
.flat-banner b::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ok);flex:none}

/* ---------- Billing toggle ---------- */
.billing-toggle{display:inline-flex;gap:4px;padding:4px;margin:0 auto 28px;
  background:var(--wash);border:1px solid var(--rule);border-radius:100px}
.billing-toggle{display:flex;width:max-content;margin-inline:auto}
.billing-toggle button{
  border:0;background:none;cursor:pointer;font-family:inherit;font-size:.92rem;font-weight:550;
  color:var(--ink-soft);padding:10px 20px;border-radius:100px;transition:.15s;
  display:inline-flex;align-items:baseline;gap:8px;
}
.billing-toggle button:hover{color:var(--ink)}
.billing-toggle button.is-on{background:var(--white);color:var(--ink);box-shadow:var(--shadow-1)}
.toggle-note{font-family:var(--mono);font-size:.66rem;letter-spacing:.05em;color:var(--ok);
  text-transform:uppercase}
.billing-toggle button:not(.is-on) .toggle-note{color:var(--ink-mute)}
@media(max-width:520px){
  .billing-toggle{width:100%}
  .billing-toggle button{flex:1;justify-content:center;padding:10px 12px}
  .toggle-note{display:none}
}

/* ---------- Tier cards ---------- */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
@media(max-width:960px){.tiers{grid-template-columns:1fr;max-width:520px;margin-inline:auto}}
.tier{background:var(--white);border:1px solid var(--rule);border-radius:14px;padding:26px;
  box-shadow:var(--shadow-1);display:flex;flex-direction:column;position:relative}
.tier--featured{border-color:var(--seal);border-width:1.5px;box-shadow:var(--shadow-2)}
.tier h2{font-size:1.22rem;letter-spacing:-.025em;margin-bottom:.2em}
.tier-who{font-size:.87rem;color:var(--ink-mute);margin-bottom:20px;min-height:2.6em}
.tier-price[hidden]{display:none}
.tier-save{display:inline-block;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ok);background:var(--ok-soft);
  border-radius:6px;padding:5px 10px;margin:0 0 12px}
.tier-save--muted{color:var(--ink-mute);background:var(--wash)}
.tier-num{font-size:2.6rem;font-weight:800;letter-spacing:-.045em;line-height:1;margin:0 0 6px;
  display:flex;align-items:baseline;gap:7px;font-variant-numeric:tabular-nums}
.tier-num .unit{font-size:.82rem;font-weight:500;color:var(--ink-mute);letter-spacing:0}
.tier-eff{font-size:.88rem;color:var(--ink-soft);margin:0 0 8px}
.tier-setup{font-family:var(--mono);font-size:.76rem;color:var(--ink-mute);margin:0 0 18px}
.tier-setup--waived{color:var(--ok)}
.tier-setup s{color:var(--ink-mute);margin-left:5px}
.tier-flat{font-family:var(--mono);font-size:.68rem;letter-spacing:.04em;color:var(--ink-soft);
  background:var(--wash);border:1px solid var(--rule-soft);border-radius:7px;
  padding:9px 11px;margin:0 0 18px;text-align:center}
.tier .btn{width:100%;justify-content:center;margin-bottom:20px}
.tier-list{list-style:none;padding:0;margin:0;flex:1}
.tier-list li{padding:8px 0 8px 25px;position:relative;font-size:.89rem;line-height:1.45;
  border-bottom:1px solid var(--rule-soft)}
.tier-list li:last-child{border-bottom:0}
.tier-list li::before{content:"";position:absolute;left:3px;top:15px;width:10px;height:6px;
  border-left:2px solid var(--ok);border-bottom:2px solid var(--ok);transform:rotate(-45deg)}
.tiers-note{max-width:78ch;margin:26px auto 0;font-size:.86rem;color:var(--ink-mute);
  text-align:center}

/* ---------- Partner offer row ---------- */
.offer-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);
  border:1px solid var(--rule);border-radius:12px;overflow:hidden;margin-top:28px}
@media(max-width:700px){.offer-row{grid-template-columns:1fr}}
.offer{background:var(--white);padding:22px 20px}
.offer b{display:block;font-size:2rem;font-weight:800;letter-spacing:-.04em;line-height:1;
  margin-bottom:8px;color:var(--seal-deep)}
.offer span{display:block;font-size:.88rem;color:var(--ink-soft);line-height:1.45}

.ref-math{font-family:var(--mono);font-size:.84rem;color:var(--ink-soft);margin:0 0 8px;
  display:flex;flex-wrap:wrap;gap:6px;align-items:baseline}
.ref-math b{color:var(--ink);font-weight:600}
.ref-math span{color:var(--ink-mute)}
.ref-total{font-size:1.5rem;font-weight:700;letter-spacing:-.035em;margin:0 0 10px;
  color:var(--seal-deep);font-variant-numeric:tabular-nums}
.cmp-note{background:var(--ok-soft);border:1px solid #A7F3D0;border-radius:var(--r);
  padding:14px 18px;font-size:.94rem;margin:0 0 26px}

/* ---------- Readiness report and capture ---------- */
.result-body{padding:clamp(24px,4vw,34px)}
.report-cta{background:var(--wash);border:1px solid var(--rule);border-radius:12px;
  padding:clamp(22px,3vw,30px);margin:30px 0 24px}
.report-cta h3{font-size:1.1rem;margin-bottom:.4em}
.report-cta > p{color:var(--ink-soft);font-size:.94rem;max-width:60ch}
.capture-form{margin-top:22px;box-shadow:none}
.check{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;margin:4px 0 18px;
  color:var(--ink-soft);cursor:pointer}
.check input{width:17px;height:17px;margin-top:2px;flex:none;accent-color:var(--seal)}
.capture-done{background:var(--gold-soft);border:1px solid #FDE68A;border-radius:8px;
  padding:16px 18px;margin:0;font-size:.92rem}

/* ---------- Email capture block ---------- */
.capture-band{background:var(--white);border:1px solid var(--rule);border-radius:14px;
  padding:clamp(26px,4vw,38px);box-shadow:var(--shadow-1);
  display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,44px);align-items:center}
@media(max-width:820px){.capture-band{grid-template-columns:1fr}}
.capture-band h2{font-size:clamp(1.3rem,1.1rem + .9vw,1.7rem);margin-bottom:.4em}
.capture-band p{color:var(--ink-soft);margin-bottom:0}
.capture-inline{display:flex;gap:10px;flex-wrap:wrap}
.capture-inline input{flex:1 1 220px;padding:12px 14px;border:1px solid var(--rule);
  border-radius:8px;font-family:inherit;font-size:.95rem;background:var(--wash);color:var(--ink)}
.capture-inline input:focus{outline:none;border-color:var(--seal);
  box-shadow:0 0 0 3px var(--seal-soft);background:#fff}
.capture-inline .btn{flex:none}

/* ---------- Intake flow ---------- */
.flow{counter-reset:step;display:grid;gap:14px;margin:28px 0}
.flow-step{display:grid;grid-template-columns:44px 1fr;gap:18px;background:var(--white);
  border:1px solid var(--rule);border-radius:var(--r);padding:20px 22px;box-shadow:var(--shadow-1)}
.flow-step::before{counter-increment:step;content:counter(step);
  font-family:var(--mono);font-size:.8rem;color:var(--seal);background:var(--seal-soft);
  border-radius:8px;width:34px;height:34px;display:grid;place-items:center;font-weight:500}
.flow-step h3{font-size:1.02rem;margin-bottom:.3em}
.flow-step p{margin-bottom:0;font-size:.93rem;color:var(--ink-soft)}
@media(max-width:560px){.flow-step{grid-template-columns:1fr}.flow-step::before{display:none}}

@media print{
  .seasonal,.quiz-top,.quiz-nav,.report-cta,.btn-row{display:none!important}
  .result-body{padding:0}
  .grade-wrap{border:0;padding:0 0 18px}
}

/* ============================================================
   Intake questionnaire, referral prominence, partner code box
   ============================================================ */

/* Honeypot: present for bots, invisible and unreachable for people */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;
  pointer-events:none}

/* ---------- Intake form ---------- */
.intake{background:var(--white);border:1px solid var(--rule);border-radius:14px;
  box-shadow:var(--shadow-2);overflow:hidden;margin:28px 0}
.intake .quiz-top{padding:16px 24px}
.i-saved{color:var(--ok);font-family:var(--mono);font-size:.7rem;letter-spacing:.05em}
.intake-body{padding:clamp(24px,4vw,36px)}
.istep{border:0;padding:0;margin:0;min-width:0}
.istep legend{padding:0;margin-bottom:6px;font-size:clamp(1.15rem,1rem + .7vw,1.45rem);
  font-weight:650;letter-spacing:-.025em;display:flex;flex-wrap:wrap;align-items:baseline;gap:12px}
.istep-n{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--seal-deep);background:var(--seal-soft);border-radius:5px;padding:4px 9px;font-weight:500}
.istep-blurb{color:var(--ink-soft);font-size:.94rem;margin:0 0 22px;max-width:62ch}
.istep .field{margin-bottom:18px}
.istep label{font-size:.84rem;font-weight:600;color:var(--ink);margin-bottom:4px}
.istep label abbr{color:var(--flag);text-decoration:none;border:0}
.fhint{display:block;font-size:.8rem;color:var(--ink-mute);line-height:1.45;margin-bottom:7px;
  font-weight:400}
.istep input.is-bad,.istep select.is-bad,.istep textarea.is-bad{border-color:var(--flag);
  box-shadow:0 0 0 3px var(--flag-soft)}
.intake-nav{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;
  padding:18px 24px;background:var(--wash);border-top:1px solid var(--rule)}
.intake-right{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-left:auto}
@media(max-width:560px){
  .intake-nav{flex-direction:column;align-items:stretch}
  .intake-right{margin-left:0;flex-direction:column-reverse}
  .intake-nav .btn{width:100%;justify-content:center}
}

/* ---------- Referral band, used across the site ---------- */
.refband{background:var(--white);border:1px solid var(--rule);border-radius:14px;
  box-shadow:var(--shadow-1);overflow:hidden;display:grid;
  grid-template-columns:1.15fr .85fr;align-items:stretch}
@media(max-width:820px){.refband{grid-template-columns:1fr}}
.refband-in{padding:clamp(24px,4vw,34px)}
.refband h2,.refband h3{font-size:clamp(1.2rem,1.05rem + .8vw,1.6rem);margin-bottom:.4em}
.refband p{color:var(--ink-soft);margin-bottom:0}
.refband-fig{background:var(--tint);border-left:1px solid var(--rule);
  padding:clamp(24px,4vw,34px);display:flex;flex-direction:column;justify-content:center;gap:16px}
@media(max-width:820px){.refband-fig{border-left:0;border-top:1px solid var(--rule)}}
.refnum{display:flex;align-items:baseline;gap:10px}
.refnum b{font-size:2.1rem;font-weight:800;letter-spacing:-.04em;line-height:1;
  color:var(--seal-deep);font-variant-numeric:tabular-nums}
.refnum span{font-size:.88rem;color:var(--ink-soft);line-height:1.35}
.refband .btn{margin-top:6px}

/* Compact strip for narrower spots */
.refstrip{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;
  background:var(--seal-soft);border:1px solid #BFDBFE;border-radius:10px;
  padding:14px 18px;margin:26px 0}
.refstrip p{margin:0;font-size:.94rem;color:var(--ink)}
.refstrip b{color:var(--seal-deep)}
.refstrip a{font-weight:600;white-space:nowrap;color:var(--seal-deep)}

/* Footer referral line */
.foot-ref{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;
  padding:14px 0;margin-top:6px;border-top:1px solid var(--rule);
  font-size:.86rem;color:var(--ink-soft)}
.foot-ref b{color:var(--seal-deep)}

/* Attribution notice when a referral cookie is present */
.refnotice{background:var(--ok-soft);border:1px solid #A7F3D0;border-radius:8px;
  padding:10px 14px;margin:0 0 18px;font-size:.86rem;color:var(--ok);
  font-family:var(--mono);letter-spacing:.02em}

/* ---------- Partner code box ---------- */
.code-box{background:var(--white);border:1px solid var(--rule);border-radius:12px;
  box-shadow:var(--shadow-1);padding:26px;max-width:520px;margin:26px auto;text-align:center}
.code-label{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-mute);margin:0 0 10px}
.code-value{font-family:var(--mono);font-size:2rem;font-weight:500;letter-spacing:.14em;
  color:var(--seal-deep);margin:0 0 10px}
.code-link{font-family:var(--mono);font-size:.8rem;color:var(--ink-soft);word-break:break-all;
  background:var(--wash);border-radius:7px;padding:10px 12px;margin:0 0 14px}

/* ---------- Partner signup form ---------- */
.partner-form{max-width:640px}

/* ============================================================
   Client portal
   ============================================================ */

.portal-who{font-family:var(--mono);font-size:.76rem;color:var(--ink-soft);
  padding:8px 11px;letter-spacing:.02em}
.portal-error{background:var(--flag-soft);border:1px solid #FECACA;color:var(--flag);
  border-radius:8px;padding:13px 16px;margin:0 0 20px;font-size:.93rem}
.portal-ok{background:var(--ok-soft);border:1px solid #A7F3D0;color:var(--ok);
  border-radius:8px;padding:13px 16px;margin:0 0 20px;font-size:.93rem}

.pstats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);
  border:1px solid var(--rule);border-radius:12px;overflow:hidden;margin-top:26px}
@media(max-width:820px){.pstats{grid-template-columns:repeat(2,1fr)}}
.pstat{background:var(--white);padding:20px}
.pstat b{display:block;font-size:1.6rem;font-weight:700;letter-spacing:-.035em;line-height:1.1;
  margin-bottom:5px;font-variant-numeric:tabular-nums}
.pstat span{display:block;font-size:.84rem;color:var(--ink-soft);line-height:1.4}
.pstat--warn b{color:var(--gold)}

.pgrid{display:grid;grid-template-columns:1.6fr .9fr;gap:34px;align-items:start}
@media(max-width:960px){.pgrid{grid-template-columns:1fr}}

.scroll-card{border:1px solid var(--rule);border-radius:var(--r);background:var(--white);
  overflow-x:auto;box-shadow:var(--shadow-1)}
.ptable{width:100%;min-width:520px;border-collapse:collapse;font-size:.9rem}
.ptable th,.ptable td{text-align:left;padding:12px 15px;border-bottom:1px solid var(--rule-soft);
  vertical-align:top}
.ptable thead th{background:var(--wash);font-family:var(--mono);font-size:.68rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;
  border-bottom:1px solid var(--rule)}
.ptable tbody tr:last-child td{border-bottom:0}
.ptag{display:inline-block;font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;
  text-transform:uppercase;background:var(--seal-soft);color:var(--seal-deep);
  border-radius:5px;padding:3px 8px}

.pdl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0 0 14px;font-size:.88rem}
.pdl dt{color:var(--ink-mute);font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;
  padding-top:2px}
.pdl dd{margin:0;color:var(--ink)}

.pdetails{border-top:1px solid var(--rule-soft);padding-top:14px;margin-top:4px}
.pdetails summary{cursor:pointer;font-size:.9rem;font-weight:600;color:var(--seal-deep);
  list-style:none}
.pdetails summary::-webkit-details-marker{display:none}
.pdetails summary::before{content:"+ ";font-family:var(--mono)}
.pdetails[open] summary::before{content:"− "}
.nav-signin{color:var(--ink-soft);font-size:.88rem;font-weight:500;padding:8px 11px;
  border-radius:7px;text-decoration:none!important;white-space:nowrap}
.nav-signin:hover{background:var(--tint);color:var(--ink)}
@media(max-width:1360px){.hdr .nav-signin{display:none}}
.pstat--good b{color:var(--ok)}
.refcard .code-value{font-family:var(--mono);letter-spacing:.14em;color:var(--seal-deep)}
.refcard .code-link{font-family:var(--mono);font-size:.76rem;color:var(--ink-soft);
  background:var(--wash);border-radius:7px;padding:9px 10px;margin:0 0 12px;word-break:break-all}
.refcard s{margin-right:6px}
