@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,500;0,600;0,700;0,800;1,500;1,600&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400;1,6..72,500&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --ink:#141C2E;
  --ink-soft:#3B4457;
  --paper:#F3F0E7;
  --paper-card:#FBF9F2;
  --paper-line:#D9D2BE;
  --navy:#1E2A4A;
  --navy-bright:#3A5089;
  --navy-deep:#0F1830;
  --navy-tint:#E1E5EF;
  --gold:#C8963C;
  --gold-deep:#8A6420;
  --gold-tint:#F3E3B9;
  --sage:#4E7A63;
  --sage-deep:#2F4D3D;
  --sage-tint:#DCE8DF;
  --rust:#6B4E71;
  --rust-deep:#3D2A42;
  --rust-tint:#E9DEE7;
  --slate:#5B5748;
  --paper-rgb:243,240,231;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } .spin{ animation:none !important; } }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Newsreader', serif; font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
::selection{ background:var(--gold-tint); color:var(--ink); }
a{ color:var(--navy); }
h1,h2,h3{ font-family:'Playfair Display', serif; font-weight:700; margin:0; color:var(--ink); letter-spacing:-0.01em; }
.eyebrow{
  font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--navy); display:flex; align-items:center; gap:10px; font-weight:600;
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--gold); display:inline-block; }
.eyebrow.on-dark{ color:var(--gold-tint); }
.eyebrow.on-dark::before{ background:var(--gold); }
.wrap{ max-width:1160px; margin:0 auto; padding:0 32px; position:relative; }
section{ padding:120px 0; }
@media (max-width:720px){ .wrap{ padding:0 22px; } section{ padding:72px 0; } }

.offset-card{ position:relative; }
.offset-card::before{ content:""; position:absolute; inset:0; background:var(--gold); transform:translate(10px,10px); z-index:0; }
.offset-card > .inner{ position:relative; z-index:1; background:var(--paper-card); border:2px solid var(--ink); }
.offset-card.navy::before{ background:var(--navy-bright); }
.offset-card.sage::before{ background:var(--sage); }
.offset-card.rust::before{ background:var(--rust); }

/* ---------- NAV ---------- */
header.site{
  position:sticky; top:0; z-index:50; background:rgba(var(--paper-rgb),0.94);
  backdrop-filter:blur(6px); border-bottom:2px solid var(--ink);
}
.navbar{ max-width:1160px; margin:0 auto; padding:20px 32px; display:flex; align-items:center; justify-content:space-between; }
.wordmark{
  font-family:'Playfair Display', serif; font-weight:800; font-size:21px; color:var(--ink);
  text-decoration:none; letter-spacing:-0.01em; display:flex; align-items:center; gap:8px;
}
.wordmark .logo-img{ height:36px; width:auto; display:block; }
.wordmark span{ font-family:'IBM Plex Mono', monospace; font-size:10px; font-weight:600; color:var(--gold-deep); letter-spacing:0.08em; text-transform:uppercase; }
nav.links{ display:flex; gap:32px; align-items:center; }
nav.links a{
  font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:0.05em;
  color:var(--ink-soft); text-decoration:none; text-transform:uppercase; font-weight:600;
  border-bottom:2px solid transparent; padding-bottom:2px;
}
nav.links a:hover{ border-color:var(--gold); color:var(--navy); }
nav.links a[aria-current="page"]{ border-color:var(--navy); color:var(--navy); }
@media (max-width:800px){ nav.links{ display:none; } }

.btn{
  font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:0.05em; text-transform:uppercase;
  padding:15px 24px; text-decoration:none; display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  border:2px solid var(--ink); font-weight:600;
}
.btn-primary{ background:var(--ink); color:var(--paper); }
.btn-primary:hover{ background:var(--navy-deep); border-color:var(--navy-deep); }
.btn-ghost{ color:var(--ink); background:transparent; }
.btn-ghost:hover{ background:var(--gold-tint); }
.btn-ghost.on-dark{ color:var(--paper); border-color:var(--paper); }
.btn-ghost.on-dark:hover{ background:rgba(247,239,216,0.12); }

.dropdown{ position:relative; display:inline-flex; }
.dropdown-caret{ transition:transform 0.15s ease; }
.dropdown.open .dropdown-caret{ transform:rotate(180deg); }
.dropdown-menu{
  position:absolute; top:calc(100% + 10px); left:0; min-width:180px; z-index:20;
  background:var(--paper-card); border:2px solid var(--ink); box-shadow:6px 6px 0 var(--gold);
  display:none; flex-direction:column; padding:6px;
}
.dropdown.open .dropdown-menu{ display:flex; }
.dropdown-menu a{
  font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:0.05em; text-transform:uppercase;
  color:var(--ink); text-decoration:none; font-weight:600; padding:11px 14px;
}
.dropdown-menu a:hover{ background:var(--gold-tint); }

