/* DRIVE™ Scorecard: editorial report.
   Layout concept: a printed report on white paper. Navy is the ink of authority (covers, rules, numerals);
   the brand's pale blue-grey (#f4f7fb) marks asides; gold is reserved for scores.
   Type: Newsreader (editorial serif with optical sizes) for reading and display; Manrope for labels and controls. */
@font-face{font-family:"Manrope";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/manrope-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/manrope-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/manrope-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/manrope-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:800;font-display:swap;src:url(fonts/manrope-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/newsreader-latin-opsz-normal.woff2) format("woff2-variations"),url(fonts/newsreader-latin-opsz-normal.woff2) format("woff2")}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:200 800;font-display:swap;src:url(fonts/newsreader-latin-opsz-italic.woff2) format("woff2-variations"),url(fonts/newsreader-latin-opsz-italic.woff2) format("woff2")}

:root{
  /* NeuroAIQ brand colours (unchanged) */
  --navy:#14315f; --sky:#38b6ff; --cta:#1a8fe3; --ink:#0c1f3d; --brand-bg:#f4f7fb; --gauge-a:#f7c860; --gauge-b:#ee9141;
  /* roles */
  --paper:#ffffff; --panel:var(--brand-bg); --text:#1f2e48; --muted:#56657e; --faint:#7a879c;
  --rule:#d7dee8; --rule-strong:#9aabc3; --on-cta:#ffffff;
  --on-navy:#ffffff; --on-navy-2:#c5d0e1; --navy-rule:rgba(255,255,255,.18);
  --link:#0b6aae; --gold:#8f701a; /* audit #3: deeper gold, as in the PDF (4.7:1) */ --attention:#a5461d;
  --serif:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Manrope","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --measure:38rem;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0b1830; --panel:#112445; --ink:#eef3fb; --text:#d3dbe8; --muted:#a3b0c6; --faint:#8592a8;
    --rule:#22385c; --rule-strong:#4f6790; --link:#7cd0ff; --gold:#e2c26a; --attention:#f29a72; color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --paper:#0b1830; --panel:#112445; --ink:#eef3fb; --text:#d3dbe8; --muted:#a3b0c6; --faint:#8592a8;
  --rule:#22385c; --rule-strong:#4f6790; --link:#7cd0ff; --gold:#e2c26a; --attention:#f29a72; color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body{margin:0;background:var(--paper);color:var(--text);font:400 1.0625rem/1.6 var(--sans)}
img,video{max-width:100%}
h1,h2,h3,h4,p,ol,ul,figure{margin:0}
ol,ul{padding:0;list-style:none}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.08;letter-spacing:-.015em;text-wrap:balance;color:var(--ink);font-optical-sizing:auto}
p{text-wrap:pretty}
a{color:var(--link);text-underline-offset:3px;text-decoration-thickness:1px}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--link);outline-offset:3px}
.skip{position:absolute;left:-9999px;top:0;background:var(--paper);padding:.75rem 1rem;z-index:10}
.skip:focus{left:1rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.wrap{max-width:74rem;margin-inline:auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
@media (min-width:700px){.wrap{padding-left:max(48px,env(safe-area-inset-left,0px));padding-right:max(48px,env(safe-area-inset-right,0px))}}
.narrow{max-width:44rem}
.stack{display:flex;flex-direction:column}
.g06{gap:.6rem}.g14{gap:1.4rem}.g16{gap:1.6rem}
.eyebrow,.label{font:600 .75rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.small{font-size:.9375rem;color:var(--muted)}
.fine{font-size:.875rem;line-height:1.5;color:var(--muted)} /* audit #2: was --faint (3.6:1) */

/* masthead: a thin printed header */
.top{background:var(--paper);border-bottom:1px solid var(--ink)}
.top .wrap{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-block:1.1rem .9rem}
.top .name{font:700 .875rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--ink)}
.top .tool{font:400 1rem/1 var(--serif);font-style:italic;color:var(--muted)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.8rem;min-height:54px;padding:.65rem 1.65rem;border-radius:0;border:1px solid transparent;
  font:600 .9375rem/1.2 var(--sans);letter-spacing:.04em;cursor:pointer;text-align:center;text-decoration:none;transition:background-color .2s,border-color .2s,color .2s}
.btn-primary{background:var(--cta);color:var(--on-cta)}
.btn-primary::after{content:"";width:1.1rem;height:.7rem;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12'%3E%3Cpath d='M0 6h16M11 1l5 5-5 5' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12'%3E%3Cpath d='M0 6h16M11 1l5 5-5 5' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .2s}
.btn-primary:hover{background:var(--navy)}
.hero .btn-primary:hover,.rz-end .btn-primary:hover{background:#fff;color:var(--navy)}
.btn-primary:hover::after{transform:translateX(4px)}
.btn-quiet{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn-quiet:hover{background:var(--ink);color:var(--paper)}
.btn[disabled]{opacity:.35;cursor:not-allowed}
.btn[disabled]::after{display:none}
.linkbtn{background:none;border:0;padding:.5rem 0;min-height:44px;color:var(--link);text-decoration:underline;cursor:pointer;font-weight:600}

/* ---------- landing: the report cover ---------- */
.hero{position:relative;overflow:hidden;background:var(--navy);color:var(--on-navy)}
.hero::before{content:"";position:absolute;right:-16rem;top:50%;width:56rem;height:56rem;transform:translateY(-50%);pointer-events:none;opacity:.55;
  background:repeating-radial-gradient(circle at center,transparent 0 52px,rgba(255,255,255,.05) 52px 53px)}
.hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(2.5rem,6vw,6rem);align-items:end;padding-block:clamp(4rem,10vw,8rem) clamp(3.5rem,8vw,6.5rem)}
.hero h1{font-size:clamp(3rem,7.4vw,6rem);line-height:.98;font-weight:420;letter-spacing:-.025em;color:var(--on-navy)}
.hero h1 em{display:block;font-style:italic;font-weight:380;color:var(--sky)}
.hero .lede{font:600 .8125rem/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gauge-a)}
.hero .sub{font:400 clamp(1.3rem,2.4vw,1.6rem)/1.4 var(--serif);color:var(--on-navy-2);max-width:31rem}
.hero .copy{gap:1.6rem;align-items:flex-start;min-width:0}
.hero .cta{margin-top:1rem}
.hero :focus-visible,.rhero :focus-visible,.rz-end :focus-visible,.lead :focus-visible{outline-color:#fff}
.example{background:var(--paper);color:var(--text);padding:1.6rem 1.75rem 1.35rem;gap:1rem;min-width:0;border-top:3px solid var(--gauge-a)}
.example .eyebrow{color:var(--muted)}

.sec{padding-block:clamp(4.5rem,10vw,8rem)}
.sec + .sec{border-top:1px solid var(--rule)}
.sec h2{font-size:clamp(2.1rem,4.6vw,3.4rem);max-width:48rem;font-weight:420}
.sec-measures{background:var(--panel)}
.measures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.5rem 3.5rem;margin-block:3.5rem 3rem}
.measures li{border-top:1px solid var(--ink);padding-top:1.4rem;display:flex;flex-direction:column;gap:.75rem;min-width:0}
.measures .m-n{font:300 3.5rem/1 var(--serif);font-style:italic;color:var(--navy)}
.measures h3{font-size:2rem;font-weight:450}
.measures p{font:400 1.125rem/1.55 var(--serif);color:var(--muted)}
.closing{font:400 clamp(1.5rem,3vw,2.1rem)/1.3 var(--serif);font-style:italic;color:var(--ink);max-width:40rem}
.lp-cta{margin-top:2.5rem}

.author{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:2.5rem 4.5rem;align-items:center}
.author.no-video{grid-template-columns:minmax(0,1fr);max-width:46rem}
.author .bio{gap:.9rem}
.author .bio h2{font-size:clamp(2.4rem,5vw,3.6rem);font-weight:420}
.role{font:600 .8125rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.author .bio > p:not(.role){font:400 1.25rem/1.5 var(--serif);color:var(--text)}
.creds{display:grid;margin-top:.75rem;border-top:1px solid var(--ink)}
.creds li{padding:.75rem 0;border-bottom:1px solid var(--rule);color:var(--muted);font-size:.9375rem;line-height:1.45}
.vid{display:grid;min-width:0}
.vid video{width:100%;aspect-ratio:16/9;background:#000}
.vid-ph{aspect-ratio:16/9;max-width:100%;background:var(--navy);color:var(--on-navy-2);display:grid;place-items:center;align-content:center;gap:1rem;padding:1rem;text-align:center;font-size:.875rem;letter-spacing:.02em}
.vid-play{width:4.75rem;height:4.75rem;border-radius:50%;border:1px solid rgba(255,255,255,.55);position:relative}
.vid-play::after{content:"";position:absolute;left:53%;top:50%;transform:translate(-50%,-50%);border-left:1.1rem solid #fff;border-top:.7rem solid transparent;border-bottom:.7rem solid transparent}

.boe{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem 5rem;align-items:center;margin-top:2.5rem}
.boe-text{gap:1.1rem;max-width:36rem;font:400 1.1875rem/1.6 var(--serif);color:var(--muted)}
.pull{font:400 clamp(1.75rem,3.6vw,2.6rem)/1.2 var(--serif);font-style:italic;color:var(--ink);border-top:1px solid var(--ink);padding-top:1.25rem}
@media (min-width:821px){ .boe{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)} }

/* LEAD™ figure */
.lead{margin:clamp(3rem,7vw,4.5rem) 0 0;background:var(--navy);color:var(--on-navy);padding:clamp(1.9rem,5vw,3.5rem);
  --c-l:var(--sky);--c-e:color-mix(in srgb,var(--sky) 70%,var(--gauge-a));--c-a:color-mix(in srgb,var(--sky) 38%,var(--gauge-a));
  --c-d:var(--gauge-a);--c-v:var(--gauge-b);--mark:4rem}
.lead figcaption{font:400 clamp(1.6rem,3.4vw,2.3rem)/1.2 var(--serif);font-style:italic;max-width:34rem;margin-bottom:clamp(2rem,5vw,3.25rem);color:var(--on-navy)}
.lead-steps{display:grid;grid-template-columns:minmax(0,1fr)}
.ls{--c:var(--c-l);--n:var(--c-e);position:relative;display:grid;grid-template-columns:var(--mark) minmax(0,1fr);gap:1.1rem;align-items:center;padding-bottom:1.75rem;min-width:0}
.ls-e{--c:var(--c-e);--n:var(--c-a)} .ls-a{--c:var(--c-a);--n:var(--c-d)} .ls-d{--c:var(--c-d);--n:var(--c-v)} .ls-v{--c:var(--c-v);padding-bottom:0}
.ls-mark{position:relative;z-index:1;width:var(--mark);height:var(--mark);border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--c);color:var(--c);background:var(--navy);font:400 2rem/1 var(--serif)}
.ls-v .ls-mark{border:0;color:var(--navy);background:linear-gradient(135deg,var(--gauge-a),var(--gauge-b))}
.ls-text{display:grid;gap:.25rem;min-width:0}
.ls-name{font:500 1.25rem/1.2 var(--serif);color:var(--on-navy)}
.ls-does{font:400 1rem/1.4 var(--serif);font-style:italic;color:var(--on-navy-2)}
.ls-v .ls-name{font-size:1.45rem;color:var(--gauge-a)}
.ls:not(.ls-v)::before{content:"";position:absolute;left:calc(var(--mark) / 2 - .5px);top:calc(50% - .875rem);height:100%;width:1px;background:linear-gradient(180deg,var(--c),var(--n))}
@media (min-width:860px){
  .lead-steps{grid-template-columns:repeat(5,minmax(0,1fr))}
  .ls{grid-template-columns:minmax(0,1fr);align-items:start;gap:1.25rem;padding:0 1.25rem 0 0}
  .ls:not(.ls-v)::before{left:var(--mark);top:calc(var(--mark) / 2);width:calc(100% - var(--mark));height:1px;background:linear-gradient(90deg,var(--c),var(--n))}
  .ls:not(.ls-v)::after{content:"";position:absolute;right:.15rem;top:calc(var(--mark) / 2 - 4px);width:8px;height:8px;border-top:1px solid var(--n);border-right:1px solid var(--n);transform:rotate(45deg)}
}

/* ---------- details form ---------- */
.screen{padding-block:clamp(3rem,7vw,5rem) clamp(4rem,9vw,6.5rem)}
.screen h1{font-size:clamp(2.4rem,6vw,3.6rem);font-weight:420}
h1:focus{outline:none}
.field{gap:.5rem}
.field label{font:600 .75rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.field input[type=text],.field input[type=email],.field select,textarea{width:100%;min-height:52px;padding:.7rem .85rem;background:var(--panel);border:0;border-bottom:1px solid var(--rule-strong);border-radius:4px 4px 0 0; /* audit #9: shaded box so empty fields are easy to spot */
  font:400 1.25rem/1.3 var(--serif);color:var(--ink);transition:border-color .2s,box-shadow .2s}
textarea{padding:.8rem;border:1px solid var(--rule-strong);font-size:1.0625rem;line-height:1.5;min-height:9rem;resize:vertical}
.field input:hover,textarea:hover{border-color:var(--ink)}
.field input:focus,textarea:focus{outline:none;border-color:var(--link);box-shadow:0 1px 0 var(--link)}
.two{display:grid;grid-template-columns:minmax(0,1fr);gap:1.6rem}
@media (min-width:560px){.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem}}
.err{color:var(--attention);font-size:.9375rem;font-weight:600}
.field [aria-invalid="true"]{border-color:var(--attention);box-shadow:0 1px 0 var(--attention)}
.check{display:flex;gap:.85rem;align-items:flex-start;line-height:1.5;font-size:.9375rem;color:var(--muted)}
.check input{width:1.5rem;height:1.5rem;margin:.15rem 0 0;flex:none;accent-color:var(--navy)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formerr{border-left:2px solid var(--attention);padding:.5rem 1rem;color:var(--attention);font-weight:600}
.pnote{gap:.45rem;background:var(--panel);padding:1.25rem 1.4rem;font:400 1rem/1.55 var(--serif);color:var(--muted)}
.pnote-h{font:600 .75rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}

/* ---------- questions ---------- */
.track .bar{display:block;height:1px;background:var(--rule);overflow:visible}
.track .bar i{display:block;height:3px;margin-top:-1px;width:0;background:var(--navy);transition:width .35s ease}
.count{font:600 .75rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-variant-numeric:tabular-nums}
#qh{font-size:clamp(2.1rem,5.6vw,3.25rem);line-height:1.1;font-weight:420}
.helper{font:400 1.25rem/1.45 var(--serif);font-style:italic;color:var(--muted)}
.opts{gap:0;border-top:1px solid var(--rule)}
.opt{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1.25rem;width:100%;min-height:64px;padding:1.05rem .25rem 1.05rem 0;background:transparent;
  border:0;border-bottom:1px solid var(--rule);text-align:left;font:400 1.25rem/1.35 var(--serif);color:var(--ink);cursor:pointer;transition:padding .2s,color .2s}
.opt:hover{padding-left:.6rem}
.opt .tick{flex:none;width:1.3rem;height:1.3rem;border:1px solid var(--rule-strong);border-radius:50%;transition:all .2s}
.opt[aria-pressed="true"]{padding-left:.9rem;box-shadow:inset 3px 0 0 var(--navy)}
.opt[aria-pressed="true"] .tick{border-color:var(--navy);background:radial-gradient(circle,var(--navy) 0 42%,transparent 46%)}
.opt.dk{font:500 .9375rem/1.3 var(--sans);letter-spacing:.02em;color:var(--muted);border-bottom:0;margin-top:.5rem;min-height:52px}
.opt.dk[aria-pressed="true"]{color:var(--ink)}
.navrow{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}

/* ---------- results: cover ---------- */
#s-result{background:var(--paper)}
.rhero{background:var(--navy);color:var(--on-navy);position:relative;overflow:hidden}
.rhero::before{content:"";position:absolute;right:-20rem;top:-12rem;width:52rem;height:52rem;pointer-events:none;opacity:.5;
  background:repeating-radial-gradient(circle at center,transparent 0 52px,rgba(255,255,255,.05) 52px 53px)}
.rhero .wrap{position:relative;padding-block:clamp(3.5rem,8vw,6.5rem) clamp(3rem,7vw,5rem);display:grid;gap:1.75rem}
.rz-brand{font:600 .75rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gauge-a)}
.rhero h1{font-size:clamp(3.2rem,9vw,6rem);line-height:.95;font-weight:400;font-style:italic;color:var(--on-navy)}
.rz-intro{gap:.6rem;max-width:38rem;font:400 clamp(1.2rem,2.3vw,1.45rem)/1.45 var(--serif)}
.rz-intro p:last-child{color:var(--on-navy-2)}
.overview{display:grid;grid-template-columns:minmax(0,1fr);border-top:1px solid var(--navy-rule);max-width:62rem;margin-top:1rem}
.overview li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:.4rem 1rem;padding:1.1rem 0;border-bottom:1px solid var(--navy-rule)}
.overview a,.overview .ovn{color:inherit;text-decoration:none;font:600 .75rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase}
.overview a:hover{text-decoration:underline}
.overview .pc{font:300 clamp(2.8rem,7vw,4rem)/1 var(--serif);font-variant-numeric:lining-nums tabular-nums;color:var(--on-navy)}
.overview .na{font:400 1.2rem/1.3 var(--serif);font-style:italic;color:var(--on-navy-2)}
.overview .scale{grid-column:1 / -1}
@media (min-width:760px){
  .rhero .overview{grid-template-columns:repeat(3,minmax(0,1fr));border-top:0;gap:0 3rem}
  .rhero .overview li{grid-template-columns:minmax(0,1fr);border-bottom:0;border-top:1px solid var(--navy-rule);padding-top:1.3rem;align-content:start}
}
.scale{position:relative;display:block;height:2px;background:var(--rule);overflow:hidden;margin-top:.4rem}
.rhero .scale{background:var(--navy-rule)}
.scale .fill{position:absolute;top:0;bottom:0;left:0;width:0;background:linear-gradient(90deg,var(--gauge-a),var(--gauge-b))}
.example .overview{border-top-color:var(--rule);margin-top:0}
.example .overview li{border-bottom-color:var(--rule);padding:.9rem 0}
.example .overview .pc{color:var(--ink);font-size:2.4rem}

#rbody{gap:clamp(2.5rem,5vw,3.5rem)}
.rz-h2{font:600 .75rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

/* category tabs (one category shows at a time) */
.rtabs{position:sticky;top:0;z-index:5;display:flex;gap:clamp(.5rem,3vw,2.5rem);background:color-mix(in srgb,var(--paper) 94%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--rule);margin-inline:calc(-1 * max(20px,env(safe-area-inset-left,0px)));padding-inline:max(20px,env(safe-area-inset-left,0px))}
.rtabs [role=tab]{display:flex;align-items:baseline;gap:.5rem;padding:.95rem 0;min-height:52px;background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;color:var(--muted);cursor:pointer}
.rtabs [role=tab][aria-selected=true]{color:var(--ink);border-bottom-color:var(--navy)}
.rtabs [role=tab]:hover{color:var(--ink)}
.rt-n{font:700 .75rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.rt-v{font:400 1.3rem/1 var(--serif);color:inherit;font-variant-numeric:lining-nums tabular-nums}
@media (min-width:700px){.rtabs{margin-inline:calc(-1 * max(48px,env(safe-area-inset-left,0px)));padding-inline:max(48px,env(safe-area-inset-left,0px))}}
@media (max-width:520px){.rtabs{justify-content:space-between}.rt-n{font-size:.6875rem;letter-spacing:.08em}.rt-v{font-size:1.0625rem}}

/* ---------- results: one category, following the LEAD™ logic ---------- */
#s-result .screen{background:var(--panel)}
.sc-list{display:grid}
.sc{display:grid;gap:1.6rem;background:var(--paper);border-radius:8px;padding:clamp(1.5rem,5vw,3.25rem);max-width:52rem;margin-inline:auto;width:100%;scroll-margin-top:4.5rem;
  box-shadow:0 1px 2px rgba(12,31,61,.06),0 12px 32px -20px rgba(12,31,61,.25)}
.sc-k{font:700 .75rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--link)}
.sc-title{font:500 clamp(1.4rem,3.8vw,1.95rem)/1.2 var(--serif);color:var(--ink);letter-spacing:-.01em;text-wrap:balance}
/* v34 percentage header: name, percentage underneath, tick gauge on the right */
.sc-head{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;background:var(--navy);color:#fff;margin:calc(-1 * clamp(1.5rem,5vw,3.25rem)) calc(-1 * clamp(1.5rem,5vw,3.25rem)) 0;padding:clamp(1.4rem,4.5vw,2.4rem) clamp(1.5rem,5vw,3.25rem);border-radius:8px 8px 0 0}
.sc-name{font:800 clamp(1.7rem,4.6vw,2.2rem)/1.1 var(--sans);letter-spacing:-.02em;color:#fff}
.sc-head .sc-pc{margin-top:.25rem;font:500 clamp(2.2rem,6.5vw,2.8rem)/1 var(--sans);letter-spacing:-.02em;color:var(--gauge-a);font-variant-numeric:tabular-nums}
.sc-head .sc-mini{flex:none;width:clamp(6.5rem,24vw,9.5rem)}
.gauge .g-off{stroke:rgba(255,255,255,.18)}.gauge .g-needle{fill:#9fb3d6}.gauge .g-hole{fill:var(--navy)}
.gauge .m0{stroke:var(--gauge-a)}.gauge .m1{stroke:color-mix(in srgb,var(--gauge-b) 10%,var(--gauge-a))}.gauge .m2{stroke:color-mix(in srgb,var(--gauge-b) 20%,var(--gauge-a))}
.gauge .m3{stroke:color-mix(in srgb,var(--gauge-b) 30%,var(--gauge-a))}.gauge .m4{stroke:color-mix(in srgb,var(--gauge-b) 40%,var(--gauge-a))}.gauge .m5{stroke:color-mix(in srgb,var(--gauge-b) 50%,var(--gauge-a))}
.gauge .m6{stroke:color-mix(in srgb,var(--gauge-b) 60%,var(--gauge-a))}.gauge .m7{stroke:color-mix(in srgb,var(--gauge-b) 70%,var(--gauge-a))}.gauge .m8{stroke:color-mix(in srgb,var(--gauge-b) 80%,var(--gauge-a))}
.gauge .m9{stroke:color-mix(in srgb,var(--gauge-b) 90%,var(--gauge-a))}.gauge .m10{stroke:var(--gauge-b)}
.sc-pc{font:300 clamp(4rem,13vw,5.75rem)/.85 var(--serif);color:var(--ink);letter-spacing:-.03em;font-variant-numeric:lining-nums tabular-nums}
.sc-mini{flex:none;width:clamp(6.5rem,24vw,9rem);margin-bottom:.2rem}
/* band title (#169), then the band text */
.sc-band{font:700 .8125rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--link);margin-bottom:-1rem}
.sc-na-t{font:400 clamp(1.9rem,6vw,2.5rem)/1.1 var(--serif);font-style:italic;color:var(--muted)}
.sc-na-x{font-size:1.0625rem;line-height:1.6;color:var(--text)}
.sc-close{display:grid;gap:.85rem;padding-top:1.5rem;border-top:3px solid var(--gauge-a)}

/* each part of the logic */
.part{display:grid;gap:1rem}
.part p{font-size:1.0625rem;line-height:1.65;color:var(--text)}
.part-h{font:500 clamp(1.35rem,3.2vw,1.7rem)/1.2 var(--serif);color:var(--ink);letter-spacing:-.01em;text-wrap:balance}
.part-h::before{content:"";display:block;width:2.25rem;height:3px;background:var(--navy);margin-bottom:.9rem}
.part + .part{padding-top:1.4rem}

/* conditions / aspects as tiles */
.tileset{display:grid;gap:.85rem;margin-block:.4rem}
.tileset-h{font:700 .8125rem/1.4 var(--sans)!important;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)!important}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:.65rem;counter-reset:tile}
.tiles li{counter-increment:tile;position:relative;background:var(--panel);border-radius:6px;padding:1rem 1rem 1rem 3.1rem;font-size:.9375rem;line-height:1.45;color:var(--muted)}
.tiles li::before{content:counter(tile);position:absolute;left:1rem;top:1rem;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--navy);color:#fff;font:700 .75rem/1.5rem var(--sans);text-align:center}
.tiles .t-k{font:700 1rem/1.35 var(--sans);color:var(--ink)}
.tiles .t-k::after{content:"\A";white-space:pre}
.tiles-plain li{padding-left:1rem}
.tiles-plain li::before{display:none}

/* LEAD™ flow bar: where this category sits in the logic */
.leadbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-block:.75rem .25rem;padding:1.1rem .9rem;background:var(--navy);border-radius:8px}
.lb{position:relative;display:grid;justify-items:center;gap:.45rem;text-align:center;min-width:0}
/* audit #4: later stages dimmed with colour that still reads (6.3:1), not transparency */
.lb:not(.on):not(.done) .lb-t{color:#aab7cc}.lb:not(.on):not(.done) .lb-m{border-color:rgba(170,183,204,.6);color:#aab7cc}.lb:not(.on):not(.done).lb-v .lb-m{background:transparent;border:1px solid rgba(247,200,96,.7);color:var(--gauge-a)}
.lb:not(:last-child)::after{content:"";position:absolute;top:.95rem;left:calc(50% + 1.15rem);right:calc(-50% + 1.15rem);height:1px;background:rgba(255,255,255,.55)}
.lb:not(:last-child)::before{content:"";position:absolute;top:calc(.95rem - 3px);right:calc(-50% + 1.15rem);width:6px;height:6px;border-top:1px solid rgba(255,255,255,.75);border-right:1px solid rgba(255,255,255,.75);transform:rotate(45deg)}
.lb-m{width:1.9rem;height:1.9rem;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.8);color:#fff;font:400 1rem/1 var(--serif)}
.lb-v .lb-m{border:0;background:linear-gradient(135deg,var(--gauge-a),var(--gauge-b));color:var(--navy);font:700 1rem/1 var(--sans)}
.lb-t{font:600 .6875rem/1.25 var(--sans);letter-spacing:.04em;color:#fff}
.lb.on{opacity:1}
.lb.done{opacity:.9}
.lb.done .lb-m{background:rgba(56,182,255,.28);border-color:rgba(56,182,255,.75)}
.lb.ln::after{background:var(--sky);height:2px}
.lb.ln::before{border-color:var(--sky)}
.lb.on .lb-m{background:var(--sky);border-color:var(--sky);color:var(--navy);font-weight:600}
.lb.on.lb-v .lb-m{background:linear-gradient(135deg,var(--gauge-a),var(--gauge-b))}
/* #193 Value: everything before leads into Business Value */
.k-value .lb.done:not(:last-child)::after{background:linear-gradient(90deg,var(--sky),var(--gauge-a));height:2px}
.k-value .lb.done:nth-child(4)::after{background:linear-gradient(90deg,var(--gauge-a),var(--gauge-b))}
.k-value .lb.done:not(:last-child)::before{border-color:var(--gauge-a)}
.k-value .lb.done:nth-child(4)::before{border-color:var(--gauge-b)}
.k-value .lb-v .lb-m{width:2.6rem;height:2.6rem;margin-top:-.35rem;font-size:1.25rem;box-shadow:0 0 0 5px rgba(247,200,96,.22),0 0 18px 2px rgba(238,145,65,.45)}
.k-value .lb-v .lb-t{color:var(--gauge-a);font-weight:800;font-size:.75rem}
.k-value .lb-v{gap:.3rem}
@media (max-width:560px){.lb{padding-inline:2px}.lb-t{font-size:.625rem;letter-spacing:-.01em;line-height:1.2;hyphens:auto}.leadbar{padding:.9rem .4rem}.k-value .lb-v .lb-t{font-size:.625rem}}

/* insights: one card each */
.insight{border:1px solid var(--rule);border-radius:8px;background:var(--paper);overflow:hidden}
.insight + .insight{margin-top:-.35rem}
.insight summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.85rem;align-items:start;padding:1rem 1.1rem;cursor:pointer;list-style:none}
.insight summary::-webkit-details-marker{display:none}
.insight summary::after{content:"";width:.6rem;height:.6rem;margin-top:.45rem;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .2s}
.insight[open] summary::after{transform:rotate(225deg);margin-top:.7rem}
.insight .n,.steps .n{display:inline-grid;place-items:center;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--navy);color:#fff;font:700 .8125rem/1 var(--sans)}
.ins-t{font:700 1.0625rem/1.4 var(--sans);color:var(--ink)}
.insight[open]{border-color:var(--rule-strong)}
.ins-b{display:grid;gap:.85rem;padding:0 1.25rem 1.25rem calc(1.1rem + 1.75rem + .85rem)}
.ins-b p{font-size:1rem;line-height:1.65}
.ins-eg{background:var(--panel);border-left:3px solid var(--sky);border-radius:0 6px 6px 0;padding:.8rem 1rem;color:var(--muted)!important;font-size:.9688rem!important}
.ins-biz{position:relative;padding-left:1.6rem}
.ins-biz::before{content:"";position:absolute;left:0;top:.62em;width:1rem;height:2px;background:var(--gauge-b)}
.ins-biz::after{content:"";position:absolute;left:.55rem;top:calc(.62em - 3px);width:6px;height:6px;border-top:2px solid var(--gauge-b);border-right:2px solid var(--gauge-b);transform:rotate(45deg)}
.ins-biz strong{color:var(--ink)}
@media (max-width:560px){.ins-b{padding-left:1.1rem}}

/* what this means: labelled tiles */
.impacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));gap:.65rem}
.impact{border-top:3px solid var(--navy);background:var(--panel);border-radius:0 0 6px 6px;padding:1rem 1.1rem;font-size:.9688rem!important;line-height:1.55!important}
.impact .k{font:700 .75rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.impact .k::after{content:"\A";white-space:pre}

/* next steps: a checklist; titles first, detail on tap */
.steps{display:grid;border-top:1px solid var(--rule)}
.step{border-bottom:1px solid var(--rule)}
.step summary,.step > .n{list-style:none}
.step summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.85rem;align-items:start;padding:.95rem 0;cursor:pointer}
.step summary::-webkit-details-marker{display:none}
.step summary::after{content:"+";font:400 1.4rem/1 var(--sans);color:var(--muted);margin-top:.15rem}
.step details[open] summary::after{content:"\2212"}
.steps .n{background:var(--gauge-a);color:var(--navy)}
.st-t{font:700 1.0313rem/1.45 var(--sans);color:var(--ink)}
.st-d{padding:0 2rem 1.1rem calc(1.75rem + .85rem);font-size:1rem!important;color:var(--muted)!important}
.step:not(:has(details)){display:grid;grid-template-columns:auto minmax(0,1fr);gap:.85rem;padding:.95rem 0}
.decide{background:var(--navy);color:#fff!important;border-radius:8px;padding:1.1rem 1.25rem;font-size:1.0313rem!important}
.decide strong{display:block;font:700 .75rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gauge-a);margin-bottom:.35rem}

