/*! LLRN theme components — extracted from approved design system. Tokens live in theme.json; this file carries component classes used by block patterns. */

/* ============================================================
   TOKENS
   ============================================================ */
:root{
  --paper:#FBFAF5;
  --surface:#FFFFFF;
  --cream:#F0EDDF;
  --ink:#1C2A26;
  --muted:#54635D;
  --faint:#5F6A63;
  --line:#E4E0D2;
  --line-soft:#EEEBDD;
  --green:#2F544C;
  --green-deep:#223E38;
  --green-soft:#EAF0EC;
  --green-line:#CBDAD1;
  --green-text:#2F544C;
  --btn-green-bg:#2F544C;
  --btn-green-fg:#FFFFFF;
  --btn-accent-fg:#FFFFFF;
  --panel-green:#2A4A42;
  --btn-green-bg-hover:#223E38;
  --btn-green-fg-hover:#FFFFFF;
  --btn-accent-bg-hover:#956618;
  --btn-accent-fg-hover:#FFFFFF;
  --control-border:#6E7C75;
  --accent:#8A5D15;
  --accent-bright:#D9A85C;
  --accent-soft:#F4EAD5;
  --shadow:0 1px 2px rgba(28,42,38,.05), 0 8px 24px -12px rgba(28,42,38,.14);
  --shadow-lg:0 24px 60px -24px rgba(28,42,38,.30);
  --radius:14px;
  --radius-sm:9px;
  --maxw:1180px;
  --logo-plate:transparent;

  color-scheme: light;

  --sans:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --serif:"Spectral",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}