/* ---------- PAGE HEADER (non-home pages) ---------- */
.page-header{ background:var(--navy-deep); color:var(--paper); padding:88px 0 64px; border-bottom:4px solid var(--gold); }
.page-header h1{ font-size:44px; color:var(--paper); margin:18px 0 20px; line-height:1.1; }
@media (max-width:720px){ .page-header h1{ font-size:32px; } }
.page-header p.intro{ color:#C7CCDC; font-size:18px; max-width:60ch; line-height:1.7; margin:0; }

.section-head{ margin-bottom:52px; max-width:660px; }
.section-head h2{ font-size:34px; margin-top:16px; }
.section-head p{ color:var(--slate); font-size:17px; margin-top:14px; }

/* ---------- HERO (home only) ---------- */
.hero{ padding:64px 0 96px; position:relative; }
.hero-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:70px; align-items:start; }
@media (max-width:900px){ .hero-grid{ grid-template-columns:1fr; gap:56px; } }
.hero h1{ font-size:54px; line-height:1.08; margin:22px 0 24px; }
@media (max-width:900px){ .hero h1{ font-size:36px; } }
.hero .lede{ font-size:19.5px; color:var(--ink-soft); max-width:46ch; margin-bottom:34px; }
.hero .cta-row{ display:flex; gap:16px; flex-wrap:wrap; }

.stamp{ position:absolute; top:-18px; right:-8px; width:118px; height:118px; z-index:2; }
@media (max-width:900px){ .stamp{ top:-4px; right:6px; width:96px; height:96px; } }
.stamp .spin{ animation:spin 26s linear infinite; transform-origin:60px 60px; }
@keyframes spin{ from{ transform:rotate(0deg);} to{ transform:rotate(360deg);} }

.manuscript .inner{ padding:32px 30px; }
.manuscript .tag{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--slate); margin-bottom:16px; display:block; font-weight:600; }
.manuscript .original{ font-size:15.5px; line-height:1.8; color:var(--ink-soft); font-family:'Newsreader', serif; }
.manuscript .strike{ text-decoration:line-through; text-decoration-color:var(--navy); text-decoration-thickness:2px; opacity:0.5; }
.manuscript .mark{ background:var(--gold-tint); padding:1px 3px; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.manuscript .margin-note{
  font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--paper-card); background:var(--navy);
  display:inline-block; margin-left:6px; border-radius:50%; width:17px; height:17px; text-align:center; line-height:17px; font-weight:600;
}
.manuscript hr{ border:none; border-top:2px dashed var(--paper-line); margin:22px 0; }
.manuscript .translation-label{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold-deep); display:block; margin-bottom:10px; font-weight:600; }
.manuscript .translation{ font-family:'Playfair Display', serif; font-style:italic; font-size:20px; line-height:1.5; color:var(--ink); font-weight:600; }

/* ---------- MANIFESTO BLOCK (reused on About) ---------- */
.manifesto{ background:var(--navy-deep); color:var(--paper); border-top:4px solid var(--gold); border-bottom:4px solid var(--gold); }
.manifesto blockquote{
  margin:26px 0 0; font-family:'Playfair Display', serif; font-style:italic; font-weight:600;
  font-size:34px; line-height:1.35; max-width:880px; color:var(--paper);
}
@media (max-width:760px){ .manifesto blockquote{ font-size:23px; } }
.manifesto .signoff{ margin-top:28px; font-family:'IBM Plex Mono', monospace; font-size:13px; color:#AEB6CC; letter-spacing:0.05em; }
.manifesto .body-text{ margin-top:26px; max-width:70ch; color:#D2D6E4; font-size:16.5px; line-height:1.75; }

/* ---------- RUN CARDS (What we run — bento w/ icons) ---------- */
.run-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; }
@media (max-width:860px){ .run-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .run-grid{ grid-template-columns:1fr; } }
.run-card{ background:var(--paper-card); border:2px solid var(--ink); padding:30px 26px; display:flex; flex-direction:column; transition:transform 0.15s ease, background 0.15s ease; }
.run-card:hover{ background:var(--paper); transform:translateY(-3px); }
.run-icon{ width:44px; height:44px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; }
.run-icon svg{ width:26px; height:26px; }
.run-card:nth-child(6n+1) .run-icon{ background:var(--navy-tint); color:var(--navy); }
.run-card:nth-child(6n+2) .run-icon{ background:var(--gold-tint); color:var(--gold-deep); }
.run-card:nth-child(6n+3) .run-icon{ background:var(--sage-tint); color:var(--sage-deep); }
.run-card:nth-child(6n+4) .run-icon{ background:var(--rust-tint); color:var(--rust-deep); }
.run-card:nth-child(6n+5) .run-icon{ background:var(--navy-tint); color:var(--navy); }
.run-card:nth-child(6n+6) .run-icon{ background:var(--gold-tint); color:var(--gold-deep); }
.run-card .num{ font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--slate); letter-spacing:0.08em; margin-bottom:10px; }
.run-card h3{ font-size:20px; font-weight:700; margin-bottom:10px; line-height:1.3; }
.run-card p{ color:var(--slate); font-size:15px; line-height:1.6; margin:0; }

