/* =========================================================================
   REVEILLE OIL & GAS SERVICES NIGERIA LTD
   Design system — v3

   Colour thesis: BRASS LEADS. The logo's overlap tone (#AB7943) is the
   voice of the brand — it reads as metal, which is what Reveille makes.
   Orange is demoted to "ignition": it appears roughly three times per
   page (primary action, scroll progress, one hero word) and nowhere else.
   An accent only reads as an accent when it is rare.

   Ground: deep charcoal. Light sections: warm document paper #EDE9E1.
   Pure white is reserved exclusively for certificate mats, so the
   certificates read as physical documents lying on a desk.

   Edges are crisp. Section transitions are tight (28px) and marked with a
   brass hairline — the blend comes from the palette being tonally related,
   not from a wide gradient smear.
   ========================================================================= */

/* ---- Tokens ------------------------------------------------------------- */
:root{
  /* Dark ramp */
  --ink-900:#0B0A06;
  --ink-850:#100F09;
  --ink-800:#15140D;
  --ink-700:#1B1A13;   /* brand charcoal */
  --ink-600:#232219;
  --ink-500:#2C2A20;

  /* Warm paper ramp */
  --paper:#EDE9E1;
  --paper-2:#E5E0D6;
  --paper-3:#DAD4C6;
  --paper-4:#C9C2B1;
  --white:#FFFFFF;     /* certificates + logo only */

  /* Brass — the primary voice */
  --brass:#AB7943;        /* brand tone, from the logo overlap */
  --brass-lift:#C9A66B;   /* text on dark */
  --brass-soft:#DCC79A;   /* highlights */
  --brass-pale:#F0DDB4;   /* sheen peak */
  --brass-deep:#7E5A2C;   /* text on paper */
  --brass-dark:#5E4320;

  /* Orange — ignition only. Do not add references to this. */
  --orange:#E07817;
  --orange-lift:#F0913A;

  /* Semantic — dark ground */
  --bg:var(--ink-800);
  --tx:#F2EFE7;
  --tx-dim:#A9A496;
  --tx-faint:#8A8574;   /* lifted to clear WCAG AA on the darkest ground */
  --rule:rgba(242,239,231,0.09);
  --rule-mid:rgba(242,239,231,0.16);
  --rule-hi:rgba(242,239,231,0.30);
  --rule-brass:rgba(171,121,67,0.42);

  /* Semantic — paper ground */
  --l-bg:var(--paper);
  --l-tx:var(--ink-700);
  --l-tx-dim:#55523F;
  --l-tx-faint:#67634F;   /* 5.05:1 on paper — was #7E7967 at 3.62:1, failed AA */
  --l-rule:rgba(27,26,19,0.11);
  --l-rule-mid:rgba(27,26,19,0.18);
  --l-rule-hi:rgba(27,26,19,0.30);
  --l-rule-brass:rgba(126,90,44,0.38);

  /* Type */
  --f-display:"Big Shoulders Display","Arial Narrow",sans-serif;
  --f-body:"IBM Plex Sans",-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono","SFMono-Regular",Menlo,monospace;

  /* Measure — text is held in from the edges */
  --container:1120px;
  --gutter:clamp(26px,6vw,76px);
  --measure:62ch;

  --ease:cubic-bezier(.22,.68,0,1);
  --ease-soft:cubic-bezier(.32,.72,.24,1);

  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.42'/%3E%3C/svg%3E");
}

/* ---- Reset --------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
}
body{
  margin:0;background:var(--bg);color:var(--tx);
  font-family:var(--f-body);font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
p{margin:0;}
ul{margin:0;padding:0;list-style:none;}
button{font-family:inherit;}
::selection{background:var(--brass);color:var(--ink-900);}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;}

h1,h2,h3,h4{
  margin:0;font-family:var(--f-display);font-weight:700;
  text-transform:uppercase;line-height:.96;letter-spacing:.008em;
}

.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter);}

/* =========================================================================
   SCROLL PROGRESS  — ignition #1 of 3
   ========================================================================= */
.progress{position:fixed;top:0;left:0;height:2px;width:100%;z-index:200;pointer-events:none;}
.progress span{
  display:block;height:100%;width:0%;
  background:linear-gradient(90deg,var(--brass),var(--orange));
  transition:width .12s linear;
}

/* =========================================================================
   TYPE
   ========================================================================= */
.eyebrow{
  font-family:var(--f-mono);font-size:11px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--brass-lift);
  display:flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:16px;height:1px;background:currentColor;flex:none;}
.on-light .eyebrow,.on-light-2 .eyebrow{color:var(--brass-deep);}

.lede{font-size:16.5px;line-height:1.75;color:var(--tx-dim);max-width:var(--measure);}
.on-light .lede,.on-light-2 .lede{color:var(--l-tx-dim);}
.tx-dim{color:var(--tx-dim);}
.on-light .tx-dim,.on-light-2 .tx-dim{color:var(--l-tx-dim);}

/* =========================================================================
   BUTTONS  — .btn-primary is ignition #2 of 3
   ========================================================================= */
.btn{
  font-family:var(--f-mono);font-size:12px;font-weight:500;
  letter-spacing:.11em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 26px;border:1px solid var(--rule-brass);
  color:var(--tx);background:transparent;cursor:pointer;position:relative;
  transition:background .35s var(--ease),color .35s var(--ease),
             border-color .35s var(--ease),transform .35s var(--ease);
}
.btn:hover{border-color:var(--brass-lift);color:var(--brass-lift);transform:translateY(-2px);}
.btn .arw{transition:transform .35s var(--ease);}
.btn:hover .arw{transform:translateX(4px);}

.btn-primary{background:var(--orange);border-color:var(--orange);color:var(--ink-900);font-weight:600;}
.btn-primary:hover{background:var(--orange-lift);border-color:var(--orange-lift);color:var(--ink-900);transform:translateY(-2px);}

.on-light .btn,.on-light-2 .btn{border-color:var(--l-rule-brass);color:var(--l-tx);}
.on-light .btn:hover,.on-light-2 .btn:hover{border-color:var(--brass-deep);color:var(--brass-deep);}
.on-light .btn-primary,.on-light-2 .btn-primary{background:var(--ink-700);border-color:var(--ink-700);color:var(--paper);}
.on-light .btn-primary:hover,.on-light-2 .btn-primary:hover{background:var(--brass-deep);border-color:var(--brass-deep);color:var(--white);}

