/* publiclayer.au v2. Tokens first; every colour on the page comes from here.
   Contrast pairs are checked by scripts/check.mjs at build time. */
:root{
  --ink:#121A2B;        /* body text, footer */
  --mute:#4A5468;       /* secondary text on white and paper */
  --blue:#1D2F5E;       /* the layer: brand band, primary buttons, chart (website words) */
  --blue-2:#2B4485;     /* links on light */
  --paper:#F2F4F8;      /* alternate band */
  --white:#FFFFFF;
  --rule:#D3D9E4;
  --ochre:#8A5C05;      /* chart (people's words), focus on light */
  --ochre-lt:#EFC35A;   /* accent on blue: focus, highlighted button */
  --on-blue:#FFFFFF;
  --on-blue-mute:#C9D2E6;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Public Sans",system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --measure:41rem;
  --wide:68rem;
  --gutter:clamp(16px,5vw,48px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:18px;line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-variant-numeric:lining-nums}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue-2);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--ochre);outline-offset:3px;border-radius:2px}
.band-blue :focus-visible,.foot :focus-visible{outline-color:var(--ochre-lt)}
.skip{position:absolute;left:-9999px;top:8px;background:var(--ochre-lt);color:var(--ink);padding:8px 14px;font-weight:600;z-index:20}
.skip:focus{left:8px}
p{margin:0 0 1em;text-wrap:pretty}
li{text-wrap:pretty}
h1,h2,h3{color:inherit}
h1,h2{font-family:var(--serif);font-weight:500;font-optical-sizing:auto;letter-spacing:-.012em}
h1{font-size:clamp(34px,4.4vw,54px);line-height:1.08;margin:0 0 .5em;text-wrap:balance}
h2{font-size:clamp(27px,3vw,38px);line-height:1.14;margin:0 0 .6em;text-wrap:balance}
h3{font-family:var(--sans);font-weight:700;font-size:19px;line-height:1.35;margin:1.6em 0 .4em}

/* preview-only bar (removed in the production build) */
.pv{background:var(--ochre-lt);color:var(--ink);font-size:15px;padding:8px var(--gutter);text-align:left}
.pv a{color:var(--ink);font-weight:600}
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin:1em 0 2em;max-width:none}
.sw{border:1px solid var(--rule);border-radius:6px;overflow:hidden;font-size:14px;line-height:1.4}
.sw i{display:block;height:64px}
.sw span{display:block;padding:8px 10px}

/* header */
.top{display:flex;justify-content:space-between;align-items:center;gap:12px 28px;flex-wrap:wrap;padding:18px var(--gutter);border-bottom:1px solid var(--rule);background:var(--white)}
.wordmark{display:inline-flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-weight:700;font-size:19px;letter-spacing:-.01em}
.mark{width:22px;height:22px;flex:none}
.top nav{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:16px}
.top nav a{color:var(--ink);text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
.top nav a:hover{border-bottom-color:var(--rule)}
.top nav a[aria-current="page"]{border-bottom-color:var(--blue)}
.top nav .nav-contact{color:var(--blue-2);font-weight:600}

/* bands */
.band{padding:clamp(56px,8vw,104px) var(--gutter)}
.band-white{background:var(--white)}
.band-paper{background:var(--paper)}
.band-blue{background:var(--blue);color:var(--on-blue)}
.band-blue a{color:var(--on-blue)}
.wrap{max-width:var(--wide);margin:0 auto}
.wrap.narrow{max-width:var(--wide);margin:0 auto}
.wrap.narrow>*,.narrow-in{max-width:var(--measure)}
.wrap.narrow>.chart-home{max-width:var(--measure)}
.lede{font-size:clamp(19px,1.6vw,21px);line-height:1.55}
.band-blue .lede{color:var(--on-blue)}
.note{color:var(--mute);font-size:16px;max-width:68ch}
.more{font-weight:600}
.more::after{content:" \2192"}

/* hero: the rotating question */
.hero{padding-top:clamp(48px,7vw,96px);padding-bottom:clamp(48px,6vw,80px)}
.qs{list-style:none;margin:0;padding:0;min-height:var(--qmin,0)}
.q-text{max-width:32ch;font-family:var(--serif);font-weight:400;font-optical-sizing:auto;font-size:clamp(28px,3.9vw,52px);line-height:1.18;letter-spacing:-.01em;margin:0 0 .7em;text-wrap:pretty;hanging-punctuation:first}
.q[data-size="mid"] .q-text{font-size:clamp(26px,3.3vw,44px)}
.q[data-size="long"] .q-text{font-size:clamp(24px,2.8vw,38px)}
.q-src{color:var(--on-blue-mute);font-size:16px;margin:0;max-width:68ch}
.q{animation:qin .5s ease both}
@keyframes qin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.q{animation:none}}
.rot-controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:22px}
.rot-btn{font:inherit;font-size:15px;font-weight:600;color:var(--on-blue);background:transparent;border:1px solid var(--on-blue-mute);border-radius:6px;padding:7px 14px;cursor:pointer;min-height:40px}
.rot-btn:hover{background:rgba(255,255,255,.08)}
.rot-count{color:var(--on-blue-mute);font-size:15px;font-variant-numeric:tabular-nums}
.hero-land{margin:clamp(36px,5vw,56px) 0 0;padding-top:22px;border-top:1px solid rgba(201,210,230,.35);max-width:var(--measure);font-size:clamp(18px,1.5vw,20px)}

