/* Anti-Racism Daily — palette "Live v1.1", 22 Sep 2026.
   Slot names are kept from brand identity v1.0 so every pair and component
   keeps its role; only the values changed, so the names no longer describe the
   colours: --lime and --pink are FLAME, --violet is FOREST, --red is SAND,
   --deep-violet is CREAM, --electric is TEAL, --periwinkle is OLIVE,
   --pale-pink is MAUVE. --acid is new. Pairs:
     HOUSE   ink + flame        3.9  (AA large only)
     LEARN   forest + acid lime 8.1  AAA
     ACT     sand + ink         5.6  AA
     FUND    flame + ink        3.9  (AA large only)
     LISTEN  teal + cream       4.6  AA
     READING paper + ink       16.6  AAA */

:root{
  --ink:#141D0C;          /* INK — house ground, body text */
  --lime:#E62E00;         /* FLAME — wordmark, Fund, Take action */
  --violet:#4C430B;       /* FOREST — Learn ground */
  --red:#A19163;          /* SAND — Act ground */
  --pink:#E62E00;         /* FLAME */
  --deep-violet:#E7DDCB;  /* CREAM — type on Teal and Forest */
  --electric:#496769;     /* TEAL — Listen ground */
  --paper:#FFFAEB;        /* PAPER — reading ground */
  --acid:#ECF014;         /* ACID LIME — accent, dark grounds only */
  --periwinkle:#9B9E00;   /* OLIVE — support tint, unassigned */
  --pale-pink:#C0B5A5;    /* MAUVE — support tint, unassigned */

  /* the working pair — every surface sets these two, nothing else */
  --ground:var(--paper);
  --type:var(--ink);

  --radius:18px;
  --radius-lg:26px;
  --pill:999px;
}

/* ─── pairs ─────────────────────────────────────────────────────────────
   A surface declares a pair and everything inside inherits it. A second
   pair may enter as a block or a card — never as type in the first field. */
.pair-house   {--ground:var(--ink);        --type:var(--lime)}
.pair-learn   {--ground:var(--violet);     --type:var(--lime)}
.pair-act     {--ground:var(--red);        --type:var(--ink)}
.pair-fund    {--ground:var(--pink);       --type:var(--deep-violet)}
.pair-listen  {--ground:var(--electric);   --type:var(--lime)}
.pair-read    {--ground:var(--paper);      --type:var(--ink)}
[class*="pair-"]{background:var(--ground);color:var(--type)}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Bricolage Grotesque','Helvetica Neue',Arial,sans-serif;
  font-size:19px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:var(--lime);color:var(--ink)}

.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.wrap-narrow{max-width:860px;margin:0 auto;padding:0 28px}

/* ─── type ──────────────────────────────────────────────────────────── */
h1,h2,h3,h4,.display{
  font-family:'Big Shoulders Display','Arial Narrow',sans-serif;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.005em;
  line-height:.9;
}
h1{font-size:clamp(46px,7.4vw,92px)}
h2{font-size:clamp(34px,4.6vw,60px)}
h3{font-size:clamp(26px,3vw,38px)}
h4{font-size:22px}

/* the serif italic marks a voice that isn't ours — never a headline alone */
.voice,blockquote{
  font-family:'Instrument Serif',Georgia,serif;
  font-style:italic;
  font-weight:400;
  font-size:1.18em;
  line-height:1.38;
  text-transform:none;
  letter-spacing:0;
}

/* labels are always mono */
.label,.eyebrow,.press-label,.sub-note,.sub-count,.meta{
  font-family:'Space Mono','SFMono-Regular',monospace;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1.5;
}
.label b,.meta b{font-weight:700}

/* reading measure — the one place the system goes quiet */
.read{max-width:66ch;font-size:19px;line-height:1.6}
.read p + p{margin-top:1.1em}

/* ─── wordmark ──────────────────────────────────────────────────────────
   Supplied artwork (lime, already set at its angle). Only ever placed on
   ink, where lime is its pair. The words are the mark. */
