/* ============================================================
   LODE — style.css
   mining-industrial · yellow-amber + slate · slab serif + mono
   no external fonts; system stacks only.
   ============================================================ */

:root{
  --bg:        #0f1014;
  --bg-2:      #14161c;
  --bg-3:      #1c1e25;
  --ink:       #ecead8;
  --ink-dim:   #a8a89a;
  --ink-mute:  #6c6c63;
  --rail:      #3a3d46;
  --rail-2:    #22242b;
  --amber:     #f5c34d;
  --amber-2:   #ffd76b;
  --amber-dim: #cfb582;
  --rust:      #a8693d;
  --rust-dim:  #6b3d22;
  --rule:      #2a2c34;

  --slab: "Roboto Slab", "Rockwell", "Courier New", Georgia, serif;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", "Menlo", "Consolas", monospace;
  --body: "Inter", "Helvetica Neue", system-ui, sans-serif;
}

/* ============================================================
   reset, base
   ============================================================ */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--mono);
  font-size:15px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
a{ color:var(--amber); text-decoration:none; }
a:hover{ color:var(--amber-2); }
code{
  font-family:var(--mono);
  font-size:0.94em;
  background:var(--bg-3);
  padding:1px 5px;
  border-radius:2px;
  color:var(--amber-dim);
}
em{ font-style:italic; color:var(--ink-dim); }
strong{ color:var(--ink); font-weight:600; }

/* paper grain overlay so the page feels like printed stock */
body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  z-index:1000;
  background:
    radial-gradient(circle at 20% 10%, rgba(255,215,107,0.025), transparent 40%),
    radial-gradient(circle at 80% 90%, rgba(168,105,61,0.03), transparent 50%);
  mix-blend-mode:screen;
}

/* ============================================================
   the SHAFT — vertical depth-gauge nav, left edge
   ============================================================ */
.shaft{
  position:fixed;
  top:0; left:0; bottom:0;
  width:88px;
  background:linear-gradient(to right, var(--bg-2) 0 78px, var(--rail-2) 78px 80px, transparent 80px);
  z-index:20;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:18px 0 26px;
}
.shaft-cap{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px; height:44px;
  background:var(--amber);
  color:var(--bg);
  border:none;
  margin-bottom:18px;
  clip-path:polygon(0 0, 100% 0, 100% 78%, 50% 100%, 0 78%);
}
.shaft-cap svg{ width:24px; height:24px; }
.shaft-rail{
  position:relative;
  width:4px;
  flex:1;
  background:var(--rail-2);
  margin:0 auto;
  overflow:visible;
}
.shaft-fill{
  position:absolute;
  top:0; left:0; right:0;
  height:0%;
  background:linear-gradient(to bottom, var(--amber), var(--rust));
  transition:height 0.12s linear;
}
.shaft-marks{
  list-style:none;
  margin:0; padding:0;
  position:absolute; inset:0;
}
.shaft-marks li{
  position:absolute;
  left:-46px;
  top:var(--at);
  width:40px;
  text-align:right;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.08em;
  color:var(--ink-mute);
  transform:translateY(-50%);
}
.shaft-marks li::after{
  content:"";
  position:absolute;
  right:-12px; top:50%;
  width:8px; height:1px;
  background:var(--ink-mute);
  transform:translateY(-50%);
}
.shaft-nav{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:18px;
  align-items:center;
}
.shaft-nav a{
  font-family:var(--mono);
  font-size:9.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  padding:6px 0;
  border-left:1px solid transparent;
}
.shaft-nav a:hover{ color:var(--amber); }

/* ============================================================
   layout — every section gets pushed right of the shaft
   ============================================================ */
main{
  margin-left:88px;
  padding:0;
  max-width:none;
}
section{
  padding:84px 8vw 84px 6vw;
  position:relative;
}

/* ============================================================
   surface bar — slug under the helmet
   ============================================================ */
.surface{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 8vw 18px 6vw;
  border-bottom:1px solid var(--rule);
  background:var(--bg-2);
}
.slug{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-dim);
}
.slug .tag{ color:var(--ink); }
.slug .sep{ color:var(--ink-mute); margin:0 8px; }
.x-handle{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.12em;
  color:var(--amber);
  padding:6px 12px;
  border:1px solid var(--amber-dim);
}
.x-handle:hover{ background:var(--amber); color:var(--bg); }

/* ============================================================
   the kicker — small label above each stratum hed
   ============================================================ */