/* ---------- SPLIT PANELS (Decoded / Archived teaser) ---------- */
.split-panels{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
@media (max-width:800px){ .split-panels{ grid-template-columns:1fr; } }
.panel{ padding:44px 38px; color:var(--paper); border:2px solid var(--ink); }
.panel.sage{ background:var(--sage-deep); }
.panel.rust{ background:var(--rust-deep); }
.panel .ptag{ font-family:'IBM Plex Mono', monospace; font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; opacity:0.75; margin-bottom:14px; display:block; font-weight:600; }
.panel h3{ font-size:28px; color:var(--paper); margin-bottom:14px; }
.panel p{ opacity:0.9; font-size:15.5px; line-height:1.7; margin-bottom:22px; max-width:44ch; }
.panel a.plink{ font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:0.05em; text-transform:uppercase; color:var(--paper); text-decoration:none; border-bottom:2px solid var(--gold); padding-bottom:2px; font-weight:600; }

/* ---------- PIPELINE ---------- */
.pipeline{ background:var(--navy-deep); color:var(--paper); border-top:4px solid var(--gold); border-bottom:4px solid var(--gold); }
.pipeline .section-head h2{ color:var(--paper); }
.pipeline .section-head p{ color:#B8BFD2; }
.pipeline-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
@media (max-width:800px){ .pipeline-row{ grid-template-columns:1fr; } }
.pipe-step{ background:rgba(247,239,216,0.06); border:2px solid rgba(247,239,216,0.3); padding:26px 22px; }
.pipe-num{ font-family:'IBM Plex Mono', monospace; font-size:26px; color:var(--gold-tint); font-weight:700; margin-bottom:14px; display:block; }
.pipe-step h3{ font-family:'Playfair Display', serif; font-size:21px; color:var(--paper); margin-bottom:8px; }
.pipe-step p{ color:#B8BFD2; font-size:14.5px; line-height:1.6; margin:0; }

/* ---------- VALUE CARDS (About) ---------- */
.value-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:56px; }
@media (max-width:860px){ .value-grid{ grid-template-columns:1fr; } }
.value-card{ border-top:3px solid var(--navy); padding-top:20px; }
.value-card:nth-child(2){ border-top-color:var(--gold); }
.value-card:nth-child(3){ border-top-color:var(--sage); }
.value-card h3{ font-size:21px; margin-bottom:10px; }
.value-card p{ color:var(--slate); font-size:15.5px; line-height:1.65; margin:0; }

/* ---------- ARTICLE LIST (Decoded / Archived pages) ---------- */
.article-grid{ display:flex; flex-direction:column; gap:2px; background:var(--paper-line); }
.article-row{
  background:var(--paper-card); padding:28px 30px; display:grid; grid-template-columns:140px 1fr; gap:26px; align-items:start;
}
@media (max-width:700px){ .article-row{ grid-template-columns:1fr; gap:10px; } }
.article-row .meta{ font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--slate); }
.article-row .meta .date{ display:block; font-weight:600; margin-bottom:8px; }
.article-row.sage .meta .date{ color:var(--sage-deep); }
.article-row.rust .meta .date{ color:var(--rust-deep); }
.article-row h3{ font-size:22px; margin-bottom:8px; font-weight:700; }
.article-row p.summary{ color:var(--ink-soft); font-size:15.5px; margin:0 0 12px; line-height:1.65; }
.article-row .tag-pill{
  display:inline-block; font-family:'IBM Plex Mono', monospace; font-size:10.5px; letter-spacing:0.06em;
  text-transform:uppercase; padding:4px 10px; font-weight:600;
}
.article-row.sage .tag-pill{ color:var(--sage-deep); background:var(--sage-tint); }
.article-row.rust .tag-pill{ color:var(--rust-deep); background:var(--rust-tint); }

/* ---------- TEAM ---------- */
.team-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
@media (max-width:920px){ .team-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .team-grid{ grid-template-columns:1fr; } }
.team-card{ display:flex; flex-direction:column; }
.team-photo{
  width:100%; aspect-ratio:4/5; background:var(--navy-tint); border:2px solid var(--ink);
  display:flex; align-items:center; justify-content:center; margin-bottom:18px; overflow:hidden;
}
.team-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.team-photo .placeholder-initial{ font-family:'Playfair Display', serif; font-size:56px; font-weight:700; color:var(--navy-bright); opacity:0.55; }
.team-card h3{ font-size:21px; margin-bottom:6px; }
.team-card .role{
  font-family:'IBM Plex Mono', monospace; font-size:11.5px; letter-spacing:0.05em; text-transform:uppercase;
  color:var(--navy); font-weight:700; line-height:1.6; display:block; margin-bottom:4px;
}
.team-card .affil{
  font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.05em; text-transform:uppercase;
  color:var(--gold-deep); font-weight:600; line-height:1.6; display:block; margin-bottom:14px;
}
.team-card p.bio{ color:var(--ink-soft); font-size:15px; line-height:1.65; margin:0 0 14px; }
.team-card a.linkedin{
  font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:0.03em; text-transform:uppercase;
  color:var(--navy); text-decoration:none; border-bottom:2px solid var(--gold); padding-bottom:2px; font-weight:600; align-self:flex-start;
}
.team-note{ margin-top:40px; font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--slate); border-top:2px dashed var(--paper-line); padding-top:18px; }
.team-grid.founders-two{ grid-template-columns:repeat(2, minmax(240px, 340px)); justify-content:center; max-width:760px; margin:0 auto; gap:48px; }
@media (max-width:640px){ .team-grid.founders-two{ grid-template-columns:1fr; max-width:340px; } }
.section-pad-y{ padding:80px 0; }
.section-pad-b{ padding-bottom:80px; }