/* the finding */
.chart{margin:2em 0 2.4em}
.c-blue{background:var(--blue);color:#fff}
.c-ochre{background:var(--ochre);color:#fff}
.key{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:15px;color:var(--mute);margin:0 0 12px}
.key span{display:inline-flex;align-items:center;gap:7px}
.key i{width:12px;height:12px;border-radius:2px;display:inline-block}
.key .k-blue{background:var(--blue)}.key .k-ochre{background:var(--ochre)}
.cells{display:grid;grid-template-columns:repeat(13,1fr);gap:4px;max-width:470px}
.cell{aspect-ratio:1;border-radius:4px}
.ends{display:flex;justify-content:space-between;max-width:470px;margin:8px 0 0;font-size:16px}
.sbar{margin:0 0 16px}
.sbar-l{font-size:15px;color:var(--mute);margin:0 0 6px}
.sbar-t{display:flex;gap:2px;height:32px}
.sbar-t span{display:flex;align-items:center;padding:0 10px;font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;border-radius:4px}
.strip{position:relative;height:150px;margin:44px 12px 0 0;border-bottom:1px solid var(--rule)}
.goodzone{position:absolute;left:0;top:0;bottom:0;background:#DCE3F2}
.dot.dot-good{background:var(--blue)}
.ref{position:absolute;top:-8px;bottom:0;border-left:2px solid var(--ink)}
.ref-good{border-left-color:var(--blue)}
.ref-good em{color:var(--blue);font-weight:700}
.ref em{position:absolute;top:-26px;left:6px;font-style:normal;font-size:14px;white-space:nowrap;color:var(--mute)}
.ref-med em{top:4px;color:var(--ink);font-weight:700}
.dot{position:absolute;width:11px;height:11px;margin-left:-5.5px;border-radius:50%;background:var(--ochre);box-shadow:0 0 0 2px #fff;margin-bottom:2px}
.dot-off{left:auto!important;right:-17px}
.far{position:absolute;right:-12px;bottom:20px;font-size:14px;color:var(--mute)}
.ticks{position:relative;height:24px;font-size:14px;color:var(--mute)}
.tick{position:absolute;top:4px;transform:translateX(-50%)}
.tick:first-child{transform:none}
.tick:last-child{transform:translateX(-100%)}
.hbars{margin:0}
.hbar{margin:0 0 18px}
.hbar-l{font-weight:600;font-size:16px;margin:0 0 6px}
.hbar-t{position:relative;display:flex;align-items:center;gap:10px;height:34px;background:var(--paper);border-radius:4px}
.hbar-t span{height:100%;border-radius:4px}
.hbar-t b{font-size:16px;white-space:nowrap}
@media (max-width:520px){.ref-good em{left:auto;right:auto;transform:none}.sbar-t span{font-size:14px;padding:0 7px}}
.chart figcaption{color:var(--mute);font-size:15px;line-height:1.5;margin-top:12px;max-width:56ch;text-wrap:pretty}
.chart-home{margin:1.6em 0 3em}
.facts{list-style:none;margin:0 0 1em;padding:0}
.facts li{padding:14px 0;border-top:1px solid var(--rule)}
.facts li:last-child{border-bottom:1px solid var(--rule)}

/* read the paper */
.paper-title{font-family:var(--serif);font-size:clamp(28px,3vw,36px);line-height:1.15;margin:0 0 .4em;font-weight:500}
.paper-title a{color:var(--ink);text-decoration:none}
.paper-title a:hover{text-decoration:underline;text-decoration-thickness:2px}
.btn{display:inline-block;background:var(--blue);color:var(--white);font-weight:600;font-size:17px;text-decoration:none;padding:12px 22px;border-radius:6px;border:0;cursor:pointer;line-height:1.3}
.btn:hover{background:#15234A;text-decoration:none}
.band-blue .btn-light,.btn-light{background:var(--ochre-lt);color:var(--ink)}
.band-blue .btn-light:hover{background:#F5D27E}
.form-h{margin-top:2.2em}

/* forms */
.form{display:grid;gap:16px;margin-top:10px}
.fields{display:grid;gap:16px}
@media (min-width:720px){.form-pdf .fields{grid-template-columns:1fr 1fr 1fr}.fields.two{grid-template-columns:1fr 1fr}}
label{display:block;font-size:15px;font-weight:600;margin-bottom:6px}
input,textarea{width:100%;font:inherit;font-size:17px;color:var(--ink);background:var(--white);border:1px solid #9AA4B8;border-radius:6px;padding:11px 13px;min-height:46px}
textarea{resize:vertical;min-height:130px}
input:focus,textarea:focus{outline:3px solid var(--ochre);outline-offset:1px;border-color:var(--ink)}
.on-dark input,.on-dark textarea{border-color:transparent}
.on-dark input:focus,.on-dark textarea:focus{outline-color:var(--ochre-lt)}
.form button{font:inherit;font-weight:600;font-size:17px;background:var(--blue);color:var(--white);border:0;border-radius:6px;padding:12px 22px;cursor:pointer;min-height:46px}
.form button:hover{background:#15234A}
.on-dark button{background:var(--ochre-lt);color:var(--ink)}
.on-dark button:hover{background:#F5D27E}
.form button[disabled]{opacity:.65;cursor:default}
.status{margin:0;font-weight:600}
.status:empty{display:none}
.status[data-state="err"]{color:#9B2A1A}
.on-dark .status[data-state="err"]{color:var(--ochre-lt)}
.fine{font-size:15px;color:var(--mute);margin:0;max-width:68ch}
.on-dark .fine{color:var(--on-blue-mute)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* leaders */
.leaders{list-style:none;margin:0;padding:0}
.leaders li{font-family:var(--serif);font-size:clamp(21px,2vw,25px);line-height:1.38;padding:22px 0;border-top:1px solid var(--rule)}
.leaders li:last-child{border-bottom:1px solid var(--rule)}

/* steps (a real sequence, so a real ordered list) */
.steps{margin:0 0 1.4em;padding-left:1.4em}
.steps li{padding-left:.3em;margin-bottom:.7em}
.steps li::marker{font-weight:700;color:var(--blue)}

/* who */
.who{display:grid;grid-template-columns:150px 1fr;gap:24px;align-items:start}
.who img{width:150px;border-radius:4px}
.who-text{font-size:19px}
@media (max-width:520px){.who{grid-template-columns:96px 1fr;gap:16px}.who img{width:96px}.who-text{font-size:17px}}

/* page heads */
.page-head{padding-bottom:clamp(40px,5vw,64px)}
.page-head h2{margin-top:1.6em}

/* how we help */
.points h3:first-child{margin-top:.6em}
.apps{display:grid;gap:40px;margin-top:2.2em}
@media (min-width:900px){.apps{grid-template-columns:1fr 1fr;gap:48px}}
.app h3{margin-top:1em}
.screen{margin:0}
.screen-frame{aspect-ratio:16/10;border:1px solid var(--rule);border-radius:8px;background:var(--paper);display:flex;align-items:center;justify-content:center;color:var(--mute);font-size:15px}

/* paper page */
.preview-note{max-width:68ch;background:var(--paper);border:1px solid var(--rule);border-radius:6px;padding:10px 14px;font-size:15px;color:var(--mute)}
.paper-kicker{color:var(--mute);font-size:16px;margin-bottom:.6em}
.deck{font-size:clamp(19px,1.6vw,21px);color:var(--mute);line-height:1.5}
.byline{display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:start;margin:1.8em 0 1.6em;font-size:16px;line-height:1.5}
.byline img{width:64px;border-radius:3px}
.byline p{margin:0}
.paper-actions{margin:0 0 1.4em}
.toc{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:12px 0}
.toc summary{cursor:pointer;font-weight:600}
.toc ol{margin:.6em 0 .2em;padding-left:1.4em;font-size:16px}
.toc li{margin:.25em 0}
.paper-body{padding-top:clamp(24px,3vw,40px)}
.paper-body h2{margin-top:2.2em;scroll-margin-top:16px}
.paper-body h2:first-child{margin-top:0}
.paper-body h3{scroll-margin-top:16px}
.paper-body strong{font-weight:700}
.paper-body ol,.paper-body ul{padding-left:1.3em}
.paper-body li{margin-bottom:.45em}
.ev{font-size:max(13px,.78em);color:var(--mute)}
.table-wrap{overflow-x:auto;margin:1.4em 0 1.8em;-webkit-overflow-scrolling:touch}
.paper-body table{border-collapse:collapse;width:100%;font-size:15.5px;line-height:1.45}
.paper-body th,.paper-body td{overflow-wrap:break-word;hyphens:manual;text-align:left;vertical-align:top;padding:10px 12px 10px 0;border-bottom:1px solid var(--rule)}
.paper-body th{font-weight:700;border-bottom:2px solid var(--ink)}
.paper-body td:first-child{padding-right:16px}

/* footer */
.foot{background:var(--ink);color:#D5DBE6;padding:48px var(--gutter);font-size:16px}
.foot-in{max-width:var(--wide);margin:0 auto}
.foot-in p{max-width:68ch}
.foot a{color:#FFFFFF}
.foot .wordmark{color:#FFFFFF}
.foot .mark rect:nth-child(2){fill:#8A9CC9}.foot .mark rect:nth-child(3){fill:#5B6886}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:1.4em}

/* print: the PDF is rendered from /edition-one with these rules */
@media print{
  @page{size:A4;margin:20mm 18mm 20mm}
  body{font-size:10.5pt;line-height:1.5;color:#000}
  .pv,.top,.foot,.skip,.toc,.paper-actions,#pdf,.preview-note,.form{display:none!important}
  .band{padding:0!important;background:none!important}
  .wrap.narrow{max-width:none}
  .paper-head{break-after:page}
  .paper-head .wrap{padding-top:60mm}
  h1{font-size:34pt}
  .print-only{display:block!important}
  .deck{font-size:13pt}
  .paper-body h2{font-size:18pt;break-after:avoid;margin-top:1.6em}
  .paper-body h3{break-after:avoid}
  .chart,.table-wrap,figure{break-inside:avoid}
  .paper-body table{min-width:0;font-size:9pt}
  a{color:inherit;text-decoration:none}
  .paper-body a[href^="http"]::after{content:" (" attr(href) ")";font-size:8pt;color:#444;word-break:break-all}
}

.print-only{display:none}
.viz{display:flow-root}
@media (max-width:520px){.top{padding-top:14px;padding-bottom:12px}.top nav{gap:4px 16px;font-size:15px}}
.check{display:flex;gap:10px;align-items:flex-start}
.check input{width:22px;height:22px;min-height:0;margin:2px 0 0;flex:none;accent-color:var(--blue)}
.check label{font-weight:400;font-size:16px;margin:0}
.status .btn{margin-left:6px}
.screen img{border:1px solid var(--rule);border-radius:8px;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.thumbs img{border-radius:5px}
.fourq{margin:0 0 1.2em;padding-left:1.4em;font-family:var(--serif);font-size:clamp(21px,2vw,25px);line-height:1.35}
.fourq li{margin:.25em 0;padding-left:.2em}
.fourq li::marker{color:var(--blue);font-family:var(--sans);font-weight:700;font-size:.8em}
.jump{list-style:none;margin:1.4em 0 0;padding:0}
.jump li{border-top:1px solid var(--rule)}
.jump li:last-child{border-bottom:1px solid var(--rule)}
.jump a{display:block;padding:12px 0;font-weight:600;text-decoration:none}
.jump a::after{content:" \2193"}
.jump a:hover{text-decoration:underline}
.example{background:var(--white);border:1px solid var(--rule);border-radius:6px;padding:14px 18px}
.band-white .example{background:var(--paper)}
.cases{display:grid;gap:16px;margin:0 0 1.4em}
.case{background:var(--white);border:1px solid var(--rule);border-radius:6px;padding:4px 18px 6px}
.case h3{margin-top:.9em}

/* screen viewer: opens a screen over the page; Esc, the Close button or a click outside returns to the page */
.lb{border:0;padding:0;background:transparent;max-width:min(1100px,94vw);max-height:92vh;overflow:visible}
.lb::backdrop{background:rgba(18,26,43,.82)}
.lb img{display:block;max-width:100%;max-height:84vh;width:auto;height:auto;border-radius:6px;margin:0 auto;background:#fff}
.lb-close{position:absolute;top:-46px;right:0;font:inherit;font-size:15px;font-weight:600;background:var(--white);color:var(--ink);border:0;border-radius:6px;padding:8px 14px;cursor:pointer}
.lb-cap{color:#fff;font-size:15px;margin:10px 0 0;text-align:center}

.paper-body td a{overflow-wrap:anywhere}
.paper-body td:first-child,.paper-body th:first-child{min-width:7.5em}
@media (max-width:520px){.paper-body td:first-child,.paper-body th:first-child{min-width:6.2em}.paper-body table{font-size:14.5px}}

/* FAQ, added 3 November 2026 */
.faq{margin:0 0 1.5rem}
.faq dt{font-weight:600;margin:1rem 0 .25rem}
.faq dd{margin:0 0 .5rem}
.band-paper .rotator{margin-top:1rem}
.band-paper .q-text{font-size:clamp(24px,2.8vw,36px);max-width:40ch}
.band-paper .q[data-size="mid"] .q-text,.band-paper .q[data-size="long"] .q-text{font-size:clamp(22px,2.4vw,30px)}
.band-paper .q-src,.band-paper .rot-count{color:var(--muted,#4A5568)}
.band-paper .rot-btn{color:var(--ink,#121A2B);border-color:var(--rule,#C3CCDB)}
.band-paper .rot-btn:hover{background:rgba(29,47,94,.08)}
.band-paper .hero-land{border-top-color:var(--rule,#C3CCDB)}
/* 4 November 2026: kicker, hero note, steps on dark */
.kicker{font-size:16px;font-weight:600;letter-spacing:.02em;color:var(--on-blue-mute);margin:0 0 .8em}
.hero-note{color:var(--on-blue-mute);font-size:16px;margin:.6em 0 0}
.steps-dark{color:var(--on-blue)}
.steps-dark li{margin-bottom:.5em}
.band-white .q-text{font-size:clamp(24px,2.8vw,36px);max-width:40ch}
.band-white .q[data-size="mid"] .q-text,.band-white .q[data-size="long"] .q-text{font-size:clamp(22px,2.4vw,30px)}
.band-white .q-src,.band-white .rot-count{color:var(--muted,#4A5568)}
.band-white .rot-btn{color:var(--ink,#121A2B);border-color:var(--rule,#C3CCDB)}
.band-white .rot-btn:hover{background:rgba(29,47,94,.08)}
.band-white .hero-land{border-top-color:var(--rule,#C3CCDB)}

/* 4 November 2026: centre the reading column and scale up on large screens (Gary: half the screen, left-aligned on a laptop) */
.wrap.narrow{max-width:var(--measure)}
.narrow-in{margin-left:auto;margin-right:auto}
@media (min-width:1400px){html{font-size:17px}body{font-size:19px}}
@media (min-width:1800px){html{font-size:18px}body{font-size:20px}}
@media print{.wrap.narrow{max-width:none}}
@media (min-width:1100px){.hero .wrap.narrow>h1{max-width:none;margin-right:-14rem}}
.steps-dark li::marker{color:var(--ochre-lt,#EFC35A)}
.foot-in{max-width:var(--measure)}
.apps{max-width:var(--measure);margin-left:auto;margin-right:auto}
@media (min-width:900px){.apps{grid-template-columns:1fr}}
#faq h3{font-size:1.3em;margin:1.8em 0 .4em}
#faq h3:first-of-type{margin-top:.6em}
.faq dt{font-size:1em}