/* ==========================================================================
   ReversePath design system
   Implements the visual system and UX specification of 1 October 2026.
   Light theme only (MVP). Tokens first; components after; print last.
   ========================================================================== */

/* ---------- Fonts: self-hosted, SIL Open Font License (see fonts/OFL-LICENSE.txt)
   Headings, figures and the wordmark: Anek Latin by Ek Type, an Indian foundry,
   whose Latin shares its structure with the family's Indian scripts. Set slightly
   condensed, it reads as firm and official without borrowing an editorial serif.
   Body and interface: Source Sans 3. Codes and references only: Source Code Pro. */
@font-face{font-family:"Anek Latin";font-weight:100 800;font-stretch:75% 125%;font-style:normal;font-display:swap;src:url(../fonts/anek-latin-latin-variable.woff2) format("woff2-variations"),url(../fonts/anek-latin-latin-variable.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Anek Latin";font-weight:100 800;font-stretch:75% 125%;font-style:normal;font-display:swap;src:url(../fonts/anek-latin-latin-ext-variable.woff2) format("woff2-variations"),url(../fonts/anek-latin-latin-ext-variable.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,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:"Source Sans 3";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,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:"Source Sans 3";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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:"Source Sans 3";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,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:"Source Sans 3";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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:"Source Code Pro";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/source-code-pro-latin-400-normal.woff2) format("woff2")}

/* ---------- Tokens
   One brand colour: aubergine, a deep ink the colour of a wax seal. It marks
   actions, the current step and the brand, nothing decorative. The page is a
   warm paper; status colours carry meaning only, and none of them is green. */
:root{
  /* neutrals */
  --paper:#F7F4EE; --surface:#FFFDFA; --sunk:#EEE9E1; --ground:#F0EBE3;
  --rule:#D9D3CB; --rule-strong:#8E877F;
  --ink:#202024; --ink-2:#4A474C; --ink-3:#625F63;
  /* brand (variables keep their earlier names, which the code relies on) */
  --ledger:#5A3452; --ledger-deep:#43263D; --ledger-tint:#EAE0E6;
  --ochre:#5A3452;
  /* severity */
  --sev-critical:#A43D3D; --sev-critical-tint:#F6E3E1;
  --sev-high:#93451F;     --sev-high-tint:#F5E6DB;
  --sev-medium:#A56A24;   --sev-medium-tint:#F5EBDB; --sev-medium-ink:#7A4C14;
  --sev-low:#42617D;      --sev-low-tint:#E5ECF2;
  /* status: information and verified are slate blues, never green */
  --info:#42617D; --info-tint:#E5ECF2;
  --done:#3E5870; --done-tint:#E3E9EF;

  --serif:"Anek Latin","Arial Narrow",system-ui,sans-serif; /* the heading face; the name is historical */
  --head:"Anek Latin","Arial Narrow",system-ui,sans-serif;
  --sans:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Source Code Pro",Consolas,Menlo,monospace;

  /* spacing scale, 4 px base */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px; --s9:96px;

  --radius:3px; --radius-panel:4px;
  --shadow-pop:0 2px 6px rgba(32,32,36,.12);
  --shadow-modal:0 12px 32px rgba(32,32,36,.18);
  --measure:68ch;
  --max:1200px;
}

/* ---------- Base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;font-variant-numeric:lining-nums}
h1,h2,h3{font-family:var(--head);font-weight:600;font-stretch:88%;margin:0;color:var(--ink);text-wrap:balance}
h1{font-size:42px;line-height:1.08;letter-spacing:-.01em}
h2{font-size:31px;line-height:1.14;letter-spacing:-.005em}
h3{font-size:21px;line-height:1.25;font-weight:600}
h4{font-family:var(--sans);font-size:17px;line-height:1.4;font-weight:600;margin:0}
p{margin:0}
p+p{margin-top:var(--s4)}
a{color:var(--ledger);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--ledger-deep);text-decoration-thickness:2px}
strong,b{font-weight:600}
em{font-style:italic}
code,.ref{font-family:var(--mono);font-size:13px;letter-spacing:0}
.ref{color:var(--ink-2)}
table .ref,.qref{white-space:nowrap}
img,svg{max-width:100%}
hr{border:0;border-top:1px solid var(--rule);margin:var(--s7) 0}
:focus-visible{outline:3px solid var(--ledger);outline-offset:2px;border-radius:2px}
.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-link{position:absolute;left:-9999px;top:0;z-index:300;background:var(--ink);color:#fff;padding:var(--s3) var(--s4)}
.skip-link:focus{left:0;color:#fff}
.num{font-variant-numeric:tabular-nums lining-nums}
[hidden]{display:none!important}

@media (max-width:599px){
  body{font-size:17px}
  h1{font-size:32px;line-height:1.1}
  h2{font-size:25px;line-height:1.18}
  h3{font-size:19px}
}

/* ---------- Type roles */
.display{font-family:var(--head);font-size:58px;line-height:1;font-weight:600;font-stretch:85%;letter-spacing:-.015em}
@media (max-width:599px){.display{font-size:40px;line-height:1.02}}
.lede{font-family:var(--sans);font-size:20px;line-height:1.55;color:var(--ink-2);max-width:56ch}
@media (max-width:599px){.lede{font-size:18px}}
.meta{font-size:13px;line-height:1.45;color:var(--ink-3)}
.eyebrow{display:block;font-family:var(--head);font-size:16px;line-height:1.3;font-weight:600;font-stretch:92%;color:var(--ledger)}
.prose{max-width:var(--measure)}
.prose p+p,.prose p+ul,.prose ul+p,.prose p+ol,.prose ol+p{margin-top:var(--s4)}
.prose ul,.prose ol{padding-left:1.25em;margin:0}
.prose li+li{margin-top:var(--s2)}
.prose h2{margin-top:var(--s7);margin-bottom:var(--s4)}
.prose h3{margin-top:var(--s6);margin-bottom:var(--s3)}
.muted{color:var(--ink-2)}

/* ---------- Layout */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--s5)}
@media (max-width:599px){.wrap{padding:0 var(--s4)}}
.section{padding:var(--s8) 0 var(--s8)}
.section:first-of-type{border-top:0}
@media (max-width:599px){.section{padding:var(--s8) 0}}
.section.tight{padding:var(--s8) 0}

/* Section layout: a margin column holding the section's name, like the head of
   account written in the margin of a register, and the body beside it. The old
   section numbers stay in the markup but are not shown: the sections are not a
   sequence, so numbering them would claim an order that is not there. */
.editorial{display:grid;grid-template-columns:180px minmax(0,1fr);column-gap:var(--s7)}
.editorial .rail{padding-top:9px}
.editorial .rail .no,.editorial .rail .rule{display:none}
.editorial .rail .eyebrow{font-size:16px;color:var(--ink-3);font-weight:500;line-height:1.35;max-width:14ch}
.editorial .body > h2{max-width:24ch}
.editorial .body p{max-width:72ch}
.editorial .body > .lead-p{margin-top:var(--s4);color:var(--ink-2);max-width:var(--measure);font-size:18px;line-height:1.55}
@media (max-width:1023px){
  .editorial{grid-template-columns:minmax(0,1fr);row-gap:var(--s2)}
  .editorial .rail{padding-top:0}
  .editorial .rail .eyebrow{max-width:none;font-size:15px}
}

.stack > * + *{margin-top:var(--s4)}
.stack-lg > * + *{margin-top:var(--s6)}
.cluster{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s7)}
@media (max-width:1023px){.split{grid-template-columns:minmax(0,1fr);gap:var(--s6)}}

/* ---------- Site header */
.site-header{background:var(--surface);border-top:3px solid var(--ledger);border-bottom:1px solid var(--rule);position:relative;z-index:40}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);min-height:76px}
.wordmark{text-decoration:none;color:var(--ink);display:block;line-height:1}
.wordmark .name{font-family:var(--head);font-weight:700;font-stretch:86%;font-size:25px;letter-spacing:-.01em}
.wordmark .desc{display:block;font-size:13px;color:var(--ink-3);margin-top:3px}
.wordmark:hover{color:var(--ink)}
.primary-nav{display:flex;align-items:center;gap:var(--s6)}
.primary-nav a.nav-link{display:inline-block;line-height:1.3}
.primary-nav ul{display:flex;gap:var(--s5);list-style:none;margin:0;padding:0}
.primary-nav a.nav-link{color:var(--ink-2);text-decoration:none;font-size:15.5px;padding:24px 0 22px;border-bottom:3px solid transparent;transition:color .15s ease,border-color .15s ease}
.primary-nav a.nav-link:hover{color:var(--ink);border-bottom-color:var(--rule-strong)}
.primary-nav a.nav-link[aria-current="page"]{color:var(--ink);font-weight:600;border-bottom-color:var(--ledger)}
.site-header .menu-button{display:none}
@media (max-width:1023px){
  .wordmark .desc{display:none}
  .primary-nav{display:none}
  .site-header .menu-button{display:inline-flex}
}

/* Mobile drawer: a native dialog, full height from the right */
.drawer{margin:0 0 0 auto;height:100%;max-height:100%;width:min(420px,100%);border:0;padding:0;background:var(--paper);box-shadow:var(--shadow-modal)}
.drawer::backdrop{background:rgba(27,35,48,.45)}
.drawer .drawer-head{display:flex;justify-content:space-between;align-items:center;padding:var(--s4) var(--s5);border-bottom:1px solid var(--rule)}
.drawer nav ul{list-style:none;margin:0;padding:0}
.drawer nav a{display:flex;align-items:center;min-height:56px;padding:0 var(--s5);border-bottom:1px solid var(--rule);color:var(--ink);text-decoration:none;font-size:17px}
.drawer nav a[aria-current="page"]{box-shadow:inset 3px 0 0 var(--ledger);background:var(--ledger-tint)}
.drawer .drawer-foot{padding:var(--s5)}
.drawer .drawer-foot .btn{width:100%}

/* ---------- Footer */
.site-footer{background:var(--ground);color:var(--ink-2);margin-top:var(--s9);padding:var(--s8) 0 var(--s6);border-top:3px solid var(--ink)}
.site-footer a{color:var(--ink);text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.site-footer a:hover{color:var(--ledger);text-decoration-color:currentColor}
.site-footer .cols{display:grid;grid-template-columns:1.2fr repeat(5,1fr);gap:var(--s6)}
.site-footer h2{font-family:var(--head);font-size:16px;font-weight:600;font-stretch:90%;color:var(--ink);margin-bottom:var(--s3)}
.site-footer ul{list-style:none;margin:0;padding:0;font-size:15px}
.site-footer li+li{margin-top:var(--s2)}
.site-footer .wordmark .name{color:var(--ink)}
.site-footer .wordmark .desc{color:var(--ink-3);display:block}
.site-footer .base{margin-top:var(--s7);padding-top:var(--s4);border-top:1px solid var(--rule-strong);font-size:13px;color:var(--ink-3);display:flex;justify-content:space-between;gap:var(--s4);flex-wrap:wrap}
@media (max-width:1023px){.site-footer .cols{grid-template-columns:1fr 1fr}}
@media (max-width:599px){.site-footer .cols{grid-template-columns:1fr}}

/* ---------- Breadcrumbs */
.crumbs{font-size:14px;color:var(--ink-3);margin:var(--s5) 0 0}
.crumbs ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:var(--s2)}
.crumbs li+li::before{content:"/";margin-right:var(--s2);color:var(--rule-strong)}
.crumbs a{color:var(--ink-2)}

