/* ============================================================
   Agent Autopsy — design system v2
   Copper, three states: ember (accent / attested),
   patina-teal (inferred), oxide-red (origin / egress).
   Legacy token names aliased for page-specific components.
   ============================================================ */

:root{
  --paper:    #F7F3EC;
  --ink:      #1B2733;
  --ink-70:   rgba(27,39,51,.72);
  --ink-55:   rgba(27,39,51,.56);
  --ink-40:   rgba(27,39,51,.42);
  --ink-22:   rgba(27,39,51,.24);
  --wash-a:   #E8CDB6;
  --wash-b:   #F6E8DC;
  --wash-c:   #E0A172;
  --copper:   #A8500F;
  --copper-dark:#8A4009;
  --patina:   #2E6E63;
  --alarm:    #A32637;
  --night:    #16202C;
  --bone:     #E7EBF2;
  --bone-55:  rgba(231,235,242,.55);
  --tint-warm:#F2EDE5;
  --tint-copper:#FBF4EA;
  --sans: 'Hanken Grotesk', ui-sans-serif, system-ui, sans-serif;
  --mono: 'Space Mono', ui-monospace, 'Courier New', monospace;
  --pad-x: clamp(1.25rem, 4.5vw, 4rem);
  --measure: 62ch;
  --head-h: 64px;

  /* legacy aliases */
  --page: var(--paper);
  --card: #FCF9F3;
  --ink-2: #243447;
  --muted: var(--ink-55);
  --line: rgba(27,39,51,.22);
  --ember: var(--copper);
  --ember-dark: var(--copper-dark);
  --ember-soft: var(--wash-b);
  --navy-deep: var(--night);
  --teal: var(--patina);
  --teal-soft: #E3EFEC;
  --red: var(--alarm);
  --red-soft: #F7E3E6;
}

/* ================= Base ================= */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--head-h) + 16px); }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  font-family:var(--sans);
  font-weight:400;
  color:var(--ink);
  background:var(--paper);
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{ background:var(--wash-a); color:var(--ink); }
a{ color:inherit; }
a:focus-visible, button:focus-visible{ outline:2px solid var(--copper); outline-offset:3px; }
img{ max-width:100%; height:auto; }
h1,h2{ font-weight:300; letter-spacing:-.02em; }
strong{ font-weight:500; color:var(--ink); }

/* Legacy container used by page-specific layouts */
.wrap{ max-width:1080px; margin:0 auto; padding:0 var(--pad-x); }

/* ================= Utility type ================= */
.mono-label{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-55);
}
.mono-meta{
  font-family:var(--mono);
  font-size:.66rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink-40);
}
.cta-mono{
  font-family:var(--mono);
  font-size:.78rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  text-decoration:none;
  white-space:nowrap;
  color:var(--ink);
  transition:color .18s ease;
}
.cta-mono:hover{ color:var(--copper); text-decoration:none; }