/* =========================================================================
   HEADER
   ========================================================================= */
.site-header{
  position:sticky;top:0;z-index:150;
  background:rgba(17,16,10,.92);
  backdrop-filter:blur(16px) saturate(120%);
  border-bottom:1px solid var(--rule);
}
.site-header .container{display:flex;align-items:center;justify-content:space-between;height:76px;max-width:1320px;gap:28px;}

.brand{display:flex;align-items:center;gap:11px;}
.brand img{height:29px;width:auto;}
.brand-word{font-family:var(--f-display);font-weight:700;font-size:19px;letter-spacing:.04em;line-height:1;}
.brand-word small{
  display:block;font-family:var(--f-mono);font-size:8px;font-weight:400;
  letter-spacing:.26em;color:var(--tx-faint);text-transform:uppercase;margin-top:4px;
}

.nav{display:flex;align-items:center;gap:22px;flex:0 1 auto;}
.nav a{
  font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--tx-dim);position:relative;padding:7px 0;white-space:nowrap;
  transition:color .3s var(--ease);
}
.nav a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:var(--brass-lift);transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease);
}
.nav a:hover{color:var(--tx);}
.nav a:hover::after{transform:scaleX(1);}
.nav a.active{color:var(--brass-lift);}
.nav a.active::after{transform:scaleX(1);background:var(--brass);}

.nav-cta{display:flex;align-items:center;gap:14px;flex:none;}
.nav-cta .btn{white-space:nowrap;}
.nav-toggle{
  display:none;background:none;border:1px solid var(--rule-brass);color:var(--tx);
  width:42px;height:42px;align-items:center;justify-content:center;cursor:pointer;
  transition:border-color .3s var(--ease),color .3s var(--ease);
}
.nav-toggle:hover{border-color:var(--brass-lift);color:var(--brass-lift);}
@media (max-width:1180px){
  .nav{display:none;}
  .nav-toggle{display:flex;}
  .nav-cta .btn .lbl{display:none;}
  .nav-cta .btn{padding:13px 16px;}
}

/* Mobile menu — a full-screen panel, NOT a child of .site-header.
   The header carries backdrop-filter, which creates a containing block for
   fixed-position descendants; nesting the menu inside it collapsed the panel
   to the header's own height. It must stay a sibling. */
.mobile-menu{
  position:fixed;top:76px;left:0;right:0;bottom:0;z-index:140;
  height:auto;                       /* explicit inset wins; no % height traps */
  background:
    radial-gradient(120% 70% at 50% 0%,rgba(171,121,67,.13) 0%,rgba(171,121,67,0) 60%),
    var(--ink-900);
  border-top:1px solid var(--rule-brass);
  padding:14px var(--gutter) calc(28px + env(safe-area-inset-bottom,0px));
  overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .34s var(--ease),transform .34s var(--ease),visibility .34s;
}
.mobile-menu.open{opacity:1;visibility:visible;transform:none;}
/* modern viewport unit so mobile browser chrome doesn't clip the panel */
@supports (height:100dvh){ .mobile-menu{ bottom:auto; height:calc(100dvh - 76px); } }

.mobile-menu a{
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--f-display);font-weight:700;font-size:clamp(23px,6.4vw,29px);
  text-transform:uppercase;letter-spacing:.02em;
  padding:clamp(12px,1.7vh,18px) 2px;min-height:52px;   /* comfortable touch target */
  border-bottom:1px solid var(--rule);color:var(--tx);
  opacity:0;transform:translateY(8px);
  transition:opacity .4s var(--ease),transform .4s var(--ease),color .2s var(--ease);
}
.mobile-menu.open a{opacity:1;transform:none;}
/* staggered reveal so the panel reads as opening, not just appearing */
.mobile-menu.open a:nth-of-type(1){transition-delay:.06s;}
.mobile-menu.open a:nth-of-type(2){transition-delay:.10s;}
.mobile-menu.open a:nth-of-type(3){transition-delay:.14s;}
.mobile-menu.open a:nth-of-type(4){transition-delay:.18s;}
.mobile-menu.open a:nth-of-type(5){transition-delay:.22s;}
.mobile-menu.open a:nth-of-type(6){transition-delay:.26s;}
.mobile-menu.open a:nth-of-type(7){transition-delay:.30s;}
.mobile-menu.open a:nth-of-type(8){transition-delay:.34s;}
.mobile-menu.open a:nth-of-type(9){transition-delay:.38s;}
.mobile-menu a:active{color:var(--brass-lift);}
.mobile-menu .mm-n{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;color:var(--brass);}

.mobile-menu a.mm-cta{
  justify-content:center;margin-top:20px;border-bottom:none;
  background:var(--orange);color:var(--ink-900);
  font-family:var(--f-mono);font-size:12.5px;font-weight:600;
  letter-spacing:.11em;gap:10px;padding:17px 20px;min-height:54px;
}
.mobile-menu a.mm-cta:active{background:var(--orange-lift);color:var(--ink-900);}
.mobile-menu .mm-foot{
  margin-top:auto;padding-top:22px;
  font-family:var(--f-mono);font-size:11px;color:var(--tx-faint);line-height:2;
  opacity:0;transition:opacity .4s var(--ease) .34s;
}
.mobile-menu.open .mm-foot{opacity:1;}
.mobile-menu .mm-foot a{
  display:inline;font-family:var(--f-mono);font-size:11px;font-weight:400;
  border:none;padding:0;min-height:0;color:var(--brass-lift);text-transform:none;
  opacity:1;transform:none;letter-spacing:0;
}
/* Short screens (older Androids, landscape): the eight destinations and the
   quote button earn their space; the contact block does not — it repeats what
   is on the Contact page and in the site footer. */
@media (max-height:720px){
  .mobile-menu .mm-foot{display:none;}
  .mobile-menu a{font-size:clamp(20px,5.6vw,24px);min-height:46px;padding:10px 2px;}
  .mobile-menu a.mm-cta{margin-top:16px;min-height:48px;padding:14px 20px;}
}

@media (prefers-reduced-motion:reduce){
  .mobile-menu,.mobile-menu a,.mobile-menu .mm-foot{transition-duration:.001ms!important;}
  .mobile-menu a{opacity:1;transform:none;}
}

/* =========================================================================
   SECTIONS + TIGHT SEAMS
   28px, hairline-marked. Crisp edge, not a fade zone.
   ========================================================================= */
