:root{
  --paper: #F7F4EF;
  --paper-deep: #F1ECE3;
  --ink: #16233D;
  --ink-soft: #4B5670;
  --ink-faint: #8891A3;
  --trace: #C1442D;
  --trace-soft: rgba(193,68,45,0.14);
  --trace-strong: rgba(193,68,45,0.28);
  --teal: #2C6B5E;
  --teal-soft: rgba(44,107,94,0.12);
  --card: #FFFFFF;
  --border: rgba(22,35,61,0.10);
  --max: 1180px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px;}

.ecg-bg{
  background-image:
    repeating-linear-gradient(to right, var(--trace-soft) 0 1px, transparent 1px 24px),
    repeating-linear-gradient(to bottom, var(--trace-soft) 0 1px, transparent 1px 24px),
    repeating-linear-gradient(to right, var(--trace-strong) 0 1.5px, transparent 1.5px 120px),
    repeating-linear-gradient(to bottom, var(--trace-strong) 0 1.5px, transparent 1.5px 120px);
}

.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:12.5px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--trace);
  display:flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:16px;height:1.5px;background:var(--trace);display:inline-block;
}
.eyebrow.on-dark{color:#8FD9C4;}
.eyebrow.on-dark::before{background:#8FD9C4;}

h1,h2,h3,h4{
  font-family:'Newsreader',serif;
  font-weight:500;
  margin:0;
  color:var(--ink);
  letter-spacing:-0.01em;
}

/* ---------- NAV ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(247,244,239,0.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
nav.wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:76px;
}
.logo{
  display:flex; align-items:center; gap:12px;
  font-family:'Newsreader',serif; font-weight:600; font-size:18px;
  text-decoration:none; color:var(--ink);
}
.logo img{
  height:38px; width:auto; border-radius:4px;
}
.logo-sub{
  display:block; font-family:'IBM Plex Mono',monospace; font-weight:400;
  font-size:10px; letter-spacing:0.12em; color:var(--ink-faint); text-transform:uppercase;
  margin-top:1px;
}
.nav-links{
  display:flex; align-items:center; gap:32px; list-style:none; margin:0; padding:0;
}
.nav-links a{
  text-decoration:none; font-size:14.5px; font-weight:500; color:var(--ink-soft);
  position:relative; padding:4px 0; transition:color 0.2s;
}
.nav-links a:hover, .nav-links a.active{color:var(--ink);}
.nav-links a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1.5px;
  background:var(--trace); transform:scaleX(0); transform-origin:left; transition:transform 0.25s;
}
.nav-links a:hover::after, .nav-links a.active::after{transform:scaleX(1);}
.nav-cta{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:0.06em;
  background:var(--ink); color:var(--paper) !important; padding:10px 18px;
  border-radius:2px; text-decoration:none; white-space:nowrap;
}
.menu-btn{display:none;background:none;border:none;cursor:pointer;padding:8px;}
.menu-btn svg{width:22px;height:22px;}

/* ---------- HERO (home) ---------- */
.hero{ padding:88px 0 40px; position:relative; overflow:hidden; }
.hero .wrap{position:relative; z-index:2;}
.hero-inner{max-width:760px;}
.hero h1{ font-size:clamp(2.3rem, 4.6vw, 3.7rem); line-height:1.08; margin:22px 0 24px; }
.hero h1 em{color:var(--trace); font-style:italic;}
.hero p.lede{ font-size:18px; color:var(--ink-soft); max-width:560px; margin-bottom:36px; }
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:56px;}
.btn{
  font-family:'IBM Plex Mono',monospace; font-size:13px; letter-spacing:0.04em;
  padding:14px 24px; border-radius:2px; text-decoration:none; display:inline-flex;
  align-items:center; gap:8px; transition:all 0.2s; border:1px solid transparent; cursor:pointer;
}
.btn-primary{background:var(--ink); color:var(--paper);}
.btn-primary:hover{background:var(--trace);}
.btn-outline{border-color:var(--ink); color:var(--ink); background:none;}
.btn-outline:hover{background:var(--ink); color:var(--paper);}

.pulse-strip{width:100%; height:90px; display:block;}
.pulse-strip path{
  fill:none; stroke:var(--trace); stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:1400; stroke-dashoffset:1400;
  animation:draw 2.6s ease-out forwards 0.3s;
}
@keyframes draw{ to{stroke-dashoffset:0;} }

.divider-strip{height:56px; width:100%; overflow:hidden; position:relative;}
.divider-strip svg{width:100%;height:100%;}
.divider-strip path{fill:none; stroke:var(--ink-faint); stroke-width:1.5; opacity:0.55;}
.divider-strip .beat{stroke:var(--trace); opacity:0.85;}

/* ---------- PAGE HERO (subpages) ---------- */
.page-hero{ padding:64px 0 48px; position:relative; }
.page-hero .wrap{position:relative; z-index:2;}
.page-hero h1{ font-size:clamp(2rem,4vw,3rem); margin:18px 0 18px; max-width:760px; }
.page-hero p.lede{ font-size:17px; color:var(--ink-soft); max-width:620px; }
.crumb{ font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ink-faint); margin-bottom:8px; }
.crumb a{text-decoration:none; color:var(--ink-faint);}
.crumb a:hover{color:var(--trace);}