/* ---------- Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:44px;padding:0 20px;border-radius:var(--radius);border:1px solid transparent;font-family:var(--sans);font-size:15px;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,color .15s ease;white-space:nowrap}
.btn-lg{min-height:48px;padding:0 24px;font-size:16px}
.btn-primary{background:var(--ledger);color:#fff}
.btn-primary:hover{background:var(--ledger-deep);color:#fff}
.btn-secondary{background:var(--surface);color:var(--ink);border-color:var(--rule-strong)}
.btn-secondary:hover{border-color:var(--ink);color:var(--ink)}
.btn-text{background:none;border:0;min-height:auto;padding:0;color:var(--ledger);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.btn-text:hover{text-decoration-thickness:2px;color:var(--ledger-deep)}
.btn-text.danger{color:var(--sev-critical)}
.btn-danger{background:var(--sev-critical);color:#fff}
.btn-danger:hover{background:#6E1515;color:#fff}
.btn[disabled],.btn[aria-disabled="true"]{background:var(--sunk);color:var(--ink-3);border-color:var(--sunk);cursor:not-allowed}
.btn-plain{background:none;border:1px solid var(--rule-strong);color:var(--ink);font-weight:600}
@media (max-width:599px){.btn{min-height:48px}}
.actions{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center}
.actions.end{justify-content:flex-end}

/* ---------- Forms */
.form{max-width:640px}
.field{margin-top:var(--s5)}
.field:first-child{margin-top:0}
.field > label,.field > .label,fieldset > legend{display:block;font-size:15px;font-weight:600;line-height:1.4;color:var(--ink);margin-bottom:var(--s1)}
.field .opt{font-weight:400;color:var(--ink-3)}
.hint{display:block;font-size:14px;color:var(--ink-3);margin-bottom:var(--s2);line-height:1.45}
.input,.select,.textarea{display:block;width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--rule-strong);border-radius:var(--radius);background:var(--surface);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.4}
.textarea{min-height:120px;resize:vertical}
.select{appearance:none;-webkit-appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231B2330' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.input:focus,.select:focus,.textarea:focus{outline:3px solid var(--ledger);outline-offset:0;border-color:var(--ledger)}
.w-6{max-width:12ch}.w-14{max-width:22ch}.w-20{max-width:28ch}.w-30{max-width:38ch}.w-36{max-width:44ch}
.field.has-error .input,.field.has-error .select,.field.has-error .textarea{border:2px solid var(--sev-critical)}
.field-error{display:block;color:var(--sev-critical);font-size:14px;font-weight:600;margin-top:var(--s1)}
fieldset{border:0;margin:0;padding:0}
.choice{display:flex;gap:var(--s3);align-items:flex-start;min-height:44px;padding:10px 0;cursor:pointer;font-size:16px;line-height:1.45}
.choice input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--ledger)}
.consent{margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid var(--rule)}
.consent .choice{font-size:15px}
.consent .version{display:block;margin-top:var(--s1);font-size:12.5px;color:var(--ink-3)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- Status and severity chips */
.chip{display:inline-flex;align-items:center;gap:7px;font-family:var(--sans);font-size:12.5px;font-weight:600;line-height:1.3;padding:3px 8px;border-radius:3px;white-space:nowrap;background:var(--sunk);color:var(--ink-2)}
.chip .bars{display:inline-flex;gap:2px}
.chip .bars i{display:block;width:3px;height:10px;border:1px solid currentColor}
.chip .bars i.on{background:currentColor}
.sev-critical{background:var(--sev-critical-tint);color:var(--sev-critical)}
.sev-high{background:var(--sev-high-tint);color:var(--sev-high)}
.sev-medium{background:var(--sev-medium-tint);color:var(--sev-medium-ink)}
.sev-low{background:var(--sev-low-tint);color:var(--sev-low)}
.chip.st-ledger{background:var(--ledger-tint);color:var(--ledger)}
.chip.st-done{background:var(--done-tint);color:var(--done)}
.chip.st-plain{background:transparent;border:1px solid var(--rule);color:var(--ink-3)}
.chip.st-self{background:var(--sunk);color:var(--ink)}
.chip svg{flex:none}

/* ---------- Alerts */
.alert{padding:var(--s4) var(--s5);border-radius:var(--radius);border-left:4px solid var(--ledger);background:var(--ledger-tint);color:var(--ink);max-width:var(--measure)}
.alert h2,.alert h3,.alert .alert-title{font-family:var(--sans);font-size:16px;font-weight:600;line-height:1.4;margin:0 0 var(--s1)}
.alert.error{border-left-color:var(--sev-critical);background:var(--sev-critical-tint)}
.alert.warning{border-left-color:var(--sev-medium);background:var(--sev-medium-tint)}
.alert.success{border-left-color:var(--done);background:var(--done-tint)}
.alert ul{margin:var(--s2) 0 0;padding-left:1.2em}
.alert a{color:var(--ink)}
.toast{position:fixed;left:50%;bottom:var(--s5);transform:translateX(-50%);background:var(--ink);color:#fff;padding:var(--s3) var(--s5);border-radius:var(--radius);font-size:15px;box-shadow:var(--shadow-pop);z-index:500}

/* ---------- Tables and registers */
.table-wrap{background:var(--surface);border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong)}
.table-scroll{overflow-x:auto;position:relative}
table.register{width:100%;border-collapse:collapse;font-size:14px;line-height:1.45;font-variant-numeric:tabular-nums lining-nums}
table.register caption{text-align:left;padding:var(--s3) 0;font-size:14px;color:var(--ink-2)}
table.register th{background:var(--sunk);text-align:left;font-weight:600;color:var(--ink-2);padding:var(--s3) var(--s4);vertical-align:bottom;white-space:nowrap}
table.register td{padding:var(--s3) var(--s4);border-top:1px solid var(--rule);vertical-align:top;color:var(--ink)}
table.register td.r,table.register th.r{text-align:right}
table.register tbody tr{transition:background-color .12s ease}
table.register tbody tr.selectable{cursor:pointer}
table.register tbody tr.selectable:hover{background:var(--paper)}
table.register tbody tr[aria-selected="true"]{background:var(--ledger-tint);box-shadow:inset 3px 0 0 var(--ledger)}
table.register tr.sev-row-critical td:first-child{box-shadow:inset 3px 0 0 var(--sev-critical)}
table.register tr.sev-row-high td:first-child{box-shadow:inset 3px 0 0 var(--sev-high)}
table.register tr.sev-row-medium td:first-child{box-shadow:inset 3px 0 0 var(--sev-medium)}
table.register tr.sev-row-low td:first-child{box-shadow:inset 3px 0 0 var(--sev-low)}
table.register .title{font-weight:600}
table.register a.row-link{color:var(--ink);text-decoration:none}
table.register a.row-link:hover{text-decoration:underline}
.toolbar{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5);align-items:center;justify-content:space-between;margin-bottom:var(--s3)}
.toolbar .count{font-size:14px;color:var(--ink-2)}
.seg{display:inline-flex;border:1px solid var(--rule-strong);border-radius:var(--radius);overflow:hidden}
.seg button{background:var(--surface);border:0;border-left:1px solid var(--rule);padding:6px 12px;font:600 13.5px/1.3 var(--sans);color:var(--ink-2);cursor:pointer;min-height:36px}
.seg button:first-child{border-left:0}
.seg button[aria-pressed="true"]{background:var(--ledger);color:#fff}
@media (max-width:599px){
  /* Registers become stacked records; never scroll sideways */
  table.register.stackable thead{position:absolute;left:-9999px}
  table.register.stackable,table.register.stackable tbody,table.register.stackable tr,table.register.stackable td{display:block;width:100%}
  table.register.stackable tr{border-top:1px solid var(--rule);padding:var(--s3) var(--s4)}
  table.register.stackable td{border:0;padding:2px 0}
  table.register.stackable td[data-label]::before{content:attr(data-label) ": ";color:var(--ink-3);font-weight:400}
  table.register.stackable td.no-label::before{content:none}
  table.register.stackable tr[class*="sev-row-"] td:first-child{box-shadow:none}
  table.register.stackable tr.sev-row-critical{box-shadow:inset 3px 0 0 var(--sev-critical)}
  table.register.stackable tr.sev-row-high{box-shadow:inset 3px 0 0 var(--sev-high)}
  table.register.stackable tr.sev-row-medium{box-shadow:inset 3px 0 0 var(--sev-medium)}
  table.register.stackable tr.sev-row-low{box-shadow:inset 3px 0 0 var(--sev-low)}
}

/* Simple ruled lists */
.ruled{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.ruled > li{padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.ruled.two{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--s7)}
@media (max-width:1023px){.ruled.two{grid-template-columns:1fr}}
.ruled .item-title{font-family:var(--head);font-weight:600;font-stretch:90%;font-size:21px;line-height:1.25;color:var(--ink);text-decoration:none}
a.item-title:hover{text-decoration:underline}
.ruled .item-desc{margin-top:var(--s1);font-size:15px;color:var(--ink-2)}

/* Definition rows */
.defs{display:grid;grid-template-columns:max-content 1fr;gap:var(--s2) var(--s5);font-size:15px;margin:0}
.defs dt{color:var(--ink-3)}
.defs dd{margin:0}
@media (max-width:640px){.defs{grid-template-columns:minmax(0,1fr);gap:var(--s1)}.defs dd{margin-bottom:var(--s3)}}
.ref.hash{overflow-wrap:anywhere;word-break:break-all;white-space:normal}

/* "What this does not claim" */
/* The limitations are framed like an official note: one of the few boxed elements, because it must be read as a whole. */
.claims{list-style:none;margin:0;padding:var(--s2) var(--s6);border:1px solid var(--ink);border-left:6px solid var(--ink);background:var(--surface);max-width:820px}
.claims li{display:block;padding:var(--s4) 0;border-bottom:1px solid var(--rule);font-size:16px;color:var(--ink-2)}
.claims li:last-child{border-bottom:0}
@media (max-width:599px){.claims{padding:var(--s1) var(--s4)}}
.claims li .n{display:none}
.claims strong{color:var(--ink)}

/* Card: reserved for self-contained objects (documents, partners) */
.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-panel);padding:var(--s5)}

/* ---------- Hero */
.hero{padding:var(--s8) 0 var(--s8);background:var(--surface)}
.hero .grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--s8);align-items:start}
.hero .display span{display:block}
/* The register excerpt is the product itself: set as a sheet, not a decoration. */
.hero figure .table-wrap{border:1px solid var(--rule-strong);border-top:4px solid var(--ink);}
.hero figure table.register th{background:var(--ground)}
.hero .lede{margin-top:var(--s5)}
.hero .actions{margin-top:var(--s6)}
.hero .qualifier{margin-top:var(--s4)}
.hero figure{margin:0}
.hero figcaption{margin-top:var(--s2)}
@media (max-width:1023px){.hero .grid{grid-template-columns:1fr}.hero{padding:var(--s7) 0}}

/* Dark editorial pause (one per page at most) */

/* ---------- Modals (native dialog) */
dialog.modal{border:0;border-radius:var(--radius-panel);padding:0;width:min(560px,calc(100% - 32px));box-shadow:var(--shadow-modal);background:var(--surface);color:var(--ink)}
dialog.modal::backdrop{background:rgba(27,35,48,.45)}
dialog.modal .m-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s4);padding:var(--s5) var(--s5) 0}
dialog.modal .m-body{padding:var(--s3) var(--s5) 0}
dialog.modal .m-foot{display:flex;justify-content:flex-end;gap:var(--s4);align-items:center;padding:var(--s5)}
.close-x{background:none;border:0;cursor:pointer;width:44px;height:44px;margin:-10px -10px 0 0;border-radius:var(--radius);color:var(--ink-2);display:inline-flex;align-items:center;justify-content:center}
.close-x:hover{background:var(--sunk);color:var(--ink)}
@media (max-width:599px){dialog.modal{width:100%;max-width:100%;height:100%;max-height:100%;margin:0;border-radius:0}}

/* ---------- Side panel */
.side-panel{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--surface);border-left:1px solid var(--rule);box-shadow:var(--shadow-modal);z-index:200;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .2s ease;visibility:hidden}
.side-panel.open{transform:none;visibility:visible}
.side-panel .p-head{padding:var(--s5);border-bottom:1px solid var(--rule);display:flex;gap:var(--s4);justify-content:space-between;align-items:flex-start}
.side-panel .p-head h2{font-size:22px;font-weight:600;line-height:1.3;margin-top:var(--s1)}
.side-panel .p-body{padding:var(--s5);overflow-y:auto;flex:1}
.side-panel .p-foot{padding:var(--s4) var(--s5);border-top:1px solid var(--rule)}
.side-panel h3{font-family:var(--sans);font-size:15px;font-weight:600;margin:var(--s5) 0 var(--s2)}
.side-panel ol,.side-panel ul{padding-left:1.2em;margin:0;font-size:15px}
.side-panel li+li{margin-top:var(--s2)}
@media (max-width:599px){.side-panel{width:100%;border-left:0}}

/* ---------- Disclosure */
details.disclose{border-top:1px solid var(--rule)}
details.disclose > summary{list-style:none;cursor:pointer;display:flex;gap:var(--s2);align-items:center;padding:var(--s3) 0;font-weight:600;font-size:15px;color:var(--ink)}
details.disclose > summary::-webkit-details-marker{display:none}
details.disclose > summary::before{content:"";width:8px;height:8px;border-right:1.6px solid var(--ink-2);border-bottom:1.6px solid var(--ink-2);transform:rotate(-45deg);transition:transform .15s ease;margin:0 4px}
details.disclose[open] > summary::before{transform:rotate(45deg)}
details.disclose .d-body{padding:0 0 var(--s4) 22px;font-size:15px;color:var(--ink-2);max-width:var(--measure)}
details.disclose .d-body p+p{margin-top:var(--s2)}