/* Buttons */
.btn{
  display:inline-block;
  font-family:var(--mono);
  font-size:.78rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  text-decoration:none;
  white-space:nowrap;
  padding:.95rem 1.7rem;
  border:1px solid var(--ink-22);
  background:rgba(252,249,243,.55);
  color:var(--ink);
  transition:color .18s ease, background-color .18s ease, border-color .18s ease;
}
.btn:hover{ background:var(--ink); border-color:var(--ink); color:var(--paper); text-decoration:none; }
.btn.ghost{ border-color:transparent; background:transparent; }
.btn.ghost:hover{ background:transparent; color:var(--copper); }
.btn-ember{ background:var(--copper); border-color:var(--copper); color:#FCF9F3; }
.btn-ember:hover{ background:var(--copper-dark); border-color:var(--copper-dark); color:#FCF9F3; }
.btn-ghost{ background:transparent; border-color:var(--ink-22); color:var(--ink); }
.btn-ghost:hover{ background:transparent; border-color:var(--copper); color:var(--copper); }
.cta-row{ margin-top:2.4rem; display:flex; gap:1.1rem; flex-wrap:wrap; }

/* ================= Header ================= */
.site-head{
  position:sticky;
  top:0;
  z-index:60;
  border-bottom:1px solid var(--ink-22);
}
/* Glass lives on a pseudo-element: backdrop-filter on the header itself
   would make it the containing block for the fixed mobile menu (iOS). */
.site-head::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:rgba(247,243,236,.86);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.site-head-in{
  max-width:1200px;
  margin:0 auto;
  padding:0 var(--pad-x);
  height:var(--head-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  font-weight:500;
  font-size:1.05rem;
  letter-spacing:.01em;
  white-space:nowrap;
}
.brand:hover{ text-decoration:none; }
.brand .lite{ color:var(--copper); }
.mark{
  width:27px;
  height:27px;
  border-radius:7px;
  border:2.5px solid var(--copper);
  display:grid;
  place-items:center;
  color:var(--copper);
  background:var(--card);
  flex:none;
}
.site-nav{
  display:flex;
  align-items:center;
  gap:clamp(1.2rem, 2vw, 2rem);
}
.site-nav a{ line-height:1; display:inline-flex; align-items:center; padding:0; }
.site-nav .cta-mono{ font-size:.7rem; }
.site-nav .access{ color:var(--copper); font-weight:700; }
.site-nav .access:hover{ color:var(--copper-dark); }
.nav-toggle{ display:none; }

@media (max-width: 940px){
  .nav-toggle{
    display:grid;
    gap:5px;
    background:transparent;
    border:1px solid var(--ink-22);
    padding:10px 9px;
    cursor:pointer;
  }
  .nav-toggle span{
    display:block;
    width:18px;
    height:2px;
    background:var(--ink);
    transition:transform .18s ease;
  }
  body.nav-open .nav-toggle span:first-child{ transform:translateY(3.5px) rotate(45deg); }
  body.nav-open .nav-toggle span:last-child{ transform:translateY(-3.5px) rotate(-45deg); }
  .site-nav{
    position:fixed;
    top:var(--head-h); right:0; bottom:0; left:0;
    background:var(--paper);
    border-top:1px dashed var(--ink-22);
    flex-direction:column;
    align-items:flex-start;
    padding:2.6rem var(--pad-x);
    gap:1.7rem;
    overflow-y:auto;
    overscroll-behavior:contain;
    opacity:0;
    transform:translateY(-8px);
    pointer-events:none;
    transition:opacity .18s ease, transform .18s ease;
  }
  .site-nav .cta-mono{ font-size:.88rem; }
  body.nav-open .site-nav{ opacity:1; transform:none; pointer-events:auto; }
  body.nav-open{ overflow:hidden; }
}

/* ================= Gradient wash (homepage hero) ================= */
.wash{ position:absolute; inset:0; z-index:0; }
.blob{
  position:absolute;
  display:block;
  border-radius:50%;
  filter:blur(72px);
  opacity:.8;
  will-change:transform;
}
.b1{
  width:52vw; height:52vw; min-width:480px; min-height:480px;
  background:var(--wash-a);
  top:-20%; left:-10%;
  animation:drift1 32s ease-in-out infinite alternate;
}
.b2{
  width:46vw; height:46vw; min-width:420px; min-height:420px;
  background:var(--wash-b);
  bottom:-24%; right:-8%;
  animation:drift2 38s ease-in-out infinite alternate;
}
.b3{
  width:28vw; height:28vw; min-width:280px; min-height:280px;
  background:var(--wash-c);
  top:16%; right:14%;
  opacity:.4;
  animation:drift1 44s ease-in-out infinite alternate-reverse;
}
@keyframes drift1{ from{ transform:translate(0,0) scale(1); } to{ transform:translate(4%,6%) scale(1.06); } }
@keyframes drift2{ from{ transform:translate(0,0) scale(1); } to{ transform:translate(-5%,-4%) scale(1.05); } }
@media (prefers-reduced-motion: reduce){ .blob{ animation:none; } }

/* ================= Homepage hero ================= */
.hero{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  overflow:hidden;
  padding:6.5rem var(--pad-x) 5.5rem;
}
.hero-inner{
  position:relative;
  z-index:1;
  text-align:center;
  max-width:62rem;
}
.eyebrow-hero{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--ink-55);
  margin-bottom:2.2rem;
}
.hero h1{
  font-size:clamp(2.3rem, 5.2vw, 3.95rem);
  line-height:1.1;
  margin-inline:auto;
}
.lede{
  margin:2.2rem auto 0;
  max-width:44rem;
  font-size:clamp(1.02rem, 1.5vw, 1.22rem);
  line-height:1.62;
  color:var(--ink-70);
}
.hero-actions{
  margin-top:2.6rem;
  display:flex;
  gap:1.25rem;
  justify-content:center;
  flex-wrap:wrap;
}
.hero-meta{
  margin-top:1.8rem;
  font-size:.7rem;
}
.demo-note{
  margin-top:.9rem;
  font-size:.86rem;
  color:var(--ink-40);
}

/* ================= Ledger card ================= */
.ledger{
  position:relative;
  z-index:1;
  margin-top:4rem;
  width:min(44rem, 100%);
  background:var(--card);
  border:1px dashed var(--ink-22);
  padding:1.4rem 1.5rem 1.2rem;
  text-align:left;
}
.ledger-head{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  padding-bottom:.9rem;
  border-bottom:1px dotted var(--ink-22);
}
.legend{ display:flex; gap:1.2rem; flex-wrap:wrap; }
.legend .mono-meta::before{
  content:"";
  display:inline-block;
  width:14px;
  margin-right:.45rem;
  vertical-align:middle;
  border-top:2px solid var(--copper);
}
.legend .inferred::before{ border-top:2px dashed var(--patina); }
.ledger-rows{ padding:.4rem 0; list-style:none; }
.ledger-rows li{
  display:grid;
  grid-template-columns:5.2rem 8.4rem 1fr;
  gap:1rem;
  align-items:baseline;
  padding:.5rem 0;
  border-bottom:1px dotted rgba(27,39,51,.12);
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.02em;
  margin:0;
}
.ledger-rows li:last-child{ border-bottom:none; }
.ledger-rows .t{ color:var(--ink-40); }
.ledger-rows .src{ color:var(--ink-55); text-transform:uppercase; font-size:.64rem; letter-spacing:.1em; }
.ledger-rows .ev{ color:var(--ink); }
.ltag{
  font-size:.6rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:.1rem .4rem;
  border:1px solid currentColor;
  margin-left:.55rem;
  white-space:nowrap;
}
.ltag.origin{ color:var(--alarm); }
.ltag.egress{ color:var(--alarm); }
.ltag.data{ color:var(--ink-55); }
.ledger-foot{
  padding-top:.9rem;
  border-top:1px dotted var(--ink-22);
  display:flex;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}
.ledger-caption{
  position:relative;
  z-index:1;
  margin-top:1.1rem;
  font-size:.86rem;
  color:var(--ink-55);
  text-align:center;
  max-width:34rem;
}

/* ================= Homepage sections ================= */
main.home section{ padding:5.5rem var(--pad-x); }
.rule-label{
  display:flex;
  align-items:center;
  gap:1.5rem;
  margin-bottom:3rem;
}
.rule-label .dash{ flex:1; border-top:1px dashed var(--ink-22); transform:translateY(1px); }
main.home h2{
  font-size:clamp(1.9rem, 4vw, 3.1rem);
  line-height:1.14;
  max-width:26ch;
}
.section-intro{
  margin-top:1.8rem;
  max-width:var(--measure);
  color:var(--ink-70);
  font-size:1.05rem;
}

/* Custody seal divider */
.seal{
  display:flex;
  align-items:center;
  gap:1.1rem;
  padding:0 var(--pad-x);
}
.seal::before, .seal::after{ content:""; flex:1; border-top:1px dashed var(--ink-22); }
.seal span{
  font-family:var(--mono);
  font-size:.62rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-40);
  white-space:nowrap;
}

/* Sources strip — lateral marquee */
.sources{ padding-top:3.4rem !important; padding-bottom:3.4rem !important; }
.sources-marquee{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.sources-track{
  display:flex;
  width:max-content;
  animation:sources-drift 70s linear infinite;
}
.sources-marquee:hover .sources-track{ animation-play-state:paused; }
.sources-set{
  display:flex;
  align-items:center;
  gap:2.6rem;
  padding-right:2.6rem;
}
.sources-set span{
  font-family:var(--mono);
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-55);
  white-space:nowrap;
}
.sources-set .sep{ color:var(--wash-c); font-size:.9rem; letter-spacing:0; }
@keyframes sources-drift{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .sources-track{ animation:none; }
  .sources-marquee{ -webkit-mask-image:none; mask-image:none; }
  .sources-set[aria-hidden="true"]{ display:none; }
  .sources-track{ width:100%; }
  .sources-set{ flex-wrap:wrap; gap:1.4rem 2.2rem; }
}

/* The gap */
.gap-cols{
  margin-top:3.4rem;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:3rem 4rem;
}
.gap-cols h3{
  font-weight:400;
  font-size:1.3rem;
  letter-spacing:-.01em;
  margin-bottom:1rem;
}
.gap-cols p{ color:var(--ink-70); font-size:1rem; }

/* Features */
.feat-grid{
  margin-top:3.2rem;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:2.8rem 3.2rem;
}
.feat-grid h3{
  font-family:var(--mono);
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:.8rem;
}
.feat-grid p{ font-size:.97rem; line-height:1.6; color:var(--ink-70); }
.chip{
  font-family:var(--mono);
  font-size:.72em;
  letter-spacing:.05em;
  border:1px solid var(--ink-22);
  padding:.06rem .38rem;
  white-space:nowrap;
}

/* Steps */
.how ol{ border-top:1px dashed var(--ink-22); margin-top:3.2rem; list-style:none; }
.step-row{
  display:grid;
  grid-template-columns:5rem 16rem 1fr;
  gap:2rem;
  padding:2.4rem 0;
  border-bottom:1px dashed var(--ink-22);
  align-items:baseline;
}
.step-row .num{
  font-family:var(--mono);
  font-size:.8rem;
  letter-spacing:.1em;
  color:var(--ink-40);
}
.step-row h3{ font-weight:400; font-size:1.35rem; letter-spacing:-.01em; }
.step-row p{ color:var(--ink-70); max-width:var(--measure); font-size:1rem; }
.step-row .mono-meta{ display:block; margin-top:1rem; }

/* Validation */
.val-grid{
  margin-top:3.2rem;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:2.6rem 3rem;
}
.val-grid h3{
  font-family:var(--mono);
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:.8rem;
}
.val-grid p{ font-size:.97rem; line-height:1.6; color:var(--ink-70); }
.val-link{ margin-top:3rem; }
.val-note{
  margin-top:1.4rem;
  max-width:var(--measure);
  font-size:.92rem;
  color:var(--ink-55);
}

/* Doctrine */
.doctrine{ text-align:center; padding-top:7rem !important; padding-bottom:7rem !important; }
.doctrine h2{
  margin-inline:auto;
  font-size:clamp(2.2rem, 5vw, 4rem);
  line-height:1.1;
  max-width:none;
}
.doctrine h2 em{ font-weight:300; }
.doctrine p{
  margin:2.2rem auto 0;
  max-width:44rem;
  color:var(--ink-70);
  font-size:1.05rem;
}

/* Why built */
/* Centered container for homepage sections (matches header width) */
.section-in{ max-width:1200px; margin:0 auto; }

/* Why built — magazine spread */
.why-grid, .layer-grid{
  display:grid;
  grid-template-columns:minmax(0, 7fr) minmax(0, 5fr);
  gap:3rem 4.5rem;
  align-items:start;
}
@media (max-width: 980px){
  .why-grid, .layer-grid{ grid-template-columns:minmax(0, 1fr); }
}
.why-quote .pull, .layer-quote .pull{
  margin:0;
  max-width:none;
  font-size:clamp(1.7rem, 2.6vw, 2.5rem);
  border-left:1px dashed var(--copper);
  padding-left:1.8rem;
}
.pull em{ color:var(--copper); font-style:italic; }
.founder-row{
  margin-top:3.5rem;
  padding-top:2rem;
  border-top:1px dashed var(--ink-22);
  display:flex;
  align-items:center;
  gap:1rem;
}
.founder-row p{ margin:0; font-size:1rem; color:var(--ink-70); }
.founder-row a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--ink-40); text-underline-offset:3px; }
.founder-row a:hover{ color:var(--copper); }

