/* ===========================================================
   PACT · AGM E-Booklet 2026 — editorial system
   v2 · poster-inspired colour + playful grotesque type
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&family=Hanken+Grotesk:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,500&display=swap');

:root{
  --paper:#FFFFFF;          /* white page — printed on cream stock */
  --paper-edge:#F0EEE9;
  --ink:#221D16;            /* warm near-black */
  --ink-soft:#5C5446;       /* muted body / captions */
  --line:#221D1622;
  --line-soft:#221D1612;

  /* poster palette */
  --red:#E5341E;
  --cobalt:#2540D8;
  --magenta:#C73B82;
  --green:#46A12C;
  --lime:#AFD60F;
  --purple:#5B4BC4;
  --yellow:#F4B40A;
  --cyan:#2BA8E0;

  --clay:#E5341E;           /* live section accent (set per-page by JS) */
  --olive:#6B6A47;
  --reverse:#241F18;
  --reverse-paper:#F4EEE1;
  --gold:#C8A24A;

  --display:'Bricolage Grotesque', system-ui, sans-serif;
  --text:'Hanken Grotesk', system-ui, sans-serif;

  --page-w:800px;
  --page-h:1131px;
  --mx:74px;
  --my:60px;

  --backdrop:#C7C0B2;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--backdrop);
  font-family:var(--text);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

@media screen and (max-width:840px){
  .reader{padding:20px 0 60px !important;align-items:center;overflow-x:hidden;}
  .page{transform:scale(var(--mob-scale,1));transform-origin:top center;margin-bottom:calc((var(--page-h) * (var(--mob-scale,1) - 1)) + 20px);}
  .navbtn{left:16px !important;bottom:16px !important;}
  .navpanel{left:16px !important;width:min(300px,calc(100vw - 32px)) !important;}
}
/* ---------- reader shell ---------- */
.reader{
  padding:54px 16px 120px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:30px;
}

/* ---------- page ---------- */
.page{
  position:relative;
  width:var(--page-w);
  height:var(--page-h);
  background:var(--paper);
  color:var(--ink);
  overflow:hidden;
  box-shadow:0 22px 60px -22px rgba(30,24,16,.55), 0 2px 6px rgba(30,24,16,.10);
  scroll-margin-top:80px;
}
.page__inner{
  position:absolute;
  inset:var(--my) var(--mx);
  display:flex;
  flex-direction:column;
  z-index:2;
}

/* running head + footer */
.runhead,.runfoot{
  position:absolute;
  left:var(--mx); right:var(--mx);
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  font-family:var(--text);
  font-weight:500;
  font-size:8.5px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--ink-soft);
  z-index:3;
}
.runhead{top:30px;padding-bottom:9px;border-bottom:1px solid var(--line-soft);}
.runfoot{bottom:30px;padding-top:9px;border-top:1px solid var(--line-soft);}
.runfoot .pg{font-variant-numeric:tabular-nums;letter-spacing:.16em;font-weight:700;color:var(--clay);}
.runhead .r,.runfoot .r{color:var(--ink-soft);}