/* ---------- Assessment shell */
.a-header{border-top:3px solid var(--ledger);border-bottom:1px solid var(--rule);background:var(--surface)}
.a-header .bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--s2) var(--s5);min-height:64px}
.a-header .context{font-family:var(--sans);font-size:16px;font-weight:600;line-height:1.3;color:var(--ledger-deep);background:var(--ledger-tint);border:1px solid var(--ledger);border-radius:2px;padding:6px 14px;margin:0}
.progress{height:4px;background:var(--rule);display:flex;gap:2px}
.progress span{display:block;height:100%;background:var(--rule);position:relative;overflow:hidden}
.progress span i{position:absolute;inset:0 auto 0 0;background:var(--ledger)}
.a-layout{display:grid;grid-template-columns:260px minmax(0,680px);gap:var(--s7);padding-top:var(--s6);padding-bottom:var(--s8)}
.a-layout.single{grid-template-columns:minmax(0,760px)}
.a-rail{position:sticky;top:var(--s4);align-self:start}
.a-rail h2{font-family:var(--head);font-size:16px;font-weight:600;font-stretch:90%;color:var(--ink-3);margin-bottom:var(--s3)}
.modlist{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.modlist li{border-bottom:1px solid var(--rule)}
.modlist button{display:grid;grid-template-columns:28px 1fr;gap:var(--s2);width:100%;text-align:left;background:none;border:0;padding:var(--s3) var(--s2);font-family:var(--sans);font-size:14.5px;color:var(--ink);cursor:pointer;line-height:1.35}
.modlist button:disabled{cursor:default;color:var(--ink-3)}
.modlist button:not(:disabled):hover{background:var(--surface)}
.modlist .letter{font-family:var(--mono);font-size:13px;color:var(--ink-3);padding-top:1px}
.modlist .state{display:block;font-size:12.5px;color:var(--ink-3);margin-top:2px}
.modlist li[aria-current="step"] button{box-shadow:inset 3px 0 0 var(--ledger);background:var(--ledger-tint)}
.modlist li.na .state{font-style:italic}
.rail-note{margin-top:var(--s5);font-size:13px;color:var(--ink-3);line-height:1.5}
.rail-toggle{display:none}
@media (max-width:1023px){
  .a-layout{grid-template-columns:minmax(0,1fr);gap:var(--s4)}
  .a-rail{position:static}
  .a-rail .modlist,.a-rail h2,.a-rail .rail-note{display:none}
  .a-rail.open .modlist,.a-rail.open h2,.a-rail.open .rail-note{display:block}
  .rail-toggle{display:inline-flex}
}

/* Question blocks: not cards */
.q-intro{padding-bottom:var(--s5);border-bottom:1px solid var(--rule)}
.q-intro .meta{margin-top:var(--s2)}
.q-block{padding:var(--s6) 0 var(--s6);border-bottom:1px solid var(--rule)}
.q-block .qref{font-family:var(--mono);font-size:13px;color:var(--ink-3);white-space:normal;overflow-wrap:anywhere}
.q-block .qtext{font-family:var(--head);font-size:23px;line-height:1.3;margin-top:var(--s2);font-weight:500;font-stretch:96%}
.q-block .qctx{margin-top:var(--s2);font-size:14.5px;color:var(--ink-2)}
.q-block.unanswered{box-shadow:inset 3px 0 0 var(--sev-critical);padding-left:var(--s4)}
.q-block.unanswered .qref{color:var(--sev-critical);font-weight:600}
.options{display:grid;gap:var(--s2);margin-top:var(--s4)}
.option{display:flex;gap:var(--s3);align-items:center;min-height:52px;padding:10px 14px;background:var(--surface);border:1px solid var(--rule-strong);border-radius:var(--radius);cursor:pointer}
.option:hover{border-color:var(--ink)}
.option input{width:20px;height:20px;margin:0;accent-color:var(--ledger);flex:none}
.option .ol{font-weight:600;font-size:16px}
.option .od{display:block;font-size:13.5px;color:var(--ink-3);font-weight:400}
.option:has(input:checked){border-color:var(--ledger);background:var(--ledger-tint);box-shadow:inset 0 0 0 1px var(--ledger)}
.option:has(input:focus-visible){outline:3px solid var(--ledger);outline-offset:2px}
.q-block details.disclose{margin-top:var(--s4)}
.a-nav{display:flex;justify-content:space-between;gap:var(--s4);align-items:center;margin-top:var(--s6)}
@media (max-width:599px){
  .q-block .qtext{font-size:20px}
  .a-nav{position:sticky;bottom:0;background:var(--paper);padding:var(--s3) 0;border-top:1px solid var(--rule);margin-top:0;z-index:20}
}

/* Sector picker */
.sector-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.sector-list li{border-bottom:1px solid var(--rule)}
.sector-list label{display:grid;grid-template-columns:24px 1fr;gap:var(--s3);padding:var(--s4) var(--s2);cursor:pointer}
.sector-list input{width:20px;height:20px;margin:3px 0 0;accent-color:var(--ledger)}
.sector-list .sn{font-family:var(--head);font-weight:600;font-stretch:90%;font-size:20px;line-height:1.3}
.sector-list .sd{display:block;font-size:14.5px;color:var(--ink-2);margin-top:2px}
.sector-list li:has(input:checked){background:var(--ledger-tint);box-shadow:inset 3px 0 0 var(--ledger)}

/* ---------- Results */
.r-head{padding:var(--s7) 0 var(--s6);border-bottom:1px solid var(--rule)}
.r-head .facts-line{margin-top:var(--s2)}
.score{display:flex;align-items:baseline;gap:var(--s5);flex-wrap:wrap;margin-top:var(--s5)}
.score .value{font-family:var(--head);font-weight:600;font-stretch:88%;font-size:56px;line-height:1;font-variant-numeric:tabular-nums lining-nums}
.score .of{font-size:15px;color:var(--ink-3);margin-left:4px}
.score .label{font-size:13px;color:var(--ink-3);display:block;margin-bottom:var(--s1)}
.score .band{font-family:var(--head);font-weight:600;font-stretch:90%;font-size:22px}
.selfnote{margin-top:var(--s4);font-size:14px;font-weight:600;color:var(--ink-2)}
.r-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--s7);padding-top:var(--s6)}
.r-toc{position:sticky;top:var(--s4);align-self:start;font-size:14.5px}
.r-toc ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.r-toc li a{display:block;padding:var(--s2) 0;border-bottom:1px solid var(--rule);color:var(--ink-2);text-decoration:none}
.r-toc li a:hover{color:var(--ink)}
.r-section{padding-bottom:var(--s7);margin-bottom:var(--s7);border-bottom:1px solid var(--rule)}
.r-section > h2{margin-bottom:var(--s4)}
.sevbar{display:flex;height:14px;border-radius:2px;overflow:hidden;margin:var(--s4) 0 var(--s2);background:var(--sunk)}
.sevbar span{display:block;height:100%}
.sevbar .critical{background:var(--sev-critical)}.sevbar .high{background:var(--sev-high)}.sevbar .medium{background:var(--sev-medium)}.sevbar .low{background:var(--sev-low)}
.sevlegend{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);font-size:14px}
.roadmap h3{font-family:var(--head);font-size:20px;font-weight:600;font-stretch:90%}
.roadmap ul{list-style:none;margin:var(--s3) 0 0;padding:0}
.roadmap ul li{display:grid;grid-template-columns:96px 1fr;gap:var(--s3);padding:var(--s2) 0;border-top:1px solid var(--rule);font-size:15px}
@media (max-width:599px){.roadmap ul li{grid-template-columns:1fr}}
.doc-reader{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-panel);padding:var(--s6);font-family:var(--sans);font-size:16.5px;line-height:1.7;white-space:pre-wrap;max-width:var(--measure)}
@media (max-width:1023px){.r-layout{grid-template-columns:minmax(0,1fr)}.r-toc{position:static}}
.sample-banner{background:var(--sev-medium-tint);border-bottom:1px solid var(--rule);padding:var(--s3) 0;font-size:15px}
.sample-banner strong{color:var(--ink)}

/* ---------- Admin shell */
.admin-body{border-top:4px solid var(--ink)}
.admin-shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh}
.admin-nav{border-right:1px solid var(--rule);padding:var(--s5) 0;background:var(--paper)}
.admin-nav .wordmark{padding:0 var(--s5) var(--s5)}
.admin-nav ul{list-style:none;margin:0;padding:0}
.admin-nav a{display:block;padding:10px var(--s5);color:var(--ink-2);text-decoration:none;font-size:15px}
.admin-nav a:hover{color:var(--ink);background:var(--surface)}
.admin-nav a[aria-current="page"]{color:var(--ink);font-weight:600;background:var(--ledger-tint);box-shadow:inset 3px 0 0 var(--ledger)}
.admin-nav .who{padding:var(--s5);font-size:13px;color:var(--ink-3);border-top:1px solid var(--rule);margin-top:var(--s5)}
.admin-main{padding:var(--s6) var(--s6) var(--s8);max-width:1240px}
.admin-main > header{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s4);flex-wrap:wrap;padding-bottom:var(--s4);margin-bottom:var(--s5);border-bottom:1px solid var(--rule)}
.admin-main h1{font-size:32px}
.admin-main h2{font-size:22px;margin-bottom:var(--s3)}
.admin-main .block + .block{margin-top:var(--s7)}
.admin-main table.register{font-size:14px}
.admin-chip{display:inline-block;margin-left:var(--s2);font:600 12px/1 var(--sans);background:var(--ledger);color:#fff;padding:4px 6px;border-radius:3px;vertical-align:3px}
@media (max-width:1023px){
  .admin-shell{grid-template-columns:minmax(0,1fr)}
  .admin-nav{border-right:0;border-bottom:1px solid var(--rule);padding:var(--s3) 0}
  .admin-nav ul{display:flex;flex-wrap:wrap;padding:0 var(--s3)}
  .admin-nav a{padding:8px 12px}
  .admin-nav .who{display:none}
  .admin-main{padding:var(--s5) var(--s4) var(--s8)}
}
.narrow-page{max-width:420px;margin:0 auto;padding:var(--s8) var(--s4)}
.narrow-page h1{font-size:32px;margin:var(--s6) 0 var(--s4)}

/* ---------- Motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}

/* ---------- Print: results, registers and reports */
.print-only{display:none}
@media print{
  @page{size:A4;margin:18mm 18mm 20mm}
  body{background:#fff;color:#000;font-size:11pt;line-height:1.5}
  .site-header,.site-footer,.a-header,.a-rail,.r-toc,.actions,.no-print,.side-panel,.toolbar,.skip-link,dialog,.sample-banner .actions{display:none!important}
  .print-only{display:block}
  .wrap{max-width:none;padding:0}
  .r-layout,.a-layout{display:block;padding:0}
  .r-section{border-bottom:0;padding-bottom:0;margin-bottom:12mm;break-inside:auto}
  .r-section > h2{break-before:page;font-size:18pt}
  .r-section.first > h2{break-before:avoid}
  table.register{font-size:9.5pt}
  table.register thead{display:table-header-group}
  table.register tr{break-inside:avoid}
  table.register th{background:#eee!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .chip,.sevbar span{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  a{color:#000;text-decoration:none}
  .prose a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:#444}
  .doc-reader{border:0;padding:0;font-size:11pt}
  .print-cover{display:block;min-height:240mm;break-after:page}
  .print-cover .t{font-family:var(--serif);font-size:30pt;margin-top:60mm}
}

/* ---------- Small helpers used by admin and dialogs */
.h3{font-family:var(--head);font-size:22px;line-height:1.25;font-weight:600;font-stretch:90%;margin:0}
.alert.flash{margin-bottom:var(--s5)}
.logout-form{margin-top:var(--s2)}
.mt-s{margin-top:var(--s3)}.mt-m{margin-top:var(--s5)}.mt-l{margin-top:var(--s7)}
.inline-form{display:inline}
.kv{font-size:15px}
.kv dt{font-weight:600;margin-top:var(--s3)}
.kv dd{margin:0;color:var(--ink-2)}
.secret{font-family:var(--mono);font-size:18px;background:var(--sunk);padding:var(--s3) var(--s4);border-radius:var(--radius);display:inline-block}
.seg a.btn-seg{display:inline-flex;align-items:center;padding:6px 12px;min-height:36px;border-left:1px solid var(--rule);font:600 13.5px/1.3 var(--sans);color:var(--ink-2);text-decoration:none;background:var(--surface)}
.seg a.btn-seg:first-child{border-left:0}
.seg a.btn-seg[aria-current="true"]{background:var(--ledger);color:#fff}
.seg.wrap{display:flex;flex-wrap:wrap;gap:6px;border:0;overflow:visible}
.seg.wrap a.btn-seg,.seg.wrap a.btn-seg:first-child{border:1px solid var(--rule-strong);border-radius:var(--radius)}

/* ---------- Additions for forms, privacy notice and results */
mark.placeholder{background:var(--sev-medium-tint);color:var(--sev-medium-ink);padding:0 4px;border-radius:2px;font-weight:600}
[data-summary]{margin-bottom:var(--s5)}
.share-result{margin-top:var(--s6);padding:var(--s4);background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius)}
.r-section h3{font-family:var(--sans);font-size:17px;font-weight:600}
.r-section .ruled h3{font-family:var(--head);font-size:20px;font-weight:600;font-stretch:90%}
.sevlegend > span{display:inline-flex;align-items:center;gap:6px}
.q-intro .eyebrow,.a-layout .eyebrow{color:var(--ink-3)}
legend.qtext{padding:0;float:none;width:100%}
.split > div > .h3:first-child{margin-top:0}
td.unsure{font-style:italic}

@media (max-width:599px){
  .btn{white-space:normal;text-align:center;line-height:1.3;padding-top:8px;padding-bottom:8px}
  .scroll-note{display:block}
}
.scroll-note{display:none;font-size:13px;color:var(--ink-3);margin-top:var(--s2)}
.nowrap{white-space:nowrap}

/* Headings receive focus after a screen change, for screen readers; no ring is needed for that. */
h1[tabindex="-1"]:focus,h2[tabindex="-1"]:focus,.alert[tabindex="-1"]:focus{outline:none}
@media (max-width:599px){
  table.register.stackable td.r,table.register.stackable th.r{text-align:left}
  .a-layout form{padding-bottom:var(--s4)}
}

/* ==========================================================================
   Workspace (signed-in customers)
   ========================================================================== */
.app-top{background:var(--surface);border-top:3px solid var(--ledger);border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:50}
.app-top-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);min-height:60px;padding:0 var(--s5)}
.app-top .wordmark .name{font-size:20px}
.app-org{font-size:14.5px;color:var(--ink-2);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app-user{display:flex;align-items:center;gap:var(--s4)}
.app-menu-button{display:none}
.app-shell{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:calc(100vh - 61px)}
.app-nav{border-right:1px solid var(--rule);padding:var(--s5) 0;background:var(--paper)}
.app-nav ul{list-style:none;margin:0;padding:0}
.app-nav a{display:block;padding:10px var(--s5);color:var(--ink-2);text-decoration:none;font-size:15px}
.app-nav a:hover{color:var(--ink);background:var(--surface)}
.app-nav a[aria-current="page"]{color:var(--ink);font-weight:600;background:var(--ledger-tint);box-shadow:inset 3px 0 0 var(--ledger)}
.app-nav-note{padding:var(--s5)}
.app-main{padding:var(--s6) var(--s6) var(--s8);max-width:1180px;min-width:0}
.app-main > header{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s4);flex-wrap:wrap;padding-bottom:var(--s4);margin-bottom:var(--s5);border-bottom:1px solid var(--rule)}
.app-main h1{font-size:32px}
.app-main h2{font-size:24px;margin-bottom:var(--s3)}
.app-main .block + .block{margin-top:var(--s7)}
@media (max-width:1023px){
  .app-shell{grid-template-columns:minmax(0,1fr)}
  .app-nav{display:none}
  .app-menu-button{display:inline-flex}
  .app-user .meta,.app-user form{display:none}
  .app-main{padding:var(--s5) var(--s4) var(--s8)}
}
@media (max-width:599px){
  .app-top-bar{padding:0 var(--s4);gap:var(--s3)}
  .app-org{font-size:13px}
  .app-top .wordmark .name{font-size:18px}
  .app-main h1{font-size:26px}
}

/* Result state block */
.state-block{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s5);align-items:start;padding:var(--s5);background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-panel)}
.state-block .state-name{font-family:var(--head);font-weight:600;font-stretch:88%;font-size:28px;line-height:1.15}
.state-block .state-why{margin-top:var(--s2);color:var(--ink-2);font-size:15px;max-width:62ch}
.state-block .score-secondary{text-align:right;font-size:14px;color:var(--ink-3)}
.state-block .score-secondary .n{display:block;font-family:var(--head);font-weight:600;font-stretch:88%;font-size:28px;color:var(--ink-2);line-height:1.1}
.state-block .score-secondary .capped{color:var(--sev-high);font-weight:600}
.state-ladder{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);margin:var(--s4) 0 0;padding:0;font-size:14px;color:var(--ink-3)}
.state-ladder li::before{content:"";display:inline-block;width:8px;height:8px;border-radius:1px;border:1.5px solid currentColor;margin-right:6px;vertical-align:1px}
.state-ladder li.on{color:var(--ink);font-weight:600}
.state-ladder li.on::before{background:currentColor}
@media (max-width:599px){.state-block{grid-template-columns:1fr}.state-block .score-secondary{text-align:left}}