.section{padding:clamp(62px,8vw,108px) 0;position:relative;}
.section-sm{padding:clamp(40px,5vw,64px) 0;position:relative;}
/* A compact strip followed by a full section stacked two lots of padding and
   left a dead gap. Pull the following section up when the grounds match. */
.section-sm + .section{padding-top:clamp(30px,3.6vw,56px);}
.section + .seam + .section{padding-top:clamp(52px,6.4vw,92px);}

.on-dark{background:var(--ink-800);}
.on-dark-deep{background:var(--ink-900);}
.on-light{background:var(--paper);color:var(--l-tx);}
.on-light-2{background:var(--paper-2);color:var(--l-tx);}
.on-light h1,.on-light h2,.on-light h3,.on-light h4,
.on-light-2 h1,.on-light-2 h2,.on-light-2 h3,.on-light-2 h4{color:var(--l-tx);}

.seam{height:28px;width:100%;position:relative;pointer-events:none;}
.seam::before{
  content:"";position:absolute;left:0;right:0;top:50%;height:1px;
  background:linear-gradient(90deg,transparent,var(--brass) 22%,var(--brass) 78%,transparent);
  opacity:.34;
}
.seam-deep-light,.seam-dark-light{background:linear-gradient(180deg,var(--ink-900) 0%,var(--ink-800) 46%,var(--paper-3) 54%,var(--paper) 100%);}
.seam-deep-light2,.seam-dark-light2{background:linear-gradient(180deg,var(--ink-900) 0%,var(--ink-800) 46%,var(--paper-3) 54%,var(--paper-2) 100%);}
.seam-light-deep{background:linear-gradient(180deg,var(--paper) 0%,var(--paper-3) 46%,var(--ink-800) 54%,var(--ink-900) 100%);}
.seam-light-dark{background:linear-gradient(180deg,var(--paper) 0%,var(--paper-3) 46%,var(--ink-700) 54%,var(--ink-800) 100%);}
.seam-light2-dark{background:linear-gradient(180deg,var(--paper-2) 0%,var(--paper-3) 46%,var(--ink-700) 54%,var(--ink-800) 100%);}
.seam-light2-deep{background:linear-gradient(180deg,var(--paper-2) 0%,var(--paper-3) 46%,var(--ink-800) 54%,var(--ink-900) 100%);}
.seam-light-light2{background:linear-gradient(180deg,var(--paper),var(--paper-2));}
.seam-dark-deep{background:linear-gradient(180deg,var(--ink-800),var(--ink-900));}
.seam-deep-dark{background:linear-gradient(180deg,var(--ink-900),var(--ink-800));}

/* Section heads — centred composition, held in from the edges */
.section-head,.head-split{
  max-width:660px;margin-inline:auto;text-align:center;
  margin-bottom:clamp(38px,5vw,60px);
  display:block;
}
.section-head h2,.head-split h2{font-size:clamp(27px,3.5vw,42px);margin-top:16px;}
.section-head .eyebrow,.head-split .eyebrow{justify-content:center;}
.section-head .lede,.head-split .lede{margin:18px auto 0;font-size:15.5px;}
.head-split > div{display:contents;}

/* =========================================================================
   PLATE — framed like a plate in a technical report
   ========================================================================= */
.plate{position:relative;background:var(--ink-600);overflow:hidden;}
.plate img{
  width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.64) contrast(1.10) brightness(.94) sepia(.06);
  transition:transform 1.1s var(--ease-soft),filter .7s var(--ease);
}
.plate::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(165deg,rgba(171,121,67,.16) 0%,rgba(0,0,0,0) 48%),
    linear-gradient(0deg,rgba(11,10,6,.56) 0%,rgba(11,10,6,0) 56%);
}
.plate::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background-image:var(--grain);opacity:.15;mix-blend-mode:overlay;
}
a.plate:hover img,.plate-hover:hover img{transform:scale(1.045);filter:saturate(.82) contrast(1.10) brightness(1) sepia(0);}

.plate .tick{position:absolute;z-index:4;width:12px;height:12px;pointer-events:none;opacity:.8;}
.plate .tick::before,.plate .tick::after{content:"";position:absolute;background:var(--brass-soft);}
.plate .tick::before{width:100%;height:1px;top:0;left:0;}
.plate .tick::after{height:100%;width:1px;top:0;left:0;}
.plate .tick.tl{top:11px;left:11px;}
.plate .tick.tr{top:11px;right:11px;transform:scaleX(-1);}
.plate .tick.bl{bottom:11px;left:11px;transform:scaleY(-1);}
.plate .tick.br{bottom:11px;right:11px;transform:scale(-1,-1);}

.plate .fig{position:absolute;z-index:4;left:0;right:0;bottom:0;padding:18px 30px 30px;display:flex;align-items:baseline;gap:12px;}
.plate .fig-n{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:var(--brass-soft);text-transform:uppercase;flex:none;}
.plate .fig-t{font-family:var(--f-mono);font-size:11px;letter-spacing:.05em;color:var(--paper);line-height:1.5;}

.plate-4x3{aspect-ratio:4/3;} .plate-3x2{aspect-ratio:3/2;}
.plate-16x9{aspect-ratio:16/9;} .plate-3x4{aspect-ratio:3/4;} .plate-1x1{aspect-ratio:1/1;}

/* =========================================================================
   DECK — a stack of plates you can advance. Reads as "there is more here",
   which a single static photograph cannot say.
   ========================================================================= */
.deck{position:relative;}
.deck-stage{position:relative;aspect-ratio:4/3;}
.deck-card{
  position:absolute;inset:0;
  transition:transform .72s var(--ease-soft),opacity .5s var(--ease),filter .6s var(--ease);
  will-change:transform,opacity;
}
/* the three visible states: front, one back, two back */
.deck-card[data-pos="0"]{transform:none;opacity:1;z-index:3;}
.deck-card[data-pos="1"]{transform:translate(3.2%,-4.4%) scale(.945);opacity:.62;z-index:2;filter:saturate(.5) brightness(.72);}
.deck-card[data-pos="2"]{transform:translate(6.2%,-8.4%) scale(.892);opacity:.32;z-index:1;filter:saturate(.34) brightness(.56);}
.deck-card[data-pos="hidden"]{transform:translate(6.2%,-8.4%) scale(.892);opacity:0;z-index:0;pointer-events:none;}
.deck-card .plate{height:100%;}

