/* Pathways of Promise Kenya — Design System (cream / teal / terracotta / charcoal)
   Lora (display + brand, same as the header) + Source Sans 3 (body + UI). Mobile-first.
   Icons: Bootstrap Icons (the same set as the POS). The header plugin loads the font on every page.
   Use them as <i class="bi bi-heart"></i>, inside .card__icon / .icon-tile for the tinted-tile look. */

/* 1. TOKENS */
:root{
  --cream:#FAF2E9;--cream-2:#F4E8D8;--cream-3:#EFDFC9;
  --teal:#4E6A7A;--teal-d:#3A525F;--teal-l:#6E8A9A;--teal-soft:#E4EBEF;
  --terra:#D07A55;--terra-d:#A85A39;--terra-l:#E8A986;--terra-soft:#F8E1D5;
  --ink:#2A2A2A;--ink-soft:#5A544C;--ink-mute:#8A8378;
  --line:#E5D9C7;--line-dark:#CFBFA6;--white:#FFF;--success:#3F7D58;--error:#B84A3E;
  --success-soft:#E2F1E8;--error-soft:#F7E2DF;

  /* type: one pairing everywhere, identical to the header */
  --font-serif:"Aleo",Georgia,"Times New Roman",serif;
  --font-sans:"Open Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fs-h1:clamp(2.3rem,6.5vw,4.2rem);--fs-h2:clamp(1.7rem,4.2vw,2.6rem);--fs-h3:clamp(1.2rem,2.6vw,1.5rem);--fs-h4:1.15rem;
  --fs-body:1.0625rem;--fs-small:.9375rem;--fs-eyebrow:.8125rem;

  --s-1:.5rem;--s-2:1rem;--s-3:1.5rem;--s-4:2rem;--s-5:3rem;--s-6:5rem;--s-7:7rem;
  --w-narrow:42rem;--w-default:68rem;--w-wide:80rem;

  /* radius scale (same ladder as the POS: card 12 / control 9 / tag 7); --r-btn matches the header Donate button */
  --r-sm:.35rem;--r-md:.6rem;--r-lg:1rem;--r-xl:1.5rem;--r-pill:999px;
  --r-card:.75rem;--r-ctl:.5625rem;--r-tag:.4375rem;--r-btn:.25rem;

  /* shadows: soft, layered, negative spread (POS "app" and "float" shadows in ink tones) */
  --sh-1:0 1px 2px rgba(42,42,42,.05),0 6px 20px -12px rgba(42,42,42,.14);
  --sh-2:0 1px 3px rgba(42,42,42,.06),0 10px 24px -14px rgba(42,42,42,.22);
  --sh-3:0 1px 3px rgba(42,42,42,.06),0 16px 34px -18px rgba(42,42,42,.3);
  --sh-focus:0 0 0 4px rgba(78,106,122,.18);

  /* motion: --ease-spring is the springy zoom used by the header */
  --t-fast:.18s ease;--t-base:.28s cubic-bezier(.2,.7,.2,1);--t-slow:.6s cubic-bezier(.2,.7,.2,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);

  --nav-break:1100px;
}

/* 2. BASE */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:6.5rem;scrollbar-width:thin;scrollbar-color:rgba(208,122,85,.55) var(--cream-2)}
body{margin:0;background:var(--cream);color:var(--ink);font:400 var(--fs-body)/1.65 var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--teal);text-underline-offset:3px}a:hover{color:var(--teal-d)}
h1,h2,h3,h4{font-family:var(--font-serif);color:var(--teal);line-height:1.15;margin:0 0 .5em;font-weight:600;letter-spacing:-.005em;text-wrap:balance}
h1{font-size:var(--fs-h1)}h2{font-size:var(--fs-h2)}h3{font-size:var(--fs-h3);line-height:1.35}h4{font-size:var(--fs-h4);line-height:1.35}
p{margin:0 0 1em;text-wrap:pretty}p:last-child{margin-bottom:0}
::selection{background:var(--terra);color:var(--white)}
:focus-visible{outline:3px solid var(--terra);outline-offset:2px;border-radius:var(--r-sm)}
.skip{position:absolute;left:-9999px;top:0;background:var(--white);color:var(--teal);padding:.75rem 1rem;z-index:1000;border-radius:0 0 var(--r-md) 0;font-weight:600}.skip:focus{left:0}
.sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* icons (Bootstrap Icons font) */
.bi{line-height:1}
.btn .bi,.chip .bi{font-size:1.1em;flex:none}