/* First actions */
.actions-list{list-style:none;margin:0;padding:0;counter-reset:fa;border-top:1px solid var(--rule)}
.actions-list > li{counter-increment:fa;display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--s3);padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.actions-list > li::before{content:counter(fa);font-family:var(--head);font-weight:600;font-stretch:88%;font-size:26px;line-height:1.05;color:var(--ledger)}
.actions-list .what{font-weight:600}
.actions-list .meta-line{margin-top:var(--s1);display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);align-items:center;font-size:13.5px;color:var(--ink-3)}

/* Locked feature preview */
.locked{border:1px dashed var(--rule-strong);border-radius:var(--radius-panel);padding:var(--s5);background:var(--surface)}
.locked h2{font-size:20px}

/* Dashboard */
.status-line{font-family:var(--sans);font-size:20px;line-height:1.5;max-width:60ch}
.dash-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--s7);margin-top:var(--s7)}
.dash-side{border-left:1px solid var(--rule);padding-left:var(--s5)}
@media (max-width:1279px){.dash-grid{grid-template-columns:minmax(0,1fr)}.dash-side{border-left:0;padding-left:0;border-top:1px solid var(--rule);padding-top:var(--s5)}}

/* Print-only report pages */
.report-page{max-width:820px;margin:0 auto;padding:var(--s6) var(--s5) var(--s8);background:var(--surface)}
.report-page h1{font-size:34px}
.report-page h2{font-size:22px;margin-top:var(--s7);margin-bottom:var(--s3)}
.report-bar{display:flex;justify-content:space-between;gap:var(--s4);align-items:center;padding:var(--s3) var(--s5);background:var(--paper);border-bottom:1px solid var(--rule)}
@media print{.report-bar{display:none}.report-page{padding:0;max-width:none}.report-page h2{break-after:avoid}}

/* Upload */
.dropzone{border:1px dashed var(--rule-strong);border-radius:var(--radius);padding:var(--s4);background:var(--paper)}
.code-block{font-family:var(--mono);font-size:13px;background:var(--sunk);padding:var(--s3);border-radius:var(--radius);overflow-wrap:anywhere}
.h4{font-family:var(--sans);font-size:17px;line-height:1.4;font-weight:600;margin:0}
.overdue{color:var(--sev-critical);font-weight:600}
.level-form{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;max-width:100%}
.level-form .select{display:inline-block;width:auto;max-width:100%;min-width:0}
.trail,.report-foot,.hash{overflow-wrap:anywhere;word-break:break-word}
.flag-review{display:inline-block;font-family:var(--sans);font-size:12px;font-weight:600;line-height:1.3;padding:1px 6px;border-radius:3px;border:1px dashed var(--sev-medium);background:var(--sev-medium-tint);color:var(--ink);vertical-align:1px;white-space:nowrap;cursor:help}
.toc-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px;font-family:var(--sans);font-size:14px}
.toc-list a{color:var(--ink-2)}
ul.plain{list-style:none;margin:0;padding:0}
ul.plain li+li{margin-top:4px}
.meta.where{font-style:italic}
.cta-band{border:0;border-top:2px solid var(--ink);background:none;padding:var(--s5) 0 0}
.cta-band h2{margin:0}
.tiers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s4)}
@media (max-width:1100px){.tiers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.tiers{grid-template-columns:minmax(0,1fr)}}
.tier{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s5) 0 0;background:none;border:0;border-top:3px solid var(--ink)}
.tier:first-child{border-top-color:var(--ledger)}
.tiers{column-gap:var(--s6)!important}
.tier h3{margin:0}
.tier .price{font-family:var(--sans);font-size:17px;font-weight:600;color:var(--ledger)}
.tier ul{margin:0;padding-left:1.1em;font-size:15px}
.tier .who{font-size:14px;color:var(--ink-2)}
.tier .go{margin-top:auto}
.audiences{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s7);row-gap:0}
@media (max-width:820px){.audiences{grid-template-columns:minmax(0,1fr)}}
.audiences>li{padding:var(--s5) 0 var(--s6);border-top:2px solid var(--ink)}
.site-footer .disclaimer{margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid var(--rule);font-size:13.5px;line-height:1.6;color:var(--ink-2);max-width:110ch}
.site-footer .cols h2.mt-m{margin-top:var(--s5)}
@media (max-width:640px){.site-footer .cols{grid-template-columns:1fr}}

.prelaunch{background:var(--sev-medium-tint);border-bottom:1px solid var(--sev-medium);color:var(--ink);font-size:14px;line-height:1.4;padding:var(--s2) var(--s4);text-align:center}
/* Sector identity in the assessment */
.sector-flag{display:inline-block;margin:0;font-family:var(--head);font-size:21px;line-height:1.3;font-weight:600;font-stretch:90%;color:var(--ledger-deep);border-left:4px solid var(--ledger);padding:2px 0 2px 12px}
.q-intro .eyebrow{display:block}
.sector-context{background:var(--ledger-tint);border-left:3px solid var(--ledger);padding:var(--s3) var(--s4);max-width:var(--measure);font-size:15px;line-height:1.5}
.qorigin{display:inline-block;font-size:13px;font-weight:600;border-radius:2px;margin-right:var(--s2);padding:2px 8px;margin-bottom:var(--s2)}
.qorigin.sector{background:var(--ledger-deep);color:var(--paper)}
.qorigin.common{background:var(--sunk);color:var(--ink-2)}
@media (max-width:600px){.a-header .bar{padding-top:var(--s2);padding-bottom:var(--s2);min-height:0}.a-header .context{order:3;flex-basis:100%;text-align:center;font-size:14px;padding:4px 12px;border-radius:6px}.sector-flag{font-size:18px}}
/* References on industry guides */
.ref-groups{display:grid;gap:var(--s5)}
.ref-group h3{margin-bottom:var(--s2)}
.ref-table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45}
.ref-table th,.ref-table td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--rule)}
.ref-table thead th{font-size:13.5px;font-weight:600;color:var(--ink-3);border-bottom:2px solid var(--rule-strong)}
.ref-table tbody th{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--ledger-deep);white-space:nowrap;width:5.5rem}
.ref-table td:nth-child(2){font-weight:600;color:var(--ink)}
.ref-chip{display:inline-block;font-family:var(--mono);font-size:13px;line-height:1.3;color:var(--ink-2);background:var(--sunk);border-radius:3px;padding:2px 6px;margin:0 4px 6px 0;white-space:nowrap}
@media (max-width:600px){.ref-table thead{display:none}.ref-table tr{display:block;padding:10px 0;border-bottom:1px solid var(--rule)}.ref-table th,.ref-table td{display:block;border:0;padding:2px 0}}
/* Contact form: date and time side by side, IST note */
.callback{border:0;padding:0;margin-left:0;margin-right:0}
.callback legend{font-weight:600;margin-bottom:var(--s2)}
.callback-fields{display:flex;flex-wrap:wrap;gap:0 var(--s4)}
.callback-fields .field{margin-top:0}
.ist-note{font-size:12.5px;line-height:1.4;color:var(--ink-3);margin-top:var(--s1)}

/* Contents of the free result: a two-column index, not a numbered sequence */
.contents{list-style:none;margin-left:0;margin-right:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s7);border-top:1px solid var(--rule)}
.contents > li{padding:var(--s5) 0;border-bottom:1px solid var(--rule)}
.contents h3{font-size:20px}
.contents p{margin-top:var(--s2);color:var(--ink-2);font-size:15.5px;max-width:52ch}
@media (max-width:820px){.contents{grid-template-columns:minmax(0,1fr)}}
/* A checkbox label inside a field keeps its checkbox beside the text, in regular weight */
.field > label.choice{display:flex;font-weight:400;font-size:15px;margin-bottom:0}
.callback legend{padding:0}

/* ==========================================================================
   Sequences and schedules, set as registers rather than steppers.
   A row per entry, columns that line up down the page, one heavy rule at the
   top and hairlines between. Numbers appear only where the order is real, and
   are set as small figures in the margin, not in boxes or circles.
   ========================================================================== */