/* dark / colour-field variants */
.page--rev{background:var(--reverse);color:var(--reverse-paper);}
.page--rev .runhead,.page--rev .runfoot,
.page--field .runhead,.page--field .runfoot{color:rgba(255,255,255,.72);}
.page--rev .runhead,.page--field .runhead{border-color:#ffffff2e;}
.page--rev .runfoot,.page--field .runfoot{border-color:#ffffff2e;}
.page--field .runfoot .pg{color:#fff;}
/* light-coloured fields (lime/yellow) need dark chrome */
.page--field.on-light .runhead,.page--field.on-light .runfoot{color:rgba(20,18,10,.66);}
.page--field.on-light .runhead{border-color:rgba(20,18,10,.2);}
.page--field.on-light .runfoot{border-color:rgba(20,18,10,.2);}
.page--field.on-light .runfoot .pg{color:#1b1a10;}

/* colour-field page (poster moments) */
.page--field{color:#fff;}
.field-bg{position:absolute;inset:0;z-index:0;overflow:hidden;}
.page--field .page__inner{z-index:2;}

/* ---------- type primitives ---------- */
.eyebrow{
  font-family:var(--text);
  font-weight:600;
  font-size:10px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--clay);
}
.eyebrow--muted{color:var(--ink-soft);}
.page--rev .eyebrow{color:var(--gold);}

.kicker{
  font-family:var(--text);
  font-weight:500;
  font-size:9px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--ink-soft);
}

h1.display{
  font-family:var(--display);
  font-weight:700;
  font-size:72px;
  line-height:.92;
  letter-spacing:-.025em;
  margin:0;
}
h2.head{
  font-family:var(--display);
  font-weight:600;
  font-size:53px;
  line-height:.94;
  letter-spacing:-.025em;
  margin:0;
}
h3.sub{
  font-family:var(--display);
  font-weight:500;
  font-size:23px;
  line-height:1.16;
  letter-spacing:-.018em;
  margin:0;
}
.lede{
  font-family:var(--text);
  font-weight:400;
  font-size:17.5px;
  line-height:1.5;
  color:var(--ink);
}
.body{
  font-family:var(--text);
  font-weight:400;
  font-size:13.5px;
  line-height:1.6;
  color:var(--ink-soft);
  text-wrap:pretty;
}
.body p{margin:0 0 12px;}
.body p:last-child{margin-bottom:0;}
.romnum{
  font-family:var(--display);
  font-style:normal;
  font-weight:700;
  color:var(--clay);
}
.serif-it{font-family:var(--display);font-style:normal;font-weight:500;}

/* placeholder convention */
.ph{
  border:1px solid var(--line);
  background:
    repeating-linear-gradient(135deg, transparent 0 12px, rgba(34,29,22,.022) 12px 13px);
  display:flex;align-items:center;justify-content:center;text-align:center;
  color:var(--ink-soft);font-family:var(--text);font-weight:500;
  font-size:9px;letter-spacing:.2em;text-transform:uppercase;padding:14px;
}
.tag{
  font-family:var(--text);font-weight:600;
  font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--clay);
}
.note{
  font-family:var(--text);font-weight:500;
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);
}
.tint{background:color-mix(in srgb, var(--clay) 7%, transparent);}

/* hairline rule */
.rule{height:1px;background:var(--line);border:0;margin:0;}
.rule--clay{height:3px;background:var(--clay);border:0;width:46px;margin:0;border-radius:2px;}

/* ---------- profile card ---------- */
.profiles{display:grid;gap:26px 30px;}
.profile{display:flex;flex-direction:column;gap:11px;}
.profile .pic{
  aspect-ratio:4/5;width:100%;
  border:1px solid var(--line);
  background:
    repeating-linear-gradient(135deg, transparent 0 12px, rgba(34,29,22,.022) 12px 13px);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--text);font-weight:500;font-size:8.5px;letter-spacing:.22em;color:var(--ink-soft);
}
.profile .nm{font-family:var(--display);font-weight:600;font-size:19px;line-height:1.04;letter-spacing:-.02em;}
.profile .ro{font-family:var(--text);font-weight:600;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--clay);}
.profile .qt{font-weight:400;font-size:13px;line-height:1.48;color:var(--ink);}

/* ---------- infographic primitives ---------- */
.metrics{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);}
.metric{background:var(--paper);padding:22px 20px 20px;}
.metric .fig{
  font-family:var(--display);font-weight:600;font-size:50px;line-height:.9;letter-spacing:-.03em;color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.metric .fig em{font-style:normal;color:var(--clay);}
.metric .lbl{
  margin-top:9px;font-family:var(--text);font-weight:500;font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-soft);line-height:1.5;
}
.metric .ph-fig{color:var(--clay);}