.deck-ui{display:flex;align-items:center;gap:14px;margin-top:18px;}
.deck-dots{display:flex;gap:7px;flex:1;}
.deck-dots button{
  width:26px;height:3px;padding:0;border:none;border-radius:99px;cursor:pointer;
  background:var(--rule-hi);transition:background .35s var(--ease),width .35s var(--ease);
}
.deck-dots button[aria-current="true"]{background:var(--brass-lift);width:38px;}
.deck-nav{display:flex;gap:8px;}
.deck-nav button{
  width:38px;height:38px;display:grid;place-items:center;cursor:pointer;
  background:transparent;border:1px solid var(--rule-brass);color:var(--tx-dim);
  transition:border-color .3s var(--ease),color .3s var(--ease),transform .3s var(--ease);
}
.deck-nav button:hover{border-color:var(--brass-lift);color:var(--brass-lift);}
.deck-nav button:active{transform:scale(.94);}
.on-light .deck-nav button,.on-light-2 .deck-nav button{border-color:var(--l-rule-brass);color:var(--l-tx-dim);}
.on-light .deck-dots button,.on-light-2 .deck-dots button{background:var(--l-rule-hi);}
.on-light .deck-dots button[aria-current="true"],.on-light-2 .deck-dots button[aria-current="true"]{background:var(--brass-deep);}

/* =========================================================================
   PROBLEM — the hook. Short lines, big air, no technical vocabulary.
   This is the rest stop the eye needs between dense sections.
   ========================================================================= */
.problem{text-align:center;max-width:26ch;margin-inline:auto;}
.problem .line{
  font-family:var(--f-display);font-weight:700;text-transform:uppercase;
  font-size:clamp(30px,5.6vw,62px);line-height:.98;letter-spacing:.01em;
  color:var(--tx);
}
.problem .line .q{color:var(--brass-lift);}
.on-light .problem .line,.on-light-2 .problem .line{color:var(--l-tx);}
.on-light .problem .line .q,.on-light-2 .problem .line .q{color:var(--brass-deep);}
.problem .after{
  margin:26px auto 0;max-width:46ch;font-size:16.5px;line-height:1.72;color:var(--tx-dim);
}
.on-light .problem .after,.on-light-2 .problem .after{color:var(--l-tx-dim);}

/* =========================================================================
   LEDGER THUMB — a visual anchor per service row
   ========================================================================= */
.ledger .row.has-thumb{grid-template-columns:56px 1fr 116px 28px;}
.ledger .thumb{
  width:116px;aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--paper-3);
}
.ledger .thumb img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.6) contrast(1.08) brightness(.97) sepia(.05);
  transition:transform .8s var(--ease-soft),filter .5s var(--ease);
}
a.ledger-row-link:hover .thumb img{transform:scale(1.07);filter:saturate(.9) contrast(1.08) brightness(1) sepia(0);}
.ledger .thumb::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 0 1px var(--l-rule-brass);
}
@media (max-width:820px){
  .ledger .row.has-thumb{grid-template-columns:48px 1fr 84px;}
  .ledger .thumb{width:84px;}
  .ledger .row.has-thumb .a{display:none;}
}
@media (max-width:520px){
  .ledger .row.has-thumb{grid-template-columns:40px 1fr;}
  .ledger .thumb{display:none;}
}

/* =========================================================================
   LOG SHOT — a visual anchor per track-record entry
   ========================================================================= */
.log .entry.has-shot{grid-template-columns:196px 1fr 210px;}
.log .shot{position:relative;overflow:hidden;aspect-ratio:4/3;background:var(--ink-600);align-self:start;}
.log .shot img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.58) contrast(1.1) brightness(.9) sepia(.06);
  transition:transform .9s var(--ease-soft),filter .55s var(--ease);
}
.log .entry:hover .shot img{transform:scale(1.05);filter:saturate(.85) contrast(1.1) brightness(1) sepia(0);}
.log .shot::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px var(--rule-brass);pointer-events:none;}
.log .shot .cap{
  position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;
  background:linear-gradient(180deg,rgba(11,10,6,0) 0%,rgba(11,10,6,.72) 42%,rgba(11,10,6,.94) 100%);
  font-family:var(--f-mono);font-size:9.5px;line-height:1.5;letter-spacing:.07em;
  color:var(--brass-soft);text-shadow:0 1px 2px rgba(0,0,0,.6);
}
@media (max-width:980px){
  .log .entry.has-shot{grid-template-columns:1fr;}
  .log .shot{max-width:320px;margin-top:6px;}
}

/* =========================================================================
   DATAPLATE
   ========================================================================= */
.dataplate{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));
  border:1px solid var(--rule-brass);background:rgba(0,0,0,.20);
}
.dataplate .cell{padding:17px 20px;border-left:1px solid var(--rule);}
.dataplate .cell:first-child{border-left:none;}
.dataplate .lbl{display:block;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-faint);margin-bottom:7px;}
.dataplate .val{font-family:var(--f-mono);font-size:13.5px;color:var(--tx);line-height:1.55;}
.dataplate .val.hi{color:var(--brass-lift);}
.dataplate .val a{transition:color .3s var(--ease);}
.dataplate .val a:hover{color:var(--brass-lift);}

.on-light .dataplate,.on-light-2 .dataplate{border-color:var(--l-rule-brass);background:rgba(27,26,19,.03);}
.on-light .dataplate .cell,.on-light-2 .dataplate .cell{border-left-color:var(--l-rule);}
.on-light .dataplate .lbl,.on-light-2 .dataplate .lbl{color:var(--l-tx-faint);}
.on-light .dataplate .val,.on-light-2 .dataplate .val{color:var(--l-tx);}
.on-light .dataplate .val.hi,.on-light-2 .dataplate .val.hi{color:var(--brass-deep);}
.on-light .dataplate .val a:hover,.on-light-2 .dataplate .val a:hover{color:var(--brass-deep);}
.dataplate.stack{grid-template-columns:1fr;}
.dataplate.stack .cell{border-left:none;border-top:1px solid var(--rule);}
.dataplate.stack .cell:first-child{border-top:none;}
.on-light .dataplate.stack .cell,.on-light-2 .dataplate.stack .cell{border-top-color:var(--l-rule);}

/* =========================================================================
   HERO
   ========================================================================= */
.hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(116% 88% at 84% 6%,rgba(171,121,67,.19) 0%,rgba(171,121,67,0) 54%),
    radial-gradient(84% 66% at 4% 98%,rgba(171,121,67,.10) 0%,rgba(171,121,67,0) 56%),
    linear-gradient(172deg,var(--ink-800) 0%,var(--ink-900) 100%);
}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:var(--grain);opacity:.09;mix-blend-mode:overlay;}
.hero-grid{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.04fr .96fr;
  gap:clamp(32px,4.5vw,64px);align-items:center;
  padding-top:clamp(60px,8vw,96px);padding-bottom:clamp(38px,4.5vw,52px);
}
@media (max-width:960px){.hero-grid{grid-template-columns:1fr;gap:38px;}}

.hero h1{font-size:clamp(38px,5vw,68px);max-width:15ch;margin-top:22px;letter-spacing:.015em;}

/* Ignition #3 of 3 — the one hero word, in struck bronze */
.hero h1 .hl{
  color:var(--brass-lift);
  background-image:linear-gradient(100deg,
    var(--brass-deep) 0%, var(--brass) 16%, var(--brass-soft) 30%,
    var(--brass-pale) 40%, var(--brass-soft) 50%, var(--brass) 66%,
    var(--brass-deep) 82%, var(--brass) 100%);
  background-size:300% 100%;background-position:0% 50%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:sheen 11s cubic-bezier(.45,.05,.55,.95) infinite;
}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  .hero h1 .hl{-webkit-text-fill-color:currentColor;color:var(--brass-lift);background:none;animation:none;}
}
@keyframes sheen{0%,100%{background-position:0% 50%;}50%{background-position:100% 50%;}}
@media (prefers-reduced-motion:reduce){.hero h1 .hl{animation:none;background-position:38% 50%;}}

.hero .lede{margin-top:24px;font-size:clamp(15.5px,1.5vw,17px);}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;}

.hero-visual{position:relative;}
.hero-visual::before{content:"";position:absolute;inset:-13px -13px 13px 13px;border:1px solid var(--brass);opacity:.34;pointer-events:none;}

.hero-foot{position:relative;z-index:2;border-top:1px solid var(--rule);}
.hero-foot .dataplate{border:none;background:transparent;}
.hero-foot .dataplate .cell{border-left:1px solid var(--rule);padding:22px 20px;}
.hero-foot .dataplate .cell:first-child{border-left:none;padding-left:0;}

.scroll-cue{
  display:inline-flex;align-items:center;gap:10px;margin-top:26px;
  font-family:var(--f-mono);font-size:9.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--tx-faint);
}
.scroll-cue .bar{display:block;width:34px;height:1px;background:var(--rule-hi);position:relative;overflow:hidden;}
.scroll-cue .bar::after{content:"";position:absolute;inset:0;background:var(--brass-lift);transform:translateX(-100%);animation:cue 2.8s var(--ease) infinite;}
@keyframes cue{0%{transform:translateX(-100%);}55%,100%{transform:translateX(100%);}}
@media (prefers-reduced-motion:reduce){.scroll-cue .bar::after{animation:none;transform:none;opacity:.55;}}

/* =========================================================================
   STATS
   ========================================================================= */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(152px,1fr));}
.stats .s{padding:clamp(24px,3vw,36px) 20px;border-left:1px solid var(--l-rule);text-align:center;}
.stats .s:first-child{border-left:none;}
.stats b{display:block;font-family:var(--f-display);font-weight:700;font-size:clamp(27px,3.3vw,42px);color:var(--l-tx);line-height:1;white-space:nowrap;}
.stats b .u{color:var(--brass-deep);font-size:.44em;letter-spacing:.02em;vertical-align:.42em;margin-left:.12em;}
.stats .s > span{display:block;margin-top:10px;font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--l-tx-faint);line-height:1.7;}
.on-dark .stats .s,.on-dark-deep .stats .s{border-left-color:var(--rule);}
.on-dark .stats b,.on-dark-deep .stats b{color:var(--tx);}
.on-dark .stats b .u,.on-dark-deep .stats b .u{color:var(--brass-lift);}
.on-dark .stats .s > span,.on-dark-deep .stats .s > span{color:var(--tx-faint);}

/* =========================================================================
   LEDGER
   ========================================================================= */
.ledger{border-top:1px solid var(--l-rule-mid);max-width:900px;margin-inline:auto;}
.ledger .row{
  display:grid;grid-template-columns:66px 1fr 28px;gap:clamp(14px,2.4vw,28px);
  align-items:center;padding:clamp(21px,2.4vw,28px) 0;
  border-bottom:1px solid var(--l-rule);
  transition:padding-left .4s var(--ease),background .4s var(--ease);
}
a.ledger-row-link:hover,.ledger .row:hover{background:rgba(171,121,67,.07);}
a.ledger-row-link:hover{padding-left:16px;}
.ledger .n{font-family:var(--f-mono);font-size:12px;color:var(--brass-deep);letter-spacing:.1em;}
.ledger .t{display:block;font-family:var(--f-display);font-weight:700;text-transform:uppercase;font-size:clamp(19px,2.3vw,26px);line-height:1.02;color:var(--l-tx);}
.ledger .d{display:block;margin-top:10px;font-size:14px;line-height:1.68;color:var(--l-tx-dim);max-width:64ch;}
.ledger .a{font-family:var(--f-mono);font-size:18px;color:var(--brass-deep);transition:transform .4s var(--ease);text-align:right;}
a.ledger-row-link:hover .a{transform:translateX(5px);}
.on-dark .ledger,.on-dark-deep .ledger{border-top-color:var(--rule-mid);}
.on-dark .ledger .row,.on-dark-deep .ledger .row{border-bottom-color:var(--rule);}
.on-dark .ledger .t,.on-dark-deep .ledger .t{color:var(--tx);}
.on-dark .ledger .d,.on-dark-deep .ledger .d{color:var(--tx-dim);}
.on-dark .ledger .n,.on-dark .ledger .a,.on-dark-deep .ledger .n,.on-dark-deep .ledger .a{color:var(--brass-lift);}
@media (max-width:640px){
  .ledger .row{grid-template-columns:42px 1fr;}
  .ledger .a{display:none;}
}

/* =========================================================================
   GRID + CARDS
   ========================================================================= */
.grid{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);}
.on-light .grid,.on-light-2 .grid{background:var(--l-rule);border-color:var(--l-rule);}
.g2{grid-template-columns:repeat(2,1fr);}
.g3{grid-template-columns:repeat(3,1fr);}
.g4{grid-template-columns:repeat(4,1fr);}
@media (max-width:980px){.g3,.g4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr;}}
.grid-open{display:grid;gap:clamp(16px,2.2vw,26px);background:none;border:none;}