.kicker{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--amber-dim);
  margin:0 0 18px;
  display:inline-block;
  padding:4px 0 4px 14px;
  border-left:3px solid var(--amber);
}

/* ============================================================
   masthead — big slab type
   ============================================================ */
.masthead{
  font-family:var(--slab);
  font-weight:800;
  font-size:clamp(48px, 8vw, 120px);
  line-height:0.92;
  letter-spacing:-0.02em;
  color:var(--ink);
  margin:0 0 28px;
  text-transform:uppercase;
}
.m-row{ display:block; }
.m-word{ display:inline-block; }
.m-word.amber{ color:var(--amber); }
.m-word.amber::after{
  content:"";
  display:inline-block;
  width:0.6em; height:0.6em;
  background:var(--amber);
  margin-left:0.12em;
  vertical-align:0.04em;
  transform:rotate(45deg) translateY(-0.06em);
}

/* ============================================================
   headframe — 2-column hero: copy left, illustration right
   ============================================================ */
.headframe{
  display:grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap:60px;
  align-items:start;
  padding-top:48px;
  padding-bottom:96px;
  border-bottom:1px solid var(--rule);
  position:relative;
}
.headframe::after{
  content:"";
  position:absolute;
  left:6vw; right:8vw;
  bottom:-1px;
  height:1px;
  background:linear-gradient(to right, var(--amber-dim), transparent 60%);
}
.head-left{ min-width:0; }

.lede{
  font-family:var(--body);
  font-size:18px;
  line-height:1.55;
  color:var(--ink-dim);
  max-width:52ch;
  margin:0 0 32px;
}

/* CTAs */
.cta-row{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:36px;
}
.cta{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 22px;
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  border:1px solid var(--amber-dim);
  transition:transform .08s ease, background .15s ease;
}
.cta svg{ width:16px; height:16px; }
.cta.primary{
  background:var(--amber);
  color:var(--bg);
  border-color:var(--amber);
}
.cta.primary:hover{ background:var(--amber-2); transform:translateY(-1px); }
.cta.ghost{
  background:transparent;
  color:var(--ink);
}
.cta.ghost:hover{ background:var(--bg-3); border-color:var(--amber); color:var(--amber); }
.cta.big{ padding:18px 30px; font-size:13px; }

/* the data plate */
.plate{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:0;
  border:1px solid var(--rule);
  margin:0 0 22px;
  background:var(--bg-2);
}
.plate > div{
  padding:12px 14px;
  border-right:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.plate > div:nth-child(3n){ border-right:0; }
.plate > div:nth-last-child(-n+3){ border-bottom:0; }
.plate dt{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin:0 0 4px;
}
.plate dd{
  font-family:var(--slab);
  font-weight:700;
  font-size:14px;
  margin:0;
  color:var(--ink);
}

.contracts{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--ink-mute);
  margin:0;
}
.contracts a{ color:var(--amber-dim); }
.contracts a:hover{ color:var(--amber); }

/* ============================================================
   the rig — inline SVG headframe illustration
   ============================================================ */
.rig{
  margin:0;
  position:relative;
  padding:18px;
  background:var(--bg-2);
  border:1px solid var(--rule);
}
.rig svg{
  width:100%;
  height:auto;
  max-height:560px;
}
.rig-cap{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin-top:12px;
  text-align:center;
}
/* winder spins slowly */
.winder{ transform-origin:150px 36px; animation:spin 16s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }
/* dust drift */
.dust{ animation:drift 4s ease-in-out infinite alternate; transform-origin:center; opacity:.6; }
@keyframes drift{ from{ transform:translateY(0); opacity:.3; } to{ transform:translateY(-6px); opacity:.7; } }
/* cart rocks ever so slightly */
.cart{ animation:rock 3.4s ease-in-out infinite alternate; transform-origin:150px 470px; }
@keyframes rock{ from{ transform:translate(150px,462px) rotate(-0.5deg); } to{ transform:translate(150px,462px) rotate(0.5deg); } }
/* vein traces shimmer */
.veins path{ animation:shimmer 5s ease-in-out infinite alternate; }
.veins path:nth-child(2){ animation-delay:1.2s; }
.veins path:nth-child(3){ animation-delay:2.4s; }
.veins path:nth-child(4){ animation-delay:3.1s; }
@keyframes shimmer{ from{ opacity:.4; } to{ opacity:.85; } }

/* ============================================================
   stratum — the body sections
   ============================================================ */