/* bar chart */
.bars{display:flex;flex-direction:column;gap:13px;}
.bar-row{display:grid;grid-template-columns:118px 1fr 42px;align-items:center;gap:14px;}
.bar-row .bl{font-family:var(--text);font-weight:600;font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft);}
.bar-track{height:10px;background:#221d1610;position:relative;border-radius:6px;overflow:hidden;}
.bar-fill{position:absolute;inset:0 auto 0 0;background:var(--clay);border-radius:6px;}
.bar-fill.olive{background:color-mix(in srgb, var(--clay) 42%, var(--paper));}
.bar-row .bv{font-family:var(--text);font-weight:600;font-size:10px;letter-spacing:.04em;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;}

.stat-lead{font-family:var(--display);font-weight:700;font-size:120px;line-height:.82;letter-spacing:-.04em;color:var(--clay);font-variant-numeric:tabular-nums;}

/* timeline */
.tl{display:flex;flex-direction:column;}
.tl-item{display:grid;grid-template-columns:74px 1fr;gap:18px;padding:15px 0;border-top:1px solid var(--line-soft);}
.tl-item:last-child{border-bottom:1px solid var(--line-soft);}
.tl-item .yr{font-family:var(--text);font-weight:700;font-size:11px;letter-spacing:.08em;color:var(--clay);padding-top:3px;}
.tl-item .ti{font-family:var(--display);font-weight:500;font-size:16px;letter-spacing:-.02em;margin-bottom:4px;}

/* list of names */
.namelist{columns:2;column-gap:34px;font-family:var(--text);font-weight:400;font-size:13px;line-height:1.8;color:var(--ink);}
.namelist .n{break-inside:avoid;}

/* ---------- contents / nav ---------- */
.toc{display:flex;flex-direction:column;gap:0;}
.toc a{
  display:grid;grid-template-columns:34px 1fr auto;align-items:baseline;gap:14px;
  padding:12px 0;border-top:1px solid var(--line-soft);
  text-decoration:none;color:var(--ink);
}
.toc a:last-child{border-bottom:1px solid var(--line-soft);}
.toc .ix{font-family:var(--display);font-weight:700;color:var(--clay);font-size:15px;letter-spacing:-.02em;}
.toc .ti{font-family:var(--display);font-weight:500;font-size:16px;letter-spacing:-.02em;}
.toc .ti small{display:block;font-family:var(--text);font-weight:500;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-top:2px;}
.toc .pg{font-family:var(--text);font-weight:600;font-size:10px;letter-spacing:.08em;color:var(--ink-soft);font-variant-numeric:tabular-nums;}
.toc a:hover .ti{color:var(--clay);}

/* section opener */
.opener{height:100%;display:flex;flex-direction:column;justify-content:space-between;}
.opener .big{font-family:var(--display);font-weight:800;font-size:96px;line-height:.88;letter-spacing:-.035em;}
.opener .secno{font-family:var(--display);font-weight:800;font-size:150px;line-height:.8;color:#ffffff1f;}

/* full-bleed image layer */
.bleed{position:absolute;inset:0;}
.bleed img{width:100%;height:100%;object-fit:cover;display:block;}
img.framed{width:100%;height:100%;object-fit:cover;display:block;border:0;}
.imgbox{overflow:hidden;border:1px solid var(--line);}

/* ---------- circle motif (poster graphic) ---------- */
.circles{position:absolute;inset:0;width:100%;height:100%;display:block;}
.circles circle, .circles ellipse, .circles path, .circles rect{shape-rendering:geometricPrecision;}

/* utility */
.col{display:flex;flex-direction:column;}
.spread{flex:1;display:flex;flex-direction:column;}
.mt-auto{margin-top:auto;}
.grow{flex:1;}
.two{display:grid;grid-template-columns:1fr 1fr;gap:34px;}
.muted{color:var(--ink-soft);}
.clay{color:var(--clay);}

/* ---------- floating contents button + panel ---------- */
.navbtn{
  position:fixed;left:22px;bottom:22px;z-index:50;
  font-family:var(--text);font-weight:600;font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  background:var(--ink);color:var(--paper);border:0;border-radius:999px;
  padding:13px 20px;cursor:pointer;box-shadow:0 8px 24px -8px rgba(0,0,0,.5);
}
.navbtn::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--red);margin-right:9px;vertical-align:middle;}
.navpanel{
  position:fixed;left:22px;bottom:70px;z-index:50;width:300px;max-height:72vh;overflow:auto;
  background:var(--paper);border:1px solid var(--line);border-radius:10px;
  box-shadow:0 24px 60px -18px rgba(0,0,0,.5);padding:10px 6px;
  display:none;
}
.navpanel.open{display:block;}
.navpanel a{display:flex;justify-content:space-between;gap:12px;text-decoration:none;
  color:var(--ink);font-family:var(--text);font-weight:500;font-size:10.5px;letter-spacing:.02em;
  padding:7px 14px;border-radius:6px;}
