/* =========================================================
   JN site — shared page styles (Experience atlas, dossier,
   About). Tokens from the design system only.
   ========================================================= */

/* ---------- photography frames ---------- */
.fig { margin: 0; }
.fig image-slot {
  display: block;
  width: 100%;
  border: 1px solid var(--ink);
  background: var(--paper);
}
.fig-cap {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--ink-muted);
  margin-top: 10px;
  line-height: 1.6;
}
.fig-cap .dot { color: var(--brass); }

/* photo tone (tweakable) — graded toward the palette by default */
body.tone-grade image-slot { filter: sepia(0.16) saturate(0.82) contrast(0.98) brightness(1.02); }
body.tone-bw    image-slot { filter: grayscale(1) contrast(1.05); }

/* ---------- page title band ---------- */
.pt-band {
  padding: 72px var(--gutter-page) 56px;
  border-bottom: 1px solid var(--ink);
  background: var(--cream);
}
.pt-band-in { max-width: var(--measure); margin: 0 auto; }
.pt-kicker {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  color: var(--forest);
  margin-bottom: 20px;
}
.pt-kicker a { color: var(--ink-muted); text-decoration: none; }
.pt-kicker a:hover { color: var(--forest); }
.pt-kicker .sep { color: var(--rule); margin: 0 10px; }
.pt-title {
  font-family: var(--font-serif);
  font-size: 68px;
  font-weight: var(--w-regular);
  line-height: 0.98;
  letter-spacing: -0.035em;
  font-variation-settings: "opsz" 72;
  margin: 0;
  max-width: 900px;
}
.pt-title em { font-style: italic; font-weight: var(--w-medium); color: var(--forest); }
.pt-dek {
  font-family: var(--font-serif);
  font-size: 21px;
  font-style: italic;
  font-weight: var(--w-light);
  line-height: 1.45;
  color: var(--ink-soft);
  font-variation-settings: "opsz" 24;
  max-width: 640px;
  margin: 22px 0 0;
  text-wrap: pretty;
}

/* ---------- map etchings ---------- */
.map-strip {
  position: relative;
  border: 1px solid var(--ink);
  background: var(--paper);
  overflow: hidden;
  height: 260px;
  margin-top: 44px;
}
.map-strip svg { display: block; width: 100%; height: 100%; }
.map-note {
  position: absolute;
  right: 14px; bottom: 10px;
  font-family: var(--font-mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--ink-muted);
}
.map-pin-g { cursor: pointer; }
.map-inline {
  border: 1px solid var(--ink);
  background: var(--paper);
  overflow: hidden;
}
.map-inline svg { display: block; width: 100%; height: 100%; }

/* ---------- atlas (Experience index) ---------- */
.atl-city {
  padding: 88px var(--gutter-page);
  border-bottom: 1px solid var(--rule);
}
.atl-city:last-of-type { border-bottom: 1px solid var(--ink); }
.atl-in {
  max-width: var(--measure);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 7fr 6fr;
  gap: 72px;
  align-items: center;
}
.atl-in.flip { grid-template-columns: 6fr 7fr; }
.atl-no {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--brass);
  margin-bottom: 18px;
}
.atl-no .dot { color: var(--rule); }
.atl-h {
  font-family: var(--font-serif);
  font-size: 44px;
  font-weight: var(--w-regular);
  letter-spacing: -0.025em;
  line-height: 1.02;
  font-variation-settings: "opsz" 60;
  margin: 0 0 22px;
}
.atl-h em { font-style: italic; font-weight: var(--w-medium); color: var(--forest); }
.atl-p {
  font-family: var(--font-serif);
  font-size: 17.5px;
  line-height: 1.7;
  color: var(--ink-soft);
  font-variation-settings: "opsz" 16;
  margin: 0 0 26px;
  max-width: 560px;
  text-wrap: pretty;
}
.atl-p em { font-style: italic; font-weight: var(--w-medium); color: var(--forest); }
.atl-link {
  font-family: var(--font-serif);
  font-size: 17px;
  font-style: italic;
  color: var(--ink-soft);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
  transition: border-color var(--dur-base) var(--ease);
}
.atl-link:hover { border-bottom-color: var(--brass); }

/* Kyiv feature — full-bleed */
.atl-feature { border-bottom: 1px solid var(--rule); }
.atl-feature .fig image-slot { border-left: none; border-right: none; }
.atl-feature-body {
  padding: 56px var(--gutter-page) 88px;
}
.atl-feature-in {
  max-width: var(--measure);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: start;
}