/* The six steps (home, platform) and the progress record (dashboard) */
.journey{list-style:none;margin-left:0;margin-right:0;padding:0;counter-reset:j;border-top:2px solid var(--ink)}
.journey > li{counter-increment:j;display:grid;grid-template-columns:2rem 10rem minmax(0,1fr) 12rem;column-gap:var(--s5);align-items:baseline;padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.journey > li::before{content:counter(j);font-family:var(--head);font-weight:500;font-size:15px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.journey .step{font-family:var(--head);font-weight:600;font-stretch:90%;font-size:19px;line-height:1.3;color:var(--ink)}
.journey .step a{color:inherit}
.journey .what{font-size:15.5px;line-height:1.5;color:var(--ink-2)}
.journey .avail{font-size:14px;line-height:1.4;color:var(--ink-3)}
.journey .avail a{color:var(--ink-2)}
/* What the free check covers is set apart from what happens in the workspace by a heavier rule */
.journey > li.now .avail{color:var(--ledger);font-weight:600}
.journey > li.now + li:not(.now){border-top:2px solid var(--ink)}
.journey > li.now:has(+ li:not(.now)){border-bottom:0}
/* The dashboard's progress record: step and where it stands */
.journey.compact > li{grid-template-columns:2rem 10rem minmax(0,1fr);padding:var(--s3) 0}
.journey.compact .state{font-size:15px;color:var(--ink-2)}
.journey.compact > li.now .state{color:var(--ink)}
.journey.compact > li[aria-current="step"]{background:var(--ledger-tint);box-shadow:inset 3px 0 0 var(--ledger)}
.journey.compact > li[aria-current="step"]::before{padding-left:var(--s2)}
@media (max-width:820px){
  .journey > li,.journey.compact > li{grid-template-columns:2rem minmax(0,1fr);row-gap:var(--s1)}
  .journey .what,.journey .avail,.journey .state{grid-column:2}
}

/* Dates: a schedule. Date, what happens, status. */
.timeline{list-style:none;margin-left:0;margin-right:0;padding:0;border-top:2px solid var(--ink)}
.timeline > li{display:grid;grid-template-columns:11rem minmax(0,1fr) 7rem;grid-template-areas:"when what tag";column-gap:var(--s5);align-items:baseline;padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.timeline .when{grid-area:when;font-family:var(--head);font-weight:600;font-stretch:90%;font-size:19px;line-height:1.3;color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
.timeline .what{grid-area:what;margin:0;font-size:15.5px;line-height:1.5;color:var(--ink-2);max-width:62ch}
.timeline .tag{grid-area:tag;text-align:right;font-size:14px;font-weight:600;color:var(--ink-3)}
.timeline > li.upcoming .tag{color:var(--ledger)}
.timeline > li.past .when{color:var(--ink-2)}
@media (max-width:640px){
  .timeline > li{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"when tag" "what what";row-gap:var(--s1)}
}
/* The roadmap in a result: buckets of work, each with its list of fixes */
.timeline.roadmap > li{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"when tag" "list list";row-gap:var(--s2)}
.timeline.roadmap > li > ul{grid-area:list}
.timeline.roadmap > li.upcoming .when{color:var(--ledger)}

/* Numbered procedures: the number sits in the margin as a figure, the step beside it */
.numbered{list-style:none;margin-left:0;margin-right:0;padding:0;counter-reset:n;border-top:2px solid var(--ink)}
.numbered > li{counter-increment:n;display:grid;grid-template-columns:2rem minmax(0,1fr);column-gap:var(--s5);padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.numbered > li::before{content:counter(n);font-family:var(--head);font-weight:500;font-size:15px;line-height:1.7;color:var(--ink-3);font-variant-numeric:tabular-nums}
.numbered h3{font-size:19px}
.numbered p{margin-top:var(--s1);color:var(--ink-2);font-size:15.5px;max-width:62ch}

/* Sourced statements: the claim, and beside it the provision it rests on */
.facts{border-top:1px solid var(--rule-strong);margin-top:0}
.facts > div{display:grid;grid-template-columns:minmax(0,1fr) 17rem;column-gap:var(--s7);align-items:baseline;padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.facts .fact{font-family:var(--sans);font-size:17.5px;line-height:1.5;color:var(--ink);max-width:64ch}
.facts .src{display:block;margin:0;font-family:var(--sans);font-size:14px;line-height:1.45;color:var(--ink-3)}
@media (max-width:820px){.facts > div{grid-template-columns:minmax(0,1fr);row-gap:var(--s2)}.facts .src{border-left:0;padding-left:0}}

/* What to do next, after a free result: three choices in order, as rows */
.steps-list{list-style:none;margin-left:0;margin-right:0;padding:0;counter-reset:ns;border-top:2px solid var(--ink)}
.steps-list > li{counter-increment:ns;display:grid;grid-template-columns:2rem minmax(0,1fr) auto;column-gap:var(--s5);align-items:baseline;padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.steps-list > li::before{content:counter(ns);font-family:var(--head);font-weight:500;font-size:15px;color:var(--ink-3)}
.steps-list > li > *{grid-column:2}
.steps-list > li > .btn{grid-column:3;grid-row:1 / span 2;align-self:center;margin:0}
.steps-list .what{font-family:var(--head);font-weight:600;font-stretch:90%;font-size:19px}
.steps-list .meta{font-size:15px;color:var(--ink-2);max-width:62ch}
@media (max-width:700px){.steps-list > li{grid-template-columns:2rem minmax(0,1fr)}.steps-list > li > .btn{grid-column:2;grid-row:auto;justify-self:start;margin-top:var(--s3)}}



/* The contents of the free result: a two-column index under one heavy rule */
.contents{border-top:2px solid var(--ink)}

/* Informational notes read as a footnote under a rule, not a tinted callout box.
   Error, warning and success states keep their tinted panel so they stay obvious. */
.alert:not(.error):not(.warning):not(.success){background:none;border:0;border-top:1px solid var(--rule-strong);border-radius:0;padding:var(--s3) 0 0;font-size:15px;color:var(--ink-2)}
.alert:not(.error):not(.warning):not(.success) a{color:var(--ink)}
.alert.error,.alert.warning,.alert.success{border-radius:0}

/* Limits: a plain ruled list, each limit set as a short run-in heading. No frame. */
.claims{padding:0;border:0;border-top:2px solid var(--ink);background:none;max-width:760px}
.claims li{padding:var(--s4) 0}
.claims li:last-child{border-bottom:1px solid var(--rule)}
.claims li p{margin:0;max-width:62ch}
.claims strong{display:block;font-family:var(--head);font-weight:600;font-stretch:88%;font-size:19px;line-height:1.3;margin-bottom:2px}
@media (max-width:599px){.claims{padding:0}}

/* Partner audiences: one after another on the editorial grid, heading in the margin. */
.audiences{display:block}
.audiences>li{display:grid;grid-template-columns:180px minmax(0,1fr);column-gap:var(--s7);padding:var(--s5) 0 var(--s6);border-top:1px solid var(--rule-strong)}
.audiences>li:first-child{border-top:2px solid var(--ink)}
.audiences>li>*{grid-column:2;max-width:68ch}
.audiences>li>h3{grid-column:1;grid-row:1 / span 6;margin:0;font-size:19px}
.audiences>li>p.mt-s:first-of-type{margin-top:0}
@media (max-width:1023px){.audiences>li{grid-template-columns:minmax(0,1fr)}.audiences>li>*{grid-column:1}.audiences>li>h3{grid-row:auto}.audiences>li>p.mt-s:first-of-type{margin-top:var(--s2)}}

/* Cited parts read as a plain run of references, not tags. */
.ref-chip{background:none;border-radius:0;padding:0;margin:0 10px 2px 0;font-size:13.5px;color:var(--ink)}

/* ==========================================================================
   ReversePath's grammar, October 2026
   1. A sequence steps down to the right. The three verbs of the promise and the
      six steps of the work are set as a descending path; nothing else is.
   2. Open and closed. A small open square is something still to come or still a
      gap; a filled square is in force or done. The same mark the result uses for
      its Self-Assessed, Evidence-Supported and Expert-Verified ladder.
   3. Type changes with the kind of information: statements condensed, dates set
      wide like a calendar, explanations in the text face.
   4. Each section is composed for its content, so the page changes pace:
      statement, dense facts, a path, an index, one dark pause, a split, a scale,
      a run-in list, the limits set large, and a short close.
   ========================================================================== */

/* ---- Section heads: no fixed rail. Label, heading and lead sit together, and
   each section decides where the head goes. */
.sec-head .eyebrow{color:var(--ink-3);font-weight:500;font-size:15px;font-stretch:96%}
.sec-head h2{margin-top:6px}
.sec-head .lead-p{margin-top:var(--s4);font-size:18px;line-height:1.55;color:var(--ink-2);max-width:54ch}
.split-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--s8);align-items:end}
.split-head .lead-p{margin-top:0}
@media (max-width:899px){.split-head{grid-template-columns:minmax(0,1fr)}.split-head .lead-p{margin-top:var(--s4)}}

/* ---- Hero: the promise as a descending path, then the product itself */
.hero.hero-path{padding:var(--s8) 0 var(--s8)}
.hero-path .eyebrow{color:var(--ink-3);font-weight:500;font-size:15px}
.display.stepped{margin-top:var(--s4);font-size:clamp(44px,7.6vw,100px);line-height:.96;font-weight:600;font-stretch:80%;letter-spacing:-.022em}
.display.stepped span{display:block}
.display.stepped span:nth-child(2){padding-left:1.05em}
.display.stepped span:nth-child(3){padding-left:2.1em}
.hero-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--s8);margin-top:var(--s8);align-items:start}
.hero-path .lede{margin-top:0;font-size:19px;max-width:44ch}
.hero-path .actions{margin-top:var(--s5)}
.hero-path figure{margin:0}
@media (max-width:1023px){.hero-grid{grid-template-columns:minmax(0,1fr);row-gap:var(--s7);margin-top:var(--s6)}}
@media (max-width:599px){
  .hero.hero-path{padding:var(--s6) 0 var(--s7)}
  .display.stepped{font-size:clamp(38px,11.4vw,48px);line-height:1}
  .display.stepped span:nth-child(2){padding-left:.6em}
  .display.stepped span:nth-child(3){padding-left:1.2em}
}

/* ---- Sourced facts: three statements side by side, each with its provision */
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid var(--ink);border-bottom:1px solid var(--rule)}
.facts > div{display:block;padding:var(--s5) var(--s6) var(--s5) 0;border-bottom:0}
.facts > div + div{padding-left:var(--s6);border-left:1px solid var(--rule)}
.facts .fact{font-size:16px;line-height:1.5;max-width:none}
.facts .src{margin-top:var(--s3);font-size:13px}
@media (max-width:899px){
  .facts{grid-template-columns:minmax(0,1fr)}
  .facts > div,.facts > div + div{padding:var(--s4) 0;border-left:0}
  .facts > div + div{border-top:1px solid var(--rule)}
}

/* ---- The six steps: the step names descend as a path on the left, one tread
   per step; what each step does stays in one column on the right, so the eye can
   follow the path or read straight down. The two steps the free check covers are
   drawn in the brand colour; the workspace steps in ink. */
.steps.section{padding-top:var(--s9);padding-bottom:var(--s7)}
.steps .sec-head h2{font-size:clamp(30px,3.4vw,42px);line-height:1.04;font-stretch:82%;max-width:16ch}
.journey.path{border-top:0;margin-top:var(--s7);--tread:clamp(36px,5.2vw,76px);--rise:1px;--ink-line:var(--ink)}
.journey.path > li{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,30rem);column-gap:var(--s7);row-gap:var(--s1);align-items:baseline;padding:var(--s4) 0 var(--s6);border:0;
  background:linear-gradient(var(--ink-line),var(--ink-line)) no-repeat calc(var(--i,0) * var(--tread)) 0 / var(--rise) 100%}
.journey.path > li:nth-child(2){--i:1}.journey.path > li:nth-child(3){--i:2}.journey.path > li:nth-child(4){--i:3}.journey.path > li:nth-child(5){--i:4}.journey.path > li:nth-child(6){--i:5}
.journey.path > li.now{--rise:3px;--ink-line:var(--ledger)}
.journey.path > li:last-child{background:none}
.journey.path > li.now + li:not(.now){border-top:0}
/* the number sits on the tread, the name just after it */
.journey.path > li::before{position:absolute;top:calc(var(--s4) + 6px);left:calc(var(--i,0) * var(--tread) + 12px);padding:0;font-family:var(--head);font-weight:600;font-size:15px;color:var(--ink-3)}
.journey.path > li.now::before{color:var(--ledger)}
.journey.path .step{grid-column:1;padding-left:calc(var(--i,0) * var(--tread) + 2.75rem);font-size:clamp(26px,2.7vw,36px);line-height:1;font-stretch:80%;letter-spacing:-.01em;transition:color .15s ease}
.journey.path .what{grid-column:2;grid-row:1;font-size:16.5px;line-height:1.5;color:var(--ink-2);max-width:46ch}
.journey.path .avail{grid-column:2;font-size:14px}
/* the tread: from the riser above to the start of this step's name */
.journey.path > li::after{content:"";position:absolute;top:0;height:var(--rise);background:var(--ink-line);left:calc((var(--i,0) - 1) * var(--tread));width:calc(var(--tread) + 2.75rem);transform-origin:left center;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.journey.path > li:first-child::after{left:0;width:2.75rem}
.journey.path > li:hover .step,.journey.path > li:focus-within .step{color:var(--ledger-deep)}
/* a hairline from the name across to its explanation, shown while it is being read */
.journey.path > li .what{position:relative}
.journey.path > li .what::before{content:"";position:absolute;right:calc(100% + 12px);top:.75em;width:0;border-top:1px dotted var(--rule-strong);transition:width .25s ease}
@media (hover:hover){.journey.path > li:hover .what::before{width:var(--s5)}}
/* drawn on arrival, once, when script is present and motion is allowed */
.journey.path.will-draw > li::after{transform:scaleX(0)}
.journey.path.will-draw.drawn > li::after{transform:scaleX(1)}
.journey.path.drawn > li:nth-child(2)::after{transition-delay:.09s}.journey.path.drawn > li:nth-child(3)::after{transition-delay:.18s}
.journey.path.drawn > li:nth-child(4)::after{transition-delay:.27s}.journey.path.drawn > li:nth-child(5)::after{transition-delay:.36s}
.journey.path.drawn > li:nth-child(6)::after{transition-delay:.45s}
@media (max-width:820px){
  .journey.path{--tread:14px}
  .journey.path > li{grid-template-columns:minmax(0,1fr);padding-bottom:var(--s5)}
  .journey.path .step,.journey.path .what,.journey.path .avail{grid-column:1;grid-row:auto;padding-left:calc(var(--i,0) * var(--tread) + 2.5rem)}
  .journey.path .what{margin-top:var(--s2)}
  .journey.path .step{font-size:27px}
  .journey.path > li::after{width:calc(var(--tread) + 2.5rem)}
  .journey.path > li:first-child::after{width:2.5rem}
  .journey.path > li .what::before{display:none}
}

/* ---- Sectors: a run-in index. Name large, what it covers running on after it. */
.sectors.section{padding-top:var(--s8)}
.sector-index{list-style:none;margin:var(--s7) 0 0;padding:var(--s5) 0 0;border-top:2px solid var(--ink);columns:2;column-gap:var(--s8)}
.sector-index > li{break-inside:avoid;padding:0 0 var(--s5)}
.sector-index .item-title{font-family:var(--head);font-weight:600;font-stretch:84%;font-size:26px;line-height:1.1;color:var(--ink);text-decoration:none;margin-right:6px}
.sector-index .item-title:hover{color:var(--ledger);text-decoration:underline;text-decoration-thickness:2px}
.sector-index .item-desc{display:inline;font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.sector-other{margin-top:var(--s3);max-width:none}
@media (max-width:820px){.sector-index{columns:1}.sector-index .item-title{font-size:23px}}

/* ---- The one dark pause on the page */
.pause{background:var(--ledger-deep);color:#F3ECF1;padding:var(--s9) 0;margin:var(--s7) 0 0;border:0}
.pause .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--s8);align-items:end}
.pause p.q{font-family:var(--head);font-weight:600;font-stretch:82%;font-size:clamp(30px,4.3vw,56px);line-height:1.04;letter-spacing:-.015em;max-width:21ch;color:#fff}
.pause p.f{margin:0;max-width:44ch;font-size:18px;line-height:1.55;color:#DCCBD6}
@media (max-width:899px){.pause{padding:var(--s8) 0}.pause .wrap{grid-template-columns:minmax(0,1fr)}.pause p.f{margin-top:var(--s5)}}

/* ---- Roles: the definitions, and beside them the case that uses them */
.roles.section{padding-top:var(--s9)}
.roles-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:auto 1fr;column-gap:var(--s8);align-items:start}
.roles-grid > .sec-head{grid-column:1;grid-row:1}
.roles-grid > .kv{grid-column:1;grid-row:2;margin-top:var(--s7)}
.roles-grid > .case{grid-column:2;grid-row:1 / span 2}
.roles .kv{margin:var(--s7) 0 0;font-size:16px}
.roles .kv dt{margin-top:var(--s6);font-family:var(--head);font-weight:600;font-stretch:84%;font-size:28px;line-height:1.1;color:var(--ink)}
.roles .kv dt:first-child{margin-top:0}
.roles .kv dd{margin-top:var(--s2);max-width:56ch;color:var(--ink-2);line-height:1.6}
.roles .case{margin-top:var(--s6);padding-top:var(--s4);border-top:2px solid var(--ink);font-size:17px;line-height:1.65}
.roles .case p{max-width:46ch}
@media (max-width:899px){.roles-grid{grid-template-columns:minmax(0,1fr)}.roles-grid > .sec-head,.roles-grid > .kv,.roles-grid > .case{grid-column:1;grid-row:auto}.roles .case{margin-top:var(--s7)}}

/* ---- Dates: drawn to scale, then read as a schedule. Closed squares are in
   force, open squares are still to come. */
.dates.section{padding-top:var(--s9)}
.date-scale{margin-top:var(--s7)}
.date-scale svg{display:block;width:100%;height:auto;overflow:visible}
.date-scale .yr{stroke:var(--rule-strong);stroke-width:1}
.date-scale .yr-t{font:500 13px var(--head);font-stretch:112%;fill:var(--ink-3);text-anchor:middle}
.date-scale .past-line{stroke:var(--ink);stroke-width:2}
.date-scale .future-line{stroke:var(--ink);stroke-width:1;stroke-dasharray:4 4}
.date-scale .today{stroke:var(--ledger);stroke-width:2}
.date-scale .today-t{font:600 13px var(--head);font-stretch:100%;fill:var(--ledger);text-anchor:end}
.date-scale .lead{fill:none;stroke:var(--rule-strong);stroke-width:1}
.date-scale .lead.upcoming{stroke-dasharray:3 3}
.date-scale .mark{stroke:var(--ink);stroke-width:2}
.date-scale .mark.past{fill:var(--ink)}
.date-scale .mark.upcoming{fill:var(--paper)}
.timeline.scale-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:0;margin-top:0}
.timeline.scale-list > li{display:block;padding:0 var(--s5) 0 0;border:0;position:relative}
.timeline.scale-list > li::before{content:"";display:block;width:12px;height:12px;border:2px solid var(--ink);background:var(--paper);margin-bottom:var(--s3)}
.timeline.scale-list > li.past::before{background:var(--ink)}
.timeline.scale-list .when{display:block;font-family:var(--head);font-weight:600;font-stretch:112%;font-size:22px;line-height:1.15;letter-spacing:-.005em}
.timeline.scale-list > li.past .when{color:var(--ink-3)}
.timeline.scale-list .tag{display:block;text-align:left;margin-top:var(--s1);font-size:13.5px}
.timeline.scale-list .what{margin-top:var(--s2);font-size:15.5px}
.timeline.scale-list > li.past .what{color:var(--ink-3)}
.dates-more{margin-top:var(--s6)}
.date-scale .past-line,.date-scale .lead{transition:stroke-dashoffset 1s ease}
@media (max-width:899px){
  .date-scale{display:none}
  .timeline.scale-list{grid-template-columns:minmax(0,1fr);margin-top:var(--s6)}
  /* a vertical line through the marks, solid while in force, dotted after */
  .timeline.scale-list > li{padding:0 0 var(--s5) var(--s6)}
  .timeline.scale-list > li::before{position:absolute;left:0;top:5px;margin:0}
  .timeline.scale-list > li:not(:last-child)::after{content:"";position:absolute;left:5px;top:21px;bottom:-1px;border-left:2px solid var(--ink)}
  .timeline.scale-list > li.upcoming:not(:last-child)::after{border-left:2px dotted var(--ink-3)}
  .timeline.scale-list > li.past:has(+ li.upcoming)::after{border-left-style:dotted;border-left-color:var(--ink-3)}
}

/* ---- What the free result contains: the heading holds its place while the
   contents run past it, as a run-in list */
.receive-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:var(--s8);align-items:start}
.receive .sec-head h2{font-size:clamp(28px,3vw,38px);line-height:1.06;font-stretch:82%;max-width:12ch}
.receive .contents{border-top:2px solid var(--ink);padding-top:var(--s5);column-gap:var(--s7);row-gap:var(--s5)}
.receive .contents > li{padding:0;border:0}
.receive .contents h3,.receive .contents p{display:inline}
.receive .contents h3{font-family:var(--head);font-size:19px;font-stretch:88%;margin-right:4px}
.receive .contents p{margin:0;font-size:15.5px;line-height:1.55;color:var(--ink-2)}
@media (max-width:899px){.receive-grid{grid-template-columns:minmax(0,1fr);row-gap:var(--s5)}}

/* ---- Limits: the fine print, set as the largest type in the body of the page */
.limits.section{padding-top:var(--s9);padding-bottom:var(--s9)}
.limits .sec-head h2{font-size:22px;font-stretch:96%;line-height:1.2}
.limits .claims{margin-top:var(--s6);max-width:none;border-top:2px solid var(--ink);padding-top:var(--s6)}
.limits .claims > li{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:var(--s7);padding:0 0 var(--s7);border:0}
.limits .claims > li:last-child{padding-bottom:0;border:0}
.limits .claims .n{display:block;text-align:right;font-family:var(--head);font-weight:500;font-stretch:100%;font-size:18px;line-height:2.3;color:var(--ledger)}
.limits .claims p{max-width:none;font-size:17px;line-height:1.55;color:var(--ink-2)}
.limits .claims strong{display:block;margin-bottom:var(--s3);font-family:var(--head);font-weight:600;font-stretch:80%;font-size:clamp(30px,3.9vw,50px);line-height:1.02;letter-spacing:-.015em;color:var(--ink);max-width:20ch}
@media (max-width:899px){
  .limits .claims > li{grid-template-columns:minmax(0,1fr);padding-bottom:var(--s6)}
  .limits .claims .n{text-align:left;line-height:1.4;margin-bottom:var(--s1)}
}

/* ---- Changes and the close: short, and set off to the right of the page's left edge */
.changes.section{padding-top:var(--s7);padding-bottom:var(--s7)}
.changes .wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:var(--s8)}
.changes .sec-head h2{font-size:22px;font-stretch:96%}
.changes .lead-p,.changes .ruled{margin-top:0;font-size:16px;color:var(--ink-2)}
.talk.section{padding:var(--s7) 0 var(--s4)}
.talk .wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:var(--s8);align-items:baseline}
.talk .wrap::before{content:"";grid-column:1 / -1;border-top:2px solid var(--ink);margin-bottom:var(--s6)}
.talk .eyebrow{color:var(--ink-3);font-weight:500;font-size:15px}
.talk .lede{font-family:var(--head);font-weight:500;font-stretch:90%;font-size:clamp(22px,2.4vw,30px);line-height:1.25;color:var(--ink);max-width:34ch}
@media (max-width:899px){.changes .wrap,.talk .wrap{grid-template-columns:minmax(0,1fr);row-gap:var(--s3)}}