/* 3. LAYOUT */
.wrap{max-width:var(--w-default);margin:0 auto;padding:var(--s-5) var(--s-3)}
.wrap--narrow{max-width:var(--w-narrow)}.wrap--wide{max-width:var(--w-wide)}.wrap--tight{padding-top:var(--s-4);padding-bottom:var(--s-4)}
.section{padding:var(--s-6) 0}.section--tight{padding:var(--s-5) 0}
.section>.wrap,.footer>.wrap,.cta-banner>.wrap{padding-top:0;padding-bottom:0}
.section--cream{background:var(--cream-2)}
.section--band{background:var(--cream-3);border-block:1px solid var(--line)}
.section--teal{background:var(--teal);color:var(--white)}.section--teal h1,.section--teal h2,.section--teal h3{color:var(--white)}
.section--terra{background:var(--terra);color:var(--white)}.section--terra h2,.section--terra h3{color:var(--white)}

/* 4. TYPE HELPERS */
.eyebrow{display:inline-block;font:600 var(--fs-eyebrow)/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--terra-d);margin-bottom:var(--s-2)}
.section--teal .eyebrow,.section--terra .eyebrow,.hero .eyebrow{color:var(--terra-l)}
.lead{font-size:clamp(1.1rem,2vw,1.3rem);line-height:1.55;color:var(--ink-soft);max-width:60ch}
.section--teal .lead,.page-hero .lead{color:rgba(255,255,255,.88)}
.rule{border:0;border-top:2px solid var(--terra);width:3.5rem;margin:var(--s-3) 0}.rule--center{margin-inline:auto}
.prose{max-width:65ch;font-size:1.075rem;line-height:1.75}
.prose h2{margin-top:var(--s-5)}.prose h3{margin-top:var(--s-4)}.prose ul,.prose ol{padding-left:1.25rem}.prose li{margin-bottom:.4em}
.prose blockquote{border-left:4px solid var(--terra);padding:.5rem 0 .5rem 1.25rem;margin:var(--s-4) 0;font-family:var(--font-serif);font-style:italic;color:var(--ink-soft);font-size:1.15rem}

/* 5. BUTTONS (same corners + springy zoom as the header Donate button) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font:600 1rem/1 var(--font-sans);letter-spacing:.01em;padding:.85rem 1.4rem;border-radius:var(--r-btn);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background var(--t-fast),color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast),transform .35s var(--ease-spring);white-space:nowrap}
.btn:hover{transform:scale(1.04)}
.btn:active{transform:scale(.98)}
.btn--primary{background:var(--terra);color:var(--white);border-color:var(--terra)}
.btn--primary:hover{background:var(--terra-d);border-color:var(--terra-d);color:var(--white);box-shadow:0 10px 22px -8px rgba(208,122,85,.6)}
.btn--teal{background:var(--teal);color:var(--white);border-color:var(--teal)}
.btn--teal:hover{background:var(--teal-d);border-color:var(--teal-d);color:var(--white);box-shadow:0 10px 22px -8px rgba(58,82,95,.5)}
.btn--outline{background:transparent;color:var(--teal);border-color:var(--teal)}.btn--outline:hover{background:var(--teal);color:var(--white)}
.btn--ghost{background:transparent;color:var(--ink);padding-inline:.5rem}.btn--ghost:hover{color:var(--terra-d);transform:none}
.section--teal .btn--outline,.hero .btn--outline,.section--terra .btn--outline{color:var(--white);border-color:rgba(255,255,255,.7)}
.section--teal .btn--outline:hover,.hero .btn--outline:hover,.section--terra .btn--outline:hover{background:var(--white);color:var(--teal);border-color:var(--white)}
.btn--lg{padding:1rem 1.75rem;font-size:1.05rem}.btn--sm{padding:.55rem 1rem;font-size:.9rem}
.btn-group{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}

/* 6. HEADER BASE
   The header's own styling (bar, nav, zoom, shadow, mobile menu) lives in header/plugin.php.
   Only what other parts of the site share is kept here: sticky bar, brand text, brand mark/logo. */