.why-copy, .layer-copy{
  max-width:var(--measure);
  display:grid;
  gap:1.4rem;
  color:var(--ink-70);
  font-size:1.05rem;
}
.why-copy a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--ink-40); text-underline-offset:3px; }
.why-copy a:hover{ color:var(--copper); }
.pull{
  margin:3.2rem 0;
  max-width:34ch;
  font-weight:300;
  font-size:clamp(1.5rem, 3vw, 2.3rem);
  line-height:1.25;
  letter-spacing:-.015em;
  border-left:1px dashed var(--ink-22);
  padding-left:1.6rem;
}

/* The layer above — shares the magazine-spread idiom */
.layer-grid{ margin-top:3.2rem; }
.layer-meta{ display:block; margin-top:3rem; }

/* Access — dashed evidence-card CTA (shared with article pages) */
main.home section.access{
  padding-top:6rem;
  padding-bottom:7rem;
}
.access-card{
  max-width:46rem;
  margin:0 auto;
  text-align:center;
  background:var(--card);
  border:1px dashed var(--ink-22);
  padding:clamp(2.6rem, 6vw, 4.5rem) clamp(1.5rem, 5vw, 4rem);
}
.access-card .mono-label{ display:block; margin-bottom:1.6rem; }
section.access h2, .access-card h2{ margin-inline:auto; max-width:none; font-size:clamp(2rem, 4.4vw, 3.4rem); }
.access-card p{
  margin:1.6rem auto 0;
  max-width:42rem;
  color:var(--ink-70);
  font-size:1.05rem;
}
.access-card .hero-actions{ margin-top:2.6rem; }
.access-card .email{ margin-top:1.6rem; font-size:.9rem; color:var(--ink-55); }
.access-card .email a{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.access-card .email a:hover{ color:var(--copper); }

/* ================= Page hero band (article & product pages) ================= */
.page-hero{
  border-bottom:1px dashed var(--ink-22);
  background:linear-gradient(180deg, var(--wash-b) -60%, var(--paper) 60%);
}
.page-hero-in{
  max-width:1200px;
  margin:0 auto;
  padding:4.2rem var(--pad-x) 3.4rem;
}
.page-hero .eyebrow-hero{
  color:var(--copper);
  margin-bottom:1.4rem;
}
.page-hero h1{
  font-size:clamp(2rem, 4.4vw, 3.5rem);
  line-height:1.1;
  max-width:24ch;
}
.hook{
  margin-top:1.5rem;
  font-weight:300;
  font-size:clamp(1.3rem, 2.5vw, 1.8rem);
  line-height:1.32;
  letter-spacing:-.012em;
  color:var(--ink);
  max-width:36ch;
}
.hook em{ color:var(--copper); font-style:italic; }
.standfirst{
  margin-top:1.2rem;
  max-width:60ch;
  color:var(--ink-55);
  font-size:1.05rem;
  font-style:italic;
  font-weight:300;
  line-height:1.6;
}
.hero-meta-row{
  margin-top:2rem;
  display:flex;
  gap:.6rem 1.6rem;
  flex-wrap:wrap;
}

/* ================= Article layout ================= */
.doc{
  max-width:1200px;
  margin:0 auto;
  padding:3.6rem var(--pad-x) 5rem;
}
.doc-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:3rem;
}
.paper{
  background:transparent;
  border:none;
  padding:0;
  max-width:52rem;
  min-width:0;
}
@media (min-width: 1080px){
  .has-toc .doc-grid{ grid-template-columns:minmax(0, 1fr) 230px; }
}
.toc{ display:none; }
@media (min-width: 1080px){
  .toc{
    display:block;
    position:sticky;
    top:calc(var(--head-h) + 32px);
    align-self:start;
    border-left:1px dashed var(--ink-22);
    padding-left:1.4rem;
    max-height:calc(100vh - var(--head-h) - 64px);
    overflow:auto;
  }
  .toc ol{ list-style:none; margin:1rem 0 0; padding:0; }
  .toc li{ margin:0; }
  .toc a{
    display:block;
    padding:.3rem 0;
    font-size:.86rem;
    line-height:1.4;
    color:var(--ink-55);
    text-decoration:none;
  }
  .toc a:hover{ color:var(--copper); text-decoration:none; }
}