.stratum{
  border-bottom:1px solid var(--rule);
  position:relative;
}
.stratum::before{
  /* a tiny rock-strata decoration in the gutter */
  content:"";
  position:absolute;
  top:0; left:6vw;
  width:80px; height:6px;
  background:repeating-linear-gradient(90deg, var(--amber-dim) 0 8px, transparent 8px 14px);
  opacity:.5;
}
.hed{
  font-family:var(--slab);
  font-weight:800;
  font-size:clamp(32px, 4.5vw, 64px);
  line-height:1.02;
  letter-spacing:-0.015em;
  color:var(--ink);
  margin:0 0 36px;
  max-width:18ch;
}
.hed.amber{ color:var(--amber); }

.two{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:64px;
  align-items:start;
}
.prose p{
  font-family:var(--body);
  font-size:17px;
  line-height:1.62;
  color:var(--ink-dim);
  margin:0 0 18px;
  max-width:60ch;
}
.prose p strong{ color:var(--ink); }
.drop{ position:relative; }
.drop-cap{
  font-family:var(--slab);
  font-weight:800;
  font-size:64px;
  line-height:0.85;
  float:left;
  margin:6px 12px 0 0;
  color:var(--amber);
}

/* schem — the small pool-fee diagram */
.schem{
  margin:0;
  background:var(--bg-2);
  border:1px solid var(--rule);
  padding:18px;
}
.schem svg{ width:100%; height:auto; }
.schem-tag{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  fill:var(--ink-mute);
}
.schem-lab{
  font-family:var(--mono);
  font-size:12px;
  fill:var(--ink);
  letter-spacing:.04em;
}
.schem-mini{
  font-family:var(--mono);
  font-size:10px;
  fill:var(--ink-dim);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.schem-mini.amber, .schem-lab.amber{ fill:var(--amber); }

/* ============================================================
   round stratum — bar chart + prose
   ============================================================ */
.round-grid{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:64px;
  align-items:start;
}
.round-prose p{
  font-family:var(--body);
  font-size:17px;
  line-height:1.62;
  color:var(--ink-dim);
  margin:0 0 18px;
  max-width:54ch;
}
.ledger{
  margin:0;
  background:var(--bg-2);
  border:1px solid var(--rule);
  padding:24px 22px 18px;
}
.ledger svg{ width:100%; height:auto; }
.ledger-ax{
  font-family:var(--mono);
  font-size:10px;
  fill:var(--ink-mute);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.ledger-roll{
  font-family:var(--mono);
  font-size:11px;
  fill:var(--amber);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.ledger-cap{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin-top:14px;
}
/* the bars rise on load */
.bars rect{
  transform-origin:center bottom;
  animation:rise 0.9s ease-out both;
}
.bars rect:nth-child(odd){ animation-delay:.05s; }
@keyframes rise{
  from{ transform:scaleY(0); opacity:0; }
  to  { transform:scaleY(1); opacity:1; }
}

/* ============================================================
   burn stratum — three cells + split bar
   ============================================================ */
.three-col{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
  margin-bottom:48px;
}
.cell{
  background:var(--bg-2);
  border:1px solid var(--rule);
  padding:30px 24px;
  position:relative;
  min-height:240px;
}
.cell-num{
  font-family:var(--slab);
  font-weight:800;
  font-size:40px;
  color:var(--amber-dim);
  display:block;
  margin-bottom:10px;
  line-height:1;
}
.cell h3{
  font-family:var(--slab);
  font-weight:700;
  font-size:22px;
  margin:0 0 14px;
  color:var(--ink);
}
.cell p{
  font-family:var(--body);
  font-size:15px;
  line-height:1.6;
  color:var(--ink-dim);
  margin:0;
}
.cell.amber-cell{
  background:var(--amber);
  color:var(--bg);
  border-color:var(--amber);
}
.cell.amber-cell .cell-num{ color:var(--bg); opacity:.5; }
.cell.amber-cell h3{ color:var(--bg); }
.cell.amber-cell p{ color:var(--bg); }
.cell.amber-cell code{ background:rgba(15,16,20,.18); color:var(--bg); }

/* the split */
.split{
  display:flex;
  height:64px;
  margin-bottom:18px;
  border:1px solid var(--amber);
}
.split-90{
  flex:0 0 90%;
  background:var(--amber);
  color:var(--bg);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--slab);
  font-weight:800;
  letter-spacing:.16em;
  font-size:14px;
}
.split-10{
  flex:0 0 10%;
  background:var(--bg);
  color:var(--amber);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--slab);
  font-weight:800;
  letter-spacing:.14em;
  font-size:11px;
  border-left:1px solid var(--amber);
}
.split-90 span, .split-10 span{ white-space:nowrap; }
.split-note{
  font-family:var(--body);
  font-size:15px;
  color:var(--ink-dim);
  max-width:64ch;
  margin:0;
}

/* ============================================================
   vein stratum — callout + final cta
   ============================================================ */
.callout{
  background:var(--bg-2);
  border:1px solid var(--amber-dim);
  border-left:6px solid var(--amber);
  padding:30px 30px 30px 34px;
  margin:0;
}
.callout-tag{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--amber);
  margin:0 0 12px;
}
.callout-body{
  font-family:var(--slab);
  font-weight:700;
  font-size:24px;
  line-height:1.32;
  margin:0;
  color:var(--ink);
}