/* The date scale read with the pointer: a hairline and the month under it, with
   how far that is from today. It replaces the pointer only inside the scale. */
.date-scale{position:relative}
.date-scale.readable{cursor:none}
.date-scale .ruler{position:absolute;top:18px;height:62px;left:0;width:0;border-left:1px solid var(--ink);pointer-events:none;opacity:0;transition:opacity .12s ease}
.date-scale .ruler.on{opacity:1}
.date-scale .ruler.ahead{border-left-style:dashed}
.date-scale .ruler.snap{border-left-width:2px;border-left-style:solid;border-left-color:var(--ledger)}
.date-scale .ruler span{position:absolute;left:8px;white-space:nowrap;font-family:var(--head);line-height:1.2;background:var(--paper);padding:0 3px}
.date-scale .ruler.flip span{left:auto;right:8px}
.date-scale .ruler .r-when{top:-2px;font-weight:600;font-size:14px;font-stretch:112%;color:var(--ink)}
.date-scale .ruler .r-rel{top:16px;font-size:13px;color:var(--ink-3)}
.date-scale .ruler.snap .r-when{color:var(--ledger-deep)}
@media (prefers-reduced-motion: reduce){.date-scale .ruler{transition:none}.journey.path > li::after{transition:none}}
/* the worked case stays beside the definitions it uses while they are read */
@media (min-width:900px){.roles-grid > .case{position:sticky;top:var(--s6);align-self:start}}
.date-scale.no-leads{margin-top:0}
/* in the schedule, dates already in force step back; those still to come stay in full ink */
.timeline:not(.scale-list):not(.roadmap) > li.past .when{color:var(--ink-3)}

/* ==========================================================================
   Behaviour: what you are reading is the active item; the rest step back.
   Script adds .focus-on to a list and .is-active to one item (by scroll position,
   pointer or keyboard focus). Without script every item is shown at full strength.
   ========================================================================== */

/* ---- Six steps as a process ---- */
.path-frame{position:relative}
.path-note{margin-top:var(--s4);max-width:54ch;font-size:18px;line-height:1.55;color:var(--ink-2)}
@media (min-width:1200px){
  /* the note sits in the space the path leaves below it, beside the paid steps it explains */
  .path-note{position:absolute;left:0;bottom:var(--s3);z-index:1;width:calc(4 * clamp(36px,5.2vw,76px) - 3.5rem);margin:0;font-size:15px;line-height:1.5;color:var(--ink-3)}
}
.journey.path{position:relative;margin-bottom:var(--s5)}
.journey.path > li{outline-offset:6px}
.journey.path > li:focus-visible{outline:2px solid var(--ledger)}
.journey.path .avail a{transition:color .15s ease}
/* the way back: monitoring returns you to the start, to reassess */
.journey.path::after{content:"";position:absolute;left:-26px;top:0;bottom:0;width:calc(5 * var(--tread) + 26px);border-left:1px dashed var(--rule-strong);border-bottom:1px dashed var(--rule-strong);pointer-events:none;transition:border-color .2s ease}
.journey.path::before{content:"";position:absolute;left:-30px;top:-1px;width:7px;height:7px;border-left:1px solid var(--rule-strong);border-top:1px solid var(--rule-strong);transform:rotate(45deg);transform-origin:center;pointer-events:none;transition:border-color .2s ease}
.journey.path > li:last-child{background:repeating-linear-gradient(to bottom,var(--rule-strong) 0 3px,transparent 3px 6px) no-repeat calc(5 * var(--tread)) 0 / 1px 100%}
.journey.path.loop-on::after,.journey.path.loop-on::before{border-color:var(--ledger)}
/* reading state */
.journey.path.focus-on > li:not(.is-active) .step{color:var(--ink-3)}
.journey.path.focus-on > li:not(.is-active) .what{color:var(--ink-3)}
.journey.path.focus-on > li.is-active .step{color:var(--ink)}
.journey.path.focus-on > li.is-active .what{color:var(--ink)}
.journey.path.focus-on > li.is-active::before{color:var(--ink)}
.journey.path.focus-on > li.now.is-active::before{color:var(--ledger)}
.journey.path.focus-on > li:not(.now):not(.walked){--ink-line:var(--rule-strong)}
.journey.path.focus-on > li.walked:not(.now){--rise:2px}
.journey.path.focus-on > li.is-active .avail a{color:var(--ledger-deep);font-weight:600;text-decoration-thickness:2px}
.journey.path.focus-on > li.is-active .avail a::after{content:" \2192" / "";}
.journey.path.focus-on > li.is-active .what::before{width:var(--s5)}
.journey.path > li .what{transition:color .2s ease}
@media (max-width:820px){
  .journey.path::after{left:-12px;width:calc(5 * var(--tread) + 12px)}
  .journey.path::before{left:-15px}
}

/* ---- Dates: the next one is marked, and the one being read shows how far it is from today ---- */
.timeline.scale-list > li{outline-offset:6px;cursor:default}
.timeline.scale-list > li:focus-visible{outline:2px solid var(--ledger)}
.timeline.scale-list > li.next::before{border-color:var(--ledger)}
.timeline.scale-list > li.next .tag{font-weight:700}
.timeline.scale-list .rel{display:block;height:0;overflow:hidden;margin-top:0;font-family:var(--head);font-weight:600;font-size:14px;font-stretch:100%;color:var(--ledger-deep);transition:height .2s ease,margin .2s ease}
.timeline.scale-list > li.past .rel{color:var(--ink-2)}
.timeline.scale-list.focus-on > li.is-active .rel{height:1.4em;margin-top:var(--s2)}
.timeline.scale-list.focus-on > li:not(.is-active) .when{color:var(--ink-3)}
.timeline.scale-list.focus-on > li:not(.is-active) .what{color:var(--ink-3)}
.timeline.scale-list.focus-on > li.is-active .when{color:var(--ink)}
.timeline.scale-list.focus-on > li.is-active .what{color:var(--ink)}
.timeline.scale-list.focus-on > li.is-active::before{box-shadow:0 0 0 3px var(--paper),0 0 0 4px var(--ink)}
.timeline.scale-list.focus-on > li.next.is-active::before{box-shadow:0 0 0 3px var(--paper),0 0 0 4px var(--ledger)}
.date-scale .next-seg{stroke:var(--ledger);stroke-width:3}
.date-scale .mark.next{stroke:var(--ledger)}
.date-scale .lead.next{stroke:var(--ledger)}
.date-scale .mark,.date-scale .lead{transition:stroke-width .15s ease}
.date-scale .mark.is-active{stroke-width:3}
.date-scale .lead.is-active{stroke-width:2;stroke:var(--ink)}
.date-scale .lead.next.is-active{stroke:var(--ledger)}

/* ---- Limits: a declaration. The first statement is set across the full measure,
   starting where the numerals sit; the rest follow on the text column. ---- */
.inline-head{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:var(--s4)}
.inline-head h2{margin-top:0}
.limits .claims > li{container-type:inline-size}
.limits .claims > li:first-child{display:block;padding-bottom:var(--s8)}
.limits .claims > li:first-child .n{text-align:left;line-height:1.2;margin-bottom:var(--s3)}
.limits .claims > li:first-child p{padding-left:calc(25cqw + .75 * var(--s7));font-size:19px;color:var(--ink)}
.limits .claims > li:first-child strong{margin-left:calc(-25cqw - .75 * var(--s7));font-size:clamp(44px,7.4vw,104px);line-height:.95;letter-spacing:-.025em;max-width:none;margin-bottom:var(--s5)}
.limits .claims.focus-on > li:not(:first-child):not(.is-active) strong{color:var(--ink-2)}
.limits .claims.focus-on > li:not(:first-child):not(.is-active) p{color:var(--ink-3)}
.limits .claims.focus-on > li.is-active p{color:var(--ink)}
.limits .claims.focus-on > li.is-active .n{font-weight:700}
.limits .claims p,.limits .claims strong{transition:color .25s ease}
@media (max-width:899px){
  .limits .claims > li:first-child p{padding-left:0}
  .limits .claims > li:first-child strong{margin-left:0;font-size:clamp(40px,12vw,64px)}
  .limits .claims > li:first-child{padding-bottom:var(--s7)}
}
@media (prefers-reduced-motion: reduce){
  .journey.path > li .what,.journey.path::after,.journey.path::before,.timeline.scale-list .rel,.limits .claims p,.limits .claims strong,.date-scale .mark,.date-scale .lead{transition:none}
}
.journey.path.loop-on > li:last-child{background-image:repeating-linear-gradient(to bottom,var(--ledger) 0 3px,transparent 3px 6px)}