:root:not([data-theme="light"]){
  @media (prefers-color-scheme:dark){
    --paper:#121B18;
    --surface:#1B2723;
    --cream:#20302A;
    --ink:#ECEFE9;
    --muted:#A2AFA8;
    --faint:#8E9A93;
    --line:#2C3B35;
    --line-soft:#243029;
    --green:#5C9182;
    --green-deep:#0E1613;
    --green-soft:#22302A;
    --green-line:#33453D;
    --green-text:#86B5A5;
    --btn-green-bg:#7FB3A2;
    --btn-green-fg:#0E1613;
    --btn-accent-fg:#121B18;
    --panel-green:#2A4A42;
    --btn-green-bg-hover:#A5CBBD;
    --btn-green-fg-hover:#0E1613;
    --btn-accent-bg-hover:#E0B975;
    --btn-accent-fg-hover:#121B18;
    --control-border:#8E9A93;
    --accent:#D4A653;
    --accent-bright:#E0B975;
    --accent-soft:#2A3026;
    --logo-plate:#FBFAF5;
    color-scheme: dark;
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 30px -14px rgba(0,0,0,.6);
    --shadow-lg:0 30px 70px -30px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  --paper:#121B18;
  --surface:#1B2723;
  --cream:#20302A;
  --ink:#ECEFE9;
  --muted:#A2AFA8;
  --faint:#8E9A93;
  --line:#2C3B35;
  --line-soft:#243029;
  --green:#5C9182;
  --green-deep:#0E1613;
  --green-soft:#22302A;
  --green-line:#33453D;
  --green-text:#86B5A5;
  --btn-green-bg:#7FB3A2;
  --btn-green-fg:#0E1613;
  --btn-accent-fg:#121B18;
  --panel-green:#2A4A42;
  --btn-green-bg-hover:#A5CBBD;
  --btn-green-fg-hover:#0E1613;
  --btn-accent-bg-hover:#E0B975;
  --btn-accent-fg-hover:#121B18;
  --control-border:#8E9A93;
  --accent:#D4A653;
  --accent-bright:#E0B975;
  --accent-soft:#2A3026;
  --logo-plate:#FBFAF5;
  color-scheme: dark;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 30px -14px rgba(0,0,0,.6);
  --shadow-lg:0 30px 70px -30px rgba(0,0,0,.7);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.12;margin:0;text-wrap:balance;color:var(--ink)}
p{margin:0}
::selection{background:var(--accent-soft);color:var(--ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}

/* ============================================================
   SITE COMPONENT LIBRARY  (inside frames)
   ============================================================ */
.site{color:var(--ink);font-family:var(--sans)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4vw,44px)}

/* header */
.site{margin-top:0}
.llrn-head{position:relative;background:var(--surface)}
.llrn-navbar{position:relative;z-index:50;background:var(--surface);border-bottom:1px solid var(--line)}
.llrn-navbar.pinned{position:fixed;top:0;left:0;right:0;box-shadow:0 6px 20px -12px rgba(28,42,38,.35)}
/* keep the pinned bar below the WordPress admin bar when logged in */
body.admin-bar .llrn-navbar.pinned{top:32px}
@media (max-width:782px){body.admin-bar .llrn-navbar.pinned{top:46px}}
.llrn-navbar-spacer{display:none}
.llrn-navbar-spacer.on{display:block}
.llrn-topbar{background:var(--green-deep);color:#dfeae4}
.llrn-topbar .wrap{display:flex;align-items:center;gap:18px;height:38px;font-size:12.5px}
.llrn-topbar .mono{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:#b9ccc3}
.llrn-topbar .sp{margin-left:auto}
.llrn-topbar a{color:#dfeae4;display:inline-flex;align-items:center;gap:6px;opacity:.85}
.llrn-topbar a:hover{opacity:1;color:#fff}
.llrn-nav{display:flex;align-items:center;gap:26px;height:74px}
.brand{display:inline-flex;align-items:center;background:var(--logo-plate);border-radius:8px;padding:2px 4px}
.brand-logo{height:46px;width:auto;max-width:none;display:block}
.llrn-topbar a svg,.llrn-nav a svg{width:14px;height:14px;fill:currentColor;flex:none}
.mainmenu{display:flex;gap:3px;margin-left:auto;align-items:center}
.mainmenu a{
  font-size:14.5px;font-weight:500;color:var(--ink);padding:9px 13px;border-radius:8px;position:relative;
  white-space:nowrap;
}
.mainmenu a:hover{background:var(--green-soft);color:var(--green-text)}
.mainmenu a.active{color:var(--green-text)}
.mainmenu a.has:after{content:"▾";font-size:10px;margin-left:5px;color:var(--faint)}
.nav-cta{
  margin-left:8px;background:var(--btn-green-bg);color:var(--btn-green-fg) !important;padding:10px 16px !important;
  border-radius:9px;font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.1);
  white-space:nowrap;flex:none;
}
.nav-cta:hover{background:var(--btn-green-bg-hover) !important;color:var(--btn-green-fg-hover) !important}

/* buttons */
.btn{
  display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-weight:600;font-size:14.5px;
  padding:12px 22px;border-radius:10px;border:1px solid transparent;cursor:pointer;transition:.15s;
}
.btn-primary{background:var(--accent);color:var(--btn-accent-fg)}
.btn-primary:hover{background:var(--btn-accent-bg-hover);color:var(--btn-accent-fg-hover)}
.btn-green{background:var(--btn-green-bg);color:var(--btn-green-fg)}
.btn-green:hover{background:var(--btn-green-bg-hover);color:var(--btn-green-fg-hover)}
.btn-ghost{background:transparent;border-color:var(--control-border);color:var(--ink)}
.btn-ghost:hover{border-color:var(--green);color:var(--green-text)}
.btn-light{background:#fff;color:#2F544C}
.btn .ar{font-family:var(--mono)}

/* eyebrow inside site */
.s-eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-weight:500}
.s-eyebrow.on-dark{color:var(--accent-bright)}

/* section spacing */
.sec{padding:clamp(48px,7vw,88px) 0}
.sec-tight{padding:clamp(34px,5vw,56px) 0}
.sec-head{max-width:64ch}
.sec-head h2{font-size:clamp(26px,4vw,40px);letter-spacing:-.01em;margin-top:16px}
.sec-head p{color:var(--muted);font-size:17px;margin-top:14px;line-height:1.6}
.center{text-align:center;margin-left:auto;margin-right:auto}

/* ---- HERO (home) ---- */
.hero{background:var(--cream);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.hero .wrap{padding-top:clamp(44px,6vw,72px);padding-bottom:clamp(44px,6vw,72px)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,64px);align-items:center}
.hero h1{font-size:clamp(34px,4.6vw,56px);letter-spacing:-.015em;margin-top:20px}
.hero h1 em{font-style:italic;color:var(--green-text)}
.hero .lede{font-size:clamp(16px,1.7vw,19px);color:var(--muted);margin-top:22px;max-width:46ch;line-height:1.6}
.hero-actions{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.hero-stats{display:flex;gap:30px;margin-top:38px;flex-wrap:wrap}
.hero-stats .st b{font-family:var(--serif);font-size:30px;font-weight:600;color:var(--green-text);display:block;line-height:1}
.hero-stats .st span{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:6px;display:block}
.hero-logo{
  background:#FBFAF5;border:1px solid var(--line);border-radius:18px;padding:34px;
  box-shadow:var(--shadow-lg);position:relative;
}
.hero-logo img{width:100%;height:auto}
.hero-logo .cap{
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);
  margin-top:20px;text-align:center;border-top:1px solid var(--line-soft);padding-top:16px;
}

/* countdown strip */
.countdown{
  background:var(--green-deep);color:#eaf2ee;border-radius:16px;padding:26px 30px;margin-top:34px;
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;box-shadow:var(--shadow-lg);
}
.countdown .cd-meta{flex:1;min-width:210px}
.countdown .cd-meta .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-bright)}
.countdown .cd-meta h3{color:#fff;font-size:21px;margin-top:8px}
.countdown .cd-meta p{color:#a8c1b7;font-size:13px;margin-top:6px;font-family:var(--mono)}
.cd-clock{display:flex;gap:14px}
.cd-unit{text-align:center;min-width:58px}
.cd-unit b{font-family:var(--mono);font-size:30px;font-weight:600;color:#fff;display:block;font-variant-numeric:tabular-nums}
.cd-unit span{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#8fb0a4;margin-top:5px;display:block}
.cd-sep{color:#7F9E92;font-family:var(--mono);font-size:26px;align-self:flex-start;margin-top:2px}

/* stat band (dark) */
.band{background:var(--panel-green);color:#eef5f1}
.band .wrap{padding:clamp(40px,6vw,64px) clamp(20px,4vw,44px)}
.band-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:center}
.band-grid .st b{font-family:var(--serif);font-size:clamp(34px,5vw,52px);font-weight:600;display:block;line-height:1;color:#fff}
.band-grid .st span{font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:#b6d0c6;margin-top:12px;display:block}

/* generic cards */
.cards{display:grid;gap:22px}
.cards-3{grid-template-columns:repeat(3,1fr)}
.cards-2{grid-template-columns:repeat(2,1fr)}
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;
  box-shadow:var(--shadow);transition:.16s;position:relative;
}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--green-line)}
.card .ic{width:42px;height:42px;border-radius:10px;background:var(--green-soft);color:var(--green-text);display:grid;place-items:center;margin-bottom:16px}
.card h3{font-size:19px;margin-bottom:8px}
.card p{color:var(--muted);font-size:14.5px;line-height:1.58}
.card .more{font-family:var(--mono);font-size:12px;color:var(--accent);margin-top:16px;display:inline-flex;gap:6px;letter-spacing:.03em}

/* feature module (icon list) */
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.feature-grid .f{background:var(--surface);padding:28px}
.feature-grid .f .n{font-family:var(--mono);font-size:12px;color:var(--accent)}
.feature-grid .f h4{font-size:17px;margin:12px 0 8px}
.feature-grid .f p{font-size:14px;color:var(--muted)}

/* ---- PAPERS ---- */
.filterbar{
  display:flex;gap:12px;flex-wrap:wrap;align-items:center;background:var(--surface);
  border:1px solid var(--line);border-radius:12px;padding:14px;box-shadow:var(--shadow);
}
.field{position:relative;display:flex;align-items:center}
.field label{position:absolute;left:14px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);top:7px}
.select,.input{
  font-family:var(--sans);font-size:14px;color:var(--ink);background:var(--paper);
  border:1px solid var(--line);border-radius:9px;padding:22px 14px 8px;min-width:190px;appearance:none;
}
.select{background-image:linear-gradient(45deg,transparent 50%,var(--faint) 50%),linear-gradient(135deg,var(--faint) 50%,transparent 50%);background-position:calc(100% - 18px) 22px,calc(100% - 13px) 22px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.search-field{flex:1;min-width:220px}
.search-field .input{width:100%;padding:12px 14px 12px 40px}
.search-field:before{content:"⌕";position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--faint);font-size:18px}
.result-meta{display:flex;align-items:baseline;gap:12px;margin:26px 0 18px;font-family:var(--mono);font-size:12.5px;color:var(--muted);letter-spacing:.02em}
.result-meta b{color:var(--ink)}

.paper{
  display:grid;grid-template-columns:88px 1fr auto;gap:24px;align-items:start;
  padding:26px 4px;border-bottom:1px solid var(--line);
}
.paper .date{font-family:var(--mono);font-size:12px;color:var(--muted);line-height:1.5;padding-top:4px}
.paper .date b{color:var(--accent);display:block;font-size:22px;font-weight:600}
.paper h3{font-size:20px;line-height:1.25;margin-bottom:8px}
.paper h3 a:hover{color:var(--green-text)}
.paper .auth{font-family:var(--mono);font-size:12.5px;color:var(--green-text);margin-bottom:10px;letter-spacing:.02em}
.paper p{color:var(--ink);opacity:.82;font-size:14.5px;line-height:1.58;max-width:70ch}
.paper .chips{display:flex;gap:7px;margin-top:12px;flex-wrap:wrap}
.chip{font-family:var(--mono);font-size:11px;color:var(--muted);background:var(--green-soft);border-radius:999px;padding:4px 11px;letter-spacing:.02em}
.paper .dl{align-self:center}
.iconbtn{width:44px;height:44px;border-radius:10px;border:1px solid var(--green-line);display:grid;place-items:center;color:var(--green-text);background:var(--green-soft)}
.iconbtn svg{width:19px;height:19px;fill:currentColor}
.iconbtn:hover{background:var(--btn-green-bg);color:var(--btn-green-fg);border-color:var(--btn-green-bg)}

.pager{display:flex;gap:6px;justify-content:center;margin-top:36px}
.pager a,.pager span{font-family:var(--mono);font-size:13px;min-width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;color:var(--muted);text-decoration:none}
.pager .on{background:var(--btn-green-bg);color:var(--btn-green-fg);border-color:var(--btn-green-bg)}
.pager .dots{border:0;background:none}
.pager a:hover:not(.on){border-color:var(--green);color:var(--green-text)}

/* sidebar layout */
.with-side{display:grid;grid-template-columns:1fr 300px;gap:48px;align-items:start}
.side .box{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:22px;margin-bottom:20px;box-shadow:var(--shadow)}
.side .box h4{font-size:16px;margin-bottom:14px}
.side .taglist{display:flex;flex-wrap:wrap;gap:8px}
.side .archive-links{list-style:none;padding:0;margin:0;font-size:14px}
.side .archive-links li{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line-soft);color:var(--muted)}
.side .archive-links li:last-child{border:0}
.side .archive-links b{font-family:var(--mono);font-size:12px;color:var(--faint)}

/* ---- single article ---- */
.article-hero{background:var(--cream);border-bottom:1px solid var(--line)}
.article-hero .wrap{padding:clamp(38px,5vw,60px) clamp(20px,4vw,44px)}
.breadcrumb{font-family:var(--mono);font-size:12px;color:var(--faint);letter-spacing:.03em;margin-bottom:20px}
.breadcrumb a:hover{color:var(--green-text)}
.breadcrumb .sep{margin:0 8px;color:var(--line)}
.article-hero h1{font-size:clamp(28px,4vw,44px);letter-spacing:-.01em;max-width:24ch}
.article-hero{margin-top:0}
.article-hero h1.paper-single-title{font-size:clamp(28px,4vw,44px);letter-spacing:-.01em;max-width:none;margin:0}
.article-meta{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:22px;font-family:var(--mono);font-size:12.5px;color:var(--muted)}
.article-meta b{color:var(--green-text)}
.prose{max-width:70ch;font-size:17px;line-height:1.72;color:var(--ink)}
.prose p{margin-bottom:22px;color:#33413c}
:root[data-theme="dark"] .prose p{color:#c4cec8}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .prose p{color:#c4cec8}}
.prose h2{font-size:26px;margin:38px 0 14px}
.prose .lead{font-size:20px;line-height:1.6;color:var(--muted);font-family:var(--serif);font-style:italic;margin-bottom:26px}
.prose blockquote{border-left:3px solid var(--accent);padding:6px 0 6px 24px;margin:28px 0;font-family:var(--serif);font-style:italic;font-size:20px;color:var(--green-text)}
.abstract-box{background:var(--green-soft);border:1px solid var(--green-line);border-radius:12px;padding:24px;margin-bottom:30px}
.abstract-box .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-text);margin-bottom:10px}
.abstract-box p{font-size:15px;color:var(--ink);line-height:1.6;margin:0}

/* ---- events ---- */
.eventrow{
  display:grid;grid-template-columns:120px 1fr auto;gap:28px;align-items:center;
  background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px 26px;
  margin-bottom:16px;box-shadow:var(--shadow);transition:.15s;
}
.eventrow:hover{border-color:var(--green-line);transform:translateX(3px)}
.ev-date{text-align:center;border-right:1px solid var(--line);padding-right:20px}
.ev-date .mo{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.ev-date .day{font-family:var(--serif);font-size:40px;font-weight:600;color:var(--ink);line-height:1;margin-top:2px}
.ev-date .yr{font-family:var(--mono);font-size:11px;color:var(--faint);margin-top:4px}
.ev-body h3{font-size:20px;margin-bottom:8px}
.ev-body .meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--mono);font-size:12px;color:var(--muted)}
.ev-body .meta span{display:inline-flex;gap:6px;align-items:center}
.ev-body p{color:var(--muted);font-size:14px;margin-top:10px;max-width:66ch}
.ev-type{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px;background:var(--accent-soft);color:var(--accent);white-space:nowrap}
.month-divider{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:30px 0 16px;display:flex;align-items:center;gap:14px}
.month-divider:after{content:"";flex:1;height:1px;background:var(--line)}

/* ---- members table ---- */
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:var(--shadow)}
.dtable{width:100%;border-collapse:collapse;font-size:14.5px;min-width:640px}
.dtable thead th{
  font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);
  text-align:left;padding:16px 20px;border-bottom:1px solid var(--line);background:var(--cream);font-weight:500;position:sticky;top:0;
}
.dtable td{padding:15px 20px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.dtable tbody tr:hover{background:var(--green-soft)}
.dtable tbody tr:last-child td{border-bottom:0}
.dtable .name{font-weight:600;color:var(--ink)}
.dtable .uni{color:var(--muted)}
.dtable .flag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12.5px;color:var(--muted)}
.dtable .flag i{width:20px;height:14px;border-radius:2px;background:var(--green-line);display:inline-block;flex:none}
.dtable .flag img{width:20px;height:14px;border-radius:2px;object-fit:cover;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.dtable thead th[data-sort]{cursor:pointer;user-select:none}
.dtable thead th[data-sort]:hover{color:var(--green-text)}
.dtable thead th[data-dir]:after{content:"▾";font-size:9px;margin-left:6px;color:var(--green-text)}
.dtable thead th[data-dir="asc"]:after{content:"▴"}
.dtable .link a{display:inline-flex;align-items:center;gap:5px}
.dtable .link a{color:var(--green-text);font-family:var(--mono);font-size:12.5px;display:inline-flex;gap:5px;align-items:center}
.dtable .link a:hover{color:var(--accent)}
.table-tools{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.table-tools .count{font-family:var(--mono);font-size:12.5px;color:var(--muted)}
.pill-toggle{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.pill-toggle button{font-family:var(--mono);font-size:12px;padding:8px 13px;border:0;background:var(--surface);color:var(--muted);cursor:pointer}
.pill-toggle button.on{background:var(--btn-green-bg);color:var(--btn-green-fg)}

/* ---- people grid ---- */
.people{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.person{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:24px;box-shadow:var(--shadow);text-align:center;transition:.15s}
.person:hover{border-color:var(--green-line);transform:translateY(-3px)}
.person .ph{width:88px;height:88px;border-radius:50%;margin:0 auto 16px;background:linear-gradient(135deg,var(--green-soft),var(--cream));display:grid;place-items:center;font-family:var(--serif);font-size:30px;font-weight:600;color:var(--green-text);border:1px solid var(--green-line)}
.person h4{font-size:17px}
.person .role{font-family:var(--mono);font-size:11.5px;color:var(--accent);margin-top:6px;letter-spacing:.02em}
.person .aff{font-size:13px;color:var(--muted);margin-top:8px;line-height:1.45}
.person .country{font-family:var(--mono);font-size:11px;color:var(--faint);margin-top:10px}

/* ---- links tiles ---- */

.linkgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.linktile{display:flex;gap:16px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:20px;box-shadow:var(--shadow);transition:.15s}
.linktile:hover{border-color:var(--green-line);transform:translateY(-2px)}
.linktile .li{width:44px;height:44px;border-radius:10px;background:var(--green-soft);color:var(--green-text);display:grid;place-items:center;flex:none;font-family:var(--serif);font-size:20px;font-weight:600}
.linktile h4{font-size:16px;margin-bottom:4px}
.linktile p{font-size:13px;color:var(--muted)}
.linktile .u{font-family:var(--mono);font-size:11.5px;color:var(--accent);margin-top:8px}

/* ---- forms / mailing / contact ---- */
.formcard{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:clamp(26px,4vw,40px);box-shadow:var(--shadow-lg)}
.formrow{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.formfield{display:flex;flex-direction:column;gap:7px}
.formfield label{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.formfield input,.formfield textarea,.formfield select{
  font-family:var(--sans);font-size:15px;color:var(--ink);background:var(--paper);
  border:1px solid var(--control-border);border-radius:10px;padding:13px 15px;width:100%;
}
.formfield input:focus,.formfield textarea:focus{outline:2px solid var(--green);border-color:var(--green)}
.checkrow{display:flex;gap:11px;align-items:flex-start;font-size:14px;color:var(--muted);margin-bottom:20px}
.checkrow .cb{width:20px;height:20px;border:1.5px solid var(--green);border-radius:5px;flex:none;margin-top:2px}

.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,60px);align-items:start}
.contact-item{display:flex;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.contact-item .ci{width:44px;height:44px;border-radius:10px;background:var(--green-soft);color:var(--green-text);display:grid;place-items:center;flex:none}
.contact-item h4{font-size:16px;margin-bottom:4px}
.contact-item p{color:var(--muted);font-size:14px}
.contact-item a{color:var(--green-text)}

/* newsletter cta band */
.cta-band{background:var(--green-deep);color:#eaf2ee;border-radius:20px;padding:clamp(34px,5vw,56px);text-align:center;position:relative;overflow:hidden}
.cta-band h2{color:#fff;font-size:clamp(24px,3.5vw,36px)}
.cta-band p{color:#a8c1b7;max-width:52ch;margin:16px auto 0;font-size:16px}
.cta-inline{display:flex;gap:10px;max-width:460px;margin:28px auto 0;flex-wrap:wrap}
.cta-inline input{flex:1;min-width:200px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:10px;padding:14px 16px;font-family:var(--sans);font-size:15px}
.cta-inline input::placeholder{color:#8fb0a4}

/* news grid */
.newsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.newscard{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);transition:.16s;display:flex;flex-direction:column}
.newscard:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--green-line)}
.newscard .thumb{aspect-ratio:16/10;background:linear-gradient(135deg,var(--green),var(--green-deep));position:relative}
.newscard .thumb.alt{background:linear-gradient(135deg,var(--accent),#7c5518)}
.newscard .thumb.alt2{background:linear-gradient(135deg,#3a6459,var(--cream))}
.newscard .thumb .cat{position:absolute;left:14px;top:14px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;background:rgba(0,0,0,.35);color:#fff;padding:5px 10px;border-radius:999px}
.newscard .body{padding:22px;flex:1;display:flex;flex-direction:column}
.newscard .date{font-family:var(--mono);font-size:11.5px;color:var(--faint);letter-spacing:.03em}
.newscard h3{font-size:18px;margin:10px 0 8px;line-height:1.25}
.newscard p{color:var(--muted);font-size:14px;flex:1}
.newscard .more{font-family:var(--mono);font-size:12px;color:var(--accent);margin-top:14px}

/* featured news (first) */
.news-featured{display:grid;grid-template-columns:1.2fr 1fr;gap:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-bottom:26px;background:var(--surface);box-shadow:var(--shadow)}
.news-featured .img{background:linear-gradient(135deg,var(--green),var(--green-deep));min-height:300px;position:relative}
.news-featured .img .cat{position:absolute;left:20px;top:20px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.15);color:#fff;padding:6px 12px;border-radius:999px}
.news-featured .txt{padding:clamp(26px,3vw,40px);display:flex;flex-direction:column;justify-content:center}
.news-featured .date{font-family:var(--mono);font-size:12px;color:var(--accent);letter-spacing:.04em}
.news-featured h2{font-size:clamp(22px,2.6vw,30px);margin:12px 0 14px}
.news-featured p{color:var(--muted);font-size:15.5px;line-height:1.6}

/* footer */
.llrn-foot{background:var(--green-deep);color:#cfdeD7;margin-top:0}
/* WordPress gives every top-level block but the first a 24px top margin, and it
   lands on the wrapper around the footer template part - a stripe of page
   background between the last section and the footer. Invisible while the page
   ended on the paper colour; obvious once it ends on a white section. */
.wp-block-template-part{margin-top:0;margin-bottom:0}
.llrn-foot .wrap{padding:clamp(44px,6vw,72px) clamp(20px,4vw,44px) 30px}
.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:40px}
.foot-logo{background:#FBFAF5;border-radius:10px;padding:11px 15px;display:inline-block;margin-bottom:18px;box-shadow:0 2px 10px rgba(0,0,0,.2)}
.foot-logo img{height:38px;width:auto;max-width:none;display:block}
.foot-brand p{color:#9db6ab;font-size:14px;line-height:1.6;max-width:34ch}
.foot-social{display:flex;gap:10px;margin-top:20px}
.foot-social a{width:38px;height:38px;border-radius:9px;border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;color:#cfded7}
.foot-social a:hover{background:var(--accent);border-color:var(--accent);color:var(--btn-accent-fg)}
.foot-social a svg{width:17px;height:17px;fill:currentColor}
/* video embeds — real iframes */
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
/* LLRN7 recap — dark cinema band + captioned videos */
.recap{background:var(--green-deep);color:#eaf2ee}
.recap .s-eyebrow{color:var(--accent-bright)}
.recap h2{color:#fff}
.video-item{margin:0}
.video-item figcaption{font-family:var(--mono);font-size:12.5px;color:#a8c1b7;margin-top:12px;display:flex;align-items:center;gap:8px;letter-spacing:.02em}
.video-item figcaption svg{width:13px;height:13px;fill:var(--accent-bright);flex:none}
/* merged past-conferences: dark video panel + linked edition cards */
.recap-panel{background:var(--green-deep);border-radius:18px;padding:clamp(20px,3vw,30px);color:#eaf2ee;box-shadow:var(--shadow-lg);margin-bottom:30px}
.recap-panel .plabel{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-bright);margin-bottom:16px;display:flex;align-items:center;gap:10px}
.recap-panel .plabel a{color:#fff}
.recap-panel .plabel a:hover{color:var(--accent-bright)}
a.conf-card{text-decoration:none}
.foot-col h5{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-bright);margin:0 0 16px;font-weight:500}
.foot-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.foot-col a{color:#b6cabf;font-size:14px}
.foot-col a:hover{color:#fff}
.foot-news p{color:#9db6ab;font-size:13.5px;line-height:1.55;margin-bottom:14px}
.foot-news .cta-inline{margin:0;max-width:none}
.foot-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);font-family:var(--mono);font-size:11.5px;color:#9db6ab;letter-spacing:.02em}
.foot-bottom a{color:#9db6ab}

/* misc */
.mono{font-family:var(--mono)}
.tc{text-align:center}

/* conference legacy */
.conf-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.conf-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:20px;position:relative;transition:.15s;box-shadow:var(--shadow)}
.conf-card:hover{border-color:var(--green-line);transform:translateY(-3px)}
.conf-card .ed{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--accent)}
.conf-card .city{font-family:var(--serif);font-size:21px;font-weight:600;color:var(--ink);margin-top:9px}
.conf-card .uni{font-size:12.5px;color:var(--ink);margin-top:7px;line-height:1.35;font-weight:500}
.conf-card .ctry{font-family:var(--mono);font-size:11.5px;color:var(--faint);margin-top:6px;letter-spacing:.02em}
.conf-card.now .uni{color:#eef5f1}
.conf-card.now{background:var(--panel-green);border-color:var(--panel-green)}
.conf-card.now .ed{color:var(--accent-bright)}
.conf-card.now .city{color:#fff}
.conf-card.now .ctry{color:#cfe0d8}
.conf-card.now .badge{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;background:var(--accent);color:var(--btn-accent-fg);padding:3px 8px;border-radius:999px}
/* video embeds */
.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:30px}
.video-embed{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);aspect-ratio:16/9;background:linear-gradient(135deg,var(--green-deep),#0f1d19);cursor:pointer}
.video-embed:hover .play b{transform:scale(1.08)}
.video-embed .play{position:absolute;inset:0;display:grid;place-items:center}
.video-embed .play b{width:66px;height:66px;border-radius:50%;background:rgba(255,255,255,.94);color:var(--green-text);display:grid;place-items:center;font-size:22px;padding-left:5px;transition:.15s;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.video-embed .vcap{position:absolute;left:16px;bottom:14px;right:16px;color:#fff;font-family:var(--mono);font-size:12px;letter-spacing:.03em;text-shadow:0 1px 5px rgba(0,0,0,.6)}
/* event venue + documents */
.venue{background:var(--green-soft);border:1px solid var(--green-line);border-radius:12px;padding:20px;margin-bottom:20px}
.venue .k{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--green-text);margin-bottom:8px}
.venue h4{font-size:16px;margin-bottom:6px}
.venue p{font-size:13.5px;color:var(--muted);line-height:1.55}
.venue .map{margin-top:12px;height:120px;border-radius:9px;background:repeating-linear-gradient(45deg,var(--green-line),var(--green-line) 10px,transparent 10px,transparent 20px);opacity:.5;display:grid;place-items:center;font-family:var(--mono);font-size:11px;color:var(--green-text)}
.doclist{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.doclist a{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);font-size:14px;color:var(--ink)}
.doclist a:hover{border-color:var(--green);color:var(--green-text)}
.doclist .fi{width:36px;height:36px;border-radius:8px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-family:var(--mono);font-size:9.5px;font-weight:600;flex:none}
.doclist .fs{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--faint)}
.ev-links{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.ev-links a{font-family:var(--mono);font-size:11.5px;color:var(--accent);display:inline-flex;gap:5px;align-items:center;border:1px solid var(--line);padding:5px 11px;border-radius:8px}
.ev-links a:hover{border-color:var(--green);color:var(--green-text);background:var(--surface)}

/* responsive */
@media (max-width:900px){
  .hero-grid,.with-side,.split,.news-featured,.band-grid,.formrow{grid-template-columns:1fr}
  .cards-3,.cards-2,.feature-grid,.people,.newsgrid,.linkgrid{grid-template-columns:1fr 1fr}
  .conf-strip{grid-template-columns:1fr 1fr}
  .video-grid{grid-template-columns:1fr}
  .band-grid{grid-template-columns:1fr 1fr}
  .paper{grid-template-columns:1fr}
  .paper .date{display:flex;gap:10px;align-items:baseline}
  .paper .date b{font-size:16px}
  .paper .dl{justify-self:start}
  .eventrow{grid-template-columns:80px 1fr}
  .eventrow .ev-type{grid-column:2}
  .foot-top{grid-template-columns:1fr 1fr}
  .deck-meta{gap:8px 18px}
}
@media (max-width:560px){
  .cards-3,.cards-2,.feature-grid,.people,.newsgrid,.linkgrid,.band-grid,.conf-strip{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr}
  .countdown{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;scroll-behavior:auto !important}}

/* ---- committee cards: centred country + link icons ---- */
.person .country{display:flex;align-items:center;justify-content:center;gap:7px}
.person .country img{border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.08);flex:none}
.person-links{display:flex;gap:14px;justify-content:center;margin-top:12px;font-family:var(--mono);font-size:11.5px}
.person-links a{display:inline-flex;align-items:center;gap:5px;color:var(--accent)}
.person-links a:hover{color:var(--green-text)}
.person-links svg{width:13px;height:13px;fill:currentColor;flex:none}

/* ---- committee as a list (used for the large Advisory Committee) ---- */
.people.is-list{grid-template-columns:1fr;gap:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}
.people.is-list .person{
  display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:20px;
  text-align:left;border:0;border-bottom:1px solid var(--line-soft);border-radius:0;
  box-shadow:none;padding:16px 22px;background:transparent;
}
.people.is-list .person:last-child{border-bottom:0}
.people.is-list .person:hover{transform:none;background:var(--green-soft)}
.people.is-list .person .ph{width:52px;height:52px;margin:0;font-size:18px}
.people.is-list .person h4{font-size:16.5px;margin:0}
.people.is-list .person .role{margin-top:2px}
.people.is-list .person .aff{margin-top:3px;font-size:13px}
.people.is-list .person .country{justify-content:flex-start;margin-top:6px}
.people.is-list .person .l-main{min-width:0}
.people.is-list .person .l-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.people.is-list .person .person-links{margin-top:0;justify-content:flex-end}
@media (max-width:700px){
  .people.is-list .person{grid-template-columns:44px 1fr;gap:14px;padding:14px 16px}
  .people.is-list .person .ph{width:44px;height:44px;font-size:16px}
  .people.is-list .person .l-side{grid-column:2;align-items:flex-start}
}

/* ---- header dropdown ---- */
.menu-item-has-children{position:relative}
.submenu{
  position:absolute;top:100%;left:0;min-width:230px;background:var(--surface);
  border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);
  padding:8px;display:flex;flex-direction:column;gap:2px;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.14s;z-index:60;
}
.menu-item-has-children:hover .submenu,
.menu-item-has-children:focus-within .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.mainmenu .submenu a{font-size:14px;padding:9px 12px;border-radius:8px;white-space:nowrap;color:var(--ink)}
.mainmenu .submenu a:hover{background:var(--green-soft);color:var(--green-text)}
.menu-item-has-children:hover .has,.menu-item-has-children:focus-within .has{color:var(--green-text)}

/* ---- past steering committees ---- */
.past-steering{margin-top:clamp(40px,5vw,64px);padding-top:34px;border-top:1px solid var(--line)}
.past-steering h2{font-size:clamp(21px,2.6vw,26px);margin-bottom:20px}
.past-steering ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}
.past-steering li{
  display:grid;grid-template-columns:104px 1fr;gap:20px;align-items:baseline;
  padding:14px 0;border-bottom:1px solid var(--line-soft);
}
.past-steering li:last-child{border-bottom:0}
.past-steering li strong{font-family:var(--mono);font-size:12.5px;font-weight:600;color:var(--accent);letter-spacing:.02em}
.past-steering li span{font-size:14.5px;line-height:1.55;color:var(--ink)}
@media (max-width:640px){
  .past-steering li{grid-template-columns:1fr;gap:4px}
}

/* ---- events: toolbar links, icons ---- */
.pill-toggle a{font-family:var(--mono);font-size:12px;padding:8px 13px;background:var(--surface);color:var(--muted);display:inline-flex;align-items:center;text-decoration:none}
.pill-toggle a:hover{color:var(--green-text);background:var(--green-soft)}
.pill-toggle a.on{background:var(--btn-green-bg);color:var(--btn-green-fg)}
.ev-body .meta span svg,.article-meta span svg{width:13px;height:13px;fill:currentColor;flex:none;margin-right:5px;vertical-align:-2px}
.ev-links a svg{width:12px;height:12px;fill:currentColor;flex:none;margin-right:4px}
.venue .k svg{width:12px;height:12px;fill:currentColor;vertical-align:-1px;margin-right:4px}
.eventrow .ev-body h3 a:hover{color:var(--green-text)}
.eventrow p{color:var(--ink);opacity:.82}

/* ---- prose lists (used heavily by the LLRN8 conference page) ---- */
.prose ul,.prose ol{margin:0 0 22px;padding-left:22px;color:#33413c}
.prose li{margin-bottom:9px;line-height:1.65}
.prose h3{font-size:19px;margin:26px 0 10px}
.prose strong{font-weight:600;color:var(--ink)}
:root[data-theme="dark"] .prose ul,:root[data-theme="dark"] .prose ol{color:#c4cec8}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .prose ul,:root:not([data-theme="light"]) .prose ol{color:#c4cec8}}

/* flagship LLRN conference row stands out in the timeline */
.eventrow.is-flagship{background:var(--green-soft);border-color:var(--green-line)}
.eventrow.is-flagship .ev-date .mo{color:var(--green-text)}

/* ---- homepage digests: latest news + upcoming events ---- */
.digest-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,52px)}
.digest-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.digest-head h2{font-size:clamp(21px,2.6vw,27px)}
.digest-head .s-eyebrow{width:100%}
.digest-all{margin-left:auto;font-family:var(--mono);font-size:12px;color:var(--accent);white-space:nowrap}
.digest-all:after{content:" \2192"}
.digest-all:hover{color:var(--green-text)}
.digest-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.digest-item{display:block;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none}
.digest-item:hover h3{color:var(--green-text)}
.digest-item time{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--accent);display:block}
.digest-item h3{font-size:17px;line-height:1.3;margin:7px 0 0;color:var(--ink)}
.digest-item p{font-size:13.5px;color:var(--ink);opacity:.78;margin-top:6px;line-height:1.5}
/* event rows carry a date badge */
.digest-item.is-event{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:center}
.d-badge{display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--green-soft);border:1px solid var(--green-line);border-radius:10px;padding:7px 0}
.d-badge b{font-family:var(--serif);font-size:20px;font-weight:600;color:var(--green-text);line-height:1}
.d-badge i{font-family:var(--mono);font-size:9.5px;font-style:normal;letter-spacing:.08em;color:var(--muted);margin-top:2px}
.d-body{min-width:0}
.d-body h3{margin:0}
.d-meta{font-family:var(--mono);font-size:11.5px;color:var(--muted);display:block;margin-top:5px}
@media (max-width:860px){.digest-grid{grid-template-columns:1fr;gap:36px}}

/* digest band: its own quiet section between the conference history and "what we do" */
.digest-band{background:var(--surface);border-bottom:1px solid var(--line)}
.eventrow.is-flagship .ev-type{background:var(--green-deep);color:#fff}

/* ---- news list (text-only announcements) ---- */
.newsitem{display:grid;grid-template-columns:76px 1fr;gap:22px;padding:22px 4px;border-bottom:1px solid var(--line)}
.newsitem .date{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--muted);padding-top:5px;text-align:center}
.newsitem .date b{display:block;font-family:var(--serif);font-size:24px;font-weight:600;color:var(--accent);letter-spacing:0}
.newsitem h3{font-size:19px;line-height:1.28}
.newsitem h3 a:hover{color:var(--green-text)}
.newsitem p{color:var(--ink);opacity:.82;font-size:14.5px;line-height:1.58;margin-top:8px;max-width:74ch}
.newsitem .more{font-family:var(--mono);font-size:11.5px;color:var(--accent);margin-top:10px;display:inline-block}
.newsitem .more:after{content:" \2192"}
.newsitem .more:hover{color:var(--green-text)}
@media (max-width:600px){
  .newsitem{grid-template-columns:1fr;gap:8px}
  .newsitem .date{display:flex;gap:8px;align-items:baseline;text-align:left;padding-top:0}
  .newsitem .date b{font-size:16px}
}

/* back link under a single post */
.back-link{margin-top:40px;padding-top:22px;border-top:1px solid var(--line)}
.back-link a{font-family:var(--mono);font-size:12px;color:var(--accent)}
.back-link a:before{content:"90 "}
.back-link a:hover{color:var(--green-text)}

/* ---- hero: use the full measure instead of a narrow half-width column ---- */
.article-hero h1{max-width:32ch}
/* when a hero carries an intro paragraph, set title and intro side by side */
.article-hero.is-split .wrap{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:8px clamp(28px,4vw,60px);align-items:end;
}
.article-hero.is-split .wrap > .s-eyebrow{grid-column:1/-1}
.article-hero.is-split .wrap > h1{margin:0;max-width:22ch}
.article-hero.is-split .wrap > p:not(.s-eyebrow){margin:0 0 6px;max-width:46ch}
@media (max-width:860px){
  .article-hero.is-split .wrap{grid-template-columns:1fr;align-items:start}
  .article-hero.is-split .wrap > h1{max-width:none}
  .article-hero.is-split .wrap > p:not(.s-eyebrow){margin-top:14px;max-width:62ch}
}

/* ---- file downloads inside post content (WordPress file block) ---- */
.prose .wp-block-file{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:var(--green-soft);border:1px solid var(--green-line);border-radius:12px;
  padding:16px 18px;margin:0 0 24px;
}
.prose .wp-block-file:before{
  content:"PDF";font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.06em;
  color:var(--accent);background:var(--accent-soft);border-radius:7px;padding:9px 10px;flex:none;
}
/* the imported markup leaves an empty preview element behind */
.prose .wp-block-file object,.prose .wp-block-file embed,.prose .wp-block-file iframe{display:none}
.prose .wp-block-file > a:not(.wp-block-file__button){
  font-weight:600;color:var(--ink);font-size:15px;min-width:0;flex:1;text-decoration:none;
}
.prose .wp-block-file > a:not(.wp-block-file__button):hover{color:var(--green-text)}
.prose .wp-block-file .wp-block-file__button{
  margin-left:auto;background:var(--accent);color:var(--btn-accent-fg);font-family:var(--sans);font-weight:600;
  font-size:13.5px;padding:9px 16px;border-radius:9px;text-decoration:none;flex:none;
}
.prose .wp-block-file .wp-block-file__button:hover{background:#6f4a11;color:#FFFFFF}

/* ---- public submission form ---- */
.submit-form .llrn-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.submit-form .fieldhint{font-family:var(--mono);font-size:11px;color:var(--muted);margin-top:6px;display:block}
.submit-form input[type=file]{
  font-family:var(--sans);font-size:14px;color:var(--ink);background:var(--paper);
  border:1px dashed var(--green-line);border-radius:10px;padding:14px;width:100%;
}
.submit-form input[type=file]::file-selector-button{
  font-family:var(--sans);font-weight:600;font-size:13px;border:0;border-radius:8px;
  background:var(--green-soft);color:var(--green-text);padding:8px 14px;margin-right:12px;cursor:pointer;
}
.submit-form [hidden]{display:none !important}
.submit-note{
  border-radius:12px;padding:18px 20px;margin-bottom:22px;font-size:14.5px;line-height:1.55;
  border:1px solid var(--green-line);background:var(--green-soft);color:var(--ink);
}
.submit-note.is-error{border-color:#e0b4ab;background:#fbecea;color:#7d2c1d}
:root[data-theme="dark"] .submit-note.is-error{border-color:#5a3229;background:#2e1a16;color:#e8b3a6}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .submit-note.is-error{border-color:#5a3229;background:#2e1a16;color:#e8b3a6}}

/* ---- contact page: text on the left, submission form on the right ---- */
.contact-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:clamp(32px,4vw,60px);align-items:start}
.contact-split .contact-text{max-width:none}
.contact-form{position:sticky;top:104px}
.contact-form h2{font-size:clamp(20px,2.4vw,25px);margin-bottom:10px}
.contact-form .intro{font-size:14.5px;line-height:1.55;color:var(--ink);opacity:.82;margin-bottom:20px}
.contact-form .formcard{padding:clamp(22px,2.4vw,28px)}
.contact-form .formrow{grid-template-columns:1fr}
@media (max-width:1000px){
  .contact-split{grid-template-columns:1fr;gap:44px}
  .contact-form{position:static}
  .contact-form .formrow{grid-template-columns:1fr 1fr}
}

/* ---- one hero layout everywhere ----
   Heroes built from blocks sit inside WordPress' "constrained" layout, which
   gives every child `margin-inline:auto`. Any child with a max-width (our h1,
   the intro paragraph) then gets centred, so those pages looked indented while
   the shortcode-built heroes stayed flush left. Pin the whole hero to the left
   and keep one set of paddings for both kinds. */
.article-hero .wrap{padding-top:clamp(38px,5vw,60px);padding-bottom:clamp(38px,5vw,60px)}
.article-hero .wrap,
.article-hero .wrap.has-global-padding{padding-left:clamp(20px,4vw,44px);padding-right:clamp(20px,4vw,44px)}
.article-hero .wrap > *{margin-left:0 !important;margin-right:0 !important}
.article-hero .wrap > .s-eyebrow{max-width:none}

/* ---- links directory: tabbed categories, one row layout ---- */
/* Editorial underline tabs rather than floating pills - they read as one
   control strip and sit naturally above the list. */
.link-tabs{
  display:flex;gap:4px;margin:0 0 20px;border-bottom:1px solid var(--line);
  /* horizontal scrolling only - declaring overflow-x alone also turns overflow-y
     into "auto", and the tabs' -1px bottom margin was enough to summon a
     vertical scrollbar */
  overflow-x:auto;overflow-y:hidden;
  scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;
}
.link-tabs::-webkit-scrollbar{height:0;width:0}
.link-tab{
  font-family:var(--sans);font-size:14.5px;font-weight:500;color:var(--muted);cursor:pointer;
  background:none;border:0;border-bottom:2px solid transparent;border-radius:0;
  padding:11px 14px 12px;margin-bottom:-1px;white-space:nowrap;flex:none;
  display:inline-flex;align-items:center;gap:7px;transition:color .15s,border-color .15s;
}
.link-tab:hover{color:var(--ink)}
.link-tab.is-active{color:var(--green-text);border-bottom-color:var(--green);font-weight:600}
.link-tab .lt-count{
  font-family:var(--mono);font-size:10.5px;color:var(--muted);
  background:var(--green-soft);border-radius:999px;padding:2px 7px;line-height:1.5;
}
.link-tab.is-active .lt-count{background:var(--btn-green-bg);color:var(--btn-green-fg)}
.link-tab.has-none{opacity:.4}
.link-tab:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}

.link-tools{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.link-tools .count{font-family:var(--mono);font-size:12.5px;color:var(--muted)}

.link-group{display:none}
.link-group.is-active{display:block}
.lg-empty{color:var(--muted);font-size:14px;padding:26px 0}

.linkrows{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}
.linkrow{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:14px 20px;border-bottom:1px solid var(--line-soft);text-decoration:none;color:inherit;
}
.linkrow[hidden]{display:none}
.linkrow:last-child{border-bottom:0}
a.linkrow:hover{background:var(--green-soft)}
.lr-main{min-width:0}
.lr-name{display:block;font-weight:600;font-size:15px;color:var(--ink);line-height:1.35}
a.linkrow:hover .lr-name{color:var(--green-text)}
.lr-uni{display:block;font-size:13px;color:var(--muted);margin-top:3px}
.lr-side{display:flex;align-items:center;gap:16px;flex:none}
.lr-country{font-family:var(--mono);font-size:11.5px;color:var(--muted);display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.lr-country img{border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.08);flex:none}
.lr-go svg{width:14px;height:14px;fill:var(--faint)}
a.linkrow:hover .lr-go svg{fill:var(--accent)}
@media (max-width:640px){
  .linkrow{flex-direction:column;align-items:flex-start;gap:8px}
  .lr-side{gap:12px}
}

/* hero intro paragraph - theme-aware, never a hardcoded colour */
.article-hero .hero-lede{color:var(--muted);font-size:17px;line-height:1.6}

/* Nine menu items plus the conference button is a lot for one row: tighten the
   spacing on the way down to the burger breakpoint rather than wrapping. */
@media (max-width:1180px){
  .mainmenu a{padding:9px 9px;font-size:14px}
  .nav-cta{margin-left:4px;padding:10px 13px !important;font-size:13.5px}
}
@media (max-width:1040px){
  .mainmenu a{padding:8px 7px;font-size:13.5px}
  .brand-logo{height:38px}
}

/* ============================================================
   MOBILE: a real menu instead of hiding it, and layout repairs
   ============================================================ */
.llrn-burger{display:none}
.llrn-mobile-menu{display:none}

@media (max-width:960px){
  /* The burger takes over from the desktop menu. 960 rather than 900: with nine
     items plus the conference button the desktop row runs out of slack just
     above 900px. */
  .mainmenu{display:none}
  .llrn-burger{
    display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
    margin-left:auto;width:44px;height:44px;padding:0 10px;cursor:pointer;
    background:transparent;border:1px solid var(--line);border-radius:10px;
  }
  .llrn-burger span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:.18s}
  .llrn-burger[aria-expanded="true"]{border-color:var(--green);background:var(--green-soft)}
  .llrn-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .llrn-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .llrn-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .llrn-mobile-menu{
    display:block;background:var(--surface);border-top:1px solid var(--line);
    box-shadow:0 16px 30px -20px rgba(28,42,38,.4);
  }
  .llrn-mobile-menu[hidden]{display:none}
  .llrn-mobile-menu .wrap{display:flex;flex-direction:column;padding-top:10px;padding-bottom:16px}
  .llrn-mobile-menu a{
    font-size:16px;font-weight:500;color:var(--ink);padding:13px 2px;
    border-bottom:1px solid var(--line-soft);text-decoration:none;
  }
  .llrn-mobile-menu a:last-child{border-bottom:0}
  .llrn-mobile-menu a:active{color:var(--green-text)}
  .llrn-mobile-menu .mm-label{
    font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
    color:var(--faint);padding:16px 2px 6px;
  }
  .llrn-mobile-menu .mm-sub{padding-left:14px;font-size:15px;color:var(--muted)}
  .llrn-mobile-menu .mm-cta{
    margin-top:16px;background:var(--btn-green-bg);color:var(--btn-green-fg);text-align:center;
    border-radius:10px;font-weight:600;border-bottom:0;padding:14px;
  }

  /* the logo must not eat the whole bar */
  .brand-logo{height:34px}
  .llrn-nav{height:64px;gap:12px}

  /* the contact form column was still two-up and overflowed */
  .contact-form .formrow{grid-template-columns:1fr}
}

@media (min-width:601px) and (max-width:900px){
  .contact-form .formrow{grid-template-columns:1fr 1fr}
}

@media (max-width:560px){
  .brand-logo{height:30px}
  .llrn-topbar .wrap{gap:12px;font-size:11.5px}
  .llrn-topbar a{gap:5px}
}

/* mobile menu: never taller than the screen, scrolls inside itself if needed */
@media (max-width:960px){
  /* Hangs directly under the bar and floats over the page, so opening the menu
     never moves the reader's position. It is inside .llrn-navbar, so it follows
     the bar when the bar pins itself. */
  .llrn-mobile-menu{
    position:absolute;top:100%;left:0;right:0;z-index:60;
    max-height:calc(100vh - 120px);overflow-y:auto;-webkit-overflow-scrolling:touch;
    box-shadow:0 22px 40px -18px rgba(28,42,38,.45);
  }
  /* the countdown button belongs in the middle on a narrow screen */
  .countdown .btn{width:100%;justify-content:center;margin-top:4px}
  .countdown{align-items:stretch}
  .countdown .cd-clock{justify-content:center}
  .countdown .cd-meta{text-align:center}
}

/* ============================================================
   AWARDS - the Bob Hepple Award roll
   ============================================================ */
.award-intro{max-width:74ch;margin:0 0 34px}

/* the nomination guidelines call-out */
.award-guide{
  display:flex;align-items:center;gap:18px;
  padding:18px 22px;margin:0 0 30px;
  background:var(--green-soft);border:1px solid var(--green-line);border-radius:var(--radius);
}
.award-guide .ag-ico{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:var(--surface);border:1px solid var(--green-line)}
.award-guide .ag-ico svg{width:20px;height:20px;fill:var(--green-text)}
.award-guide .ag-text{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.award-guide .ag-text strong{font-size:15px;color:var(--ink)}
.award-guide .ag-text span{font-size:13.5px;color:var(--muted)}
.award-guide .ag-cta{flex:none}
.award-guide .btn{flex:none}

.award-meta{display:flex;justify-content:flex-end;margin:0 0 14px}
.award-meta .count{margin:0;font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--faint)}

/* one block per award year */
.award-roll{display:flex;flex-direction:column;gap:38px}
.award-year{position:relative}
.ay-head{margin:0 0 16px;display:flex;align-items:center;gap:16px;font-family:var(--sans)}
.ay-head::after{content:"";flex:1;height:1px;background:var(--line)}
.ay-num{
  font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.06em;
  color:var(--green-text);background:var(--green-soft);border:1px solid var(--green-line);
  padding:5px 12px;border-radius:999px;
}
.ay-people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}

.award-card{
  display:flex;gap:16px;padding:20px 22px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.award-card .ac-ico{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--accent-soft);border:1px solid var(--line)}
.award-card .ac-ico svg{width:19px;height:19px;fill:var(--accent)}
.award-card .ac-body{min-width:0;display:flex;flex-direction:column;gap:4px}
.ac-name{margin:0;font-family:var(--serif);font-size:19px;line-height:1.3;color:var(--ink);font-weight:600}
.ac-aff{margin:0;font-size:13.5px;color:var(--muted)}
.ac-by{margin:0;font-size:13px;color:var(--faint)}
.ac-by span{color:var(--muted);font-weight:600}
.ac-foot{margin-top:8px}
.ac-link{
  display:inline-flex;align-items:center;gap:7px;
  font-size:13px;font-weight:600;color:var(--green-text);text-decoration:none;
  border-bottom:1px solid var(--green-line);padding-bottom:2px;
}
.ac-link::after{content:"\2192";font-size:14px;line-height:1}
.ac-link:hover{color:var(--accent);border-bottom-color:var(--accent)}

@media (max-width:820px){
  .ay-people{grid-template-columns:1fr}
}
@media (max-width:560px){
  .award-guide{flex-wrap:wrap;gap:14px}
  .award-guide .ag-cta{width:100%}
  .award-guide .btn{display:flex;width:100%;justify-content:center;text-align:center}
  .award-meta{justify-content:flex-start}
}

/* the laudatio sub-pages: award context above the prose, a way back below it */
.award-kicker{
  display:flex;flex-wrap:wrap;align-items:center;gap:12px;
  margin:0 0 26px;padding-bottom:18px;border-bottom:1px solid var(--line);
}
.award-kicker .ak-year{
  font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.06em;
  color:var(--green-text);background:var(--green-soft);border:1px solid var(--green-line);
  padding:4px 10px;border-radius:999px;
}
.award-kicker .ak-name{font-size:14px;color:var(--muted);font-weight:600}
.award-back{margin:44px 0 0;padding-top:26px;border-top:1px solid var(--line)}

/* ============================================================
   MAILING LIST
   ============================================================ */
/* The rules text is long, so the form column stays a little narrower and the
   left column keeps a comfortable measure rather than filling the grid. */
.mailing-split{grid-template-columns:minmax(0,1fr) minmax(0,420px)}
.mailing-split .contact-text{max-width:70ch}
.mailing-split .contact-text > h2:first-child,
.mailing-split .contact-text > p:first-child{margin-top:0}

/* the consent tick: a real checkbox, sized and aligned with its wording */
.mailing-form .checkrow{margin-bottom:0}
.mailing-form .checkrow label{display:flex;gap:11px;align-items:flex-start;cursor:pointer}
.mailing-form .checkrow input[type="checkbox"]{
  width:18px;height:18px;flex:none;margin-top:2px;accent-color:var(--green);cursor:pointer;
}
.mailing-form .checkrow span{font-size:13px;line-height:1.5;color:var(--muted)}

/* footer: a link to the form, not a field that discards what you type */
.foot-news .foot-join{margin-top:16px;display:inline-flex}

@media (max-width:1000px){
  .mailing-split{grid-template-columns:1fr}
  .mailing-split .contact-text{max-width:none}
}

/* Inline links inside migrated prose had no colour and no underline, so they
   were indistinguishable from the sentence around them. Scoped to text
   elements, which leaves the file block and button links to their own rules. */
.prose p a,
.prose li a,
.prose td a,
.prose blockquote a{
  color:var(--accent);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;
}
.prose p a:hover,
.prose li a:hover,
.prose td a:hover,
.prose blockquote a:hover{color:var(--green-text)}

/* Core button block inside migrated prose: WordPress' default is a dark grey
   pill at 17px, which looks nothing like the rest of the site. Scoped to
   .prose so editor-placed buttons elsewhere keep whatever they are given. */
.prose .wp-block-buttons{margin:0 0 26px}
.prose .wp-block-button__link{
  background:var(--btn-green-bg);color:var(--btn-green-fg);
  font-family:var(--sans);font-weight:600;font-size:14.5px;
  padding:12px 22px;border-radius:10px;text-decoration:none;
  display:inline-flex;align-items:center;gap:9px;transition:.15s;
}
.prose .wp-block-button__link:hover{background:var(--btn-green-bg-hover);color:var(--btn-green-fg-hover)}

/* Search hit with no meaningful date (a page): the body takes the whole row
   rather than leaving a gap where the date block would be. */
.newsitem.is-undated{grid-template-columns:1fr}

/* Native date picker.

   Two separate problems, two separate mechanisms:

   1. The picker popup, the scrollbars and Firefox's own glyph follow the
      `color-scheme` property set on :root in the token blocks above. That alone
      fixes Firefox and the popup.

   2. Chromium draws its indicator glyph from a background image. Rather than
      guess what colour it picked and correct it - the previous attempt inverted
      it, which turned an already-light glyph black again in dark mode - the
      glyph is simply replaced with ours. Our colour, so nothing to invert and
      nothing to depend on. */
.formfield input[type="date"]::-webkit-calendar-picker-indicator {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2354635D' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M3 11h18'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 17px 17px;
  width: 17px;
  height: 17px;
  padding: 0;
  margin-left: 6px;
  cursor: pointer;
  opacity: 1;
}
.formfield input[type="date"]:hover::-webkit-calendar-picker-indicator,
.formfield input[type="date"]:focus::-webkit-calendar-picker-indicator {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A5D15' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M3 11h18'/%3E%3C/svg%3E");
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .formfield input[type="date"]::-webkit-calendar-picker-indicator {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A2AFA8' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M3 11h18'/%3E%3C/svg%3E");
  }
  :root:not([data-theme="light"]) .formfield input[type="date"]:hover::-webkit-calendar-picker-indicator,
  :root:not([data-theme="light"]) .formfield input[type="date"]:focus::-webkit-calendar-picker-indicator {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4A653' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M3 11h18'/%3E%3C/svg%3E");
  }
}
:root[data-theme="dark"] .formfield input[type="date"]::-webkit-calendar-picker-indicator {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A2AFA8' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M3 11h18'/%3E%3C/svg%3E");
}
:root[data-theme="dark"] .formfield input[type="date"]:hover::-webkit-calendar-picker-indicator,
:root[data-theme="dark"] .formfield input[type="date"]:focus::-webkit-calendar-picker-indicator {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4A653' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M3 11h18'/%3E%3C/svg%3E");
}