.bar{position:sticky;top:0;z-index:50;padding-top:env(safe-area-inset-top)}
.bar a{text-decoration:none}
.brand{font:700 1.1rem/1.1 var(--font-serif);display:inline-flex;align-items:center;gap:.65rem;letter-spacing:-.005em;min-width:0}
.brand__mark{flex:none;width:2.8rem;height:2.8rem;border-radius:var(--r-sm);background:var(--terra);display:inline-flex;align-items:center;justify-content:center;color:var(--white);font:700 1.15rem var(--font-serif)}
.brand__logo{flex:none;height:3.6rem;width:auto;max-width:12rem;object-fit:contain;background:none;border-radius:var(--r-sm)}
@media (max-width:420px){.brand{font-size:.98rem}.brand span:last-child{max-width:9.5rem}}

/* 7. LOADER (once per visit) */
.loader{position:fixed;inset:0;z-index:999;background:var(--cream);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem;transition:opacity .5s ease,visibility .5s}
.loader.is-done{opacity:0;visibility:hidden;pointer-events:none}.seen .loader{display:none}
.loader .brand__mark,.loader .brand__logo{width:5rem;height:5rem;font-size:1.8rem;animation:pulse 1.4s ease-in-out infinite}
.loader .brand__logo{width:auto;max-width:14rem}
.loader__bar{width:7rem;height:3px;background:var(--line);border-radius:3px;overflow:hidden;position:relative}
.loader__bar::after{content:"";position:absolute;inset:0;width:40%;background:var(--terra);animation:slide 1s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.08)}}@keyframes slide{from{transform:translateX(-100%)}to{transform:translateX(260%)}}

/* 8. HERO + PAGE HEAD */
.hero{background:var(--teal);color:var(--white);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:-20% -10% auto auto;width:45rem;height:45rem;background:radial-gradient(circle,rgba(208,122,85,.2),transparent 60%);pointer-events:none}
.hero::after{content:"";position:absolute;inset:auto auto -30% -20%;width:40rem;height:40rem;background:radial-gradient(circle,rgba(110,138,154,.3),transparent 65%);pointer-events:none}
.hero .wrap{position:relative;padding:var(--s-7) var(--s-3) var(--s-6);max-width:var(--w-wide)}
.hero h1{color:var(--white);max-width:20ch}
.hero p{max-width:55ch;font-size:clamp(1.05rem,1.6vw,1.25rem);color:rgba(255,255,255,.9);margin-bottom:var(--s-4)}
.page-hero{background:var(--teal);color:var(--white);border-bottom:4px solid var(--terra)}
.page-hero .wrap{padding:var(--s-6) var(--s-3) var(--s-5)}.page-hero h1{color:var(--white);max-width:20ch;margin-bottom:.4em}.page-hero .eyebrow{color:var(--terra-l)}

/* 9. GRIDS */
.grid{display:grid;gap:var(--s-3);grid-template-columns:repeat(auto-fit,minmax(min(16rem,100%),1fr))}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(min(20rem,100%),1fr))}.grid--3{grid-template-columns:repeat(auto-fit,minmax(min(17rem,100%),1fr))}.grid--4{grid-template-columns:repeat(auto-fit,minmax(min(13rem,100%),1fr))}
.split{display:grid;gap:var(--s-4);grid-template-columns:minmax(0,1fr);align-items:center}
@media (min-width:800px){.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-5)}}

