@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Fraunces:ital,opsz,wght@1,9..144,500&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --ink:#14171b;
  --ink-soft:#20242b;
  --paper:#ece3cd;
  --paper-light:#f6f0e0;
  --paper-line:#d8cba9;
  --text:#211d16;
  --text-onink:#ece3cd;
  --text-muted:#5c5544;
  --stamp:#a23b2e;
  --stamp-dark:#7e2c22;
  --ledger:#1f5c56;
  --ledger-dark:#153f3b;
  --mustard:#b98524;
  --mustard-dark:#8f6416;
  --radius:2px;
  --max:1080px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--text);
  font-family:'Inter',-apple-system,sans-serif;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{
  font-family:'Fraunces',serif;
  font-weight:600;
  line-height:1.12;
  margin:0 0 .5em;
  color:var(--ink);
  letter-spacing:-.01em;
}
h1{font-size:clamp(2.2rem,5vw,3.6rem); font-weight:700;}
h2{font-size:clamp(1.5rem,3vw,2.1rem);}
h3{font-size:1.25rem;}
p{margin:0 0 1.1em;}
a{color:var(--ledger); text-decoration-thickness:1.5px; text-underline-offset:.15em;}
a:hover{color:var(--stamp);}
.mono{font-family:'IBM Plex Mono',monospace;}

.wrap{max-width:var(--max); margin:0 auto; padding:0 28px;}
.wrap-narrow{max-width:740px; margin:0 auto; padding:0 28px;}

/* ---------- header / nav ---------- */
.site-header{
  background:var(--ink);
  color:var(--text-onink);
  border-bottom:6px solid var(--mustard);
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:20px; padding-bottom:20px; flex-wrap:wrap; gap:14px;
}
.brand{display:flex; flex-direction:column; gap:2px; text-decoration:none;}
.brand-mark{
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--mustard);
}
.brand-title{
  font-family:'Fraunces',serif; font-weight:700; font-size:1.5rem;
  color:var(--text-onink); letter-spacing:-.01em;
}
nav.primary{display:flex; gap:2px; flex-wrap:wrap;}
nav.primary a{
  color:var(--text-onink); text-decoration:none;
  font-family:'IBM Plex Mono',monospace; font-size:.82rem;
  letter-spacing:.04em; padding:8px 12px; border-radius:var(--radius);
  border:1px solid transparent;
}
nav.primary a:hover, nav.primary a.active{
  border-color:var(--mustard); color:var(--mustard);
}

/* ---------- hero ---------- */
.hero{
  background:var(--ink);
  color:var(--text-onink);
  padding:64px 0 70px;
  position:relative;
}
.hero .eyebrow{
  font-family:'IBM Plex Mono',monospace; font-size:.8rem; letter-spacing:.15em;
  text-transform:uppercase; color:var(--mustard); margin-bottom:18px; display:block;
}
.hero h1{color:var(--text-onink); max-width:16ch;}
.hero .lede{
  font-family:'Fraunces',serif; font-style:italic; font-weight:500;
  font-size:1.3rem; color:#cfc6ac; max-width:56ch; margin-top:18px;
}
.hero-actions{display:flex; gap:14px; margin-top:34px; flex-wrap:wrap;}

.hero-feature{
  display:inline-flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:var(--paper-light); border:1.5px solid var(--stamp);
  border-radius:var(--radius); padding:12px 18px; margin-top:26px;
  text-decoration:none; max-width:100%;
}
.hero-feature:hover{border-color:var(--mustard); transform:translateY(-1px);}
.hero-feature .k{
  font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--stamp); font-weight:600; white-space:nowrap;
}
.hero-feature .t{
  font-family:'Fraunces',serif; font-style:italic; font-weight:600;
  font-size:1.05rem; color:var(--ink);
}
.hero-feature .arrow{
  font-family:'IBM Plex Mono',monospace; font-size:.85rem; color:var(--ledger); white-space:nowrap;
}

.hero-flex{display:flex; align-items:center; gap:36px;}
.hero-flex .hero-copy{flex:1 1 480px;}
.hero-flex .hero-copy h1{max-width:none;}
.hero-visual{flex:0 1 340px; display:flex; justify-content:center;}
.hero-visual svg{width:100%; height:auto; max-width:340px;}
@media(max-width:860px){
  .hero-flex{flex-direction:column; align-items:flex-start;}
  .hero-visual{order:-1; max-width:220px; margin:0 auto 8px; flex:0 0 auto;}
}

.btn{
  display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:.85rem;
  letter-spacing:.03em; padding:12px 20px; border-radius:var(--radius);
  text-decoration:none; border:1.5px solid currentColor;
}
.btn-primary{background:var(--mustard); border-color:var(--mustard); color:var(--ink); font-weight:600;}
.btn-primary:hover{background:#cf9a2c; color:var(--ink);}
.btn-ghost{color:var(--text-onink);}
.btn-ghost:hover{color:var(--mustard); border-color:var(--mustard);}

/* ---------- sections on paper ---------- */
main{background:var(--paper);}
section{padding:56px 0;}
section.tight{padding:36px 0;}
.section-head{margin-bottom:32px; max-width:64ch;}
.section-head .eyebrow{
  font-family:'IBM Plex Mono',monospace; font-size:.78rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--stamp);
}

hr.rule{border:none; border-top:1px solid var(--paper-line); margin:44px 0;}