.navpanel a:hover{background:#221d1610;color:var(--clay);}
.navpanel a .pn{color:var(--ink-soft);font-variant-numeric:tabular-nums;font-weight:600;}
.navpanel .grp{font-family:var(--text);font-weight:700;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--clay);padding:14px 14px 6px;}

/* ---------- amplified colour + graphic (v3) ---------- */
/* circular profile photos with section-colour ring */
.profile .pic{
  aspect-ratio:1/1;border-radius:50%;
  border:3px solid var(--clay);
  background:color-mix(in srgb, var(--clay) 9%, var(--paper));
  color:var(--clay);
}

/* bold circular number badge (section colour) */
.num-badge{
  width:82px;height:82px;border-radius:50%;flex:none;
  background:var(--clay);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:700;font-size:27px;letter-spacing:-.02em;
}

/* lead metric tile filled with section colour (poster block) */
.metrics .metric:first-child{background:var(--clay);}
.metrics .metric:first-child .fig,
.metrics .metric:first-child .fig .ph-fig,
.metrics .metric:first-child .fig em{color:#fff;}
.metrics .metric:first-child .lbl{color:rgba(255,255,255,.86);}

/* placeholders pick up the section colour */
.ph{
  border-color:color-mix(in srgb, var(--clay) 38%, var(--line));
  background:repeating-linear-gradient(135deg, transparent 0 11px, color-mix(in srgb, var(--clay) 7%, transparent) 11px 12px);
  color:color-mix(in srgb, var(--clay) 62%, var(--ink-soft));
}

/* decorative circle rail injected into content-page outer margin */
.deco-rail{position:absolute;right:26px;top:120px;z-index:1;display:flex;flex-direction:column;gap:14px;pointer-events:none;}
.deco-rail i{width:16px;height:16px;border-radius:50%;background:var(--clay);display:block;}
.deco-rail i:nth-child(3n+2){background:color-mix(in srgb, var(--clay) 38%, var(--paper));}
.deco-rail i:nth-child(4n+3){background:transparent;border:2px solid var(--clay);}

/* circle graphics that bleed off the page edges (poster motif) */
.edge-deco{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;}

/* ===========================================================
   Model of Change — theory-of-change ladder
   =========================================================== */
.moc{position:relative;z-index:2;display:flex;flex-direction:column;}
.moc-legend{display:flex;align-items:stretch;border:1px solid var(--line);background:var(--paper);}
.moc-legend .cell{flex:1;padding:11px 13px;border-right:1px solid var(--line);}
.moc-legend .cell:last-child{border-right:0;}
.moc-legend .ln{font-family:var(--display);font-weight:700;font-size:14px;letter-spacing:-.02em;color:var(--clay);display:flex;align-items:center;gap:7px;}
.moc-legend .ln .d{width:9px;height:9px;border-radius:50%;background:var(--clay);flex:none;}
.moc-legend .cell:nth-child(2) .ln .d{background:color-mix(in srgb,var(--clay) 55%,var(--paper));}
.moc-legend .cell:nth-child(3) .ln .d{background:transparent;border:2px solid var(--clay);}
.moc-legend .cell:nth-child(4) .ln .d{background:var(--ink);}
.moc-legend small{display:block;font-family:var(--text);font-weight:600;font-size:7.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft);margin-top:5px;line-height:1.4;}