/* ---------- INVOLVE CARDS ---------- */
.involve-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width:860px){ .involve-grid{ grid-template-columns:1fr; } }
.involve-card{ padding:32px 28px; border:2px solid var(--ink); }
.involve-card:nth-child(1){ background:var(--navy-tint); }
.involve-card:nth-child(2){ background:var(--sage-tint); }
.involve-card:nth-child(3){ background:var(--gold-tint); }
.involve-card h3{ font-size:23px; margin-bottom:10px; }
.involve-card p{ color:var(--ink-soft); font-size:15.5px; margin-bottom:20px; }
.involve-card a.link{
  font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--ink); text-decoration:none; border-bottom:2px solid var(--ink); padding-bottom:2px; font-weight:600;
}

/* ---------- CONTACT ---------- */
.contact-block{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; }
@media (max-width:800px){ .contact-block{ grid-template-columns:1fr; } }
.contact-block .lead{ font-size:19px; color:var(--ink-soft); line-height:1.7; }
.contact-block .email-cta{ font-family:'Playfair Display', serif; font-size:26px; font-style:italic; color:var(--navy); display:inline-block; margin-top:16px; }

/* ---------- CTA BANNER ---------- */
.cta-banner{ background:var(--gold-tint); border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); }
.cta-banner .wrap{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; padding:44px 32px; }
.cta-banner h3{ font-size:26px; margin-bottom:6px; }
.cta-banner p{ color:var(--slate); margin:0; font-size:15.5px; }

/* ---------- FOOTER ---------- */
footer{ background:var(--ink); color:#D8DBE6; padding:56px 0 30px; }
.footer-top{ display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; margin-bottom:44px; }
footer .wordmark-f{ font-family:'Playfair Display', serif; font-size:23px; color:var(--paper); font-weight:800; }
footer p.tagline{ color:#9EA3B8; font-size:14.5px; max-width:34ch; margin-top:10px; }
footer .foot-links{ display:flex; gap:48px; flex-wrap:wrap; }
footer .foot-col h4{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:#7D8299; margin-bottom:12px; font-weight:600; }
footer .foot-col a{ display:block; color:#D8DBE6; text-decoration:none; font-size:14.5px; margin-bottom:8px; }
footer .foot-col a:hover{ color:var(--gold-tint); }
footer .bottom{
  border-top:1px solid #333B54; padding-top:22px; font-size:12.5px; color:#7D8299;
  font-family:'IBM Plex Mono', monospace; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;
}
.admin-dot{ background:none; border:none; cursor:pointer; color:#4E5670; font-size:13px; opacity:0.6; padding:4px; }
.admin-dot:hover{ opacity:1; color:var(--gold-tint); }