/* ---------- card grid ---------- */
.grid{display:grid; gap:20px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
@media(max-width:820px){.grid-3,.grid-2{grid-template-columns:1fr;}}

.card{
  background:var(--paper-light);
  border:1px solid var(--paper-line);
  border-radius:var(--radius);
  padding:26px 24px;
  text-decoration:none;
  color:var(--text);
  display:flex; flex-direction:column; gap:10px;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
a.card:hover{
  transform:translateY(-3px);
  border-color:var(--mustard);
  box-shadow:0 10px 24px rgba(20,23,27,.12);
}
.card .tab{
  font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--stamp); font-weight:600;
}
.card h3{margin-bottom:2px;}
.card p{color:var(--text-muted); font-size:.95rem; margin-bottom:0;}
.card .foot{margin-top:auto; font-family:'IBM Plex Mono',monospace; font-size:.78rem; color:var(--ledger);}

/* ---------- exhibit block (signature element) ---------- */
.exhibit{
  border:1px solid var(--paper-line);
  background:var(--paper-light);
  border-radius:var(--radius);
  margin:28px 0 34px;
  overflow:hidden;
}
.exhibit-head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:var(--ink); color:var(--text-onink);
  padding:10px 18px; flex-wrap:wrap;
}
.exhibit-tag{
  font-family:'IBM Plex Mono',monospace; font-size:.78rem; letter-spacing:.1em;
  color:var(--mustard); font-weight:600; text-transform:uppercase;
}
.verdict{
  font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.08em;
  text-transform:uppercase; padding:4px 10px; border-radius:2px; font-weight:600;
}
.verdict.holds{background:var(--ledger); color:var(--text-onink);}
.verdict.caveat{background:var(--mustard); color:var(--ink);}
.verdict.overreach{background:var(--stamp); color:var(--text-onink);}
.verdict.fabricated{background:var(--stamp-dark); color:var(--text-onink); border:1px solid #4a1810;}
.exhibit-body{padding:22px 22px 24px;}
.exhibit-body h4{margin-bottom:6px; font-size:1.08rem;}
.claim-grid{display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px dashed var(--paper-line); margin-top:16px;}
.claim-grid > div{padding:16px 18px;}
.claim-grid > div:first-child{border-right:1px dashed var(--paper-line);}
@media(max-width:700px){.claim-grid{grid-template-columns:1fr;} .claim-grid > div:first-child{border-right:none; border-bottom:1px dashed var(--paper-line);}}
.claim-grid .label{
  font-family:'IBM Plex Mono',monospace; font-size:.7rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--text-muted); display:block; margin-bottom:6px;
}
.claim-grid .video-says .label{color:var(--stamp);}
.claim-grid .source-says .label{color:var(--ledger);}
.exhibit .source-link{
  display:block; margin-top:14px; font-family:'IBM Plex Mono',monospace; font-size:.85rem;
  word-break:break-all;
}

/* ---------- solutions / numbered steps (real sequence, justified) ---------- */
.steps{counter-reset:step;}
.step{
  display:grid; grid-template-columns:56px 1fr; gap:18px;
  padding:20px 0; border-top:1px solid var(--paper-line);
}
.step:last-child{border-bottom:1px solid var(--paper-line);}
.step-num{
  counter-increment:step;
  font-family:'Fraunces',serif; font-weight:700; font-size:1.6rem; color:var(--mustard-dark);
}
.step-num::before{content: counter(step, decimal-leading-zero);}
.step h4{margin-bottom:6px;}
.step p{color:var(--text-muted); margin-bottom:0;}

/* ---------- pull quote ---------- */
blockquote{
  font-family:'Fraunces',serif; font-style:italic; font-weight:500;
  font-size:1.4rem; color:var(--ink); border-left:4px solid var(--mustard);
  padding:4px 0 4px 22px; margin:30px 0;
}
blockquote cite{
  display:block; font-family:'IBM Plex Mono',monospace; font-style:normal;
  font-size:.78rem; color:var(--text-muted); margin-top:8px; letter-spacing:.02em;
}

/* ---------- tags row ---------- */
.tagrow{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px;}
.tagrow span{
  font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.06em;
  border:1px solid var(--paper-line); border-radius:20px; padding:4px 12px; color:var(--text-muted);
}

/* ---------- footer ---------- */
footer{
  background:var(--ink); color:#a79f89; padding:40px 0; font-size:.9rem;
}
footer a{color:var(--mustard);}
footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px;}

/* ---------- misc ---------- */
.byline{
  font-family:'IBM Plex Mono',monospace; font-size:.8rem; color:var(--text-muted);
  margin-bottom:26px;
}
ul.plain{padding-left:1.15em; margin:0 0 1.1em;}
ul.plain li{margin-bottom:.5em;}
.stamp-rotate{
  display:inline-block; border:3px solid var(--stamp); color:var(--stamp);
  font-family:'IBM Plex Mono',monospace; font-weight:700; letter-spacing:.08em;
  padding:6px 14px; transform:rotate(-4deg); text-transform:uppercase; font-size:.85rem;
  border-radius:4px;
}
.callout{
  background:var(--paper-light); border-left:4px solid var(--ledger);
  padding:18px 20px; border-radius:var(--radius); margin:26px 0;
}
.callout .label{
  font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ledger); display:block; margin-bottom:8px; font-weight:600;
}