/* Before */
.atl-before {
  padding: 96px var(--gutter-page);
  text-align: center;
}
.atl-before .atl-p { margin: 22px auto 30px; max-width: 620px; text-align: left; }
.atl-before .cred {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--ink-muted);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  display: inline-block;
  padding: 12px 28px;
  line-height: 2;
}
.atl-before .cred b { color: var(--brass); font-weight: var(--w-medium); }
.atl-before .cred .dot { color: var(--brass); }

/* ---------- dossier (city narrative page) ---------- */
.dos-open .fig image-slot { border-left: none; border-right: none; border-top: none; }
.dos-open .fig-cap {
  padding: 12px var(--gutter-page) 14px;
  margin: 0;
  border-bottom: 1px solid var(--ink);
}
.dos-body {
  padding: 72px var(--gutter-page) 40px;
  max-width: calc(var(--measure-prose) * 2 - 200px);
  margin: 0 auto;
}
.dos-prose {
  columns: 2;
  column-gap: 48px;
  font-family: var(--font-serif);
  font-size: 17px;
  line-height: 1.72;
  color: var(--ink-soft);
  font-variation-settings: "opsz" 16;
}
.dos-prose p { margin: 0 0 18px; break-inside: avoid-column; text-wrap: pretty; }
.dos-prose em { font-style: italic; font-weight: var(--w-medium); color: var(--forest); }
.dos-prose > p:first-child::first-letter {
  font-size: 68px;
  line-height: 0.82;
  float: left;
  margin: 6px 10px 0 0;
  font-weight: var(--w-medium);
  color: var(--forest);
  font-variation-settings: "opsz" 72;
}
.dos-prose-single { columns: 1; max-width: var(--measure-prose); margin: 0 auto; }
.dos-pq {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 27px;
  line-height: 1.4;
  font-weight: var(--w-light);
  color: var(--ink);
  border-left: 3px solid var(--forest);
  padding: 18px 0 18px 36px;
  margin: 56px auto;
  max-width: 720px;
  position: relative;
  font-variation-settings: "opsz" 32;
}
.dos-pq::before {
  content: '"';
  position: absolute;
  left: 10px; top: 4px;
  font-size: 58px;
  color: var(--brass);
  line-height: 1;
  font-style: normal;
}
.dos-artifacts {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 20px;
  margin: 56px 0;
  align-items: stretch;
}
.dos-artifacts .fig image-slot { height: 100%; }
.dos-sub {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  color: var(--forest);
  margin: 48px 0 20px;
}
.dos-cred {
  font-family: var(--font-mono);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  line-height: 2.1;
  color: var(--ink-muted);
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  padding: 14px 0;
  margin: 12px 0 0;
}
.dos-cred .dot { color: var(--brass); }
.dos-lessons {
  font-family: var(--font-serif);
  font-size: 20px;
  font-style: italic;
  font-weight: var(--w-light);
  line-height: 1.55;
  color: var(--ink-soft);
  font-variation-settings: "opsz" 24;
  max-width: 680px;
  margin: 20px 0 0;
  text-wrap: pretty;
}
.dos-lessons em { font-weight: var(--w-medium); color: var(--forest); }
/* ---------- plates (documentary contact sheet) ---------- */
.plates { border-top: 1px solid var(--ink); padding: 64px var(--gutter-page) 72px; }
.plates-in { max-width: calc(var(--measure-prose) * 2 - 60px); margin: 0 auto; display: grid; gap: 40px; }
.plates-head { display: grid; gap: 12px; padding-bottom: 8px; }
.plates-head h2 { font-family: var(--font-serif); font-size: 36px; font-weight: var(--w-light); font-variation-settings: "opsz" 40; margin: 0; letter-spacing: -0.01em; }
.plates-head h2 em { font-style: italic; font-weight: var(--w-medium); color: var(--forest); }
.plates-head p { max-width: var(--measure-prose); margin: 0; font-family: var(--font-serif); font-size: 16px; line-height: 1.65; color: var(--ink-soft); text-wrap: pretty; }
.plates-row { display: grid; gap: 28px; }
.plates-row.three { grid-template-columns: repeat(3, 1fr); }
.plates-row.close { grid-template-columns: 5fr 7fr; align-items: end; gap: 40px; }
.plates .fig-cap { display: flex; gap: 8px; align-items: baseline; }
.plates .fig-cap .no { color: var(--brass); }
.plates-note { display: grid; gap: 16px; padding-bottom: 8px; }
.plates-note p { margin: 0; font-family: var(--font-serif); font-size: 17px; line-height: 1.7; color: var(--ink-soft); text-wrap: pretty; }
.plates-note em { font-style: italic; font-weight: var(--w-medium); color: var(--forest); }
.plates-note .rule { width: 210px; height: 1px; background: var(--brass); }
@media (max-width: 900px) {
  .plates { padding-left: 28px; padding-right: 28px; }
  .plates-row.three, .plates-row.close { grid-template-columns: 1fr; }
  .plates-row.close .plates-note { order: -1; }
}
.dos-next {
  border-top: 1px solid var(--ink);
  padding: 28px var(--gutter-page);
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  max-width: none;
}
.dos-next a {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--ink-soft);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
.dos-next a:hover { color: var(--forest); border-bottom-color: var(--brass); }