/* ---------- MISSION ---------- */
.mission{ padding:64px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.mission blockquote{
  margin:0; font-family:'Newsreader',serif; font-style:italic; font-weight:500;
  font-size:clamp(1.4rem,2.6vw,2rem); line-height:1.45; color:var(--ink); max-width:900px;
}
.mission cite{
  display:block; margin-top:22px; font-style:normal; font-family:'IBM Plex Mono',monospace;
  font-size:12.5px; letter-spacing:0.08em; color:var(--ink-faint); text-transform:uppercase;
}

/* ---------- SECTIONS ---------- */
.section{padding:92px 0;}
.section.tight{padding:64px 0;}
.section-head{max-width:640px; margin-bottom:52px;}
.section-head h2{font-size:clamp(1.8rem,3.4vw,2.5rem); margin-top:16px;}
.section-head p{color:var(--ink-soft); font-size:16px; margin-top:16px;}

.cards{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border);
  border:1px solid var(--border);
}
.cards.cols-3{grid-template-columns:repeat(3,1fr);}
.cards.cols-2{grid-template-columns:repeat(2,1fr);}
.card{
  background:var(--card); padding:34px 28px; display:flex; flex-direction:column; gap:16px;
  text-decoration:none; color:var(--ink); transition:background 0.25s;
  min-height:250px;
}
.card:hover{background:var(--paper-deep);}
.card .icon{width:38px;height:38px; color:var(--trace);}
.card h3{font-size:19px; font-weight:600; line-height:1.3;}
.card p{font-size:14.5px; color:var(--ink-soft); flex-grow:1; margin:0;}
.card .go{
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.05em;
  color:var(--ink); display:flex; align-items:center; gap:6px;
}
.card:hover .go{color:var(--trace);}
.card .go svg{width:13px;height:13px; transition:transform 0.2s;}
.card:hover .go svg{transform:translateX(3px);}

/* topic list rows (subpages) */
.topic-list{border-top:1px solid var(--border);}
.topic-row{
  display:grid; grid-template-columns:60px 1fr auto; gap:24px; align-items:center;
  padding:26px 0; border-bottom:1px solid var(--border);
}
.topic-row .tag-mono{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--trace);}
.topic-row h3{font-size:18px; font-weight:600;}
.topic-row p{margin:6px 0 0; color:var(--ink-soft); font-size:14.5px; max-width:560px;}
.topic-row .status{
  font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--ink-faint); border:1px solid var(--border); padding:6px 10px; border-radius:2px; white-space:nowrap;
}