.card{background:var(--bg);padding:clamp(24px,2.6vw,32px);}
.on-dark .card{background:var(--ink-800);}
.on-dark-deep .card{background:var(--ink-850);}
.on-light .card{background:var(--paper);}
.on-light-2 .card{background:var(--paper-2);}
.card h3{font-size:clamp(17.5px,1.9vw,21px);margin-top:13px;letter-spacing:.02em;}
.card p{margin-top:11px;font-size:14px;line-height:1.7;color:var(--tx-dim);}
.on-light .card p,.on-light-2 .card p{color:var(--l-tx-dim);}

.spec{border-top:1px solid var(--l-rule);}
.on-dark .spec,.on-dark-deep .spec{border-top-color:var(--rule);}
.spec li{
  display:grid;grid-template-columns:24px 1fr;gap:13px;align-items:start;
  padding:14px 0;border-bottom:1px solid var(--l-rule);
  font-size:14.5px;line-height:1.66;color:var(--l-tx-dim);
}
.on-dark .spec li,.on-dark-deep .spec li{border-bottom-color:var(--rule);color:var(--tx-dim);}
.spec li::before{
  content:"";width:8px;height:8px;margin-top:7px;
  border:1px solid var(--brass);border-right:none;border-bottom:none;transform:rotate(45deg);
}

/* =========================================================================
   LOG
   ========================================================================= */
.log{max-width:940px;margin-inline:auto;}
.log .entry{
  border-top:1px solid var(--rule);padding:clamp(28px,3.6vw,42px) 0;
  display:grid;grid-template-columns:196px 1fr;gap:clamp(18px,3vw,40px);
}
.log .entry:last-child{border-bottom:1px solid var(--rule);}
@media (max-width:820px){.log .entry{grid-template-columns:1fr;gap:15px;}}
.log .meta{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;color:var(--tx-faint);line-height:1.85;text-transform:uppercase;}
.log .tag{display:inline-block;margin-top:12px;padding:5px 11px;border:1px solid var(--rule-brass);color:var(--brass-lift);font-size:9px;letter-spacing:.16em;}
.log .t{font-family:var(--f-display);font-weight:700;font-size:clamp(20px,2.5vw,28px);text-transform:uppercase;letter-spacing:.02em;line-height:1.06;}
.log .b{margin-top:14px;font-size:15px;line-height:1.76;color:var(--tx-dim);max-width:68ch;}
.log .b + .b{margin-top:14px;}

.wall{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);}
.wall .w{background:var(--ink-850);padding:clamp(22px,2.8vw,32px);transition:background .4s var(--ease);}
.wall .w:hover{background:var(--ink-800);}
.wall .w .nm{font-family:var(--f-display);font-weight:700;font-size:clamp(20px,2.3vw,26px);text-transform:uppercase;letter-spacing:.025em;line-height:1.04;color:var(--tx);}
.wall .w .sub{margin-top:9px;font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-lift);}
.wall .w .note{margin-top:14px;font-size:13px;line-height:1.66;color:var(--tx-faint);}

/* =========================================================================
   TEAM
   ========================================================================= */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--l-rule);border:1px solid var(--l-rule);}
@media (max-width:980px){.team{grid-template-columns:repeat(2,1fr);}}
@media (max-width:620px){.team{grid-template-columns:1fr;}}
.member{background:var(--paper);display:flex;flex-direction:column;}
.member .shot{aspect-ratio:4/5;overflow:hidden;background:var(--paper-3);position:relative;}
.member .shot img{
  width:100%;height:100%;object-fit:cover;object-position:center 18%;
  filter:grayscale(.14) contrast(1.04) saturate(.86) sepia(.04);
  transition:filter .6s var(--ease),transform 1s var(--ease-soft);
}
.member:hover .shot img{filter:grayscale(0) contrast(1.04) saturate(1) sepia(0);transform:scale(1.035);}
.member .info{padding:22px clamp(18px,2vw,24px) 26px;flex:1;display:flex;flex-direction:column;}
.member .nm{font-family:var(--f-display);font-weight:700;font-size:20px;text-transform:uppercase;letter-spacing:.025em;color:var(--l-tx);}
.member .rl{margin-top:7px;font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep);}
.member .bio{margin-top:15px;font-size:13.5px;line-height:1.72;color:var(--l-tx-dim);}
.member .ln{margin-top:16px;padding-top:14px;border-top:1px solid var(--l-rule);font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--l-tx-faint);}

/* =========================================================================
   CERTIFICATES — the only place pure white appears
   ========================================================================= */
.certs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.2vw,26px);}
@media (max-width:900px){.certs{grid-template-columns:1fr;max-width:500px;margin-inline:auto;}}
.cert{
  background:var(--white);border:1px solid var(--l-rule-mid);
  padding:clamp(15px,1.9vw,21px);
  box-shadow:0 1px 2px rgba(11,10,6,.06),0 22px 44px -20px rgba(11,10,6,.32);
  display:flex;flex-direction:column;
}
.cert .mat{aspect-ratio:4/3;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden;padding:10px;}
.cert .mat img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
.cert .cap{
  margin-top:15px;padding-top:13px;border-top:1px solid var(--l-rule);
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
}
.cert .cap b{color:var(--l-tx);font-weight:600;}
.cert .cap span{color:var(--brass-deep);}

.policy{border-left:2px solid var(--brass);padding-left:clamp(20px,3vw,30px);}
.policy p{margin-bottom:18px;color:var(--l-tx-dim);font-size:15px;line-height:1.86;}
.policy p:last-of-type{margin-bottom:0;}
.policy .sign{margin-top:28px;padding-top:19px;border-top:1px solid var(--l-rule-mid);font-family:var(--f-mono);font-size:12px;line-height:1.95;color:var(--l-tx);}