/* ---------- About ---------- */
.abt-open {
  padding: 88px var(--gutter-page) 80px;
  border-bottom: 1px solid var(--ink);
}
.abt-open-in {
  max-width: var(--measure);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: 84px;
  align-items: start;
}
.abt-thesis {
  font-family: var(--font-serif);
  font-size: 44px;
  font-weight: var(--w-light);
  line-height: 1.12;
  letter-spacing: -0.025em;
  font-variation-settings: "opsz" 60;
  margin: 26px 0 30px;
  text-wrap: pretty;
}
.abt-thesis em { font-style: italic; font-weight: var(--w-medium); color: var(--forest); }
.abt-standfirst {
  font-family: var(--font-serif);
  font-size: 19px;
  font-style: italic;
  font-weight: var(--w-light);
  line-height: 1.55;
  color: var(--ink-soft);
  font-variation-settings: "opsz" 20;
  max-width: 520px;
}
.abt-prose {
  padding: 88px var(--gutter-page) 72px;
  max-width: calc(var(--measure-prose) + 128px);
  margin: 0 auto;
  font-family: var(--font-serif);
  font-size: 18px;
  line-height: 1.75;
  color: var(--ink-soft);
  font-variation-settings: "opsz" 16;
}
.abt-prose p { margin: 0 0 24px; text-wrap: pretty; }
.abt-prose em { font-style: italic; font-weight: var(--w-medium); color: var(--forest); }
.abt-prose > p:first-of-type::first-letter {
  font-size: 68px;
  line-height: 0.82;
  float: left;
  margin: 6px 10px 0 0;
  font-weight: var(--w-medium);
  color: var(--forest);
  font-variation-settings: "opsz" 72;
}
.abt-figrow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 44px 0;
}
.abt-figrow .fig:nth-child(2) { margin-top: 32px; }
.abt-pq {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 25px;
  font-weight: var(--w-light);
  line-height: 1.45;
  color: var(--ink);
  border-left: 3px solid var(--forest);
  padding: 14px 0 14px 32px;
  margin: 44px 0;
  position: relative;
  font-variation-settings: "opsz" 32;
}
.abt-pq::before {
  content: '"';
  position: absolute;
  left: 8px; top: 0;
  font-size: 58px;
  color: var(--brass);
  line-height: 1;
  font-style: normal;
}
.abt-ledger {
  padding: 72px var(--gutter-page);
  border-top: 1px solid var(--ink);
}
.abt-ledger-in {
  max-width: var(--measure);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
}
.abt-ledger .row {
  font-family: var(--font-mono);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--ink-soft);
  line-height: 1.7;
  padding: 13px 0;
  border-bottom: 1px solid var(--rule);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
}
.abt-ledger .row:first-of-type { border-top: 1px solid var(--ink); }
.abt-ledger .row .r { color: var(--ink-muted); text-align: right; }
.abt-ledger .row .dot { color: var(--brass); }
/* redesigned study/service ledger rows */
.led-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: baseline;
  padding: 16px 0;
  border-bottom: 1px solid var(--rule);
}
.led-row:first-of-type { border-top: 1px solid var(--ink); }
.led-main {
  font-family: var(--font-serif);
  font-size: 18px;
  font-weight: var(--w-regular);
  font-variation-settings: "opsz" 20;
  color: var(--ink);
  line-height: 1.3;
}
.led-what {
  display: block;
  font-family: var(--font-serif);
  font-size: 14px;
  font-style: italic;
  font-weight: var(--w-light);
  color: var(--ink-muted);
  margin-top: 4px;
  line-height: 1.45;
}
.led-note {
  font-family: var(--font-mono);
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--ink-muted);
  text-align: right;
  white-space: nowrap;
  line-height: 1.7;
}
.led-note .dot { color: var(--brass); }
@media (max-width: 960px) {
  .abt-ledger-in { grid-template-columns: 1fr; gap: 48px; }
}
.abt-affil {
  padding: 72px var(--gutter-page) 88px;
  border-top: 1px solid var(--ink);
}
.abt-affil-in { max-width: var(--measure); margin: 0 auto; }
.affil-row {
  display: grid;
  grid-template-columns: 84px 1fr auto;
  gap: 28px;
  align-items: center;
  padding: 22px 0;
  border-bottom: 1px solid var(--rule);
  text-decoration: none;
  color: var(--ink);
}
.affil-row:first-of-type { border-top: 1px solid var(--ink); }
.affil-row:last-of-type { border-bottom: 1px solid var(--ink); }
.affil-logo {
  width: 84px; height: 52px;
  border: 1px solid var(--rule);
  background: var(--paper);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: var(--w-medium);
  color: var(--forest);
  font-size: 15px;
}
.affil-name {
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: var(--w-regular);
  font-variation-settings: "opsz" 24;
}
.affil-name .one {
  display: block;
  font-size: 14.5px;
  font-style: italic;
  font-weight: var(--w-light);
  color: var(--ink-muted);
  margin-top: 4px;
}
.affil-meta {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--ink-muted);
}
.affil-meta .dot { color: var(--brass); }