.moc-stage{display:flex;align-items:center;gap:11px;}
.moc-stage .no{font-family:var(--display);font-weight:800;font-size:12px;letter-spacing:.02em;color:#fff;background:var(--clay);border-radius:50%;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.moc-stage .tt{font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:-.01em;color:var(--ink);}
.moc-stage .tt b{color:var(--clay);font-weight:600;}

.moc-card{border:1px solid var(--line);border-top:3px solid var(--clay);background:var(--paper);padding:13px 13px 15px;display:flex;flex-direction:column;gap:9px;}
.moc-card .ch{font-family:var(--text);font-weight:700;font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--clay);}
.moc-card .ct{font-family:var(--display);font-weight:600;font-size:17px;line-height:1.02;letter-spacing:-.02em;color:var(--ink);}
.moc-card .ct span{display:block;font-family:var(--text);font-weight:600;font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-top:4px;}

.chips{display:flex;flex-wrap:wrap;gap:5px;}
.chip{font-family:var(--text);font-weight:600;font-size:9.5px;letter-spacing:.005em;color:var(--ink);background:color-mix(in srgb,var(--clay) 9%,var(--paper));border:1px solid color-mix(in srgb,var(--clay) 28%,transparent);border-radius:999px;padding:4px 10px;line-height:1.12;}

.moc-arrow{display:flex;align-items:center;justify-content:center;gap:11px;}
.moc-arrow::before,.moc-arrow::after{content:"";height:1px;flex:1;background:var(--line);}
.moc-arrow .tri{width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid var(--clay);}

.moc-outcome{border:1.5px solid var(--clay);background:color-mix(in srgb,var(--clay) 8%,var(--paper));padding:15px 18px;display:flex;flex-direction:column;gap:11px;}
.moc-outcome .ot{font-family:var(--display);font-weight:600;font-size:21px;line-height:1.04;letter-spacing:-.02em;color:var(--ink);}