/* 10. CARDS + ICON TILES (POS style: hairline border, soft layered shadow, tinted icon tile that fills on hover) */
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s-3);box-shadow:var(--sh-1);transition:transform .35s var(--ease-spring),box-shadow var(--t-base),border-color var(--t-base);display:flex;flex-direction:column}
.card:hover{transform:translateY(-4px);box-shadow:var(--sh-3);border-color:var(--line-dark)}
.card h3{font-size:var(--fs-h4);margin:0 0 .5rem}.card p{color:var(--ink-soft);font-size:var(--fs-small)}
.card__icon,.icon-tile{width:2.75rem;height:2.75rem;border-radius:var(--r-ctl);background:var(--teal-soft);color:var(--teal);display:inline-flex;align-items:center;justify-content:center;margin-bottom:var(--s-2);flex:none;transition:background var(--t-base),color var(--t-base),transform .35s var(--ease-spring)}
.card__icon svg,.icon-tile svg{width:1.35rem;height:1.35rem}
.card__icon .bi,.icon-tile .bi{font-size:1.35rem;line-height:1}
.icon-tile--terra{background:var(--terra-soft);color:var(--terra-d)}
.card--programme .card__icon,.card--programme .icon-tile{background:var(--terra-soft);color:var(--terra-d)}
.card:hover .card__icon,.card:hover .icon-tile{background:var(--teal);color:var(--white);transform:scale(1.06)}
.card:hover .icon-tile--terra,.card--programme:hover .card__icon,.card--programme:hover .icon-tile{background:var(--terra);color:var(--white)}
.card--news{padding:0;overflow:hidden}.card--news .card__media{aspect-ratio:16/10;background:linear-gradient(135deg,var(--cream-2),var(--teal-soft))}
.card--news .card__media img{width:100%;height:100%;object-fit:cover}.card--news .card__body{padding:var(--s-3)}
.card--news time{display:block;font-size:var(--fs-eyebrow);text-transform:uppercase;letter-spacing:.1em;color:var(--terra-d);margin-bottom:.4rem;font-weight:600}
.give-list{list-style:none;padding:0;margin:0;display:grid;gap:var(--s-2)}.give-list li{display:flex;gap:1rem;align-items:flex-start}
.give-list .icon-tile{margin:0;flex:none}.give-list b{display:block;color:var(--teal)}

/* 11. STATS + CTA */
.stat-grid{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(min(11rem,100%),1fr));text-align:center;margin-top:var(--s-4)}
.stat{padding:var(--s-3) var(--s-2)}
.stat__num{display:block;font:700 clamp(2.2rem,5vw,3.2rem)/1 var(--font-serif);color:var(--terra-d);margin-bottom:.35rem}
.stat__label{display:block;font-size:var(--fs-small);color:var(--ink-soft)}
.section--teal .stat__num{color:var(--terra-l)}.section--teal .stat__label{color:rgba(255,255,255,.82)}
.cta-banner{background:var(--terra);color:var(--white);text-align:center}
.cta-banner .wrap{padding:var(--s-6) var(--s-3)}.cta-banner h2{color:var(--white);margin-bottom:var(--s-2)}
.cta-banner p{color:rgba(255,255,255,.94);max-width:55ch;margin:0 auto var(--s-4);font-size:1.1rem}
.cta-banner .btn--primary{background:var(--white);color:var(--terra-d);border-color:var(--white)}.cta-banner .btn--primary:hover{background:var(--cream);box-shadow:0 10px 22px -8px rgba(42,42,42,.35)}

/* 12. CHIPS + BADGES (7px tag radius, like the POS pills) */
.chip{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .9rem;border-radius:var(--r-tag);background:var(--white);border:1px solid var(--line);font:600 var(--fs-small) var(--font-sans);color:var(--teal);cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast),transform .3s var(--ease-spring)}
.chip:hover{background:var(--teal-soft);border-color:var(--teal-l);transform:scale(1.05)}.chip svg{width:1rem;height:1rem}
.chip-row{display:flex;flex-wrap:wrap;gap:.5rem}
.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.28rem .65rem;border-radius:var(--r-tag);background:var(--teal-soft);color:var(--teal-d);font:700 .75rem/1.2 var(--font-sans);letter-spacing:.02em}
.badge--terra{background:var(--terra-soft);color:var(--terra-d)}.badge--success{background:var(--success-soft);color:var(--success)}.badge--error{background:var(--error-soft);color:var(--error)}