/* ---------- shared responsive ---------- */
@media (max-width: 1000px) {
  .atl-in, .atl-in.flip, .atl-feature-in, .abt-open-in, .abt-ledger-in { grid-template-columns: 1fr; gap: 36px; }
  .atl-in.flip .fig { order: -1; }
  .dos-prose { columns: 1; }
  .pt-title { font-size: 46px; }
  .abt-thesis { font-size: 32px; }
  .pt-band, .atl-city, .atl-feature-body, .atl-before, .dos-body, .abt-open, .abt-prose, .abt-ledger, .abt-affil { padding-left: 28px; padding-right: 28px; }
  .dos-open .fig-cap { padding-left: 28px; padding-right: 28px; }
  .dos-artifacts { grid-template-columns: 1fr; }
  .ph { padding: 16px 24px; }
  .ph-nav { gap: 16px; flex-wrap: wrap; }
}


/* ---------- motion layer (site-motion.js) — DS tokens only ---------- */
html.jn-motion [data-reveal]{opacity:0;transform:translateY(8px);transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slow) var(--ease);will-change:opacity,transform;}
html.jn-motion [data-reveal].is-visible{opacity:1;transform:none;transition-delay:calc(var(--reveal-i,0) * 70ms);}
@media (prefers-reduced-motion: reduce){html.jn-motion [data-reveal]{opacity:1;transform:none;transition:none;}}


/* ---------- subscribe block (Field Notes capture) ---------- */
.nl{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:64px var(--gutter-page);background:var(--paper)}
.nl-in{max-width:var(--measure);margin:0 auto;display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:start}
.nl-copy h2{font-family:var(--font-serif);font-size:35px;font-weight:var(--w-regular);line-height:1.05;letter-spacing:-0.025em;font-variation-settings:"opsz" 40;margin:0 0 16px}
.nl-copy h2 em{font-style:italic;font-weight:var(--w-medium);color:var(--forest)}
.nl-copy p{font-family:var(--font-serif);font-size:17px;line-height:1.6;color:var(--ink-soft);margin:0;max-width:44ch;text-wrap:pretty}
.nl-form{display:flex;flex-direction:column;align-items:stretch;padding-top:8px}
.nl-lbl{font-family:var(--font-mono);font-size:9px;text-transform:uppercase;letter-spacing:0.22em;color:var(--ink-muted);display:block;margin-bottom:9px}
.nl-row{display:flex;border:1px solid var(--ink);background:var(--cream);transition:box-shadow 180ms cubic-bezier(.2,.6,.2,1)}
.nl-row:focus-within{box-shadow:4px 4px 0 var(--brass)}
.nl-row input{flex:1;min-width:0;border:0;background:transparent;padding:17px 18px;font-family:var(--font-serif);font-size:18px;line-height:1.2;color:var(--ink);outline:none}
.nl-row input::placeholder{color:var(--ink-muted);font-style:italic}
.nl-row button{border:0;border-left:1px solid var(--ink);background:var(--forest);color:var(--cream);font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:0.22em;padding:0 26px;cursor:pointer;white-space:nowrap;transition:background 180ms cubic-bezier(.2,.6,.2,1)}
.nl-row button:hover{background:var(--forest-deep)}
.nl-row button:active{background:var(--forest-deep);transform:translate(1px,1px)}
.nl-fine{font-family:var(--font-mono);font-size:9px;text-transform:uppercase;letter-spacing:0.16em;white-space:nowrap;color:var(--ink-muted);line-height:1.9;margin:14px 0 0;padding-top:13px;border-top:1px solid var(--rule)}
.nl-fine .dot{color:var(--brass)}
.nl-ok{font-family:var(--font-serif);font-style:italic;font-size:18px;line-height:1.4;color:var(--forest);margin:0;padding:16px 0 0}
@media (max-width:900px){.nl-in{grid-template-columns:1fr;gap:32px}.nl{padding-left:28px;padding-right:28px}}