/* callout / coming soon */
.callout{
  border:1px dashed var(--trace-strong); background:var(--trace-soft); border-radius:3px;
  padding:34px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.callout h3{font-size:20px; margin-bottom:8px;}
.callout p{color:var(--ink-soft); margin:0; max-width:460px; font-size:14.5px;}

/* ---------- NEWSLETTER ---------- */
.newsletter{ padding:80px 0; background:var(--ink); color:var(--paper); position:relative; overflow:hidden; }
.newsletter::before{
  content:""; position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(to right, rgba(247,244,239,0.05) 0 1px, transparent 1px 24px),
    repeating-linear-gradient(to bottom, rgba(247,244,239,0.05) 0 1px, transparent 1px 24px);
}
.newsletter .wrap{position:relative; z-index:2; display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;}
.newsletter h2{color:var(--paper); font-size:clamp(1.7rem,3vw,2.3rem); max-width:480px;}
.newsletter p{color:rgba(247,244,239,0.72); margin-top:14px; max-width:420px; font-size:15px;}
form.sub-form{display:flex; gap:0; max-width:420px; width:100%;}
form.sub-form input[type=email]{
  flex-grow:1; background:transparent; border:1px solid rgba(247,244,239,0.35);
  border-right:none; padding:14px 16px; color:var(--paper); font-family:'Inter',sans-serif;
  font-size:14.5px; outline:none;
}
form.sub-form input[type=email]::placeholder{color:rgba(247,244,239,0.5);}
form.sub-form button{
  font-family:'IBM Plex Mono',monospace; font-size:13px; background:var(--trace); color:var(--paper);
  border:1px solid var(--trace); padding:0 22px; cursor:pointer; letter-spacing:0.04em;
}
form.sub-form button:hover{background:#a83a24;}
.sub-note{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:rgba(247,244,239,0.45); margin-top:12px;}

/* ---------- FOUNDER ---------- */
.founder{padding:96px 0;}
.founder .wrap{display:grid; grid-template-columns:280px 1fr; gap:64px; align-items:start;}
.founder-photo{ aspect-ratio:1/1; border-radius:3px; overflow:hidden; border:1px solid var(--border); }
.founder-photo img{width:100%;height:100%;object-fit:cover;}
.founder h2{font-size:clamp(1.6rem,2.8vw,2.1rem); margin-bottom:6px;}
.founder .role{color:var(--trace); font-family:'IBM Plex Mono',monospace; font-size:13px; letter-spacing:0.03em; margin-bottom:22px;}
.founder p.bio{color:var(--ink-soft); font-size:16px; max-width:560px; margin-bottom:26px;}
.tags{display:flex; flex-wrap:wrap; gap:10px;}
.tag{
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.03em;
  border:1px solid var(--border); padding:7px 13px; border-radius:2px; color:var(--ink-soft);
}
.tag.teal{border-color:rgba(44,107,94,0.35); color:var(--teal); background:var(--teal-soft);}

/* ---------- FOOTER ---------- */
footer{border-top:1px solid var(--border); padding:48px 0 36px;}
footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px;}
footer .fnav{display:flex; gap:26px; list-style:none; padding:0; margin:0; flex-wrap:wrap;}
footer .fnav a{font-size:13.5px; text-decoration:none; color:var(--ink-soft);}
footer .fnav a:hover{color:var(--trace);}
.copy{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ink-faint);}
.socials{display:flex; gap:16px;}
.socials a{color:var(--ink-soft); display:flex;}
.socials a:hover{color:var(--trace);}
.socials svg{width:17px;height:17px;}

@media (max-width:900px){
  .cards{grid-template-columns:1fr 1fr;}
  .cards.cols-3{grid-template-columns:1fr 1fr;}
  .founder .wrap{grid-template-columns:1fr; gap:32px;}
  .founder-photo{max-width:220px;}
  .topic-row{grid-template-columns:1fr; gap:8px;}
}
@media (max-width:680px){
  .nav-links{
    position:fixed; top:76px; left:0; right:0; background:var(--paper);
    flex-direction:column; align-items:flex-start; padding:24px 32px; gap:20px;
    border-bottom:1px solid var(--border); transform:translateY(-140%); transition:transform 0.3s;
    max-height:calc(100vh - 76px); overflow-y:auto;
  }
  .nav-links.open{transform:translateY(0);}
  .menu-btn{display:block;}
  .cards, .cards.cols-3, .cards.cols-2{grid-template-columns:1fr;}
  .newsletter .wrap{flex-direction:column; align-items:flex-start;}
  form.sub-form{max-width:100%;}
  .callout{flex-direction:column; align-items:flex-start;}
}
@media (prefers-reduced-motion: reduce){
  .pulse-strip path{animation:none; stroke-dashoffset:0;}
  html{scroll-behavior:auto;}
}