/* article typography */
.paper .eyebrow{
  display:inline-block;
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--copper);
  margin-bottom:1.6rem;
}
.paper hr{
  border:none;
  border-top:1px dashed var(--ink-22);
  margin:2.6rem 0;
}
.paper h2{
  font-weight:400;
  font-size:1.55rem;
  letter-spacing:-.01em;
  margin:3.2rem 0 1rem;
}
.paper h3{
  font-weight:500;
  font-size:1.08rem;
  margin:2.2rem 0 .6rem;
}
.paper p{ margin:.9rem 0; color:var(--ink-70); }
.paper p.mut{ color:var(--ink-55); }
.paper ul, .paper ol{ margin:.9rem 0 .9rem 1.5rem; color:var(--ink-70); }
.paper ul{ list-style:disc; }
.paper ol{ list-style:decimal; }
.paper li{ margin:.5rem 0; }
.paper li::marker{ color:var(--copper); }
.paper a{
  color:var(--copper);
  text-decoration:underline;
  text-decoration-color:rgba(168,80,15,.38);
  text-underline-offset:3px;
}
.paper a:hover{ text-decoration-color:var(--copper); }

/* Buttons inside articles must not inherit the article link color */
.paper a.btn, .paper a.btn-ember, .paper a.btn-ghost{ text-decoration:none; }
.paper a.btn{ color:var(--ink); }
.paper a.btn:hover{ color:var(--paper); }
.paper a.btn.ghost{ color:var(--ink); }
.paper a.btn.ghost:hover{ color:var(--copper); }
.paper a.btn-ember{ color:#FCF9F3; }
.paper a.btn-ember:hover{ color:#FCF9F3; }
.paper a.btn-ghost{ color:var(--ink); }
.paper a.btn-ghost:hover{ color:var(--copper); }
.paper blockquote{
  border-left:1px dashed var(--copper);
  background:var(--tint-copper);
  padding:1rem 1.4rem;
  margin:1.4rem 0;
  color:var(--ink-70);
}
.paper blockquote p{ margin:.5rem 0; }
.paper code{
  font-family:var(--mono);
  font-size:.82em;
  background:var(--tint-warm);
  border:1px solid var(--ink-22);
  padding:.05rem .4rem;
  color:var(--ink);
}
.paper table{
  width:100%;
  border-collapse:collapse;
  margin:1.5rem 0;
  font-size:.92rem;
}
.paper th{
  font-family:var(--mono);
  font-size:.68rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ink-55);
  text-align:left;
  padding:.7rem .8rem;
  border-bottom:1px solid var(--ink-40);
  font-weight:400;
}
.paper td{
  padding:.75rem .8rem;
  border-bottom:1px dashed var(--ink-22);
  color:var(--ink-70);
  vertical-align:top;
}
.paper td.num, .paper th.num{ font-family:var(--mono); font-size:.85rem; }
.paper tr.hl td{ background:var(--tint-copper); }

/* ================= Related guides ================= */
.related{
  border-top:1px dashed var(--ink-22);
  padding:4rem var(--pad-x) 4.5rem;
}
.related-in{ max-width:1200px; margin:0 auto; }
.related-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:1.2rem;
  margin-top:2rem;
}
.rel-card{
  display:block;
  border:1px dashed var(--ink-22);
  background:var(--card);
  padding:1.5rem 1.4rem;
  text-decoration:none;
  transition:border-color .18s ease;
}
.rel-card:hover{ border-color:var(--copper); text-decoration:none; }
.rel-card .rk{
  font-family:var(--mono);
  font-size:.62rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--copper);
}
.rel-card h3{
  font-weight:400;
  font-size:1.05rem;
  letter-spacing:-.01em;
  margin:.55rem 0 .4rem;
}
.rel-card p{ font-size:.9rem; line-height:1.5; color:var(--ink-55); }