/* ---------- field notes ledger (Substack) ---------- */
.fn{padding:80px var(--gutter-page);border-bottom:1px solid var(--ink)}
.fn-in{max-width:var(--measure);margin:0 auto}
.fn-head{display:flex;justify-content:space-between;align-items:baseline;gap:24px;flex-wrap:wrap;margin-bottom:32px}
.fn-src{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:0.2em;color:var(--ink-muted);text-decoration:none;border-bottom:1px solid var(--brass)}
.fn-src:hover{color:var(--forest)}
.fn-list{border-top:1px solid var(--ink)}
.fn-row{display:grid;grid-template-columns:56px 1fr 150px;gap:28px;align-items:baseline;padding:26px 0;border-bottom:1px solid var(--rule);text-decoration:none;color:inherit;transition:transform 180ms cubic-bezier(.2,.6,.2,1)}
.fn-row:hover{transform:translate(-1px,-1px)}
.fn-row:hover .fn-ttl{color:var(--forest)}
.fn-no{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;color:var(--brass);padding-top:6px}
.fn-ttl{font-family:var(--font-serif);font-size:25px;font-weight:var(--w-regular);line-height:1.2;letter-spacing:-0.015em;font-variation-settings:"opsz" 28;margin:0 0 8px;text-wrap:pretty;transition:color 180ms}
.fn-ttl em{font-style:italic;font-weight:var(--w-medium);color:var(--forest)}
.fn-dek{font-family:var(--font-serif);font-size:16px;line-height:1.55;color:var(--ink-soft);margin:0;max-width:62ch;text-wrap:pretty}
.fn-date{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:0.18em;color:var(--ink-muted);text-align:right;line-height:1.7}
.fn-empty{font-family:var(--font-serif);font-style:italic;font-size:18px;color:var(--ink-muted);padding:34px 0;border-bottom:1px solid var(--rule);margin:0}
.fn-more{display:inline-block;margin-top:28px;font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:0.2em;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--brass);padding-bottom:3px}
.fn-more:hover{color:var(--forest)}
@media (max-width:900px){.fn{padding-left:28px;padding-right:28px}.fn-row{grid-template-columns:40px 1fr;gap:18px}.fn-date{grid-column:2;text-align:left}}

/* ---------- speaker kit ---------- */
.kit{padding:72px var(--gutter-page);border-bottom:1px solid var(--ink);background:var(--paper)}
.kit-in{max-width:var(--measure);margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:56px;align-items:center}
.kit-copy h2{font-family:var(--font-serif);font-size:34px;font-weight:var(--w-regular);line-height:1.08;letter-spacing:-0.025em;font-variation-settings:"opsz" 36;margin:0 0 14px}
.kit-copy h2 em{font-style:italic;font-weight:var(--w-medium);color:var(--forest)}
.kit-copy p{font-family:var(--font-serif);font-size:17px;line-height:1.6;color:var(--ink-soft);margin:0 0 18px;max-width:56ch;text-wrap:pretty}
.kit-mani{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:0.18em;color:var(--ink-muted);line-height:2}
.kit-mani .dot{color:var(--brass)}
.kit-cta{display:inline-block;font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:0.2em;color:var(--cream);background:var(--forest);border:1px solid var(--ink);padding:16px 26px;text-decoration:none;box-shadow:6px 6px 0 var(--moss);transition:transform 180ms cubic-bezier(.2,.6,.2,1),box-shadow 180ms cubic-bezier(.2,.6,.2,1)}
.kit-cta:hover{transform:translate(-1px,-1px);box-shadow:8px 8px 0 var(--moss)}
.kit-cta:active{transform:translate(1px,1px);box-shadow:0 0 0 var(--moss)}
@media (max-width:900px){.kit-in{grid-template-columns:1fr;gap:28px}.kit{padding-left:28px;padding-right:28px}}