/* =========================================================================
   FORM
   ========================================================================= */
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;}
.field label{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--l-tx-faint);}
.field input,.field select,.field textarea{
  background:transparent;border:none;border-bottom:1px solid var(--l-rule-hi);
  color:var(--l-tx);font-family:var(--f-body);font-size:15.5px;padding:11px 2px;resize:vertical;
  transition:border-color .3s var(--ease);
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brass-deep);border-bottom-width:1.5px;}
.field select{appearance:none;-webkit-appearance:none;border-radius:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2367634F' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") right 4px center no-repeat;}

/* =========================================================================
   PAGE HEAD
   ========================================================================= */
.page-head{
  position:relative;overflow:hidden;
  padding:clamp(116px,13vw,158px) 0 clamp(46px,5.5vw,68px);
  background:
    radial-gradient(104% 76% at 88% 0%,rgba(171,121,67,.15) 0%,rgba(171,121,67,0) 56%),
    linear-gradient(174deg,var(--ink-800) 0%,var(--ink-900) 100%);
}
.page-head::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:var(--grain);opacity:.08;mix-blend-mode:overlay;}
.page-head > .container{position:relative;z-index:2;text-align:center;}
.page-head h1{font-size:clamp(32px,4.6vw,58px);max-width:19ch;margin-inline:auto;letter-spacing:.015em;}
.page-head .lede{margin:20px auto 0;font-size:16.5px;}
.page-head .eyebrow{justify-content:center;}
.page-head .dataplate{text-align:left;}
.crumb{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-faint);margin-bottom:22px;}
.crumb a{transition:color .3s var(--ease);}
.crumb a:hover{color:var(--brass-lift);}
.crumb .sep{color:var(--brass);margin-inline:8px;}

/* =========================================================================
   CTA BAND — no longer a slab of orange. Charcoal + bronze frame,
   with the single orange button carrying the action.
   ========================================================================= */
.cta-band{
  position:relative;overflow:hidden;
  background:
    radial-gradient(90% 130% at 50% 0%,rgba(171,121,67,.17) 0%,rgba(171,121,67,0) 60%),
    linear-gradient(180deg,var(--ink-850) 0%,var(--ink-900) 100%);
  border-top:1px solid var(--rule-brass);border-bottom:1px solid var(--rule-brass);
  color:var(--tx);
}
.cta-band::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:var(--grain);opacity:.08;mix-blend-mode:overlay;}
.cta-band > .container{position:relative;z-index:2;}
.cta-band h2{color:var(--tx);font-size:clamp(25px,3.3vw,40px);}
.cta-band .eyebrow{color:var(--brass-lift);}
.cta-band .btn{border-color:var(--rule-brass);color:var(--tx);}
.cta-band .btn:hover{border-color:var(--brass-lift);color:var(--brass-lift);}
.cta-band .btn-primary{background:var(--orange);border-color:var(--orange);color:var(--ink-900);}
.cta-band .btn-primary:hover{background:var(--orange-lift);border-color:var(--orange-lift);color:var(--ink-900);}
.cta-flex{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:26px;}
.cta-flex .acts{display:flex;flex-wrap:wrap;gap:14px;}
@media (max-width:760px){.cta-flex{flex-direction:column;align-items:flex-start;}}

/* =========================================================================
   FOOTER
   ========================================================================= */
.site-footer{background:var(--ink-900);border-top:1px solid var(--rule);padding-top:clamp(50px,5.5vw,70px);}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:clamp(24px,3.2vw,42px);padding-bottom:clamp(38px,4.6vw,54px);}
@media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.footer-top{grid-template-columns:1fr;}}
.footer-col h4{font-family:var(--f-mono);font-size:9.5px;font-weight:500;letter-spacing:.2em;color:var(--brass);text-transform:uppercase;margin-bottom:17px;}
.footer-col a,.footer-col p{display:block;color:var(--tx-dim);font-size:13.5px;margin-bottom:11px;line-height:1.62;}
.footer-col a{transition:color .3s var(--ease);}
.footer-col a:hover{color:var(--brass-lift);}
.footer-bottom{border-top:1px solid var(--rule);padding:19px 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;color:var(--tx-faint);}

/* =========================================================================
   MOTION — long, soft, staggered. Nothing bounces.
   ========================================================================= */
.reveal{opacity:0;transform:translateY(20px);transition:opacity 1s var(--ease-soft),transform 1s var(--ease-soft);}
.reveal.in{opacity:1;transform:none;}
.reveal[data-d="1"]{transition-delay:.10s;}
.reveal[data-d="2"]{transition-delay:.20s;}
.reveal[data-d="3"]{transition-delay:.30s;}
.reveal[data-d="4"]{transition-delay:.40s;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;}}

/* =========================================================================
   HELPERS
   ========================================================================= */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,56px);align-items:center;}
.split > *,.grid > *,.grid-open > *,.hero-grid > *{min-width:0;}
.split-wide-l{grid-template-columns:1.2fr 1fr;}
.split-wide-r{grid-template-columns:1fr 1.2fr;}
.split.top{align-items:start;}
@media (max-width:900px){.split,.split-wide-l,.split-wide-r{grid-template-columns:1fr;}}
.mt-s{margin-top:18px;} .mt-m{margin-top:28px;} .mt-l{margin-top:38px;}
.nowrap{white-space:nowrap;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
/* centred blocks below a centred head keep their own left-aligned reading measure */
.hold{max-width:900px;margin-inline:auto;}

/* ══ INSIGHTS ═══════════════════════════════════════════════════════════════
   Long-form article furniture. The job here is momentum: a reader should be
   able to see the shape of the piece before committing to it, then always
   know where they are inside it. */

/* ── byline ─────────────────────────────────────────────────────────────── */
.byline{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:12px 18px;margin:24px auto 0;max-width:var(--measure);}
.byline .who{display:flex;align-items:center;gap:11px;}
.byline .mark{width:30px;height:30px;flex:none;border:1px solid var(--rule-brass);
  display:grid;place-items:center;font-family:var(--f-mono);font-size:10px;
  letter-spacing:.06em;color:var(--brass-lift);}
.byline .nm{font-family:var(--f-body);font-size:13.5px;font-weight:600;
  color:var(--tx);line-height:1.25;display:block;}
.byline .rl{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--tx-faint);display:block;margin-top:2px;}
.byline .facts{font-family:var(--f-mono);font-size:10.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--tx-faint);
  display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;}
.byline .dot{width:3px;height:3px;border-radius:50%;background:var(--brass);flex:none;}
/* No divider between the name and the facts: the two blocks wrap independently,
   and a border-right is left dangling whenever the facts drop to their own line. */
@media(max-width:620px){.byline{gap:10px;}}

/* ── contents: the pull-through device ──────────────────────────────────── */
.toc{max-width:var(--measure);margin:0 auto 46px;border:1px solid var(--l-rule-mid);
  border-left:2px solid var(--l-rule-brass);padding:22px 26px 24px;background:var(--paper-2);}