.moc-impact{background:var(--clay);color:#fff;padding:19px 20px 21px;display:flex;flex-direction:column;gap:12px;position:relative;overflow:hidden;}
.moc-impact .it{font-family:var(--display);font-weight:600;font-size:23px;line-height:1.08;letter-spacing:-.02em;color:#fff;max-width:30ch;position:relative;z-index:1;}
.moc-impact .eyebrow{color:#fff;opacity:.9;}
.moc-impact .chips{position:relative;z-index:1;}
.moc-impact .chip{color:#fff;background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.34);}
.moc-impact .impact-circ{position:absolute;right:-40px;bottom:-60px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.08);z-index:0;}

/* ---- circular Model of Change ---- */
.moc-ring{position:relative;width:470px;height:470px;margin:30px auto 0;}
.moc-ring svg{display:block;}
.ring-lab{position:absolute;}
.ring-lab span{font-family:var(--display);font-weight:600;font-size:14px;letter-spacing:-.01em;color:var(--ink);white-space:nowrap;}
.lab-top{left:0;right:0;top:0;transform:translateY(-128%);text-align:center;}
.lab-bottom{left:0;right:0;bottom:0;transform:translateY(128%);text-align:center;}
.lab-left{right:100%;top:50%;transform:translateY(-50%);margin-right:10px;text-align:right;}
.lab-right{left:100%;top:50%;transform:translateY(-50%);margin-left:10px;}

.moc-keys{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:46px;}
.moc-key{display:flex;flex-direction:column;gap:8px;}
.moc-key-h{display:flex;align-items:center;gap:8px;}
.kbadge{width:26px;height:26px;border-radius:50%;color:#fff;font-family:var(--display);font-weight:800;font-size:12px;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.kname{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:-.01em;color:var(--ink);}
.kdesc{font-family:var(--text);font-weight:600;font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);}
.kitems{display:flex;flex-direction:column;gap:5px;}
.kitems span{font-family:var(--text);font-weight:500;font-size:10.5px;line-height:1.28;color:var(--ink);padding-left:12px;position:relative;}
.kitems span::before{content:"";position:absolute;left:0;top:6px;width:5px;height:5px;border-radius:50%;background:var(--ink);opacity:.32;}

/* Model of Change — detail panels (page 2) */
.moc-panels{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.moc-panel{border:1px solid var(--line);border-top:3px solid var(--clay);background:var(--paper);padding:15px 16px 16px;display:flex;flex-direction:column;gap:11px;}
.moc-panel .moc-stage .no{width:24px;height:24px;font-size:11px;}
.moc-panel .moc-stage .tt{font-size:18px;}
.pdesc{font-family:var(--text);font-weight:600;font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--clay);margin-top:-5px;}
.pgroup{display:flex;flex-direction:column;gap:3px;}
.pg-h{font-family:var(--display);font-weight:600;font-size:12.5px;letter-spacing:-.01em;color:var(--ink);}
.pg-h span{font-family:var(--text);font-weight:600;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);}
.pg-items{font-family:var(--text);font-weight:400;font-size:10.5px;line-height:1.5;color:var(--ink-soft);}

/* ---- farewell speech ---- */
.speech-meta{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-top:9px;}
.speech-meta .nm{font-family:var(--display);font-weight:600;font-size:19px;letter-spacing:-.02em;color:var(--ink);}
.speech-meta .ro{font-family:var(--text);font-weight:600;font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--clay);}
.standfirst{font-family:var(--display);font-weight:300;font-style:italic;font-size:25px;line-height:1.18;letter-spacing:-.015em;color:var(--ink);max-width:30ch;}
.standfirst b{font-weight:500;font-style:normal;color:var(--clay);}
.speech{columns:3;column-gap:24px;column-rule:1px solid var(--line-soft);}
.speech p{font-family:var(--text);font-weight:400;font-size:10px;line-height:1.6;color:var(--ink-soft);margin:0 0 11px;text-align:justify;hyphens:auto;-webkit-hyphens:auto;}
.speech p:first-of-type::first-letter{font-family:var(--display);font-weight:700;font-size:42px;line-height:.82;float:left;color:var(--clay);margin:3px 7px 0 0;}
.speech .sig{font-family:var(--display);font-weight:600;font-style:normal;font-size:13px;color:var(--ink);text-align:left;margin-top:2px;}
.speech .sig em{display:block;font-family:var(--text);font-weight:600;font-style:normal;font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-top:3px;}

/* ---- pathways (Learn · Earn · Belong) ---- */
.pw-rows{display:flex;flex-direction:column;gap:2px;}
.pw-row{display:grid;grid-template-columns:178px 1fr;gap:18px;align-items:stretch;border:1px solid var(--line);border-left:5px solid var(--clay);background:color-mix(in srgb,var(--clay) 5%,var(--paper));padding:15px 17px;}
.pw-cap{display:flex;flex-direction:column;gap:8px;border-right:1px solid var(--line);padding-right:16px;}
.pw-cap .v{font-family:var(--display);font-weight:700;font-size:30px;line-height:.92;letter-spacing:-.03em;color:var(--clay);}
.pw-cap .v small{display:block;font-family:var(--text);font-weight:700;font-size:7.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:5px;}
.pw-goal{font-family:var(--display);font-weight:300;font-style:italic;font-size:11.5px;line-height:1.28;color:var(--ink);}
.pw-goal + .pw-goal{padding-top:6px;border-top:1px dashed var(--line);}
.pw-chips{display:flex;flex-wrap:wrap;gap:6px;align-content:flex-start;}
.pw-chip{font-family:var(--text);font-weight:600;font-size:9.5px;line-height:1.15;color:var(--ink);background:var(--paper);border:1px solid color-mix(in srgb,var(--clay) 35%,var(--line));border-radius:999px;padding:5px 11px;white-space:nowrap;}
.pw-chip.solid{background:var(--clay);color:#fff;border-color:var(--clay);}

/* interchange bridges between rows */
.pw-bridge{position:relative;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:7px;padding:13px 0;}
.pw-bridge::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:0;border-left:2px dashed color-mix(in srgb,var(--ink) 24%,transparent);z-index:0;}
.pw-bridge .blab{position:relative;z-index:1;background:var(--paper);font-family:var(--text);font-weight:700;font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);padding:0 9px;}
.bchip{position:relative;z-index:1;display:inline-flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-family:var(--text);font-weight:600;font-size:9.5px;color:var(--ink);box-shadow:0 1px 0 rgba(0,0,0,.03);white-space:nowrap;}
.bchip .dd{display:inline-flex;gap:3px;}
.bchip .dd i{width:7px;height:7px;border-radius:50%;display:block;}
.pw-legend{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;font-family:var(--text);font-weight:600;font-size:8.5px;letter-spacing:.04em;color:var(--ink-soft);}
.pw-legend .k{display:inline-flex;align-items:center;gap:6px;}
.pw-legend .k i{width:9px;height:9px;border-radius:50%;display:block;}