/* 13. FORMS + TABLES */
.form{display:grid;gap:var(--s-3);max-width:36rem}
.form label{display:grid;gap:.35rem;font-weight:600;font-size:var(--fs-small)}
.form input,.form select,.form textarea{font:inherit;font-weight:400;font-size:1rem;padding:.75rem .9rem;border:1px solid var(--line-dark);border-radius:var(--r-btn);background:var(--white);color:var(--ink);box-shadow:0 1px 2px rgba(42,42,42,.05);transition:border-color var(--t-fast),box-shadow var(--t-fast);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--teal);box-shadow:var(--sh-focus);outline:none}
.form textarea{resize:vertical;min-height:8rem}.form__hint{font-size:.85rem;color:var(--ink-mute);font-weight:400}
.note{background:var(--white);border:1px solid var(--line);border-left:4px solid var(--terra);padding:var(--s-2) var(--s-3);border-radius:0 var(--r-ctl) var(--r-ctl) 0;color:var(--ink-soft);box-shadow:var(--sh-1)}
.note--success{border-left-color:var(--success)}.note--error{border-left-color:var(--error)}
.wrap table{width:100%;border-collapse:separate;border-spacing:0;background:var(--white);font-size:.92rem;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-1)}
.wrap th{background:var(--cream-2);color:var(--ink-soft);font:700 .72rem/1.2 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;padding:.8rem .9rem;text-align:left;border-bottom:1px solid var(--line)}
.wrap td{padding:.8rem .9rem;text-align:left;border-bottom:1px solid var(--line)}
.wrap tr:last-child td{border-bottom:0}
.wrap tbody tr td{transition:background var(--t-fast)}.wrap tbody tr:hover td{background:var(--cream)}

/* 14. FOOTER */
.footer{background:var(--teal-d);color:rgba(255,255,255,.85);padding:var(--s-6) 0 calc(var(--s-3) + env(safe-area-inset-bottom));border-top:4px solid var(--terra)}
.footer a{color:rgba(255,255,255,.85);text-decoration:none}.footer a:hover{color:var(--white);text-decoration:underline}.footer a.btn{color:var(--white);text-decoration:none}
.footer__grid{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(min(13rem,100%),1fr));margin-bottom:var(--s-5)}
.footer__brand .brand{margin-bottom:var(--s-2)}.footer__brand p{max-width:34ch;font-size:var(--fs-small)}
.footer h4{color:var(--white);font-size:1rem;margin-bottom:var(--s-2)}
.footer__grid>*{min-width:0}
.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.15rem}
.footer nav a{display:flex;align-items:center;gap:.5rem;min-height:2.5rem;color:var(--white)}
.footer nav a::before{content:"\203A";color:var(--terra-l);font-weight:700;font-size:1.2em;line-height:1;transition:transform .3s var(--ease-spring)}
.footer nav a:hover::before{transform:translateX(4px) scale(1.15)}
.footer__contact li{display:flex;gap:.6rem;align-items:center;min-width:0;min-height:2.5rem}.footer__contact a,.footer__contact li{overflow-wrap:anywhere;word-break:break-word}.footer__contact svg{width:1.1rem;height:1.1rem;flex:none;color:var(--terra-l)}
.footer__contact .bi{font-size:1.05rem;flex:none;color:var(--terra-l)}
.footer__bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:var(--s-3);display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);justify-content:space-between;align-items:center;font-size:var(--fs-small)}
.footer__social{display:flex;gap:.75rem}.footer__social a{width:2.4rem;height:2.4rem;border-radius:var(--r-ctl);background:rgba(255,255,255,.1);display:inline-flex;align-items:center;justify-content:center;transition:background var(--t-fast),transform .3s var(--ease-spring)}
.footer__social a:hover{background:var(--terra);transform:scale(1.12)}.footer__social svg{width:1.1rem;height:1.1rem}
.footer__social .bi{font-size:1.05rem}

/* 15. UTILITIES */
.text-center{text-align:center}.mt-0{margin-top:0}.mt-2{margin-top:var(--s-2)}.mt-3{margin-top:var(--s-3)}.mt-4{margin-top:var(--s-4)}.mt-5{margin-top:var(--s-5)}
.mb-0{margin-bottom:0}.mb-3{margin-bottom:var(--s-3)}.mb-4{margin-bottom:var(--s-4)}.stack>*+*{margin-top:var(--s-3)}.flow-wide{max-width:65ch}

/* 16. SCROLL REVEAL (visible if JS is off) */
.js .reveal{opacity:0;transform:translateY(20px);transition:opacity var(--t-slow),transform var(--t-slow)}
.js .reveal.is-visible{opacity:1;transform:none}
.grid>.reveal:nth-child(2),.stat-grid>.reveal:nth-child(2){transition-delay:.08s}.grid>.reveal:nth-child(3),.stat-grid>.reveal:nth-child(3){transition-delay:.16s}.grid>.reveal:nth-child(n+4),.stat-grid>.reveal:nth-child(n+4){transition-delay:.24s}