/* ==========================================================================
   Final pass, October 2026. Aubergine brand; homepage relationships.
   ========================================================================== */

/* ---- Header: quieter. No coloured band; a small seal before the name. */
.site-header{border-top:0}
.wordmark{display:inline-flex;flex-direction:column;justify-content:center;min-height:44px}
.wordmark .name{display:inline-flex;align-items:center;gap:9px}
.wordmark .name::before{content:"";width:12px;height:12px;background:var(--ledger);flex:none;transform:translateY(-1px)}
.a-header,.app-top{border-top-color:var(--ledger)}
.primary-nav a.nav-link[aria-current="page"]{color:var(--ledger-deep)}
.btn-text{display:inline-flex;align-items:center;min-height:44px}
@media (max-width:899px){.field label.choice,.choice-list label{min-height:44px;align-items:center}}

/* ---- Hero: the three statements joined by one thin path. An open square is
   the gap, a half-filled one the work, a filled one the evidence. */
.display.stepped{padding-left:.55em}
.display.stepped{--step:1.05em;--lh:.96em}
.display.stepped span{position:relative;--ind:0em}
.display.stepped span:nth-child(2){--ind:var(--step);padding-left:var(--ind)}
.display.stepped span:nth-child(3){--ind:calc(2 * var(--step));padding-left:var(--ind)}
.display.stepped span::before{content:"";position:absolute;left:calc(var(--ind) - .42em);top:.36em;width:.15em;height:.15em;box-sizing:border-box;border:max(2px,.022em) solid var(--ledger);background:transparent}
.display.stepped span:nth-child(2)::before{background:linear-gradient(to top,var(--ledger) 50%,transparent 50%)}
.display.stepped span:nth-child(3)::before{background:var(--ledger)}
.display.stepped span:nth-child(n+2)::after{content:"";position:absolute;left:calc(var(--ind) - var(--step) - .42em + .075em - .5px);width:calc(var(--step) - .075em);top:calc(.51em - var(--lh));height:calc(var(--lh) - .51em + .435em);border-left:max(1px,.012em) solid var(--ledger);border-bottom:max(1px,.012em) solid var(--ledger);pointer-events:none}
@media (max-width:599px){.display.stepped{--step:.6em;--lh:1em}}
/* the free check is the way in: its column hangs from the path */
.hero-copy.entry{border-left:2px solid var(--ledger);padding-left:var(--s5)}
.hero-copy.entry .btn-primary{min-height:52px;padding-left:var(--s6);padding-right:var(--s6)}

/* ---- Sectors: a directory. Pointing at a sector brings it forward. */
.sector-index > li{transition:opacity .15s ease}
.sector-index .item-title{text-underline-offset:5px}
.sector-index.has-active > li:not(.is-active){opacity:.55}
.sector-index > li.is-active .item-title{color:var(--ledger);text-decoration:underline;text-decoration-thickness:2px}
.sector-index > li.is-active .item-title::after{content:" \2192" / "";font-weight:500}
.sector-index > li.is-active .item-desc{color:var(--ink)}

/* ---- Roles: a chain, not three definitions. The person; who decides; who
   handles it on instructions. */
.kv.chain{position:relative;padding-left:var(--s7)}
.kv.chain dt{position:relative}
.kv.chain dt::before{content:"";position:absolute;left:calc(-1 * var(--s7));top:.32em;width:13px;height:13px;box-sizing:border-box;border:2px solid var(--ledger);background:var(--paper)}
.kv.chain dt:first-of-type::before{background:var(--ledger)}
.kv.chain dt::after{content:attr(data-role) / "";display:block;margin-bottom:2px;order:-1;font-family:var(--sans);font-weight:600;font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--ledger);font-stretch:100%;position:absolute;top:-1.5em;left:0}
.kv.chain dt{margin-top:calc(var(--s6) + 1.2em)}
.kv.chain dt:first-of-type{margin-top:1.4em}
.kv.chain::before{content:"";position:absolute;left:6px;top:calc(1.4em + .32em + 13px);bottom:calc(100% - 100%);height:calc(100% - 4.8em);border-left:1px solid var(--ledger)}
.kv.chain dd + dt{padding-top:0}
.kv.chain dd{position:relative}
.kv.chain dd:not(:last-child)::after{content:"";position:absolute;left:calc(-1 * var(--s7) + 2px);bottom:calc(-1 * var(--s6) - .2em);width:8px;height:8px;border-right:1px solid var(--ledger);border-bottom:1px solid var(--ledger);transform:rotate(45deg)}

/* ---- Dates: one line in brand ink. Today is the position; 13 November 2026 is
   the next point; 13 May 2027 is the larger milestone. */
.date-scale .past-line{stroke:var(--ledger)}
.date-scale .future-line{stroke:var(--ledger)}
.date-scale .mark{stroke:var(--ledger)}
.date-scale .mark.past{fill:var(--ledger)}
.date-scale .mark.major{stroke-width:3}
.date-scale .today{stroke:var(--ink);stroke-width:2}
.date-scale .today-t{fill:var(--ink)}
.date-scale .next-seg{stroke:var(--ledger);stroke-width:4}
.timeline.scale-list > li::before{border-color:var(--ledger)}
.timeline.scale-list > li.past::before{background:var(--ledger)}
.timeline.scale-list > li.major .when{font-size:30px;line-height:1.05}
.timeline.scale-list > li.major::before{width:18px;height:18px;border-width:3px;margin-bottom:calc(var(--s3) - 6px)}
.timeline.scale-list .tag{color:var(--ink-2)}
.timeline.scale-list > li.upcoming .tag{color:var(--ledger);font-weight:700}
.timeline.scale-list > li.past .tag{color:var(--ink-3);font-weight:500}

/* ---- What the free result contains: walked through in order, the number as
   the anchor. */
.contents.walk{display:block;columns:auto;counter-reset:walk;border-top:2px solid var(--ink);padding-top:0}
.contents.walk > li{counter-increment:walk;display:grid;grid-template-columns:5.5rem minmax(0,1fr);column-gap:var(--s5);padding:var(--s5) 0;border-bottom:1px solid var(--rule)}
.contents.walk > li::before{content:counter(walk,decimal-leading-zero);font-family:var(--head);font-weight:600;font-stretch:80%;font-size:56px;line-height:.85;color:var(--ledger);letter-spacing:-.02em}
.contents.walk > li > div{padding-top:4px}
.receive .contents.walk h3{display:block;font-size:22px;font-stretch:86%;margin:0 0 var(--s1)}
.receive .contents.walk p{display:block;font-size:16px;max-width:56ch}
.receive-grid > .sec-head{position:sticky;top:var(--s6);align-self:start}
@media (max-width:899px){.receive-grid > .sec-head{position:static}.contents.walk > li{grid-template-columns:3.5rem minmax(0,1fr)}.contents.walk > li::before{font-size:40px}}

/* ---- Worth saying plainly: one brand marker moves to the statement being read. */
.limits .claims{position:relative}
.limits .claims .focus-marker{position:absolute;left:-18px;top:0;width:3px;height:0;background:var(--ledger);opacity:0;transition:transform .35s cubic-bezier(.2,.7,.2,1),height .35s ease,opacity .2s ease;pointer-events:none}
.limits .claims .focus-marker.on{opacity:1}
.limits .claims .n{color:var(--ledger)}
@media (max-width:899px){.limits .claims .focus-marker{left:-10px}}
@media (prefers-reduced-motion: reduce){.limits .claims .focus-marker,.sector-index > li{transition:none}}
@media (min-width:900px){.limits .claims .focus-marker{left:calc((100% - var(--s7)) * .25 + var(--s7) / 2 - 1px)}}

/* ==========================================================================
   Product pages. Each is composed for its job.
   ========================================================================== */

/* sections that need the whole width drop the margin label column */
.arch-section .editorial,.flow-section .editorial{display:block}
.arch-section .rail,.flow-section .rail{margin-bottom:var(--s5)}
.arch-section .body,.flow-section .body{max-width:none}

/* ---- Platform: the path as the architecture. Six stations on one line; the
   product that carries each stretch of the path is bracketed beneath it. */
.journey.arch{border-top:0;counter-reset:j;position:relative}
@media (min-width:1000px){
  .journey.arch{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:0}
  .journey.arch::before{content:"";position:absolute;left:0;right:0;top:7px;border-top:2px solid var(--ledger)}
  .journey.arch > li{display:flex;flex-direction:column;align-items:stretch;padding:0;border:0;position:relative}
  .journey.arch > li::before{content:counter(j);order:-1;align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;box-sizing:border-box;margin-bottom:var(--s4);border:2px solid var(--ledger);background:var(--paper);font-size:0;color:transparent;position:relative;z-index:1}
  .journey.arch > li:nth-child(n+3)::before{background:linear-gradient(to top,var(--ledger) 50%,var(--paper) 50%)}
  .journey.arch > li:nth-child(n+5)::before{background:var(--ledger)}
  .journey.arch .step{font-size:clamp(22px,2.1vw,30px);line-height:1.05;font-stretch:82%;padding-right:var(--s5)}
  .journey.arch .step a{text-decoration:none;color:var(--ink)}
  .journey.arch .step a:hover,.journey.arch .step a:focus-visible{color:var(--ledger);text-decoration:underline;text-decoration-thickness:2px}
  .journey.arch .what{margin-top:var(--s3);padding-right:var(--s5);font-size:15px;color:var(--ink-2)}
  .journey.arch .avail{margin-top:auto;padding-top:var(--s5)}
  .journey.arch .avail{position:relative;font-family:var(--head);font-weight:600;font-size:15px;color:var(--ledger-deep)}
  .journey.arch .avail::before{content:"";display:block;height:10px;margin-bottom:var(--s2);border-top:1px solid var(--ledger);border-left:1px solid var(--ledger)}
  .journey.arch > li:last-child .avail::before,.journey.arch > li:has(+ li.g-start) .avail::before{border-right:1px solid var(--ledger);margin-right:var(--s4)}
  .journey.arch > li.g-cont .avail::before{border-left:0}
  .journey.arch > li.g-cont .avail{color:transparent}
  .journey.arch > li.g-cont .avail::before{color:initial}
}
@media (max-width:999px){
  .journey.arch > li{grid-template-columns:2rem minmax(0,1fr);row-gap:var(--s1)}
  .journey.arch .step,.journey.arch .what,.journey.arch .avail{grid-column:2}
}
.tools-section .ruled > li{display:grid;grid-template-columns:16rem minmax(0,1fr);column-gap:var(--s6);align-items:baseline;padding:var(--s5) 0}
.tools-section .ruled .item-title{font-size:28px;font-stretch:82%}
.tools-section .ruled .item-desc{margin:0;font-size:17px}
@media (max-width:700px){.tools-section .ruled > li{grid-template-columns:minmax(0,1fr)}.tools-section .ruled .item-desc{margin-top:var(--s2)}}
.defs.principles{display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:row dense;column-gap:var(--s7);row-gap:0;font-size:16px}
.defs.principles dt{grid-column:1;padding-top:var(--s4);border-top:2px solid var(--ink);font-family:var(--head);font-weight:600;font-stretch:88%;font-size:21px;color:var(--ink)}
.defs.principles dd{grid-column:1;padding:var(--s2) 0 var(--s6);color:var(--ink-2)}
.defs.principles dt:nth-of-type(even),.defs.principles dd:nth-of-type(even){grid-column:2}
@media (max-width:700px){.defs.principles{grid-template-columns:minmax(0,1fr)}.defs.principles dt:nth-of-type(even),.defs.principles dd:nth-of-type(even){grid-column:1}}

/* ---- DPDP Remediation: one gap moving through four states, left to right */
.numbered.flow{border-top:0;counter-reset:n}
@media (min-width:900px){
  .numbered.flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--s6);position:relative}
  .numbered.flow::after{content:"";position:absolute;left:0;right:0;top:27px;border-top:1px solid var(--ledger);z-index:0}
  .numbered.flow > li{display:block;padding:0;border:0;position:relative}
}
.numbered.flow > li::before{content:counter(n,decimal-leading-zero);display:inline-block;font-family:var(--head);font-weight:600;font-stretch:80%;font-size:54px;line-height:1;color:var(--ledger);background:var(--paper);padding-right:var(--s3);position:relative;z-index:1}
.numbered.flow > li > div{margin-top:var(--s4);padding-top:var(--s4);border-top:2px solid var(--ink)}
.numbered.flow > li:last-child > div{border-top-color:var(--ledger)}
.numbered.flow h3{font-size:22px;font-stretch:84%}
.numbered.flow p{font-size:15.5px}
.numbered.flow .ref{display:inline-block;padding:0 4px;background:var(--ledger-tint);color:var(--ledger-deep);font-weight:600}
@media (max-width:899px){.numbered.flow > li{display:block;padding:var(--s5) 0;border-bottom:0}.numbered.flow > li::before{font-size:40px}}
.state-note{font-size:21px;line-height:1.5;max-width:44ch;color:var(--ink)}

/* ---- Registers on product pages: operational sheets */
.sheet .table-wrap{border-top:3px solid var(--ink)}
.sheet table.register thead th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);background:transparent;border-bottom:1px solid var(--ink)}
.sheet table.register td{vertical-align:baseline}
.sheet table.register .title{font-weight:600;font-size:16px;color:var(--ink)}
.sheet .overdue{color:var(--sev-critical);font-weight:700}
.sheet .overdue::before{content:"";display:inline-block;width:8px;height:8px;margin-right:6px;background:var(--sev-critical);vertical-align:1px}
.behaviours{border-top:2px solid var(--ink)}
@media (min-width:900px){.behaviours{columns:2;column-gap:var(--s7)}.behaviours > li{break-inside:avoid}}
.behaviours strong{display:block;font-family:var(--head);font-weight:600;font-stretch:88%;font-size:19px;color:var(--ink);margin-bottom:2px}