.toc-h{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--brass-deep);margin-bottom:14px;}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:toc;}
.toc li{counter-increment:toc;border-top:1px solid var(--l-rule);}
.toc li:first-child{border-top:0;}
.toc a{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:baseline;
  padding:11px 0;text-decoration:none;color:var(--l-tx);
  font-size:15px;line-height:1.45;transition:color .2s var(--ease);}
.toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--f-mono);
  font-size:11px;letter-spacing:.08em;color:var(--l-tx-faint);transition:color .2s var(--ease);}
.toc a:hover{color:var(--brass-deep);}
.toc a:hover::before{color:var(--brass-deep);}

/* ── prose ──────────────────────────────────────────────────────────────── */
.prose{max-width:var(--measure);margin:0 auto;}
/* descendant selector, not child: paragraphs also live inside section.check */
.prose p{font-size:16.5px;line-height:1.8;color:var(--l-tx-dim);margin:0 0 1.2em;}
.prose p.lead{font-size:19px;line-height:1.68;color:var(--l-tx);margin-bottom:1.5em;}

/* numbered section heads — the mono numeral and rule give the piece a spine */
.page-head h1,.prose h2{text-wrap:balance;}
.prose h2{font-family:var(--f-display);font-size:clamp(25px,3.2vw,34px);line-height:1.1;
  color:var(--l-tx);margin:0 0 .5em;scroll-margin-top:100px;}
.prose h2.numbered{display:grid;grid-template-columns:auto 1fr;gap:0 14px;align-items:baseline;
  margin-top:0;padding-top:20px;border-top:1px solid var(--l-rule-mid);}
.prose h2.numbered::before{content:attr(data-n);font-family:var(--f-mono);
  font-size:12px;letter-spacing:.1em;color:var(--brass-deep);
  transform:translateY(-2px);}
.prose section.check{margin:0 0 clamp(44px,5vw,64px);}
.prose section.check:last-of-type{margin-bottom:clamp(34px,4vw,48px);}
.prose h3{font-family:var(--f-display);font-size:clamp(18px,2.2vw,22px);line-height:1.25;
  color:var(--l-tx);margin:1.9em 0 .5em;}

.prose ul,.prose ol{margin:0 0 1.2em;padding-left:1.15em;}
.prose li{font-size:16.5px;line-height:1.8;color:var(--l-tx-dim);margin:0 0 .45em;}
.prose li::marker{color:var(--brass-deep);}
.prose strong{color:var(--l-tx);font-weight:600;}
.prose em{font-style:italic;}
.prose a:not(.btn){color:var(--brass-deep);text-underline-offset:3px;}

/* pull quote — a rest stop, not decoration */
.prose blockquote{margin:clamp(30px,3.4vw,42px) 0;padding:0 0 0 22px;
  border-left:2px solid var(--l-rule-brass);}
.prose blockquote p{color:var(--l-tx);font-family:var(--f-display);
  font-size:clamp(20px,2.6vw,25px);line-height:1.3;margin:0;}
.prose .plate{margin:clamp(30px,3.4vw,42px) 0;}
.prose .plate .fig-t{font-size:11px;}  /* .prose p sizing must not reach the plate caption */

/* ── takeaway card ──────────────────────────────────────────────────────── */
.takeaway{max-width:var(--measure);margin:clamp(38px,4.4vw,54px) auto 0;
  border:1px solid var(--l-rule-mid);padding:26px 28px 28px;position:relative;
  background:var(--paper-2);}
.takeaway::before,.takeaway::after{content:"";position:absolute;width:8px;height:8px;
  border-color:var(--l-rule-brass);border-style:solid;}
.takeaway::before{top:-1px;left:-1px;border-width:1px 0 0 1px;}
.takeaway::after{bottom:-1px;right:-1px;border-width:0 1px 1px 0;}
.takeaway .tk-h{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--brass-deep);margin-bottom:14px;}
.takeaway ol{margin:0;padding-left:1.15em;}
.takeaway li{font-size:15.5px;line-height:1.6;color:var(--l-tx-dim);margin:0 0 .5em;}
.takeaway li:last-child{margin-bottom:0;}
.takeaway li::marker{color:var(--brass-deep);font-family:var(--f-mono);font-size:12px;}

/* ── index placeholder ──────────────────────────────────────────────────── */
.empty-note{border:1px solid var(--l-rule-mid);padding:26px 24px;text-align:center;
  color:var(--l-tx-faint);font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;}

/* ── inline conversion block, used mid-article ──────────────────────────── */
.inline-cta{max-width:var(--measure);margin:clamp(34px,4vw,46px) auto;
  border-top:1px solid var(--l-rule-brass);border-bottom:1px solid var(--l-rule-mid);
  padding:20px 0 22px;display:flex;flex-wrap:wrap;gap:8px 22px;align-items:baseline;}
.inline-cta .t{font-family:var(--f-display);font-size:clamp(19px,2.3vw,23px);
  line-height:1.2;color:var(--l-tx);flex:1 1 260px;min-width:0;}
.inline-cta a{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass-deep);white-space:nowrap;
  text-decoration:none;border-bottom:1px solid var(--l-rule-brass);padding-bottom:3px;
  transition:color .2s var(--ease),border-color .2s var(--ease);}
.inline-cta a:hover{color:var(--l-tx);border-color:var(--l-tx);}

/* ── "read next" rail at the foot of an article ─────────────────────────── */
.next-rail{max-width:var(--measure);margin:clamp(40px,4.6vw,58px) auto 0;}
.next-rail .nr-h{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--brass-deep);margin-bottom:6px;}
.next-rail a{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:baseline;
  padding:15px 0;border-top:1px solid var(--l-rule-mid);text-decoration:none;
  transition:padding-left .2s var(--ease);}
.next-rail a:last-child{border-bottom:1px solid var(--l-rule-mid);}
.next-rail a:hover{padding-left:6px;}
.next-rail .t{font-family:var(--f-body);font-size:16px;font-weight:600;color:var(--l-tx);
  line-height:1.35;display:block;}
.next-rail .d{font-family:var(--f-body);font-size:14px;font-weight:400;color:var(--l-tx-dim);
  line-height:1.5;display:block;margin-top:3px;}
.next-rail .a{font-family:var(--f-mono);font-size:13px;color:var(--brass-deep);}