/* hand-drawn line illustrations (blend onto cream paper) */
.illus{display:flex;flex-direction:column;}
.illus img{width:100%;height:auto;display:block;}
.illus .cap{font-family:var(--text);font-weight:600;font-size:8.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);margin-top:10px;}

/* voice / testimonial block */
.voices-grid{display:grid;gap:17px 24px;}
.voice{border-top:2px solid var(--clay);padding-top:12px;display:flex;flex-direction:column;}
.voice .vq{font-family:var(--display);font-weight:400;font-size:14px;line-height:1.36;letter-spacing:-.005em;color:var(--ink);}
.voice .vq.af{font-style:italic;font-weight:300;}
.voice .vn{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:-.01em;color:var(--ink);margin-top:11px;}
.voice .vr{font-family:var(--text);font-weight:600;font-size:8px;letter-spacing:.17em;text-transform:uppercase;color:var(--clay);margin-top:3px;}
.voice .vth{font-family:var(--text);font-weight:600;font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-top:7px;}

/* page 09 — interview grid: keep circles round but compact so all six fit */
#p-blinkbegin .profiles{gap:14px 24px;}
#p-blinkbegin .profile{gap:9px;}
#p-blinkbegin .profile .pic{max-width:116px;}
#p-blinkbegin .profile .nm{font-size:17px;}
#p-blinkbegin .profile .qt{font-size:11.5px;line-height:1.4;}

/* page 12 — youth crew, in their words: circle photo + quote rows */
#p-youth .crew-words{gap:0;}
#p-youth .crew-row{display:flex;gap:22px;align-items:flex-start;border-top:1px solid var(--line-soft);padding:15px 0;}
#p-youth .crew-row:first-child{border-top:0;padding-top:4px;}
#p-youth .crew-body{flex:1;min-width:0;}
#p-youth .crew-body .nm{font-family:var(--display);font-weight:600;font-size:19px;line-height:1.05;letter-spacing:-.02em;}
#p-youth .crew-body .ro{font-family:var(--text);font-weight:600;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--clay);margin-top:5px;}
#p-youth .crew-body .qt{margin:8px 0 0;font-size:12px;line-height:1.46;color:var(--ink);}

@media print{
  body{background:#fff;}
  .reader{padding:0;gap:0;}
  .page{box-shadow:none;page-break-after:always;}
  .navbtn,.navpanel{display:none !important;}
}