/* ================= Footer ================= */
.site-foot{
  background:var(--night);
  color:var(--bone);
  padding:4.5rem var(--pad-x) 2.5rem;
}
.foot-top{
  max-width:1200px;
  margin:0 auto 4rem;
  display:flex;
  justify-content:space-between;
  gap:3rem;
  flex-wrap:wrap;
}
.foot-brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:500;
  font-size:1.05rem;
  text-decoration:none;
}
.foot-brand:hover{ text-decoration:none; }
.foot-brand .lite{ color:var(--wash-c); }
.foot-brand .mark{ background:transparent; }
.foot-cols{ display:flex; gap:clamp(2.5rem, 7vw, 6rem); flex-wrap:wrap; }
.foot-cols h4{
  font-family:var(--mono);
  font-size:.68rem;
  font-weight:400;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--bone-55);
  margin-bottom:1.1rem;
}
.foot-cols ul{ list-style:none; margin:0; padding:0; }
.foot-cols li{ margin:0 0 .55rem; }
.foot-cols a{
  text-decoration:none;
  font-size:.95rem;
  color:var(--bone);
  transition:opacity .18s ease;
}
.foot-cols a:hover{ opacity:.65; text-decoration:none; }
.foot-base{
  max-width:1200px;
  margin:0 auto;
  border-top:1px dashed var(--bone-55);
  padding-top:1.6rem;
  display:flex;
  justify-content:space-between;
  gap:1.5rem;
  flex-wrap:wrap;
  font-family:var(--mono);
  font-size:.64rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--bone-55);
}

/* ================= Reveal ================= */
.reveal{ opacity:0; transform:translateY(14px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }
body.interior .reveal{ opacity:1; transform:none; }

/* ================= Responsive ================= */
@media (max-width: 760px){
  .step-row{
    grid-template-columns:3rem 1fr;
    grid-template-areas:
      "num title"
      "num desc";
    row-gap:.6rem;
  }
  .step-row .num{ grid-area:num; }
  .step-row h3{ grid-area:title; }
  .step-row p{ grid-area:desc; }
  .ledger-rows li{ grid-template-columns:4.4rem 1fr; }
  .ledger-rows .src{ display:none; }
  .foot-top{ flex-direction:column; }
  .hero{ padding-top:4rem; }
}