.vein-cta{
  display:flex;
  gap:18px;
  margin-top:48px;
  flex-wrap:wrap;
}

/* ============================================================
   the signal — bottom stamp
   ============================================================ */
.signal{
  margin-left:88px;
  padding:42px 8vw;
  background:var(--bg-2);
  border-top:2px solid var(--amber-dim);
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:24px;
}
.signal-mark{
  display:flex;
  align-items:center;
  gap:14px;
}
.signal-mark svg{ width:42px; height:42px; }
.signal-words{ display:flex; flex-direction:column; }
.signal-words .big{
  font-family:var(--slab);
  font-weight:800;
  letter-spacing:.04em;
  font-size:20px;
  color:var(--ink);
}
.signal-words .small{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.signal-right{
  display:flex;
  gap:24px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.signal-right a{ color:var(--ink); }
.signal-right a:hover{ color:var(--amber); }

/* ============================================================
   LOG page — entries
   ============================================================ */
.page-log .log-head{
  padding-top:64px;
  padding-bottom:56px;
  border-bottom:1px solid var(--rule);
}
.page-log .log-head .masthead{
  font-size:clamp(54px, 9vw, 140px);
}
.page-log .log-head .lede{
  max-width:64ch;
}

.entry{
  padding-top:72px;
  padding-bottom:72px;
  border-bottom:1px solid var(--rule);
  display:grid;
  grid-template-columns: 200px 1fr;
  gap:48px;
  align-items:start;
}
.entry-head{
  position:sticky;
  top:24px;
}
.entry-tag{
  display:inline-block;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--amber);
  border:1px solid var(--amber-dim);
  padding:4px 10px;
  margin-bottom:18px;
}
.entry-head h2{
  font-family:var(--slab);
  font-weight:800;
  font-size:38px;
  line-height:1.02;
  letter-spacing:-0.012em;
  margin:0 0 14px;
  color:var(--ink);
}
.entry-meta{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink-mute);
  display:block;
}
.entry-body p{
  font-family:var(--body);
  font-size:17px;
  line-height:1.62;
  color:var(--ink-dim);
  margin:0 0 18px;
  max-width:64ch;
}
.entry-body p strong{ color:var(--ink); }

/* numbered steps */
.step-list{
  list-style:none;
  padding:0;
  margin:0 0 24px;
  border-top:1px solid var(--rule);
}
.step-list li{
  display:grid;
  grid-template-columns:48px 1fr;
  gap:18px;
  padding:18px 0;
  border-bottom:1px solid var(--rule);
  font-family:var(--body);
  font-size:16px;
  line-height:1.55;
  color:var(--ink-dim);
}
.step-list li strong{ color:var(--ink); }
.step-n{
  font-family:var(--slab);
  font-weight:800;
  font-size:24px;
  color:var(--amber);
  line-height:1;
}

/* marginalia line */
.aside-rule{
  font-family:var(--body);
  font-size:14px;
  color:var(--ink-mute);
  border-left:2px solid var(--amber-dim);
  padding:6px 0 6px 16px;
  margin:24px 0 0;
  max-width:64ch;
}
.aside-rule em{
  font-family:var(--mono);
  font-style:normal;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:11px;
  color:var(--amber);
  margin-right:6px;
}