.logo{display:inline-block;line-height:0;flex-shrink:0}
.logo img{display:block;height:58px;width:auto}
footer .logo img{height:74px}

/* monogram — app icon, avatar, favicon, stamp */
.monogram{
  display:inline-grid;place-items:center;
  width:64px;height:64px;border-radius:20px;
  background:var(--deep-violet);color:var(--pink);
  font-family:'Big Shoulders Display',sans-serif;font-weight:900;
  font-size:28px;letter-spacing:.02em;
}

/* ─── pills ─────────────────────────────────────────────────────────── */
.pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 18px;border-radius:var(--pill);
  border:2px solid var(--type);color:var(--type);background:transparent;
  font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;white-space:nowrap;
  transition:background .15s,color .15s;
}
.pill:hover{background:var(--type);color:var(--ground)}
.pill.solid{background:var(--type);color:var(--ground)}
.pill.solid:hover{background:transparent;color:var(--type)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 30px;border:0;border-radius:var(--pill);cursor:pointer;
  background:var(--type);color:var(--ground);
  font-family:'Space Mono',monospace;font-size:13px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  transition:transform .12s;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}

/* ─── header ────────────────────────────────────────────────────────── */
/* house pair: ink ground, lime type */
header{background:var(--ink);color:var(--lime)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:28px;padding-top:22px;padding-bottom:22px;flex-wrap:wrap}
header nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
header nav a{
  display:inline-flex;align-items:center;
  padding:9px 18px;border-radius:var(--pill);border:2px solid var(--lime);
  font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;white-space:nowrap;
  transition:background .15s,color .15s;
}
header nav a:hover,header nav a[aria-current]{background:var(--lime);color:var(--ink)}
header nav a.sub{background:var(--lime);color:var(--ink)}
header nav a.sub:hover{background:transparent;color:var(--lime)}

/* ─── hero ──────────────────────────────────────────────────────────── */
.hero{background:var(--lime);color:var(--ink);padding:78px 0 70px}
.hero h1{max-width:16ch}
.hero h1 em{font-style:normal}
.hero .row{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;margin-top:40px;flex-wrap:wrap}
.hero .sub{font-size:19px;line-height:1.6;max-width:36ch}
.sub-count{margin-bottom:14px}
.sub-count b{font-weight:700}
.sub-note{margin-top:12px;opacity:1}

/* split hero (support, contact, subscribe) */
.split{background:var(--lime);color:var(--ink);padding:74px 0}
.split .wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split h1{max-width:14ch}
.split p{font-size:19px;line-height:1.6;max-width:36ch;margin-top:24px}
.split p.already{font-size:16px}
.split p a{border-bottom:2px solid currentColor}