/* ---- Evidence Room: each row reads as a chain, evidence to control to date to state */
@media (min-width:900px){
  table.proof td:nth-child(3),table.proof td:nth-child(5),table.proof td:nth-child(6){position:relative;padding-left:28px}
  table.proof td:nth-child(3)::before,table.proof td:nth-child(5)::before,table.proof td:nth-child(6)::before{content:"\2192" / "";position:absolute;left:6px;color:var(--ledger);font-weight:600}
  table.proof td:nth-child(3){font-weight:600;color:var(--ledger-deep)}
  table.proof td:nth-child(4){color:var(--ink-3);font-size:14px}
}
table.proof tr:has(.chip-review_due) td:nth-child(5),table.proof tr:has(.review_due) td:nth-child(5){color:var(--sev-medium-ink);font-weight:700}

/* ---- Verified Assessment: a review, step by step, and the sentence it ends in */
.numbered.review{border-top:0;position:relative}
.numbered.review > li{border-bottom:0;padding:0 0 var(--s6);grid-template-columns:3rem minmax(0,1fr)}
.numbered.review > li::before{content:counter(n);display:flex;align-items:center;justify-content:center;width:30px;height:30px;box-sizing:border-box;border:2px solid var(--ledger);background:var(--paper);font-weight:700;color:var(--ledger);line-height:1;position:relative;z-index:1}
.numbered.review > li:last-child::before{background:var(--ledger);color:#fff}
.numbered.review::before{content:"";position:absolute;left:14px;top:30px;bottom:var(--s6);border-left:1px solid var(--ledger)}
.numbered.review h3{font-size:21px;font-stretch:86%}
blockquote.verdict{margin:var(--s5) 0 0;padding:var(--s6) 0 var(--s6) var(--s6);border-left:4px solid var(--ledger);background:none}
blockquote.verdict p{font-family:var(--head);font-weight:500;font-stretch:90%;font-size:clamp(22px,2.4vw,30px);line-height:1.35;color:var(--ink);max-width:36ch}
blockquote.verdict .field{background:var(--ledger-tint);color:var(--ledger-deep);padding:0 .15em;box-decoration-break:clone;-webkit-box-decoration-break:clone;font-weight:600}

/* ---- Continuous Assurance: the checks set out by how soon they matter */
table.clock tbody tr td:first-child{box-shadow:inset 4px 0 0 var(--rule-strong);padding-left:var(--s5)}
table.clock tr.t-overdue td:first-child{box-shadow:inset 4px 0 0 var(--sev-critical)}
table.clock tr.t-soon td:first-child{box-shadow:inset 4px 0 0 var(--sev-medium)}
table.clock tr.t-law td:first-child{box-shadow:inset 4px 0 0 var(--info)}
table.clock tr.t-again td:first-child{box-shadow:inset 4px 0 0 var(--done)}
table.clock td.title{font-family:var(--head);font-weight:600;font-stretch:88%;font-size:19px;width:34%}
@media (max-width:899px){table.clock.stackable tr{box-shadow:inset 4px 0 0 var(--rule-strong)}table.clock.stackable tr.t-overdue{box-shadow:inset 4px 0 0 var(--sev-critical)}table.clock.stackable tr.t-soon{box-shadow:inset 4px 0 0 var(--sev-medium)}table.clock.stackable tr.t-law{box-shadow:inset 4px 0 0 var(--info)}table.clock.stackable tr.t-again{box-shadow:inset 4px 0 0 var(--done)}}

/* ---- Reports: five outputs, each named large for the question it answers */
.numbered.outputs{border-top:3px solid var(--ink)}
.numbered.outputs > li{grid-template-columns:minmax(0,1fr);padding:var(--s5) 0}
.numbered.outputs > li::before{display:none}
@media (min-width:900px){.numbered.outputs > li > div{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--s6);align-items:baseline}}
.numbered.outputs h3{font-size:clamp(24px,2.4vw,32px);line-height:1.08;font-stretch:80%}
.numbered.outputs p{margin-top:var(--s2);font-size:16px}
.numbered.outputs .meta{display:block;margin-top:var(--s2);font-weight:600;color:var(--ledger-deep)}

/* ---- Pricing: four stages of work, one after the other */
.tiers.stages{display:block;position:relative;border-top:2px solid var(--ink)}
.tiers.stages > .tier{display:grid;grid-template-columns:3rem minmax(0,15rem) minmax(0,1fr) minmax(0,15rem);column-gap:var(--s5);align-items:start;padding:var(--s6) 0;border-top:0;border-bottom:1px solid var(--rule);position:relative}
.tiers.stages > .tier::before{content:"";grid-column:1;grid-row:1 / span 6;width:16px;height:16px;margin-top:8px;box-sizing:border-box;border:2px solid var(--ledger);background:var(--paper);position:relative;z-index:1}
.tiers.stages > .tier:nth-child(2)::before{background:linear-gradient(to top,var(--ledger) 50%,var(--paper) 50%)}
.tiers.stages > .tier:nth-child(3)::before{background:linear-gradient(to top,var(--ledger) 75%,var(--paper) 75%)}
.tiers.stages > .tier:nth-child(4)::before{background:var(--ledger)}
.tiers.stages > .tier:not(:last-child)::after{content:"";position:absolute;left:7px;top:calc(var(--s6) + 24px);bottom:calc(-1 * var(--s6) - 8px);border-left:1px solid var(--ledger)}
.tiers.stages > .tier > h3{grid-column:2;grid-row:1;font-size:clamp(24px,2.3vw,30px);line-height:1.05;font-stretch:82%}
.tiers.stages > .tier > .price{grid-column:2;grid-row:2;margin-top:var(--s2);font-size:18px}
.tiers.stages > .tier > .who{grid-column:3;grid-row:1;font-size:17px;color:var(--ink)}
.tiers.stages > .tier > ul{grid-column:3;grid-row:2 / span 3;margin-top:var(--s3)}
.tiers.stages > .tier > .meta{grid-column:4;grid-row:1;font-size:14px}
.tiers.stages > .tier > .go{grid-column:4;grid-row:2;margin-top:var(--s3)}
@media (max-width:899px){
  .tiers.stages > .tier{grid-template-columns:2.25rem minmax(0,1fr)}
  .tiers.stages > .tier > *{grid-column:2!important;grid-row:auto!important}
  .tiers.stages > .tier::before{grid-row:1 / span 2}
}
.pay-note{background:none;border:0;border-top:1px solid var(--rule-strong);border-radius:0;padding:var(--s3) 0 0;font-size:15px;color:var(--ink-2)}
.pay-note strong{color:var(--ink)}
.sheet{margin-left:0;margin-right:0}
@media (min-width:1024px){.editorial .sheet{margin-left:calc(-180px - var(--s7))}}
table.proof tr:has(.chip.sev-medium) td:nth-child(5){color:var(--sev-medium-ink);font-weight:700}
.alert.pay-note{background:none;border:0;border-top:1px solid var(--rule-strong);border-radius:0;padding:var(--s3) 0 0}

/* ==========================================================================
   Reference pages: a library, field guides and readable long text.
   ========================================================================== */

/* ---- Resources: four shelves */
@media (min-width:900px){
  .pg-resources .editorial .body{max-width:none}
  .shelves{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--s7);margin-top:var(--s6)}
}
.shelf > h2{margin-top:var(--s6)!important;padding-top:var(--s3);border-top:3px solid var(--ink);font-size:14px;font-family:var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--ledger-deep)}
.shelf .ruled{border-top:0}
.shelf .ruled .item-title{font-size:23px;font-stretch:84%}
.shelf .ruled .item-title:hover{color:var(--ledger);text-decoration:underline}
.shelf-official > p{font-size:15px;color:var(--ink-2)}
.shelf-official .ruled .item-title{font-size:19px;font-family:var(--sans);font-weight:600}
.shelf-official .ruled .item-title::after{content:" \2197" / "";color:var(--ink-3);font-weight:400}

/* ---- Industry guides: a numbered library index */
.guide-index{counter-reset:g;border-top:3px solid var(--ink)}
.guide-index > li{counter-increment:g;display:grid;grid-template-columns:3.5rem minmax(0,1fr);column-gap:var(--s4);padding:var(--s5) 0}
.guide-index > li::before{content:counter(g,decimal-leading-zero);grid-row:1 / span 3;font-family:var(--head);font-weight:600;font-stretch:80%;font-size:30px;line-height:1;color:var(--ledger)}
.guide-index .item-title{font-size:27px;font-stretch:82%}
.guide-index .item-title:hover{color:var(--ledger);text-decoration:underline}
.guide-index .meta{color:var(--ledger-deep);font-weight:600}
@media (min-width:1100px){
  .pg-industry-guides .editorial .body{max-width:none}
  .guide-index > li{grid-template-columns:3.5rem minmax(0,5fr) minmax(0,6fr);align-items:baseline}
  .guide-index > li > .item-title{grid-column:2;grid-row:1 / span 2}
  .guide-index > li > .item-desc{grid-column:3;margin:0}
  .guide-index > li > .meta{grid-column:3}
}

/* ---- Field guides: contents bar that stays with the reader */
.toc-bar{position:sticky;top:0;z-index:30;background:var(--paper);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.toc-bar .toc-list{display:flex;flex-wrap:nowrap;gap:0;overflow-x:auto;scrollbar-width:thin;font-size:14.5px;-webkit-overflow-scrolling:touch}
.toc-bar .toc-list li{flex:none}
.toc-bar .toc-list a{display:flex;align-items:center;min-height:46px;padding:0 var(--s3);color:var(--ink-2);text-decoration:none;border-bottom:3px solid transparent;white-space:nowrap}
.toc-bar .toc-list li:first-child a{padding-left:0}
.toc-bar .toc-list a:hover{color:var(--ink)}
.toc-bar .toc-list a[aria-current="location"]{color:var(--ledger-deep);font-weight:600;border-bottom-color:var(--ledger)}
.pg-vertical [id]{scroll-margin-top:64px}

/* ---- Long reference text: contents held in the margin, current section marked */
@media (min-width:1024px){
  .editorial .rail:has(ol.ruled){position:sticky;top:var(--s5);align-self:start;max-height:calc(100vh - 48px);overflow:auto}
}
.rail ol.ruled{border-top:0}
.rail ol.ruled > li{padding:var(--s2) 0;border-bottom:0;border-left:2px solid var(--rule);padding-left:var(--s3)}
.rail ol.ruled a{color:var(--ink-2);text-decoration:none;display:block;line-height:1.35}
.rail ol.ruled a:hover{color:var(--ink);text-decoration:underline}
.rail ol.ruled li:has(a[aria-current="location"]){border-left-color:var(--ledger)}
.rail ol.ruled a[aria-current="location"]{color:var(--ledger-deep);font-weight:600}
.prose h2{margin-top:var(--s7);padding-top:var(--s4);border-top:1px solid var(--rule-strong);font-size:26px;line-height:1.15;scroll-margin-top:var(--s5)}
.prose h3{margin-top:var(--s5)}
.prose{max-width:70ch}
.pg-privacy .prose,.pg-terms .prose{max-width:66ch;font-size:17.5px;line-height:1.7}
.pg-privacy .prose > .meta:first-of-type,.pg-terms .prose > .meta:first-of-type{display:inline-block;margin-top:var(--s4);padding:var(--s2) var(--s3);border-left:3px solid var(--ledger);background:var(--ledger-tint);color:var(--ink);font-size:14.5px}
@media (max-width:599px){.prose h2{font-size:23px}.pg-privacy .prose,.pg-terms .prose{font-size:17px}}

/* ---- About: the reason, said once and large */
.pg-about .section.tight:first-of-type .lede{font-family:var(--head);font-weight:500;font-stretch:92%;font-size:clamp(24px,2.7vw,34px);line-height:1.28;color:var(--ink);max-width:38ch}
.pg-about .prose p:first-child{font-size:19px}

/* ---- Contact: plain and human. One column of fields, the same width. */
.pg-contact .section.tight:first-of-type .lede{font-family:var(--head);font-weight:500;font-stretch:92%;font-size:clamp(22px,2.4vw,30px);line-height:1.3;color:var(--ink);max-width:36ch}
.pg-contact form.form{border-top:3px solid var(--ledger);padding-top:var(--s5);max-width:34rem}
.pg-contact form.form input[type=text],.pg-contact form.form input[type=email],.pg-contact form.form input[type=tel],.pg-contact form.form select,.pg-contact form.form textarea{width:100%;max-width:none;box-sizing:border-box}

/* ---- Readiness check: the context reads as a label, not a pill */
.a-header{border-bottom:1px solid var(--rule)}
.a-header .context{background:none;border:0;border-bottom:2px solid var(--ledger);border-radius:0;padding:4px 0;color:var(--ink)}
@media (max-width:600px){.a-header .context{border-radius:0;padding:2px 0 4px;text-align:left;flex-basis:auto}}

/* ---- Workspace: dated items read as a schedule; links are the item, not a wall of underline */
.upcoming-list > li{display:grid;grid-template-columns:5.5rem minmax(0,1fr);column-gap:var(--s3);align-items:baseline}
.upcoming-list > li > br{display:none}
.upcoming-list .num{font-family:var(--head);font-weight:600;font-stretch:96%;font-size:15px;color:var(--ledger-deep)}
.upcoming-list a{color:var(--ink);text-decoration:none;font-size:15px;line-height:1.45}
.upcoming-list a:hover,.upcoming-list a:focus-visible{color:var(--ledger);text-decoration:underline}
@media (max-width:899px){button[data-filter]{min-height:44px}}