/* 16b. MOTION PREFERENCES + TOUCH (no hover zoom where it can't be used or isn't wanted) */
@media (hover:none){.btn:hover,.chip:hover,.footer__social a:hover,.card:hover .card__icon,.card:hover .icon-tile{transform:none}}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .btn:hover,.card:hover,.chip:hover,.footer__social a:hover,.card:hover .card__icon,.card:hover .icon-tile{transform:none}
}

/* 17. PHONES */
@media (max-width:600px){
  .section{padding:var(--s-5) 0}.hero .wrap{padding:var(--s-5) var(--s-3)}.page-hero .wrap{padding:var(--s-5) var(--s-3) var(--s-4)}
  .btn-group .btn,.btn--lg{flex:1 1 100%;width:100%}.btn:hover{transform:none}.stat-grid{grid-template-columns:repeat(2,1fr);gap:var(--s-2)}
  .footer{padding-top:var(--s-5)}.footer__bottom{flex-direction:column;align-items:flex-start}
  .footer__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-4) var(--s-3)}
  .footer__brand,.footer__grid>div:last-child{grid-column:1/-1}
  .footer nav a{border-bottom:1px solid rgba(255,255,255,.12);font-size:.98rem}.footer ul{gap:0}
  .footer__contact li{border-bottom:1px solid rgba(255,255,255,.12)}
}
@media (min-width:601px) and (max-width:1000px){.footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:360px){.footer__grid{grid-template-columns:minmax(0,1fr)}.btn{white-space:normal;text-align:center}}

/* 18. PRINT */
@media print{.bar,.footer,.btn,.loader{display:none!important}body{background:#fff;color:#000}a{color:#000;text-decoration:underline}}

/* ---- blog, publications, headings and table of contents ---- */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.toc__title{font:700 .8rem var(--font-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute);margin:0 0 .6rem}
.toc .toc__sub{margin:.1rem 0 .3rem .9rem;padding:0;border-left:0;display:block}.toc--inline .toc__sub{display:none}
.toc--aside .toc__sub a{font-size:.88rem;padding-top:.25rem;padding-bottom:.25rem}
.toc--aside a.is-active{color:var(--teal-d);border-left-color:var(--terra);font-weight:600}
.prose h2,.prose h3{scroll-margin-top:7rem}
.post-meta{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin:0 0 var(--s-3);color:var(--ink-soft);font-size:.95rem}
.post-meta>*+*::before{content:"\00b7";margin-right:1.2rem;color:var(--terra)}
.post-figure img{width:100%;height:auto;border-radius:var(--r-lg)}
.blog-search{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:var(--s-3)}
.blog-search input{flex:1 1 16rem;max-width:28rem;font:inherit;padding:.75rem 1rem;border:1px solid var(--line-dark);border-radius:var(--r-md);background:#fff}
.pager{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:var(--s-4)}
.pub .a-badge,.post-meta .a-badge{display:inline-block;padding:.15rem .6rem;border-radius:999px;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:var(--teal-soft);color:var(--teal-d)}
.pub .a-badge--hot{background:#F8E1D5;color:var(--terra-d)}
.pub-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3)}
.pub{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-3);padding:var(--s-3);background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.pub__icon{display:grid;place-items:center;width:4.5rem;height:5.5rem;border-radius:var(--r-md);background:var(--teal-soft);color:var(--teal-d);font-size:2rem}
.pub__cover img{width:4.5rem;height:5.5rem;object-fit:cover;border-radius:var(--r-md);display:block}
.pub__meta{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:0 0 .4rem;color:var(--ink-soft);font-size:.9rem}
.pub h3{margin:0 0 .3rem}.pub h3 a{color:inherit;text-decoration:none}.pub h3 a:hover{color:var(--teal-d);text-decoration:underline}
.pub__authors{margin:0 0 .5rem;color:var(--ink-soft);font-size:.95rem}
.cite{background:var(--cream);border-left:4px solid var(--terra);padding:var(--s-2) var(--s-3);border-radius:0 var(--r-md) var(--r-md) 0;font-size:.95rem}
@media(max-width:560px){.pub{grid-template-columns:1fr}}