:root{
  --ink:#182420;
  --ink-soft:#465049;
  --paper:#EFF2EC;
  --paper-raised:#FFFFFF;
  --line:#C6CFC5;
  --brass:#B98A2E;
  --brass-soft:#EADFC5;
  --teal:#2C5F53;
  --teal-tint:#DCE7E2;
  --max:1180px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Public Sans', -apple-system, sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-family:'Newsreader', Georgia, serif;
  font-weight:500;
  color:var(--ink);
  margin:0;
}
a{color:var(--teal);}
.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12.5px;
  letter-spacing:0.09em;
  text-transform:uppercase;
  color:var(--brass);
  font-weight:500;
}
.wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}

/* Header */
header{
  position:sticky; top:0; z-index:40;
  background:rgba(239,242,236,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 32px; max-width:var(--max); margin:0 auto;
}
.wordmark{
  display:flex; align-items:center; gap:10px;
  font-family:'IBM Plex Mono', monospace;
  font-size:13px; letter-spacing:0.04em;
  color:var(--ink); text-decoration:none;
}
.wordmark svg{display:block;}
.header-inner nav{display:flex; gap:10px;}
.header-inner nav a{
  font-family:'Public Sans', sans-serif;
  font-size:14.5px; font-weight:600;
  color:var(--ink); text-decoration:none;
  padding:8px 16px; border:1px solid var(--ink); border-radius:100px;
  transition:background .15s ease, color .15s ease;
}
.header-inner nav a:hover{background:var(--ink); color:var(--paper);}
.header-inner nav a.active{background:var(--ink); color:var(--paper);}

/* Hero */
.hero{padding:88px 0 40px;}
.hero h1{
  font-size:clamp(34px, 5.2vw, 58px);
  line-height:1.08;
  max-width:15ch;
  letter-spacing:-0.01em;
}
.hero-lede{
  max-width:640px; margin-top:26px;
  font-size:18.5px; color:var(--ink-soft);
}
.hero-priority{
  margin-top:18px; max-width:640px;
  font-size:18.5px;
}
.hero-priority strong{color:var(--teal);}

/* Converge signature graphic */
.converge-wrap{margin:56px 0 8px;}
.converge-wrap svg{width:100%; height:auto; display:block;}
.converge-line{
  stroke-dasharray:900; stroke-dashoffset:900;
  animation:draw 1.6s ease forwards;
}
.converge-line:nth-child(1){animation-delay:.05s;}
.converge-line:nth-child(2){animation-delay:.15s;}
.converge-line:nth-child(3){animation-delay:.25s;}
.converge-line:nth-child(4){animation-delay:.35s;}
.converge-line:nth-child(5){animation-delay:.45s;}
.converge-line:nth-child(6){animation-delay:.55s;}
@keyframes draw{to{stroke-dashoffset:0;}}
@media (prefers-reduced-motion:reduce){
  .converge-line{animation:none; stroke-dashoffset:0;}
}
.converge-caption{
  font-family:'IBM Plex Mono', monospace; font-size:12px;
  color:var(--ink-soft); text-align:center; margin-top:6px;
  letter-spacing:0.03em;
}

/* Not / Is section */
.stance{
  background:var(--ink); color:var(--paper);
  padding:56px 0;
}
.stance .wrap{display:grid; grid-template-columns: 1fr 1.4fr; gap:48px;}
.stance h2{color:var(--paper); font-size:26px; max-width:14ch;}
.stance p{color:#C9D3CC; font-size:17px; max-width:56ch;}
.stance p + p{margin-top:14px;}
@media (max-width:760px){
  .stance .wrap{grid-template-columns:1fr;}
}

/* Who's involved */
.who{padding:72px 0;}
.who > .wrap > .eyebrow{display:block; margin-bottom:10px;}
.who h2{font-size:32px; max-width:20ch; margin-bottom:8px;}
.who-note{max-width:70ch; color:var(--ink-soft); margin-top:14px; font-size:16px;}
.who-cols{
  margin-top:40px;
  display:grid; grid-template-columns:repeat(3, 1fr); gap:28px;
}
@media (max-width:820px){.who-cols{grid-template-columns:1fr;}}
.who-col{
  background:var(--paper-raised); border:1px solid var(--line);
  border-radius:4px; padding:26px 24px;
}
.who-col .tag{
  font-family:'IBM Plex Mono', monospace; font-size:11.5px;
  letter-spacing:0.07em; text-transform:uppercase;
  color:var(--teal); display:block; margin-bottom:12px;
}
.who-col ul{margin:0; padding:0; list-style:none;}
.who-col li{
  font-size:15px; padding:9px 0; border-top:1px solid var(--line);
  color:var(--ink-soft);
}
.who-col li:first-child{border-top:none;}

/* Doc callout */
.callout{
  margin-top:44px; padding:28px 30px;
  background:var(--brass-soft); border:1px solid var(--brass);
  border-radius:4px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  flex-wrap:wrap;
}
.callout p{margin:0; font-size:16.5px; max-width:52ch;}
.callout .btn{
  font-family:'IBM Plex Mono', monospace; font-size:13px; font-weight:500;
  text-decoration:none; color:var(--ink); background:var(--paper);
  border:1px solid var(--ink); padding:12px 20px; border-radius:100px;
  white-space:nowrap; transition:background .15s ease,color .15s ease;
}
.callout .btn:hover{background:var(--ink); color:var(--paper);}

/* Work programme */
.work{padding:20px 0 88px;}
.work > .wrap > .eyebrow{display:block; margin-bottom:10px;}
.work h2{font-size:32px; max-width:18ch;}
.work-intro{max-width:66ch; color:var(--ink-soft); margin-top:14px; font-size:16px;}

.cards{margin-top:40px; display:flex; flex-direction:column; gap:20px;}
.card{
  background:var(--paper-raised); border:1px solid var(--line);
  border-radius:6px; overflow:hidden;
  opacity:0; transform:translateY(14px);
  transition:opacity .5s ease, transform .5s ease;
}
.card.in{opacity:1; transform:none;}
.card-head{
  display:flex; align-items:center; gap:18px;
  padding:24px 26px; cursor:pointer; user-select:none;
  background:none; border:none; width:100%; text-align:left;
  font:inherit; color:inherit;
}
.card-icon{
  flex:0 0 auto; width:44px; height:44px; border-radius:50%;
  background:var(--teal-tint); display:flex; align-items:center; justify-content:center;
}
.card-icon svg{width:22px; height:22px;}
.card-head-text{flex:1;}
.card-head-text .tag{
  font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.07em;
  text-transform:uppercase; color:var(--brass); display:block; margin-bottom:4px;
}
.card-head-text h3{font-size:21px; line-height:1.25;}
.chevron{
  flex:0 0 auto; width:20px; height:20px; color:var(--ink-soft);
  transition:transform .3s ease;
}
.card.open .chevron{transform:rotate(180deg);}
.card-body{
  max-height:0; overflow:hidden; transition:max-height .4s ease;
}
.card-body-inner{padding:0 26px 30px 88px;}
.card-body h4{
  font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:.05em;
  text-transform:uppercase; color:var(--teal); margin:20px 0 8px;
}
.card-body h4:first-child{margin-top:0;}
.card-body p{margin:0 0 10px; font-size:15.5px; color:var(--ink-soft); max-width:64ch;}
.card-body ul{margin:8px 0 10px; padding-left:20px;}
.card-body li{font-size:15.5px; color:var(--ink-soft); margin-bottom:6px; max-width:60ch;}
@media (max-width:640px){
  .card-body-inner{padding-left:26px;}
}

/* Related documents (work programme page only) */
.doclist{margin:18px 0 4px; display:flex; flex-direction:column; gap:0;}
.doclist a{
  display:flex; align-items:center; gap:10px;
  padding:10px 0; border-top:1px solid var(--line);
  font-size:14.5px; color:var(--ink); text-decoration:none;
}
.doclist a:first-child{border-top:1px solid var(--line);}
.doclist a:hover{color:var(--teal);}
.doclist svg{flex:0 0 auto; width:15px; height:15px; color:var(--brass);}
.doclist .filetag{
  font-family:'IBM Plex Mono', monospace; font-size:10.5px;
  color:var(--ink-soft); margin-left:auto; letter-spacing:.04em;
}

/* Simple page header banner (non-home pages) */
.page-header{padding:64px 0 20px;}
.page-header h1{
  font-size:clamp(30px, 4.4vw, 46px); line-height:1.1; max-width:18ch;
}
.page-header p{max-width:62ch; color:var(--ink-soft); font-size:17.5px; margin-top:18px;}

/* Footer */
footer{background:var(--ink); color:var(--paper); padding:64px 0 40px;}
.foot-top{
  display:flex; justify-content:space-between; align-items:flex-start;
  gap:32px; flex-wrap:wrap; padding-bottom:40px; border-bottom:1px solid #33403A;
}
footer h2{color:var(--paper); font-size:26px; max-width:12ch;}
.foot-links{display:flex; gap:28px; flex-wrap:wrap;}
.foot-links a{color:#C9D3CC; text-decoration:none; font-size:14.5px;}
.foot-links a:hover{color:var(--paper);}
.foot-bottom{
  padding-top:24px; font-size:13px; color:#8A968E;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
}