/* references */
.refs{border-top:1px solid var(--rule);padding-top:.25rem}
.refs summary{padding:.9rem 0;cursor:pointer;font:700 .75rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.refs ol{display:grid;gap:.35rem;padding-bottom:.5rem}
.refs li{position:relative;padding-left:2rem;font-size:.8125rem;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}
.rn{position:absolute;left:0;font-variant-numeric:tabular-nums}
.refs-g{font:700 .8125rem/1.4 var(--sans);color:var(--ink);padding:.6rem 0 .4rem}
.refs a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
/* citation numbers, as written in the band files */
.nobr{white-space:nowrap}
.cite{white-space:nowrap;font:500 .68em/1 var(--sans);color:var(--muted);vertical-align:super;margin-left:.05em;letter-spacing:0}
.fs-biz strong{color:var(--ink)}

/* Back / Next between categories */
.pnav{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding-top:1.5rem;border-top:1px solid var(--rule)}
.pn-to{font-weight:700}

.gauge{display:block;width:100%;height:auto;overflow:visible}
.gauge .g-track{stroke:var(--rule)}

/* where to go from here */
.rz-end{background:var(--navy);color:var(--on-navy);padding:clamp(2rem,6vw,4rem);display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(2rem,4vw,3.5rem);align-items:start}
@media (min-width:900px){.rz-end.has-video{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.close{gap:1.2rem;min-width:0;max-width:40rem}
.close .after{font-size:clamp(2.1rem,5vw,3.1rem);font-weight:420;color:var(--on-navy)}
.close .cl-start{font:400 clamp(1.2rem,2.4vw,1.45rem)/1.45 var(--serif);font-style:italic;color:var(--on-navy-2)}
.close .book{gap:.9rem;margin-top:1.25rem;padding-top:1.6rem;border-top:1px solid var(--navy-rule)}
.close .book h3{font:600 .75rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gauge-a)}
.close .cl-book{font:400 1.1875rem/1.55 var(--serif)}
.close .cl-act{margin-top:.75rem}
#book[aria-disabled="true"]{opacity:.7;cursor:default}

/* privacy notice */
.pdlg{width:min(46rem,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:0;border:0;border-top:3px solid var(--navy);background:var(--paper);color:var(--text);box-shadow:0 30px 80px rgba(3,12,28,.45)}
.pdlg::backdrop{background:rgba(8,20,38,.6)}
.pdlg[open]{display:flex;flex-direction:column}
.pdlg-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1rem .9rem 1.5rem;border-bottom:1px solid var(--rule);font:500 1.2rem/1.3 var(--serif);color:var(--ink)}
.pdlg-x{min-height:44px;padding:.4rem 1rem;font-size:.875rem}
.pdlg-body{overflow:auto;padding:1.5rem clamp(1.25rem,4vw,2.25rem) 2.25rem;overscroll-behavior:contain}
.pn{display:grid;gap:.85rem;max-width:42rem;font:400 1.0625rem/1.6 var(--serif);color:var(--text)}
.pn h1{font-size:clamp(2.2rem,5.5vw,3rem);font-weight:420}
.pn h2{font:500 1.35rem/1.25 var(--serif);color:var(--ink);margin-top:1.2rem}
.pn ul{display:grid;gap:.35rem}
.pn li{position:relative;padding-left:1.3rem}
.pn li::before{content:"";position:absolute;left:0;top:.8em;width:.65rem;height:1px;background:var(--navy)}
.pn-org{font:600 .8125rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.pn-date{font-size:.9375rem;color:var(--muted)}
.ph{background:#fff1c2;color:#4a3700;padding:0 .2em}
.privacy-page{background:var(--paper)}

/* preview only */
.preview{background:#fff4d6;color:#4a3700;border-bottom:1px solid #e6cf8a;font-size:.875rem}
.preview .wrap{padding-block:.5rem}
.preview label{margin-left:.75rem;white-space:nowrap}
.preview select{background:#fff;border:1px solid #c9a94a;padding:.2rem .4rem;max-width:14rem}
.is-preview [data-draft],.proposed{outline:2px dashed #e08a00;outline-offset:3px}

footer{border-top:1px solid var(--ink)}
footer .wrap{padding-block:1.75rem 2.75rem;font-size:.875rem;color:var(--muted);display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1.5rem}
footer a{color:var(--text);display:inline-block;padding-block:.2rem;min-height:24px}

@media (max-width:820px){
  .hero .wrap,.author{grid-template-columns:minmax(0,1fr)}
  .hero::before{right:-28rem;top:30%}
  .measures{grid-template-columns:minmax(0,1fr);gap:2.25rem}
}
@media (max-width:600px){
  .opt{font-size:1.125rem}
}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{
  .top,.preview,footer,.navrow,.rz-end,.skip,.rtabs,#s-landing,#s-details,#s-q{display:none!important}
}
@media (max-width:600px){.sc{border-radius:0;margin-inline:calc(-1 * max(20px,env(safe-area-inset-left,0px)));width:auto;padding:1.75rem max(20px,env(safe-area-inset-left,0px))}}

/* icons */
.ic{width:1.35rem;height:1.35rem;flex:none}
.ic-lg{width:3.25rem;height:3.25rem;color:var(--navy)}
.why-intro{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.1rem;align-items:start;background:var(--panel);border-radius:8px;padding:1.2rem 1.25rem}
.why-intro p{margin:0}
@media (max-width:480px){.why-intro{grid-template-columns:minmax(0,1fr)}.ic-lg{width:2.5rem;height:2.5rem}}

/* insight sequence: science -> example -> business */
.flow{display:grid;padding:0 1.25rem 1.25rem 1.1rem}
.fs{position:relative;display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:.9rem;padding-bottom:1.1rem}
.fs:last-child{padding-bottom:0}
.fs .ic{width:2.4rem;height:2.4rem;padding:.5rem;border-radius:50%;background:var(--panel);color:var(--navy);position:relative;z-index:1}
.fs-eg .ic{background:color-mix(in srgb,var(--sky) 18%,var(--paper));color:#0b6aae}
.fs-biz .ic{background:color-mix(in srgb,var(--gauge-a) 30%,var(--paper));color:#8a5a12}
.fs:not(:last-child)::before{content:"";position:absolute;left:1.2rem;top:2.4rem;bottom:0;width:2px;background:linear-gradient(var(--rule),var(--rule))}
.fs-sci:not(:last-child)::before{background:linear-gradient(var(--navy),var(--sky))}
.fs-eg:not(:last-child)::before{background:linear-gradient(var(--sky),var(--gauge-b))}
.fs-c{display:grid;gap:.75rem;padding-top:.35rem;min-width:0}
.fs-c p{font-size:1rem!important;line-height:1.62!important;margin:0}
.fs-eg .fs-c p{color:var(--muted)!important;font-style:italic}
.fs-biz .fs-c p{color:var(--ink)!important}
.fs-biz strong{color:var(--ink)}
@media (max-width:560px){.flow{padding:0 1rem 1.1rem .9rem}.fs{grid-template-columns:2.1rem minmax(0,1fr);gap:.75rem}.fs .ic{width:2.1rem;height:2.1rem;padding:.42rem}.fs:not(:last-child)::before{left:1.05rem;top:2.1rem}}
@media (max-width:600px){.sc-head{margin:-1.75rem calc(-1 * max(20px,env(safe-area-inset-left,0px))) 0;padding:1.4rem max(20px,env(safe-area-inset-left,0px));border-radius:0}}

/* opening section (#192): lead paragraph and icon notes, no added words */
.part .lede{font:400 clamp(1.15rem,2.6vw,1.3rem)/1.5 var(--serif);color:var(--ink)}
.note{display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:.9rem;align-items:start;border-radius:8px;padding:1rem 1.15rem}
.note .ic{width:2.4rem;height:2.4rem;padding:.5rem;border-radius:50%}
.note-c{display:grid;gap:.6rem;padding-top:.3rem;min-width:0}
.note-c p{margin:0;font-size:1rem!important;line-height:1.6!important}
.note-eg{background:color-mix(in srgb,var(--sky) 9%,var(--paper));border:1px solid color-mix(in srgb,var(--sky) 30%,var(--paper))}
.note-eg .ic{background:color-mix(in srgb,var(--sky) 18%,var(--paper));color:#0b6aae}
.note-eg p{font-style:italic;color:var(--muted)!important}
.note-key{background:var(--navy)}
.note-key .ic{background:rgba(255,255,255,.1);color:var(--gauge-a)}
.note-key p{color:#fff!important;font-weight:500}
.note-limit{background:var(--panel)}
.note-limit .ic{background:var(--paper);color:var(--navy)}
.note-dk{border:1px dashed var(--rule);padding:.75rem 1rem}
.note-dk .ic{width:2rem;height:2rem;padding:.4rem;color:var(--muted)}
.note-dk p{color:var(--muted)!important;font-size:.9375rem!important}
@media (max-width:480px){.note{grid-template-columns:2rem minmax(0,1fr);gap:.7rem;padding:.9rem}.note .ic{width:2rem;height:2rem;padding:.4rem}}

/* ===== #197 Typography: one sans-serif family (Manrope) throughout, as in the navy score banner.
   Replaces the thin italic serif for headlines, numbers and body text. No words changed. ===== */
:root{--serif:var(--sans)}
h1,h2,h3{font-weight:800;letter-spacing:-.028em;line-height:1.08}
.hero h1{font-weight:800;letter-spacing:-.035em;line-height:1.02}
.hero h1 em{font-style:normal;font-weight:800;color:var(--sky)}
.rhero h1{font-style:normal;font-weight:800;letter-spacing:-.03em}
.top .tool,.closing,.pull,.lead figcaption,.ls-does,.helper,.overview .na,.sc-na-t,.close .cl-start{font-style:normal}
.top .tool{font-weight:600;font-size:.875rem;letter-spacing:.02em}
.hero .sub,.rz-intro,.close .cl-start{font-weight:500;letter-spacing:-.005em}
.measures .m-n{font-weight:800;font-size:2.75rem;letter-spacing:-.04em;color:var(--navy)}
.measures h3{font-weight:800}
.measures p,.boe-text,.author .bio > p:not(.role),.pnote,.pn,.close .cl-book{font-weight:400;letter-spacing:0}
.closing,.pull,.lead figcaption{font-weight:700;letter-spacing:-.02em}
.ls-mark{font-weight:800;font-size:1.6rem}
.ls-name{font-weight:700;letter-spacing:-.01em}
.ls-does{font-weight:500}
.field input[type=text],.field input[type=email]{font-size:1.125rem;font-weight:500}
.opt{font-weight:500;font-size:1.125rem;letter-spacing:-.005em}
.overview .pc,.sc-pc{font-weight:700;letter-spacing:-.04em}
.rt-v{font-weight:700}
.sc-title,.part-h{font-weight:800;letter-spacing:-.025em}
.lb-m{font-weight:800;font-family:var(--sans)}
.part .lede{font-weight:500;letter-spacing:-.005em}
.pdlg-bar,.pn h2{font-weight:800;letter-spacing:-.015em}

/* ===== #197 "What This Means for Your Organisation": the five labels bold and easy to tell apart ===== */
.impact{border-top-width:4px}
.impact .k{display:block;font:800 1.0625rem/1.3 var(--sans);letter-spacing:-.005em;text-transform:none;color:var(--navy);margin-bottom:.35rem}
.impact .k::after{content:none}

/* ===== #197 Text on navy: brighter and larger so it reads easily ===== */
:root{--on-navy-2:#e2e9f4}
.rz-intro{font-size:clamp(1.125rem,2.2vw,1.3rem);font-weight:500;line-height:1.5}
.rz-intro p:last-child{color:#e2e9f4}
.hero .sub{color:#e2e9f4;font-weight:500}
.ls-name{font-size:1.25rem;color:#fff}
.ls-does{font-size:1.0625rem;color:#e2e9f4;line-height:1.45}
/* results LEAD™ strip: larger labels; later stages still readable */
.leadbar{padding:1.25rem 1rem}
.lb-t{font:700 .8125rem/1.3 var(--sans);letter-spacing:0;color:#fff}
.lb:not(.on):not(.done) .lb-t{color:#b9c6da}
.k-value .lb-v .lb-t{font-size:.875rem}
/* on phones the strip runs top to bottom, so every label is full size */
@media (max-width:560px){
  .leadbar{grid-template-columns:minmax(0,1fr);gap:.55rem;padding:1.1rem 1.15rem}
  .lb{grid-template-columns:2.1rem minmax(0,1fr);justify-items:start;align-items:center;text-align:left;gap:.85rem;padding:0}
  .lb-m{width:2.1rem;height:2.1rem}
  .lb-t,.k-value .lb-v .lb-t{font-size:.9375rem;line-height:1.3}
  .lb:not(:last-child)::after{top:calc(2.1rem + 2px);left:calc(1.05rem - 1px);right:auto;width:2px;height:.5rem;background:rgba(255,255,255,.45)}
  .lb.ln::after{background:var(--sky)}
  .k-value .lb.done:not(:last-child)::after{background:var(--gauge-a);height:.5rem;width:2px}
  .lb:not(:last-child)::before{display:none}
  .k-value .lb-v .lb-m{width:2.6rem;height:2.6rem;margin:0 0 0 -.25rem}
}
/* #197 Manrope has no italic; avoid the browser's fake slant. Examples keep their own colour and box instead. */
.fs-eg .fs-c p,.note-eg p,.ins-eg{font-style:normal}
em{font-style:normal;font-weight:600}
.refs em{font-style:italic;font-weight:400} /* reference titles stay in italics, as in APA style */

/* ===== #198 Landing page: calmer layout, light-blue numbers, clear LEAD™ arrows ===== */
/* trademark sign set small and raised */
.tm{font-size:.55em;vertical-align:super;line-height:0;margin-left:.04em;font-weight:inherit;letter-spacing:0}
/* three areas: a card each, big light-blue number */
.sec-measures h2{max-width:44rem}
.measures{gap:1.25rem;margin-block:2.75rem 2.5rem}
.measures li{border:0;background:var(--paper);border-radius:10px;padding:1.75rem 1.6rem 1.9rem;gap:.6rem;box-shadow:0 1px 2px rgba(12,31,61,.05),0 10px 30px -22px rgba(12,31,61,.35)}
.measures .m-n{font:800 4.25rem/1 var(--sans);letter-spacing:-.05em;color:var(--sky);margin-bottom:.35rem}
.measures h3{font-size:1.6rem;letter-spacing:-.02em}
.measures p{font-size:1.0625rem;line-height:1.6;color:var(--text)}
.closing{font-size:clamp(1.3rem,2.6vw,1.65rem);line-height:1.35;max-width:36rem}
/* built on evidence: text on the left, the question as a card on the right */
.boe{margin-top:2rem;align-items:stretch}
.boe-text{font-size:1.0625rem;line-height:1.7;color:var(--text);max-width:34rem}
.pull{border:0;border-left:4px solid var(--sky);background:var(--panel);border-radius:0 10px 10px 0;padding:1.6rem 1.75rem;font-size:clamp(1.4rem,2.6vw,1.85rem);line-height:1.25;align-self:center}
/* LEAD™ figure: solid connectors with a clear arrowhead between every stage */
.lead figcaption{font-size:clamp(1.4rem,2.8vw,1.9rem);margin-bottom:2.25rem}
.ls-mark{border-width:2px}
.ls:not(.ls-v)::before{width:3px;left:calc(var(--mark) / 2 - 1.5px);border-radius:2px}
.ls:not(.ls-v)::after{content:"";position:absolute;left:calc(var(--mark) / 2 - 7px);bottom:.35rem;width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid var(--n)}
@media (min-width:860px){
  .ls:not(.ls-v)::before{height:3px;width:calc(100% - var(--mark) - 1rem);left:calc(var(--mark) + .35rem);top:calc(var(--mark) / 2 - 1.5px)}
  .ls:not(.ls-v)::after{left:auto;bottom:auto;right:.45rem;top:calc(var(--mark) / 2 - 7px);border:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:10px solid var(--n);transform:none;width:0;height:0}
}
/* #198 section headlines: one strong weight, slightly smaller, so the page reads calmly */
.sec h2{font-weight:800;font-size:clamp(1.9rem,3.9vw,2.8rem);letter-spacing:-.03em;line-height:1.1}
.author .bio h2{font-weight:800;font-size:clamp(2rem,4.2vw,2.9rem)}
.screen h1{font-weight:800}
/* #199 Business Value shown as "$" on the landing page, matching the results LEAD™ strip */
.ls-v .ls-mark.ls-dollar{font:800 2rem/1 var(--sans);color:var(--navy);box-shadow:0 0 0 6px rgba(247,200,96,.22),0 0 22px 2px rgba(238,145,65,.45)}
@media (min-width:860px){.ls{grid-template-rows:var(--mark) auto}}

/* ===== #200 Questions: a clear question, a quiet hint, answers as calm cards (no sideways shift) ===== */
#qh{font:800 clamp(1.6rem,3.6vw,2.25rem)/1.2 var(--sans);letter-spacing:-.025em;max-width:40rem}
.helper{font:500 1.0625rem/1.5 var(--sans);color:var(--text);max-width:40rem}
.opts{gap:.65rem;border-top:0;margin-top:.5rem}
.opt,.opt:hover,.opt[aria-pressed="true"]{padding:1rem 1.15rem;transition:border-color .15s,background-color .15s,box-shadow .15s}
.opt{border:1.5px solid var(--rule);border-radius:10px;background:var(--paper);min-height:60px;
  font:500 1.0625rem/1.45 var(--sans);letter-spacing:0;color:var(--ink)}
.opt:hover{border-color:var(--rule-strong);background:var(--panel)}
.opt[aria-pressed="true"]{border-color:var(--navy);background:var(--panel);box-shadow:inset 0 0 0 1px var(--navy)}
.opt .tick{width:1.4rem;height:1.4rem;border-width:1.5px}
.opt.dk{border:1.5px dashed var(--rule-strong);margin-top:.35rem;font:500 1rem/1.4 var(--sans);color:var(--muted);min-height:52px}
.opt.dk:hover,.opt.dk[aria-pressed="true"]{color:var(--ink)}
@media (max-width:480px){.opt{font-size:1rem;padding:.9rem 1rem}}

/* ===== #202 No yellow/orange text on navy: white or light text instead (gold stays for graphics only) ===== */
.hero .lede{font:700 1.0625rem/1.4 var(--sans);letter-spacing:0;text-transform:none;color:#fff}
.rz-brand{color:#e2e9f4}
.sc-head .sc-pc{color:#fff;font-weight:700}
.ls-v .ls-name,.k-value .lb-v .lb-t{color:#fff}
.decide strong,.close .book h3{color:#fff}
/* "1 minute" and "free" stand out (same words, highlighted) */
.hero .sub .hl{font-weight:800;color:var(--navy);background:var(--sky);padding:.02em .35em .06em;border-radius:6px;white-space:nowrap}
.btn .free{display:inline-block;font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:.82em;background:#fff;color:var(--navy);padding:.18em .5em .2em;border-radius:5px;margin:0 .15em;vertical-align:.06em}

/* ===== #202 Cards: number on top, clear space between the title and the text ===== */
.tileset{gap:1rem}
.tiles{grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:.85rem}
.tiles li,.tiles-plain li{padding:1.25rem 1.3rem 1.4rem;border-radius:10px;font-size:1rem;line-height:1.55;color:var(--text);border:1px solid var(--rule)}
.tiles li::before,.tiles-plain li::before{display:block;position:static;width:2rem;height:2rem;margin-bottom:.8rem;background:var(--sky);color:var(--navy);font:800 .9375rem/2rem var(--sans);text-align:center;border-radius:50%}
.tiles .t-k{display:block;font:800 1.0625rem/1.35 var(--sans);letter-spacing:-.01em;color:var(--ink);margin-bottom:.45rem}
.tiles .t-k::after{content:none}
.tileset-h{font:800 1.0625rem/1.4 var(--sans)!important;letter-spacing:-.005em!important;text-transform:none!important}
/* What This Means: more room around and between label and text */
.impacts{gap:.85rem}
.impact{padding:1.3rem 1.4rem 1.45rem!important;font-size:1rem!important;line-height:1.6!important;color:var(--text)!important;border-radius:0 0 10px 10px}
.impact .k{margin-bottom:.55rem}
/* "The important question…": dark text on a light box, easier to read than white on navy */
.note-key{background:#e8f5ff;border-left:4px solid var(--navy);border-radius:0 10px 10px 0}
.note-key .ic{background:#fff;color:var(--navy)}
.note-key p{color:var(--ink)!important;font-weight:600;font-size:1.0625rem!important}
/* section titles: larger, with the key idea highlighted */
.part-why > .part-h,.part-h.big{font-size:clamp(1.6rem,3.6vw,2.15rem);line-height:1.15}
.part-h .kp{background:linear-gradient(transparent 58%,rgba(56,182,255,.35) 58%);padding:0 .08em;color:inherit}
.hero .lede{margin-top:.6rem}

/* ===== #203 Cards: number beside the title, a clear gap, then the text. Scenario cards use a matching icon. ===== */
.tiles li.tt{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:.7rem;row-gap:.65rem;align-items:center;align-content:start}
.tiles li.tt::before{grid-column:1;grid-row:1;margin:0;width:1.85rem;height:1.85rem;line-height:1.85rem;font-size:.875rem}
.tiles li.tt .t-k{grid-column:2;grid-row:1;margin:0}
.tiles li.tt .t-b{grid-column:1 / -1;grid-row:2;padding-top:.65rem;border-top:1px solid var(--rule)}
.tiles li.it{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.9rem;align-items:start}
.tiles li.it::before{display:none}
.tiles .ic-t{width:2.75rem;height:2.75rem;padding:.45rem;border-radius:10px;background:#e8f5ff;color:var(--navy)}
.tiles li.it .t-b{padding-top:.2rem}
/* "1 minute": yellow highlight with navy text */
.hero .sub .hl{background:var(--gauge-a);color:var(--navy)}
/* "free" in buttons: back to plain button text, set in bold */
.btn .free{display:inline;background:none;color:inherit;padding:0;margin:0;text-transform:none;letter-spacing:inherit;font-size:inherit;font-weight:800;vertical-align:baseline;border-radius:0}

/* ===== #205 Main call to action: a yellow button that stands out on navy and on white ===== */
.btn-start{background:var(--gauge-a);color:var(--navy);font:800 1.0625rem/1.2 var(--sans);letter-spacing:-.005em;
  min-height:60px;padding:.95rem 1.9rem;border-radius:10px;box-shadow:0 8px 22px -10px rgba(238,145,65,.65)}
.btn-start::after{width:1.25rem;height:.8rem}
.btn-start:hover,.hero .btn-start:hover{background:#ffd77a;color:var(--navy)}
.btn-start:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.btn-start .free{font-weight:800}
@media (max-width:480px){.btn-start{width:100%}}

/* ===== #206 Start button: rounded, raised (3D) and lively; FREE in capitals. Example card back to full presence. ===== */
.btn-start{border-radius:999px;padding:1rem 2.1rem;background:linear-gradient(180deg,#ffd978 0%,var(--gauge-a) 45%,#f2ac4f 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -3px 0 rgba(160,90,10,.25),0 10px 24px -8px rgba(238,145,65,.75),0 2px 4px rgba(12,31,61,.25);
  transition:transform .15s ease,box-shadow .15s ease,background-color .15s}
.btn-start:hover,.hero .btn-start:hover{background:linear-gradient(180deg,#ffe08f 0%,#ffd06b 45%,#f5b35b 100%);transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -3px 0 rgba(160,90,10,.25),0 16px 30px -10px rgba(238,145,65,.85),0 3px 6px rgba(12,31,61,.25)}
.btn-start:active{transform:translateY(1px);box-shadow:inset 0 2px 4px rgba(160,90,10,.35),0 4px 10px -6px rgba(238,145,65,.6)}
.btn-start .free{text-transform:uppercase;letter-spacing:.08em;font-weight:900}
@media (prefers-reduced-motion:reduce){.btn-start,.btn-start:hover,.btn-start:active{transform:none}}
/* example result card: wider column, rounded and raised like the button */
@media (min-width:821px){.hero .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center}}
.example{border-radius:14px;border-top:0;padding:1.9rem 2rem 1.6rem;box-shadow:0 24px 48px -24px rgba(0,0,0,.55);max-width:30rem;width:100%;justify-self:end}
.example .overview .pc{font-size:2.8rem}
@media (max-width:480px){.btn-start{font-size:1rem;padding:.95rem 1.1rem;gap:.6rem;white-space:nowrap}.btn-start .free{letter-spacing:.04em}}
@media (max-width:370px){.btn-start{white-space:normal;font-size:.9375rem}}
/* #208 start button: no edge lines, one solid yellow and a soft shadow only */
.btn-start{background:var(--gauge-a);border:0;box-shadow:0 10px 24px -10px rgba(0,0,0,.45)}
.btn-start:hover,.hero .btn-start:hover{background:#ffd36e;box-shadow:0 14px 28px -12px rgba(0,0,0,.5)}
.btn-start:active{box-shadow:0 6px 14px -8px rgba(0,0,0,.45)}
/* #209 the quiet button beside the yellow ones takes the same rounded shape */
#review{border-radius:999px}

/* ===== #210 Body-text options B and C (preview switch). Headlines stay Manrope. ===== */
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/source-sans-3-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/source-sans-3-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/source-sans-3-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/source-serif-4-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/source-serif-4-latin-600-normal.woff2) format("woff2")}
:root{--body:var(--sans)}
html.bt-b{--body:"Source Sans 3","Segoe UI",system-ui,sans-serif}
html.bt-c{--body:"Source Serif 4",Georgia,serif}
html.bt-b .part p,html.bt-b .fs-c p,html.bt-b .note-c p,html.bt-b .tiles .t-b,html.bt-b .impact,html.bt-b .st-d,html.bt-b .part .lede,
html.bt-b .measures p,html.bt-b .boe-text,html.bt-b .author .bio > p:not(.role),html.bt-b .pnote,html.bt-b .why-intro p,html.bt-b .rz-intro,html.bt-b .hero .sub,html.bt-b .sc-na-x,html.bt-b .close .cl-start,html.bt-b .close .cl-book,
html.bt-c .part p,html.bt-c .fs-c p,html.bt-c .note-c p,html.bt-c .tiles .t-b,html.bt-c .impact,html.bt-c .st-d,html.bt-c .part .lede,
html.bt-c .measures p,html.bt-c .boe-text,html.bt-c .author .bio > p:not(.role),html.bt-c .pnote,html.bt-c .why-intro p,html.bt-c .rz-intro,html.bt-c .hero .sub,html.bt-c .sc-na-x,html.bt-c .close .cl-start,html.bt-c .close .cl-book{font-family:var(--body)}
html.bt-b .part p,html.bt-b .fs-c p,html.bt-b .tiles .t-b,html.bt-b .impact,html.bt-b .measures p{font-size:1.125rem!important;line-height:1.6!important}
html.bt-c .part p,html.bt-c .fs-c p,html.bt-c .tiles .t-b,html.bt-c .impact,html.bt-c .measures p{font-size:1.0938rem!important;line-height:1.62!important}
html.bt-b .impact .k,html.bt-c .impact .k,html.bt-b .tileset-h,html.bt-c .tileset-h{font-family:var(--sans)}
/* #211 the three Value scenarios are longer now: one per row */
.tiles:has(> li.it){grid-template-columns:minmax(0,1fr)}

/* ===== #212 Landing: the 3 areas shown with matching icons (organisation, people, $) in one light blue, joined by arrows ===== */
.measures .m-ic{display:grid;place-items:center;width:3.6rem;height:3.6rem;border-radius:14px;background:#e3f3ff;margin-bottom:.5rem}
.measures .m-ic svg{width:2rem;height:2rem;fill:none;stroke:#1a8fe3;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.measures li{position:relative}
.measures li:not(:last-child)::after{content:"";position:absolute;z-index:1;width:0;height:0;
  left:50%;bottom:-1.05rem;transform:translateX(-50%);border-left:9px solid transparent;border-right:9px solid transparent;border-top:11px solid #38b6ff}
@media (min-width:821px){
  .measures li:not(:last-child)::after{left:auto;bottom:auto;right:-1.05rem;top:50%;transform:translateY(-50%);
    border:0;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:11px solid #38b6ff}
}
.measures .m-ic svg{width:2.3rem;height:2.3rem;stroke-width:1.8}

/* ===== #213 Landing: clean elements, no boxes or tinted backgrounds ===== */
.sec-measures{background:var(--paper)}
.measures{gap:2.5rem 3.5rem}
.measures li{background:none;box-shadow:none;border-radius:0;padding:0;gap:.55rem}
.measures .m-ic{width:auto;height:auto;background:none;border-radius:0;margin-bottom:.4rem;justify-content:start}
.measures .m-ic svg{width:2.75rem;height:2.75rem;stroke:#1a8fe3;stroke-width:1.6}
/* simple line arrows between the three, no filled triangles */
.measures li:not(:last-child)::after{border:0;width:.85rem;height:.85rem;border-top:2px solid #38b6ff;border-right:2px solid #38b6ff;
  left:0;bottom:-1.85rem;transform:rotate(135deg)}
@media (min-width:821px){
  .measures li:not(:last-child)::after{left:auto;right:-2.2rem;bottom:auto;top:1.1rem;transform:rotate(45deg);border:0;border-top:2px solid #38b6ff;border-right:2px solid #38b6ff}
}
/* the LEAD™ question: a plain rule instead of a tinted box */
.pull{background:none;border-radius:0;padding:.2rem 0 .2rem 1.4rem;border-left:3px solid #38b6ff}
/* #214 the 3-areas heading runs the full width, so it reads in two calm lines on a computer */
.sec-measures h2{max-width:none;font-size:clamp(1.75rem,3.2vw,2.5rem);line-height:1.15}
@media (min-width:821px){.sec-measures h2{max-width:58rem}}
.sec-measures .closing{max-width:58rem}
/* #215 the 3 areas: solid light-blue pictograms that show progress (bars rise, a person climbs them, they reach $) */
.measures .m-ic.solid{color:#1a8fe3}
.measures .m-ic.solid svg{width:3.4rem;height:3.4rem;fill:currentColor;stroke:none}
.measures .m-ic.solid svg{width:4.5rem;height:4.5rem}
/* #216 back to large light-blue numbers (no icons), clean layout kept */
.measures .m-n{display:block;font:800 4rem/1 var(--sans);letter-spacing:-.05em;color:var(--sky);margin-bottom:.2rem}
@media (min-width:821px){.measures li:not(:last-child)::after{top:1.6rem}}

/* ===== #222 Video section straight after the top section: the video is the main element, the bio sits beside it, smaller ===== */
.sec-author{padding-block:clamp(3rem,6vw,4.5rem)}
.sec-author .author{gap:2rem 3.5rem;align-items:center}
@media (min-width:821px){
  .sec-author .author{grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr)}
  .sec-author .author .bio{order:-1}
}
.sec-author .author.no-video{grid-template-columns:minmax(0,1fr)}
/* the video box: always 16:9 landscape, large, rounded; the player has its own full-screen button */
.sec-author .vid,.sec-author .vid-ph{width:100%;aspect-ratio:16/9;border-radius:14px;overflow:hidden;box-shadow:0 24px 48px -28px rgba(12,31,61,.55)}
.sec-author .vid video{width:100%;height:100%;object-fit:contain;background:var(--navy);display:block}
.sec-author .vid-ph{font-size:.9375rem}
/* the bio: quieter than the video */
.sec-author .bio{gap:.6rem}
.sec-author .bio h2{font-size:clamp(1.5rem,2.4vw,1.85rem);letter-spacing:-.02em}
.sec-author .bio > p:not(.role){font-size:1.0625rem!important;line-height:1.55!important}
.sec-author .creds li{font-size:.9375rem;padding:.55rem 0}

/* ===== #223 NeuroAIQ logo in the header ===== */
.top .wrap{align-items:center;padding-block:.75rem}
.top .name{line-height:0}
.top .logo{display:block;height:46px;width:auto}
@media (max-width:480px){.top .logo{height:36px}.top .tool{font-size:.8125rem}}
/* #223 optional photo of Dr Ameri beside the booking invitation */
.book-photo{width:7.5rem;height:7.5rem;border-radius:50%;object-fit:cover;border:3px solid rgba(255,255,255,.85)}
/* #224 photo beside the booking invitation: photo on the left, text and button on the right */
.book.has-photo{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:1.5rem;row-gap:.75rem;align-items:start}
.book.has-photo .book-photo{grid-row:1 / span 3;width:8.5rem;height:8.5rem}
.book.has-photo > :not(.book-photo){grid-column:2}
@media (max-width:560px){.book.has-photo{grid-template-columns:minmax(0,1fr)}.book.has-photo .book-photo{grid-row:auto;width:6.5rem;height:6.5rem}.book.has-photo > :not(.book-photo){grid-column:1}}
/* #227 sharp vector header logo (brain + NeuroAIQ®, no tagline) */
.top .logo{height:42px}
@media (max-width:480px){.top .logo{height:34px}}
/* #227 full logo with the tagline in the footer, where there is room for it to read clearly */
footer .wrap{align-items:flex-end}
.foot-brand{display:grid;gap:.6rem;justify-items:start}
.foot-logo{display:block;height:96px;width:auto}
@media (max-width:480px){.foot-logo{height:80px}}
.foot-logo{height:132px}
@media (max-width:480px){.foot-logo{height:112px}}
/* #228 top: the brain mark only; footer: website left, horizontal logo with tagline centred, Privacy Notice right */
.top .logo.logo-mark{height:44px;width:auto}
@media (max-width:480px){.top .logo.logo-mark{height:38px}}
.foot-row{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.25rem 2rem}
.foot-row .foot-site{justify-self:start}
.foot-row #privacyFoot{justify-self:end}
.foot-row .foot-logo{height:64px;width:auto;justify-self:center}
@media (max-width:640px){
  .foot-row{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}
  .foot-row .foot-logo{order:-1;height:56px;max-width:100%}
  .foot-row .foot-site,.foot-row #privacyFoot{justify-self:center}
}
/* #229 footer logo from NeuroAIQ_Logo.svg */
.foot-row .foot-logo{height:78px}
@media (max-width:640px){.foot-row .foot-logo{height:64px}}

/* #241 tester links: a banner on every page, read-only name and email, no follow-up tick box */
.tbar{background:#fde7e7;color:#7a1414;border-bottom:1px solid #f1b9b9;font-weight:600;font-size:.9375rem;padding:.55rem 0;text-align:center}
.is-tester label.check,.is-tester label.check + .fine{display:none}
input[readonly]{background:var(--rule);color:var(--text);cursor:default}
#tCode{font-size:1.5rem;letter-spacing:.3em;max-width:12rem;font-variant-numeric:tabular-nums}

/* #249 photo beside the bio until the video is added: bio on the left, photo on the right (photo first on phones) */
.sec-author .author.has-photo{grid-template-columns:minmax(0,1fr);max-width:62rem}
.author-photo{display:block;width:clamp(12rem,26vw,18rem);height:auto;aspect-ratio:1;object-fit:cover;border-radius:50%;justify-self:center;box-shadow:0 24px 48px -28px rgba(12,31,61,.55)}
@media (min-width:821px){.sec-author .author.has-photo{grid-template-columns:minmax(0,1fr) auto}}
.author .bio .led-by{margin:0 0 -.4rem} /* #250 */
/* #257 all references together at the very end of the results */
.refs-all{margin-top:3rem}
.refs-all .refs-cat{font-size:1.125rem;margin:1.5rem 0 .25rem}

/* #264 The PDF document: the website's own elements on A4 pages, with a page frame like a newsletter */
.pdf-page{width:1060px;height:1499px;box-sizing:border-box;padding:0 54px;display:flex;flex-direction:column;overflow:hidden}
.pdf-head{flex:none;height:54px;display:flex;align-items:center;gap:12px;border-bottom:1.5px solid var(--sky);margin-bottom:20px;
  font:800 .8125rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.pdf-head img{width:30px;height:auto}
.pdf-head .pdf-test{margin-left:auto;color:#b02a2a;letter-spacing:.02em;text-transform:none;font-weight:700}
.pdf-inner{flex:1;min-height:0;overflow:hidden}
.pdf-foot{flex:none;height:44px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--rule);
  margin-top:10px;font:600 .75rem/1 var(--sans);color:var(--muted)}
.pdf-page .screen,.pdf-page .wrap{padding:0;margin:0;max-width:none}
.pdf-page .rhero{border-radius:16px}
.pdf-page .rhero .wrap{padding:44px 44px 40px}
.pdf-page .sc{margin:0 0 24px;padding:30px 36px;gap:1.35rem}
.pdf-page .sc-head{margin:-30px -36px 0;padding:26px 36px}
.pdf-page .pdf-cont{margin-top:0;padding-top:0;border-top-left-radius:0;border-top-right-radius:0}
.pdf-page .rz-end{border-radius:16px;margin-bottom:28px}
.pdf-page .refs-all{margin-top:0}
.pdf-page details.refs > summary{pointer-events:none}
.pdf-cover .pdf-inner > .rhero{height:100%;display:flex;flex-direction:column;justify-content:center}
.pdf-cover .pdf-inner > .rhero .wrap{width:100%}

/* #265 PDF: spacing for paper (same elements, colours and icons; less empty space) */
.pdf-page summary::after,.pdf-page summary::before{display:none!important}
.pdf-page summary{list-style:none!important}.pdf-page summary::-webkit-details-marker{display:none}
.pdf-page summary{cursor:default}
.pdf-page .sc{gap:1.1rem;margin-bottom:18px}
.pdf-page .part{gap:.85rem}
.pdf-page .part + .part,.pdf-page .leadbar{margin-top:.4rem}
.pdf-page .tiles,.pdf-page .impacts{gap:12px}
.pdf-page .tiles > li:last-child:nth-child(odd),.pdf-page .impacts > .impact:last-child:nth-child(odd){grid-column:1 / -1}
.pdf-page .step summary{padding:.6rem 0}
.pdf-page .insight + .insight{margin-top:.6rem}
.pdf-page .refs-all .refs li{margin-bottom:.2rem;font-size:.84rem;line-height:1.4}
.pdf-page .refs-all .refs-cat{margin:1rem 0 .2rem}

/* #266 PDF print typography: the same elements, colours and icons, sized for A4 (about 9.5 pt text) */
.pdf-page p,.pdf-page li,.pdf-page .t-b,.pdf-page .st-d,.pdf-page .impact{font-size:17px!important;line-height:1.45!important}
.pdf-page .lede,.pdf-page .why-intro p{font-size:17.5px!important}
.pdf-page .sc-name{font-size:28px!important;line-height:1.1!important}
.pdf-page .sc-pc{font-size:34px!important}
.pdf-page .sc-head{padding:18px 36px!important;margin:-30px -36px 0!important}
.pdf-page .sc-head .sc-mini{width:110px!important}
.pdf-page .sc-title{font-size:25px!important;line-height:1.2!important}
.pdf-page .part-h{font-size:25px!important;line-height:1.2!important}
.pdf-page .tileset-h{font-size:16.5px!important}
.pdf-page .tt{padding:13px 16px 15px!important;font-size:15.5px!important}
.pdf-page .t-b{padding-top:6px!important}
.pdf-page .impact{padding:13px 16px 15px!important}
.pdf-page .insight summary{padding:10px 14px!important;font-size:16px!important}
.pdf-page .step summary{padding:8px 0!important;font-size:16px!important}
.pdf-page .st-d{padding:0 24px 10px 40px!important}
.pdf-page .leadbar{padding:12px 14px!important;margin:6px 0 2px!important}
.pdf-page .why-intro{padding:12px 16px!important}
.pdf-page .rz-end{padding:30px 36px!important}
.pdf-page .refs-all .refs li{font-size:14px!important;line-height:1.35!important}
.pdf-inner{overflow:visible}
.pdf-closing .pdf-inner{display:flex;flex-direction:column;justify-content:center}
.pdf-closing .pdf-inner > .rz-end{min-height:78%;align-content:center;padding:56px 56px!important}
/* #267 the continuous layout: one long page, same frame */
.pdf-page.pdf-long{height:auto}
.pdf-long .pdf-inner{flex:none}
.pdf-long .pdf-gap{margin-top:40px}
/* #267 the cards, the closing panel and the references use the full width between the page margins */
.pdf-page .sc,.pdf-page .rz-end,.pdf-page .refs-all,.pdf-page .rhero{max-width:none!important;width:auto!important;margin-left:0!important;margin-right:0!important}
/* #268 an insight part continued on the next page keeps its text in the right-hand column */
.pdf-page .fs.pdf-cont > .fs-c{grid-column:2}
.pdf-page .fs.pdf-cont{padding-top:0}
/* #267 card groups in the PDF use 2 columns, as on the website (the PDF page is wider than the website's results column) */
.pdf-page .tiles:not(.tiles-plain),.pdf-page .impacts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
/* #270 audit fixes. The PDF library places tabular figures one by one and leaves gaps ("10 .", "47 %"), so the PDF uses normal figures */
.pdf-page *{font-variant-numeric:normal!important}
/* the "not started" closing paragraphs use the same body font and spacing as the rest of the results */
.sc-close p{font-family:var(--body);line-height:1.6}
/* "Not yet assessed" on the navy header is readable */
.sc-head .sc-na-t{color:#c9d4e5}
.pdf-page .sc-na-t{font-size:22px!important}
/* references in the PDF use the body font, a little larger, so they are as easy to read as the rest */
.pdf-page .refs-all .refs li{font-family:var(--body);font-size:15px!important;line-height:1.4!important}
/* #272 continuous PDF: more breathing room (spacing only; font sizes, layout, colours and elements unchanged) */
.pdf-long p,.pdf-long li,.pdf-long .t-b,.pdf-long .st-d,.pdf-long .impact{line-height:1.65!important}
.pdf-long .refs-all .refs li{line-height:1.5!important;margin-bottom:.35rem}
.pdf-long .sc{gap:1.6rem;margin-bottom:56px}
.pdf-long .part{gap:1.15rem}
.pdf-long .part + .part{margin-top:1.6rem;padding-top:1.4rem}
.pdf-long .leadbar{margin:14px 0 10px!important}
.pdf-long .fs-c{gap:1.1rem}
.pdf-long .fs{padding-bottom:1.6rem;gap:1.1rem}
.pdf-long .flow{padding-top:.6rem}
.pdf-long .insight summary{padding:16px 18px!important}
.pdf-long .insight + .insight{margin-top:1.4rem}
.pdf-long .tiles,.pdf-long .impacts{gap:18px}
.pdf-long .tt,.pdf-long .impact{padding:20px 22px 22px!important}
.pdf-long .t-b{padding-top:10px!important}
.pdf-long .note{padding-top:1.15rem;padding-bottom:1.15rem}
.pdf-long .step summary{padding:14px 0 10px!important}
.pdf-long .st-d{padding:0 24px 16px 40px!important}
.pdf-long .why-intro{padding:18px 20px!important}
.pdf-long .rz-end{margin-bottom:48px}
.pdf-long .note + .note,.pdf-long .note + .insight,.pdf-long p + .note{margin-top:.5rem}
/* #273 the Readiness, Adoption and Value headers a little taller, to mark each new section */
.pdf-long .sc-head{padding:28px 36px!important}