/* ─── subscribe embed ───────────────────────────────────────────────── */
.bh-embed{width:100%;max-width:470px}
.bh-embed iframe{width:100%!important;border:0;background-color:transparent}
.bh-slot{max-width:470px;border:2px solid var(--type);border-radius:var(--radius);padding:20px 22px}
.bh-slot .lbl{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
.bh-slot p{font-size:16px;line-height:1.6;margin-top:10px}
.bh-slot a{border-bottom:2px solid currentColor}

/* ─── press wall ────────────────────────────────────────────────────── */
.press{background:var(--ink);color:var(--lime)}
.press .wrap{display:flex;align-items:center;gap:28px;padding-top:22px;padding-bottom:22px;flex-wrap:wrap}
.press-label{white-space:nowrap}
.logos{display:flex;align-items:center;gap:14px 22px;flex-wrap:wrap;flex:1}
.logos span,.logos a{
  font-family:'Big Shoulders Display',sans-serif;font-weight:800;
  font-size:19px;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap;
}
.logos a{border-bottom:2px solid var(--lime)}
.logos a:hover{background:var(--lime);color:var(--ink);border-color:transparent}

/* ─── cards ─────────────────────────────────────────────────────────── */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.card{background:var(--ground);color:var(--type);border-radius:var(--radius-lg);padding:26px 26px 28px}
.card.outline{background:transparent;border:2px solid var(--ink);color:var(--ink)}
.card h3{margin-bottom:12px}
.card .meta{margin-bottom:14px}
.card p{font-size:17px;line-height:1.6}
.card .meta:last-child{margin:16px 0 0}

/* ─── sections ──────────────────────────────────────────────────────── */
section{padding:74px 0}
.section-head{margin-bottom:34px}
.section-head .eyebrow{display:block;margin-bottom:14px}

.about{background:var(--paper);color:var(--ink)}
.about .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about .big{font-family:'Big Shoulders Display',sans-serif;font-weight:900;text-transform:uppercase;line-height:.9;font-size:clamp(32px,4.2vw,54px)}
.about .big em{font-style:normal}
.about p{font-size:18px;line-height:1.6;max-width:40ch}
.about p + p{margin-top:16px}

.index{background:var(--paper);color:var(--ink)}
.index .lbl{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.row-item{display:grid;grid-template-columns:96px 1fr 120px;gap:22px;align-items:center;padding:22px 24px;border-radius:var(--radius);background:var(--ink);color:var(--lime);margin-bottom:10px;transition:transform .14s}
.row-item:hover{transform:translateX(6px)}
.row-item .num,.row-item .date{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.row-item .date{text-align:right}
.row-item .title{font-family:'Big Shoulders Display',sans-serif;font-weight:900;text-transform:uppercase;font-size:28px;line-height:.95}
.row-item .arrow{display:none}
.empty-state{border:2px solid var(--ink);border-radius:var(--radius-lg);padding:56px 32px;text-align:center}
.empty-state h3{margin-bottom:14px}
.empty-state p{margin:0 auto;max-width:52ch;font-size:18px;line-height:1.6}

/* closing call to action — Act pair: the guide puts CTAs on tart red */
.cta{background:var(--red);color:var(--ink);--ground:var(--red);--type:var(--ink)}
.cta .wrap{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;flex-wrap:wrap}
.cta h2,.cta h3{max-width:15ch;font-size:clamp(34px,4.6vw,60px)}

/* ─── impact / support ──────────────────────────────────────────────── */
.impact{background:var(--paper);color:var(--ink)}
.impact h2{margin-bottom:30px}
.points{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.point{border-radius:var(--radius-lg);padding:26px}
.point:nth-child(4n+1){background:var(--ink);color:var(--lime)}
.point:nth-child(4n+2){background:var(--red);color:var(--ink)}
.point:nth-child(4n+3){background:var(--violet);color:var(--lime)}
.point:nth-child(4n+4){background:var(--pink);color:var(--deep-violet)}
.point .n{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;display:block;margin-bottom:12px}
.point h3{margin-bottom:10px;font-size:26px}
.point p{font-size:16px;line-height:1.6}

.donorbox-wrap{background:transparent;padding:0}

.faq{background:var(--violet);color:var(--lime)}
.faq h2{margin-bottom:28px}
.faq details{border-bottom:2px solid var(--lime);padding:20px 0}
.faq summary{cursor:pointer;list-style:none;font-family:'Big Shoulders Display',sans-serif;font-weight:800;text-transform:uppercase;font-size:24px;line-height:1}
.faq summary::-webkit-details-marker{display:none}
.faq details p{margin-top:14px;font-size:17px;line-height:1.6;max-width:62ch}

.disclaimer{background:var(--pink);color:var(--deep-violet)}
.disclaimer p{font-size:17px;line-height:1.6;max-width:70ch}
.disclaimer a{border-bottom:2px solid currentColor}

/* ─── forms ─────────────────────────────────────────────────────────── */
.form{max-width:640px}
.form label{display:block;margin-bottom:20px}
.form .lab{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;display:block;margin-bottom:8px}
.form input,.form textarea,.form select{
  width:100%;padding:15px 18px;border-radius:14px;
  border:2px solid var(--type);background:var(--ground);color:var(--type);
  font-family:'Bricolage Grotesque',sans-serif;font-size:17px;
}
.form input:focus,.form textarea:focus,.form select:focus{outline:3px solid var(--type);outline-offset:2px}
.form textarea{min-height:170px;resize:vertical}
.form .status{margin-top:16px;font-family:'Space Mono',monospace;font-size:13px;letter-spacing:.06em}

/* ─── footer ────────────────────────────────────────────────────────── */
footer{background:var(--ink);color:var(--lime);padding:60px 0 44px}
footer .wrap{display:grid;grid-template-columns:1fr auto;gap:44px;align-items:start}
footer nav{display:grid;grid-template-columns:repeat(3,auto);gap:10px 44px}
footer nav div{display:grid;gap:10px;align-content:start}
footer nav a{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
footer nav a:hover{border-bottom:2px solid var(--lime)}
footer .colophon{margin-top:40px;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase}

/* ─── cookie notice ─────────────────────────────────────────────────── */
.cc-banner{
  position:fixed;left:20px;right:20px;bottom:20px;z-index:60;
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  background:var(--ink);color:var(--lime);
  border-radius:var(--radius);padding:18px 22px;max-width:760px;margin:0 auto;
}
.cc-banner[hidden]{display:none}
.cc-banner p{font-size:15px;line-height:1.45;flex:1;min-width:230px}
.cc-banner a{border-bottom:2px solid var(--lime)}
.cc-actions{display:flex;gap:10px}
.cc-banner button{
  padding:10px 20px;border-radius:var(--pill);cursor:pointer;
  font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  border:2px solid var(--lime);background:transparent;color:var(--lime);
}
#cc-accept{background:var(--lime);color:var(--ink)}

/* ─── responsive ────────────────────────────────────────────────────── */
@media (max-width:860px){
  body{font-size:18px}
  .wrap,.wrap-narrow{padding:0 20px}
  section{padding:56px 0}
  .hero{padding:56px 0 52px}
  .split{padding:52px 0}
  .split .wrap,.about .wrap,footer .wrap{grid-template-columns:1fr;gap:34px}
  .hero .row,.cta .wrap{flex-direction:column;align-items:flex-start;gap:30px}
  .row-item{grid-template-columns:1fr;gap:10px;padding:20px}
  .row-item .date{text-align:left}
  header .wrap{gap:18px}
  .logo img{height:48px}
  header nav{gap:8px}
  header nav a{padding:8px 14px;font-size:11px}
  footer nav{grid-template-columns:repeat(2,auto);gap:22px 28px}
  .cc-banner{left:12px;right:12px;bottom:12px;padding:16px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  .row-item:hover,.btn:hover{transform:none}
}

/* ─── page heads ────────────────────────────────────────────────────── */
.page-head{background:var(--ink);color:var(--lime);padding:70px 0 58px}
.page-head h1 em{font-style:normal}
.page-head .intro{margin-top:24px;max-width:58ch;font-size:19px;line-height:1.6}
.page-head .intro a{border-bottom:2px solid currentColor}

/* long-form reading — ink on paper, 66ch, the one quiet block */
.prose{max-width:66ch}
.prose h2{margin:52px 0 18px}
.prose h2:first-child{margin-top:0}
.prose h3{margin:36px 0 14px}
.prose p{font-size:19px;line-height:1.6}
.prose p + p{margin-top:1.05em}
.prose ul{margin:18px 0 18px 22px}
.prose li{font-size:18px;line-height:1.6;margin-bottom:10px}
.prose a{border-bottom:2px solid currentColor}
/* the serif italic marks a voice that isn't ours */
.lede{
  font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;
  font-size:26px;line-height:1.36;margin-bottom:6px;
}

/* referral ladder */
.ladder{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.rung{border-radius:var(--radius-lg);padding:28px}
.rung:nth-child(1){background:var(--ink);color:var(--lime)}
.rung:nth-child(2){background:var(--violet);color:var(--lime)}
.rung:nth-child(3){background:var(--pink);color:var(--deep-violet)}
.rung .n{font-family:'Big Shoulders Display',sans-serif;font-weight:900;font-size:64px;line-height:.82;display:flex;align-items:baseline;gap:10px}
.rung .n small{font-family:'Space Mono',monospace;font-size:11px;font-weight:400;letter-spacing:.14em;text-transform:uppercase}
.rung h3{margin:18px 0 10px;font-size:26px}
.rung p{font-size:16px;line-height:1.6}

/* impact / support point lists */
.item{border-radius:var(--radius-lg);padding:26px;background:var(--ink);color:var(--lime)}
.item:nth-child(2n){background:var(--violet)}
.item:nth-child(3n){background:var(--red);color:var(--ink)}
.item h3{margin-bottom:10px;font-size:25px}
.item p{font-size:16px;line-height:1.6}
.points,.contacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.contacts .card{background:var(--ink);color:var(--lime)}
.contacts .card:nth-child(2n){background:var(--electric)}
.contacts .card p{margin-top:8px;font-family:'Space Mono',monospace;font-size:13px;letter-spacing:.06em}
.contacts .card a{border-bottom:2px solid currentColor}

/* accordions */
.acc{border-bottom:2px solid currentColor;padding:20px 0}
.acc summary{cursor:pointer;list-style:none;font-family:'Big Shoulders Display',sans-serif;font-weight:800;text-transform:uppercase;font-size:25px;line-height:1}
.acc summary::-webkit-details-marker{display:none}
.acc-body{padding-top:14px;max-width:66ch}
.acc-body ul,.acc-list{margin:14px 0 14px 22px}
.acc-body li{font-size:17px;line-height:1.6;margin-bottom:8px}
.acc-body a,.acc-list a{border-bottom:2px solid currentColor}
.note{font-size:17px;line-height:1.6}
.closing{font-size:18px;line-height:1.6;max-width:62ch}
.closing a{border-bottom:2px solid currentColor}

/* forms, continued */
.field{margin-bottom:20px}
.field label{display:block;font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}
.hint{display:block;margin-top:8px;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.form-msg{margin-top:16px;font-family:'Space Mono',monospace;font-size:13px;letter-spacing:.06em;min-height:1.2em}
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}
.join{max-width:470px}
.intro{font-size:19px;line-height:1.6;max-width:60ch}
.intro a{border-bottom:2px solid currentColor}

/* a section with no pair declared reads as paper + ink */
section:not([class]),section.impact,section.index{background:var(--paper);color:var(--ink)}
.about a,.hero a,.cta a{border-bottom:2px solid currentColor}

/* ─── homepage: about block + recent issues ─────────────────────────── */
.about .wrap{display:block}
.about-copy{max-width:60ch}
.about-copy p{font-size:20px;line-height:1.6}
.about-copy p + p{margin-top:1.05em}
.about-more,.cta-more{margin-top:26px}
.index .lbl h2.eyebrow,.index .lbl a.eyebrow{font-size:12px;letter-spacing:.14em;font-family:'Space Mono',monospace;text-transform:uppercase;font-weight:400;line-height:1.5}
.index .lbl a.eyebrow:hover{border-bottom:2px solid currentColor}
.cta .wrap{align-items:center}

/* ─── /support: the Fund pair — the guide assigns pink + deep violet to
   giving and mutual aid, so the whole page sits on it ────────────────── */
body.page-fund{background:var(--pink);color:var(--deep-violet)}
body.page-fund .split,
body.page-fund .impact,
body.page-fund .disclaimer{
  background:var(--pink);color:var(--deep-violet);
  --ground:var(--pink);--type:var(--deep-violet);
}
/* the fine print still reads as its own block, but without a second ground */
body.page-fund .disclaimer .wrap{border:2px solid var(--deep-violet);border-radius:var(--radius-lg);padding:26px 28px}
body.page-fund .disclaimer{padding-top:0}
/* point cards skip pink here so nothing sits pink-on-pink */
body.page-fund .point:nth-child(4n+1){background:var(--ink);color:var(--lime)}
body.page-fund .point:nth-child(4n+2){background:var(--violet);color:var(--lime)}
body.page-fund .point:nth-child(4n+3){background:var(--electric);color:var(--lime)}
body.page-fund .point:nth-child(4n+4){background:var(--deep-violet);color:var(--pink)}
body.page-fund .item{background:var(--ink);color:var(--lime)}
body.page-fund .item:nth-child(2n){background:var(--violet);color:var(--lime)}
body.page-fund .item:nth-child(3n){background:var(--electric);color:var(--lime)}

/* ─── guides grid (same component as the guide microsites) ─────────── */
.subhead{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin:0 0 26px}
.subhead h2{font-size:clamp(34px,4.6vw,60px)}
.more{background:var(--lime);color:var(--ink);--ground:var(--lime);--type:var(--ink)}
.more .guides{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.more .guides a{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center;min-height:84px;padding:18px 20px;border:2px solid var(--ink);border-radius:var(--radius);transition:background .15s,color .15s}
.more .guides a:hover,.more .guides a:focus-visible{background:var(--ink);color:var(--lime)}
.more .guides .i{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em}
.more .guides .t{font-family:'Big Shoulders Display',sans-serif;font-weight:900;text-transform:uppercase;font-size:24px;line-height:.95}
.more .more-link{margin-top:26px}

/* ─── /guides: what's inside every guide ────────────────────────────── */
.inside{background:var(--paper);color:var(--ink)}
.inside .cards{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.inside .card{border:2px solid var(--ink);background:transparent}
.inside .card .meta{margin-bottom:10px}
.inside .card h3{font-size:28px;margin-bottom:8px}
.inside .card p{font-size:16px}

/* ─── /key-terminology ─────────────────────────────────────────────── */
.gloss{background:var(--paper);color:var(--ink)}
.gloss-tools{display:grid;gap:18px;margin-bottom:40px}
.gloss-search{display:grid;gap:8px}
.gloss-search input{width:100%;padding:15px 18px;border:2px solid var(--ink);border-radius:14px;background:var(--paper);color:var(--ink);font-family:'Bricolage Grotesque',sans-serif;font-size:18px}
.gloss-search input:focus{outline:3px solid var(--ink);outline-offset:2px}
.az{display:flex;flex-wrap:wrap;gap:6px}
.az a,.az span{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;font-family:'Space Mono',monospace;font-size:13px}
.az a{border:2px solid var(--ink)}
.az a:hover{background:var(--ink);color:var(--lime)}
.az span{border:2px solid transparent;color:var(--ink)}
.gloss-empty{font-family:'Space Mono',monospace;font-size:13px;letter-spacing:.06em;margin-bottom:24px}
.letter{margin-bottom:34px;scroll-margin-top:20px}
.letter > .eyebrow{display:block;margin-bottom:6px}
.term{border-bottom:2px solid var(--ink);scroll-margin-top:30vh}
.letter .term:first-of-type{border-top:2px solid var(--ink)}
.term summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 4px}
.term summary::-webkit-details-marker{display:none}
.term summary:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.term .w{font-family:'Big Shoulders Display',sans-serif;font-weight:900;text-transform:uppercase;font-size:clamp(24px,2.6vw,32px);line-height:.95}
.term .x{position:relative;flex:0 0 30px;height:30px;border:2px solid var(--ink);border-radius:999px}
.term .x::before,.term .x::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;background:var(--ink);transform:translate(-50%,-50%)}
.term .x::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .15s}
.term[open] .x{background:var(--ink)}
.term[open] .x::before,.term[open] .x::after{background:var(--lime)}
.term[open] .x::after{transform:translate(-50%,-50%) rotate(0deg)}
.term p{padding:0 4px 22px;max-width:62ch;font-size:18px;line-height:1.6}

/* /guides: the list itself, on paper, with a one-line brief per guide */
.guides-page{background:var(--paper);color:var(--ink);--ground:var(--paper);--type:var(--ink)}
.guides-page .guides{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.guides-page .guides a{display:grid;grid-template-columns:44px 1fr;column-gap:12px;row-gap:10px;align-content:start;padding:22px 22px 24px;border:2px solid var(--ink);border-radius:var(--radius);transition:background .15s,color .15s}
.guides-page .guides a:hover,.guides-page .guides a:focus-visible{background:var(--ink);color:var(--lime)}
.guides-page .guides .i{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.14em;padding-top:5px}
.guides-page .guides .t{font-family:'Big Shoulders Display',sans-serif;font-weight:900;text-transform:uppercase;font-size:26px;line-height:.95}
.guides-page .guides .d{grid-column:2;font-size:16px;line-height:1.5}


/* ─── v1.1 readability layer ───────────────────────────────────────────
   The palette's own grading: HOUSE (ink+flame) and FUND (flame+ink) clear 3:1
   but not 4.5:1, so flame-on-ink and ink-on-flame are safe for large text only.
   Every other pair passes AA outright. So: display type keeps the pair colour,
   and running text on an ink ground uses PAPER instead of flame. Nothing in the
   palette reaches 4.5:1 on flame, so text on a flame ground stays ink and is set
   at large-text size where it is a paragraph. */

/* ink grounds: headlines and the wordmark in flame, running text in paper */
header,footer,.press,.page-head,.cc-banner,
.row-item,.item,.point:nth-child(4n+1),.contacts .card{color:var(--paper)}
header nav a,footer nav a,.press-label,.cc-banner p,
.row-item .num,.row-item .date,.logos span,.logos a{color:var(--paper)}
.page-head h1,.row-item .title,
.item h3,.point:nth-child(4n+1) h3,.contacts .card h3{color:var(--lime)}
header nav a,footer nav a:hover,.logos a{border-color:var(--paper)}
header nav a:hover,header nav a[aria-current]{background:var(--paper);color:var(--ink)}
header nav a.sub{background:var(--acid);color:var(--ink);border-color:var(--acid)}
header nav a.sub:hover{background:transparent;color:var(--acid)}
.logos a:hover{background:var(--paper);color:var(--ink)}
.cc-banner button{border-color:var(--paper);color:var(--paper)}
#cc-accept{background:var(--acid);color:var(--ink);border-color:var(--acid)}
/* ACT pair: the closing band is sand, so it takes ink */
.cta,.cta h2,.cta h3,.cta .pill{color:var(--ink);--type:var(--ink)}
.cta .pill{border-color:var(--ink)}
.cta .pill:hover{background:var(--ink);color:var(--red)}

/* LEARN — forest ground takes acid lime at any size */
.faq,.rung:nth-child(2),.item:nth-child(2n),.point:nth-child(4n+3){color:var(--acid)}
.faq h2,.faq summary,.rung:nth-child(2) .n,.rung:nth-child(2) h3,
.rung:nth-child(2) .n small,.item:nth-child(2n) h3,
.point:nth-child(4n+3) h3,.point:nth-child(4n+3) .n{color:var(--acid)}
.faq details{border-color:var(--acid)}

/* LISTEN — teal ground takes cream */
.contacts .card:nth-child(2n){color:var(--deep-violet)}
.contacts .card:nth-child(2n) h3{color:var(--deep-violet)}

/* FUND — flame grounds: ink type, paragraphs sized as large text */
.rung:nth-child(3),.point:nth-child(4n+4),.disclaimer,.hero{color:var(--ink)}
.rung:nth-child(3) .n,.rung:nth-child(3) h3,.rung:nth-child(3) .n small,
.point:nth-child(4n+4) h3{color:var(--ink)}
.hero .sub{font-size:22px;font-weight:700}

/* /support: flame hero band, the rest on paper so the body copy passes AA */
body.page-fund{background:var(--paper);color:var(--ink);--type:var(--ink)}
body.page-fund .split{background:var(--lime);--ground:var(--lime);--type:var(--ink);color:var(--ink)}
body.page-fund .split h1{color:var(--ink)}
body.page-fund .split p{font-size:22px;font-weight:700}
body.page-fund .split p.already{font-size:19px}
body.page-fund .impact,body.page-fund .disclaimer{background:var(--paper);color:var(--ink);--ground:var(--paper);--type:var(--ink)}
body.page-fund .impact > .wrap > h2{color:var(--ink)}
body.page-fund .disclaimer .wrap{border-color:var(--ink)}
body.page-fund .point:nth-child(4n+1){background:var(--ink);color:var(--paper)}
body.page-fund .point:nth-child(4n+1) h3{color:var(--lime)}
body.page-fund .point:nth-child(4n+2),body.page-fund .item:nth-child(2n){background:var(--violet);color:var(--acid)}
body.page-fund .point:nth-child(4n+2) h3,body.page-fund .item:nth-child(2n) h3{color:var(--acid)}
body.page-fund .point:nth-child(4n+3),body.page-fund .item:nth-child(3n){background:var(--electric);color:var(--deep-violet)}
body.page-fund .point:nth-child(4n+3) h3,body.page-fund .item:nth-child(3n) h3{color:var(--deep-violet)}
body.page-fund .point:nth-child(4n+4){background:var(--red);color:var(--ink)}
body.page-fund .point:nth-child(4n+4) h3{color:var(--ink)}

/* guides grid moves to the Act pair: sand carries the small briefs at 5.6:1 */
.more{background:var(--red);color:var(--ink);--ground:var(--red);--type:var(--ink)}
.more .guides a:hover,.more .guides a:focus-visible{background:var(--ink);color:var(--lime)}

/* the wordmark is masked artwork, so it takes the pair colour: flame on ink */
.logo{
  background:var(--lime);
  -webkit-mask:url(/assets/logo.png) no-repeat left center/contain;
          mask:url(/assets/logo.png) no-repeat left center/contain;
}
.logo img{opacity:0}

/* nothing in the palette reaches 4.5:1 on flame, so the sign-up block — whose
   labels are 12px mono — sits on a paper card inside the flame grounds */
.hero .join,.hero .row > div:last-child,
body.page-fund .split .join{background:var(--paper);color:var(--ink);border-radius:var(--radius);padding:20px 22px}
.hero .sub-count,.hero .sub-note,body.page-fund .split .sub-count{color:var(--ink)}

/* referral ladder and impact cards, with each card's ground and type matched */
.rung:nth-child(1){color:var(--paper)}
.rung:nth-child(1) .n,.rung:nth-child(1) h3{color:var(--lime)}
.rung:nth-child(1) .n small,.rung:nth-child(1) p{color:var(--paper)}
.rung:nth-child(2) p{color:var(--acid)}
.rung:nth-child(3){background:var(--red)}
.rung:nth-child(3),.rung:nth-child(3) .n,.rung:nth-child(3) h3,
.rung:nth-child(3) .n small,.rung:nth-child(3) p{color:var(--ink)}

.item,.item p{color:var(--paper)}
.item h3{color:var(--lime)}
.item:nth-child(2n),.item:nth-child(2n) p,.item:nth-child(2n) h3{color:var(--acid)}
.item:nth-child(3n){background:var(--electric)}
.item:nth-child(3n),.item:nth-child(3n) p,.item:nth-child(3n) h3{color:var(--deep-violet)}
body.page-fund .item:nth-child(3n),body.page-fund .item:nth-child(3n) p,
body.page-fund .item:nth-child(3n) h3{color:var(--deep-violet)}

/* .split bands carry running copy, which flame cannot hold at body size, so
   they use the Act pair (sand + ink, 5.6:1). /support keeps its flame band. */
.split{background:var(--red);color:var(--ink);--ground:var(--red);--type:var(--ink)}
/* the fine-print band also carries links at body size, so it moves to sand */
.disclaimer{background:var(--red);color:var(--ink);--ground:var(--red);--type:var(--ink)}