/* the roll table */
.ledger-tbl, .spec-tbl{
  width:100%;
  border-collapse:collapse;
  font-family:var(--mono);
  font-size:14px;
  margin:18px 0 12px;
  max-width:64ch;
  background:var(--bg-2);
  border:1px solid var(--rule);
}
.ledger-tbl caption{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-mute);
  text-align:left;
  padding:10px 14px;
  border-bottom:1px solid var(--rule);
  background:var(--bg-3);
}
.ledger-tbl th, .ledger-tbl td, .spec-tbl th, .spec-tbl td{
  padding:10px 14px;
  border-bottom:1px solid var(--rule);
  text-align:left;
  vertical-align:top;
}
.ledger-tbl thead th{
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-mute);
  background:var(--bg-3);
}
.ledger-tbl td:first-child{
  color:var(--amber);
  font-weight:700;
  width:32px;
}
.ledger-tbl tr:last-child td, .spec-tbl tr:last-child th, .spec-tbl tr:last-child td{ border-bottom:0; }
.spec-tbl th{
  font-weight:400;
  color:var(--ink-mute);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
  width:36%;
  white-space:nowrap;
}
.spec-tbl td{ color:var(--ink); }

/* the kiln visual */
.kiln-visual{
  margin:18px 0 6px;
  background:var(--bg-2);
  border:1px solid var(--rule);
  padding:20px;
}
.kiln-visual svg{ width:100%; height:auto; }
.kiln-lab{
  font-family:var(--mono);
  font-size:10px;
  fill:var(--ink-mute);
  letter-spacing:.16em;
  text-transform:uppercase;
}
.kiln-rounds rect{
  animation:rise 1.2s ease-out both;
}
.kiln-rounds rect:nth-child(even){ animation-delay:.08s; }

.dim{ color:var(--ink-mute); }

/* ============================================================
   responsive
   ============================================================ */
@media (max-width: 980px){
  .headframe{ grid-template-columns:1fr; gap:36px; }
  .two{ grid-template-columns:1fr; gap:36px; }
  .round-grid{ grid-template-columns:1fr; gap:36px; }
  .three-col{ grid-template-columns:1fr; }
  .plate{ grid-template-columns:repeat(2, 1fr); }
  .plate > div:nth-child(3n){ border-right:1px solid var(--rule); }
  .plate > div:nth-child(2n){ border-right:0; }
  .plate > div:nth-last-child(-n+3){ border-bottom:1px solid var(--rule); }
  .plate > div:nth-last-child(-n+2){ border-bottom:0; }
  .entry{ grid-template-columns:1fr; gap:24px; }
  .entry-head{ position:static; }
}

@media (max-width: 720px){
  .shaft{ width:54px; padding:14px 0 18px; }
  .shaft{ background:linear-gradient(to right, var(--bg-2) 0 50px, var(--rail-2) 50px 52px, transparent 52px); }
  .shaft-cap{ width:34px; height:34px; }
  .shaft-cap svg{ width:18px; height:18px; }
  .shaft-marks li{ left:-30px; width:24px; font-size:9px; }
  .shaft-nav{ display:none; }
  main{ margin-left:54px; }
  .signal{ margin-left:54px; padding:32px 6vw; }
  section{ padding:56px 6vw 56px 6vw; }
  .surface{ padding:14px 6vw; flex-direction:column; gap:10px; align-items:flex-start; }
  .slug{ font-size:10px; }
  .headframe{ padding-top:32px; padding-bottom:64px; }
  .masthead{ font-size:clamp(40px, 12vw, 80px); }
  .lede{ font-size:16px; }
  .plate{ grid-template-columns:1fr; }
  .plate > div{ border-right:0 !important; border-bottom:1px solid var(--rule) !important; }
  .plate > div:last-child{ border-bottom:0 !important; }
  .cta-row{ flex-direction:column; align-items:stretch; }
  .cta{ justify-content:center; }
  .hed{ font-size:clamp(28px, 8vw, 44px); }
  .drop-cap{ font-size:48px; }
  .split-90, .split-10{ font-size:10px; letter-spacing:.1em; }
  .signal{ flex-direction:column; align-items:flex-start; }
  .signal-right{ flex-wrap:wrap; gap:14px; }
  .entry-head h2{ font-size:30px; }
  .ledger-tbl, .spec-tbl{ font-size:12px; }
  .ledger-tbl th, .ledger-tbl td, .spec-tbl th, .spec-tbl td{ padding:8px 10px; }
}

/* honor reduced motion */
@media (prefers-reduced-motion: reduce){
  .winder, .dust, .cart, .veins path, .bars rect, .kiln-rounds rect{ animation:none !important; }
  html{ scroll-behavior:auto; }
}