:root{
  /* Palette — warm industrial */
  --stone: #F2EEE6;
  --stone-2: #E9E3D6;
  --stone-3: #DCD4C2;
  --ink: #16191A;
  --ink-2: #2A2E2C;
  --ink-muted: #6A6E68;
  --ink-subtle: #9A9A92;
  --line: #C9C2B2;
  --line-soft: #DDD6C6;
  --green: #2E4A3A;
  --green-2: #1F3328;
  --green-soft: #485D4F;
  --steel: #4A6478;
  --steel-soft: #6E8395;
  --copper: #8B5A3C;
  --copper-soft: #B07A55;
  --copper-bright: #C68458;
  --panel: #1A201D;
  --panel-2: #232927;
  --panel-line: #2F3633;
  --signal-amber: #C18A36;
  --signal-rose: #A24A48;

  /* Typography — Newsreader (display, opsz) · Hanken Grotesk (body) · JetBrains Mono (data) · Big Shoulders (industrial signage) */
  --serif: 'Newsreader', 'Source Serif Pro', Georgia, serif;
  --sans: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --mono: 'Barlow Condensed', 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
  --stencil: 'Big Shoulders Display', 'Oswald', 'Impact', sans-serif;

  --radius-sm: 2px;
  --radius: 4px;
  --radius-lg: 6px;

  --ease-soft: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background:var(--stone);
  color:var(--ink);
  font-size:15.5px;
  line-height:1.55;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:"ss01","ss02","cv11";
  font-variant-numeric: oldstyle-nums proportional-nums;
}

/* Display type — Newsreader, variable opsz axis: pull larger opsz for bigger sizes */
h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:400;
  font-style:normal;
  letter-spacing:-0.012em;
  line-height:1.02;
  margin:0;
  color:var(--ink);
  text-wrap:balance;
  font-variation-settings:"opsz" 36;
}
h1{font-variation-settings:"opsz" 60;letter-spacing:-0.018em;font-weight:420}
h2{font-variation-settings:"opsz" 48;letter-spacing:-0.014em;font-weight:420}
h3{font-variation-settings:"opsz" 24;font-weight:450}
h4{font-variation-settings:"opsz" 18;font-weight:500}
h1{letter-spacing:-0.025em}
h2{letter-spacing:-0.022em}
h3{letter-spacing:-0.014em;line-height:1.05}
h4{letter-spacing:-0.008em;line-height:1.15}

/* Italic accent — wrap a span in this to get the editorial pivot */
.emph{font-style:italic;font-feature-settings:"ss01"}
.emph-light{font-style:italic;color:var(--copper)}
.emph-quiet{font-style:italic;color:var(--ink-muted)}

p{margin:0;text-wrap:pretty}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:transparent;padding:0}

/* Numeric utilities */
.tn{font-variant-numeric:tabular-nums lining-nums}
.lining{font-variant-numeric:lining-nums proportional-nums}

/* Layout */
.page{min-height:100vh;background:var(--stone);overflow-x:hidden;position:relative}
.container{width:100%;max-width:1320px;margin:0 auto;padding:0 40px}
.container-narrow{max-width:1080px}
section{position:relative}

/* Tokens */
.eyebrow{
  font-family:var(--mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-muted);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.eyebrow::before{
  content:"";
  width:18px;height:1px;background:var(--ink-muted);
  display:inline-block;
}
.eyebrow.no-rule::before{display:none}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:0.04em;color:var(--ink-muted);font-feature-settings:"zero"}
.serif{font-family:var(--serif)}
.numlabel{
  font-family:var(--mono);font-size:10px;
  letter-spacing:0.16em;text-transform:uppercase;
  color:var(--ink-subtle);
}
.divider{height:1px;background:var(--line-soft);width:100%}
.divider-strong{height:1px;background:var(--line);width:100%}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:13.5px;font-weight:500;
  padding:12px 20px;border-radius:999px;
  transition:transform .25s var(--ease-soft),background .2s ease,color .2s ease,box-shadow .25s ease;
  letter-spacing:0.005em;
  will-change:transform;
}
.btn-primary{background:var(--green);color:var(--stone)}
.btn-primary:hover{background:var(--green-2);box-shadow:0 8px 24px -10px rgba(46,74,58,0.5)}
.btn-secondary{border:1px solid var(--ink);color:var(--ink);background:transparent;padding:11px 19px}
.btn-secondary:hover{background:var(--ink);color:var(--stone)}
.btn-ghost{color:var(--ink);padding:8px 0;border-radius:0;border-bottom:1px solid var(--ink)}
.btn-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:500;font-size:13px;position:relative}
.btn-arrow:hover .arr{transform:translateX(5px)}
.arr{transition:transform .25s var(--ease-soft)}

/* Magnetic — wrap a button with .magnetic; JS reads pointer and sets --mx/--my */
.magnetic{display:inline-block;transition:transform .35s var(--ease-soft)}
.magnetic > *{transition:transform .35s var(--ease-soft);transform:translate(calc(var(--mx,0px)*0.4),calc(var(--my,0px)*0.4))}
.magnetic:hover > *{transform:translate(var(--mx,0px),var(--my,0px))}

/* Inline link with growing underline */
.ink-link{
  position:relative;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0% 1px;
  background-repeat:no-repeat;
  background-position:0 calc(100% - 1px);
  transition:background-size .35s var(--ease-soft);
  padding-bottom:1px;
}
.ink-link:hover{background-size:100% 1px}
.ink-link.copper{color:var(--copper)}

/* Cards */
.card{
  background:var(--stone);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  padding:24px;
  position:relative;
  transition:border-color .25s ease, background .25s ease, transform .35s var(--ease-soft);
  overflow:hidden;
}
.card::after{
  content:"";
  position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--copper);
  transition:width .45s var(--ease-soft);
}
.card:hover{border-color:var(--ink-muted);transform:translateY(-2px)}
.card:hover::after{width:100%}
.card-dark{background:var(--panel);color:var(--stone);border-color:var(--panel-line)}
.card-flat{background:transparent;border:0;padding:0}
.card-flat::after{display:none}

/* Section chrome */
.section-pad{padding:120px 0}
.section-pad-tight{padding:80px 0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:56px}
.section-head h2{font-size:54px;max-width:18ch}
.section-intro{max-width:48ch;color:var(--ink-muted);font-size:16px;line-height:1.5}

/* Scroll progress bar — fixed thin copper line */
.scroll-progress{
  position:fixed;top:0;left:0;height:2px;
  background:linear-gradient(90deg,var(--copper) 0%,var(--copper-bright) 70%,var(--copper-soft) 100%);
  width:0%;
  z-index:80;
  pointer-events:none;
  transition:width .12s linear;
}

/* Section rail — pinned vertical number on the viewport left edge */
/* Section rail — slim dot navigator pinned to the left edge */
.section-rail{
  position:fixed;
  left:18px;top:50%;
  transform:translateY(-50%);
  z-index:60;
  display:flex;flex-direction:column;gap:14px;
  align-items:center;
  background:transparent;
  pointer-events:auto;
}
.rail-dot{
  appearance:none;border:0;background:transparent;cursor:pointer;
  padding:0;margin:0;
  display:flex;align-items:center;gap:10px;
  position:relative;
  outline:none;
}
.rail-dot-mark{
  display:block;width:6px;height:6px;border-radius:50%;
  background:var(--line);
  transition:width .25s var(--ease-soft), height .25s var(--ease-soft), background .25s ease, transform .25s ease;
}
.rail-dot.is-on .rail-dot-mark{
  background:var(--copper);
  width:9px;height:9px;
  box-shadow:0 0 0 3px rgba(198,132,88,0.14);
}
.rail-dot:hover .rail-dot-mark{
  background:var(--copper-bright);
  transform:scale(1.15);
}
/* Label — appears only on hover or active */
.rail-dot-label{
  position:absolute;left:18px;top:50%;transform:translateY(-50%) translateX(-6px);
  white-space:nowrap;
  font-size:10px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--ink);
  background:var(--stone);
  border:1px solid var(--line);
  padding:4px 8px;
  border-radius:2px;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease, transform .25s var(--ease-soft);
}
.rail-dot:hover .rail-dot-label,
.rail-dot.is-on .rail-dot-label{
  opacity:1;transform:translateY(-50%) translateX(0);
}
.rail-dot.is-on .rail-dot-label{
  color:var(--copper);border-color:var(--copper);
}
.rail-dot:focus-visible .rail-dot-label{opacity:1;transform:translateY(-50%) translateX(0)}

@media (max-width:1180px){.section-rail{display:none}}

/* UI fragment — used for "technical proof" feel */
.frag{
  background:var(--stone);
  border:1px solid var(--line);
  border-radius:var(--radius);
  font-family:var(--sans);
  overflow:hidden;
  position:relative;
  transition:transform .4s var(--ease-soft),box-shadow .4s var(--ease-soft);
}
.frag-parallax{will-change:transform}
.frag-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;
  border-bottom:1px solid var(--line-soft);
  font-family:var(--mono);font-size:10px;
  letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-muted);
  background:rgba(0,0,0,0.015);
}
.frag-head .dot{width:5px;height:5px;border-radius:50%;background:var(--green);display:inline-block;margin-right:6px}
.frag-row{display:flex;align-items:center;padding:10px 12px;gap:10px;font-size:12px;border-bottom:1px solid var(--line-soft)}
.frag-row:last-child{border-bottom:0}
.frag-row .meta{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-muted);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.frag-pip{width:6px;height:6px;border-radius:50%;display:inline-block;flex-shrink:0}
.pip-green{background:var(--green)}
.pip-steel{background:var(--steel)}
.pip-copper{background:var(--copper)}
.pip-amber{background:var(--signal-amber)}
.pip-rose{background:var(--signal-rose)}
.pip-mute{background:var(--ink-subtle)}

/* Bar / sparkline */
.spark{display:inline-flex;align-items:flex-end;gap:2px;height:14px}
.spark span{width:3px;background:var(--ink-muted);border-radius:1px}
.spark.green span{background:var(--green)}
.spark.steel span{background:var(--steel)}

/* Striped placeholder for imagery */
.placeholder-img{
  position:relative;
  width:100%;
  background:
    repeating-linear-gradient(135deg,
      rgba(46,74,58,0.06) 0 1px,
      transparent 1px 8px),
    linear-gradient(180deg, var(--stone-2), var(--stone-3));
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  color:var(--ink-muted);
  font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;
  text-align:center;
}
.placeholder-img.dark{
  background:
    repeating-linear-gradient(135deg,
      rgba(255,255,255,0.04) 0 1px,
      transparent 1px 8px),
    linear-gradient(180deg, #1A201D, #232927);
  border-color:var(--panel-line);color:#9AA39C;
}
.placeholder-img .crop{padding:8px 12px;background:rgba(242,238,230,0.5);border:1px solid var(--line-soft);border-radius:2px;backdrop-filter:blur(4px)}
.placeholder-img.dark .crop{background:rgba(0,0,0,0.35);border-color:#2F3633;color:#C8CBC4}

/* Pullquote — Instrument Italic moments */
.pullquote{
  font-family:var(--serif);
  font-size:44px;
  font-style:italic;
  line-height:1.08;
  letter-spacing:-0.018em;
  color:var(--ink);
  max-width:24ch;
  text-wrap:balance;
}
.pullquote .ink-muted{color:var(--ink-muted);font-style:normal}

/* Big stat — scramble-friendly */
.stat-big{
  font-family:var(--serif);
  font-weight:400;
  font-variant-numeric:lining-nums tabular-nums;
  letter-spacing:-0.022em;
  line-height:1;
}

/* Scramble target */
.scramble{font-variant-numeric:tabular-nums lining-nums;display:inline-block;min-width:1ch}

/* Callout dots with hover-expand */
.callout-dot{
  position:absolute;
  width:28px;height:28px;border-radius:99px;
  background:var(--signal-rose);color:var(--stone);
  font-family:var(--serif);font-size:14px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  box-shadow:0 0 0 4px rgba(162,74,72,0.18);
  transition:transform .25s var(--ease-soft), box-shadow .25s ease;
  z-index:3;
}
.callout-dot:hover{transform:scale(1.08);box-shadow:0 0 0 8px rgba(162,74,72,0.22)}
.callout-dot::before{
  content:"";position:absolute;inset:-6px;border-radius:99px;
  border:1px solid var(--signal-rose);opacity:0.4;
  animation:ping 2.4s cubic-bezier(0,0,.2,1) infinite;
}
@keyframes ping{
  0%{transform:scale(.85);opacity:.55}
  80%,100%{transform:scale(1.6);opacity:0}
}

/* Anchors / nav */
.scroll-anchor{position:absolute;top:-80px;left:0;width:0;height:0;pointer-events:none}

/* Nav link underline */
.nav-link{position:relative;padding:6px 0}
.nav-link::after{
  content:"";position:absolute;left:0;bottom:0;
  width:0;height:1px;background:currentColor;
  transition:width .35s var(--ease-soft);
}
.nav-link:hover::after,.nav-link.active::after{width:100%}

/* Subtle textures */
.tex-grid{
  background-image:
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size: 32px 32px;
  background-position: -1px -1px;
}

/* Noise overlay — adds tactility without color */
.noise::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  opacity:.045;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxNjAnIGhlaWdodD0nMTYwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjkyJyBudW1PY3RhdmVzPScyJyBzdGl0Y2hUaWxlcz0nc3RpdGNoJy8+PC9maWx0ZXI+PHJlY3Qgd2lkdGg9JzEwMCUnIGhlaWdodD0nMTAwJScgZmlsdGVyPSd1cmwoI24pJy8+PC9zdmc+");
}

/* Animations */
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.35}}
.pulse{animation:pulse-dot 1.8s ease-in-out infinite}
@keyframes spin-slow{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.spin-slow{animation:spin-slow 16s linear infinite}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .75s var(--ease-soft),transform .75s var(--ease-soft)}
.reveal.in{opacity:1;transform:none}

/* Slide-in for case study stat rows */
.row-reveal{opacity:0;transform:translateX(-12px);transition:opacity .55s var(--ease-soft),transform .55s var(--ease-soft)}
.row-reveal.in{opacity:1;transform:none}

/* Focus outline */
:focus-visible{outline:2px solid var(--copper);outline-offset:3px;border-radius:2px}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
  html{scroll-behavior:auto}
}

/* =========================================================================
   PLAYFUL INTERACTIVITY
   ========================================================================= */

/* Reveal directions */
.reveal-up{transform:translateY(14px)}
.reveal-left{transform:translateX(-18px)}
.reveal-right{transform:translateX(18px)}
.reveal-fade{transform:none;opacity:0}
.reveal.in{opacity:1;transform:none}

/* Cursor companion */
.cursor-dot{
  position:fixed;left:0;top:0;width:10px;height:10px;border-radius:50%;
  background:var(--copper);
  opacity:0;pointer-events:none;z-index:1000;
  margin-left:-5px;margin-top:-5px;
  transition:width .25s var(--ease-soft), height .25s var(--ease-soft), opacity .25s, background .25s;
  mix-blend-mode:difference;
  box-shadow:0 0 0 1px rgba(198,132,88,0.45), 0 0 20px rgba(198,132,88,0.35);
}
.cursor-dot.on{
  width:48px;height:48px;
  margin-left:-24px;margin-top:-24px;
  background:transparent;
  border:1px solid var(--copper-bright);
  box-shadow:0 0 0 1px rgba(198,132,88,0.0), 0 0 28px rgba(198,132,88,0.45);
}
@media (hover:hover){.cursor-dot{opacity:.85}}
.cursor-label{
  position:fixed;left:0;top:0;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  background:var(--ink);color:var(--stone);padding:5px 9px;border-radius:2px;
  pointer-events:none;z-index:1001;
  opacity:0;transform:translate(0,0) scale(.9);
  transition:opacity .2s ease, transform .25s var(--ease-soft);
  white-space:nowrap;
}
.cursor-label.on{opacity:1}
@media (hover:none){.cursor-dot,.cursor-label{display:none}}

/* Night mode */
html.night body{background:#15191B;color:#E6DFC9}
html.night .page{background:#15191B}
html.night .card{background:#1F2426;border-color:#2A2F31;color:#E6DFC9}
html.night h1,html.night h2,html.night h3,html.night h4{color:#F2EAD0}
html.night .mono,html.night .eyebrow{color:#9CA39B}
html.night .scroll-progress{background:linear-gradient(90deg,var(--copper-bright),var(--signal-amber))}

/* Trust meter */
.trust-meter{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border:1px solid var(--line);background:var(--stone);border-radius:3px;max-width:360px}
.tm-track{height:6px;background:rgba(22,25,26,0.08);border-radius:99px;overflow:hidden;position:relative}
.tm-fill{height:100%;background:linear-gradient(90deg,var(--copper),var(--green));border-radius:99px;transition:width .9s var(--ease-soft);box-shadow:inset 0 0 0 1px rgba(255,255,255,0.18)}
.tm-row{display:flex;justify-content:space-between;align-items:baseline}
.tm-label{font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.tm-val{font-family:var(--serif);font-size:30px;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.tm-unit{font-family:var(--mono);font-size:11px;color:var(--ink-muted);margin-left:4px}

/* Live counter */
.live-counter{display:inline-flex;align-items:center;gap:10px;padding:6px 12px;border:1px solid var(--line-soft);border-radius:99px;background:var(--stone)}
.live-dot{width:7px;height:7px;border-radius:50%;display:inline-block;animation:pulse-dot 1.6s ease-in-out infinite;box-shadow:0 0 0 4px rgba(139,90,60,0.12)}
.live-label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}

/* Marquee */
.marquee{overflow:hidden;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);padding:10px 0;background:var(--stone-2);position:relative}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track{display:flex;gap:48px;width:max-content;animation:marquee linear infinite;will-change:transform}
.marquee-item{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.marquee-pip{color:var(--copper);font-size:8px}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Tilt */
.tilt{transition:transform .35s var(--ease-soft);transform-style:preserve-3d;will-change:transform}

/* Split text — letter hover lift */
.split{display:inline}
.split-word{display:inline-block;white-space:nowrap}
.split-char{display:inline-block;transition:transform .35s cubic-bezier(.22,.61,.36,1), color .35s ease;transform-origin:50% 80%}
.split:hover .split-char{transform:translateY(-3px) rotate(-1deg);color:var(--copper)}
.split:hover .split-char:nth-child(2n){transform:translateY(-5px) rotate(1.5deg)}
.split:hover .split-char:nth-child(3n){transform:translateY(-2px) rotate(-2deg)}

/* Trust reveal slider */
.trust-reveal{position:relative;width:100%;max-width:640px;margin:0 auto}
.tr-stage{position:relative;height:200px;border:1px solid var(--ink);background:var(--stone-2);overflow:hidden;cursor:ew-resize}
.tr-before,.tr-after{position:absolute;inset:0;padding:18px;display:flex;flex-direction:column;justify-content:space-between}
.tr-before{background:linear-gradient(180deg,#F2E1DB,#E9D3CD)}
.tr-after{background:linear-gradient(180deg,#DDE6DE,#C8D6CC)}
.tr-bars{display:flex;align-items:flex-end;gap:6px;height:100px}
.tr-bars span{flex:1;display:block;border-radius:1px}
.tr-handle{position:absolute;top:0;bottom:0;width:2px;background:var(--ink);transform:translateX(-1px);pointer-events:none;z-index:3}
.tr-handle-bar{position:absolute;inset:0;background:var(--ink)}
.tr-handle-dot{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--stone);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:13px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.tr-range{position:absolute;left:0;right:0;top:0;bottom:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:4}
.tr-caption{display:block;text-align:center;margin-top:10px;color:var(--ink-muted);font-size:10px;letter-spacing:.16em;text-transform:uppercase}

/* Cursor hint on data-cursor elements */
[data-cursor]{cursor:none}
@media (hover:none){[data-cursor]{cursor:default}}

/* Subtle "wire" animated underline for headline emph */
.wire-underline{position:relative;display:inline-block}
.wire-underline::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:8px;
  background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMjAnIGhlaWdodD0nOCcgdmlld0JveD0nMCAwIDEyMCA4Jz48cGF0aCBkPSdNMCA0IEMyMCAtMSwgNDAgOSwgNjAgNCBTMTAwIC0xLCAxMjAgNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjOEI1QTNDJyBzdHJva2Utd2lkdGg9JzEuNCcvPjwvc3ZnPg==") repeat-x;
  background-size:120px 8px;
  opacity:0;transform:translateY(4px);
  transition:opacity .35s var(--ease-soft), transform .35s var(--ease-soft);
}
.wire-underline:hover::after,.wire-underline.always::after{opacity:1;transform:translateY(0)}

/* =========================================================================
   HMI KIOSK BEZEL
   ========================================================================= */
.hmi-kiosk{
  position:relative;
  padding:14px;
  border-radius:8px;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,0.04), transparent 60%),
    linear-gradient(180deg,#2d3231 0%,#22272a 45%,#1b201d 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    inset 0 -1px 0 rgba(0,0,0,0.4),
    0 28px 60px -28px rgba(0,0,0,0.55),
    0 6px 16px -10px rgba(0,0,0,0.45);
}
.hmi-kiosk::before{
  content:"";position:absolute;inset:0;border-radius:8px;pointer-events:none;
  background-image:repeating-linear-gradient(180deg,rgba(255,255,255,0.018) 0 1px,transparent 1px 3px);
  mix-blend-mode:overlay;opacity:.7;
}
.kiosk-brand{
  display:flex;align-items:center;justify-content:space-between;
  padding:6px 14px 10px;
  color:rgba(225,222,210,0.65);
  font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
}
.kiosk-asset{color:rgba(225,222,210,0.45)}
.kiosk-leds{display:inline-flex;gap:7px;align-items:center}
.led{width:6px;height:6px;border-radius:50%;display:inline-block;box-shadow:0 0 0 1px rgba(0,0,0,0.4) inset, 0 0 6px currentColor}
.led-grn{background:#7AB48A;color:#7AB48A;animation:led-blink 3.5s ease-in-out infinite}
.led-amb{background:#C18A36;color:#C18A36;opacity:.55}
.led-rose{background:#A24A48;color:#A24A48;opacity:.35}
@keyframes led-blink{0%,90%,100%{opacity:1}94%{opacity:.35}}

.kiosk-bezel{
  position:relative;
  padding:18px;
  border-radius:5px;
  background:linear-gradient(180deg,#0e1211 0%,#080a0a 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.05),
    inset 0 2px 8px rgba(0,0,0,0.6),
    inset 0 -2px 6px rgba(0,0,0,0.4);
}
.kiosk-bezel::after{
  content:"";position:absolute;inset:0;border-radius:5px;pointer-events:none;
  background:linear-gradient(125deg, rgba(255,255,255,0.045) 0%, transparent 22%, transparent 80%, rgba(255,255,255,0.018) 100%);
  mix-blend-mode:screen;z-index:5;
}
.hmi-screen{
  border:1px solid #1d2322;
  border-radius:3px;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.04),
    0 0 30px rgba(0,0,0,0.5);
}
.screw{
  position:absolute;width:10px;height:10px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #5a5e5b 0%, #2d3231 60%, #15191a 100%);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,0.15),
    inset 0 -1px 1px rgba(0,0,0,0.5),
    0 1px 1px rgba(0,0,0,0.4);
  z-index:6;
}
.screw::after{
  content:"";position:absolute;left:50%;top:50%;width:6px;height:1px;
  background:rgba(0,0,0,0.6);transform:translate(-50%,-50%) rotate(35deg);
}
.screw-tl{top:6px;left:6px}
.screw-tr{top:6px;right:6px}
.screw-bl{bottom:6px;left:6px}
.screw-br{bottom:6px;right:6px}

/* =========================================================================
   EXPERIMENTS STACK
   ========================================================================= */
.exp-stack{display:flex;flex-direction:column;border-top:1px solid var(--ink)}
.exp-row{
  display:grid;
  grid-template-columns:60px 1fr 360px;
  gap:32px;
  align-items:start;
  padding:36px 0 40px;
  border-bottom:1px solid var(--line-soft);
  opacity:0;transform:translateY(24px);
  transition:opacity .8s var(--ease-soft), transform .8s var(--ease-soft);
  position:relative;
}
.exp-row.in{opacity:1;transform:none}
.exp-row::before{
  content:"";position:absolute;left:0;top:0;height:1px;width:0;background:var(--copper);
  transition:width .6s var(--ease-soft);
}
.exp-row:hover::before{width:100%}
.exp-meta{display:flex;flex-direction:column;align-items:flex-start;gap:14px;color:var(--ink-muted);padding-top:6px}
.exp-num{font-family:var(--serif);font-style:italic;font-size:34px;line-height:1;letter-spacing:-.02em;color:var(--copper)}
.exp-body{display:flex;flex-direction:column;gap:14px;max-width:50ch}
.exp-label{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted)}
.exp-title{font-family:var(--serif);font-size:32px;line-height:1.05;letter-spacing:-.014em;color:var(--ink);text-wrap:balance}
.exp-text{font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.exp-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.exp-tag{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);padding:4px 9px;border:1px solid var(--line);border-radius:99px}
.exp-tag-live{display:inline-flex;align-items:center;gap:8px}
.exp-info{position:relative}
.info-svg{width:100%;height:auto;display:block;background:var(--stone);border:1px solid var(--line-soft);border-radius:3px}
.exp-row:hover .info-svg{border-color:var(--ink-muted)}
.info-label{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;fill:var(--ink-muted)}
.info-num{font-family:var(--serif);font-size:24px;letter-spacing:-.02em;fill:var(--ink)}
.info-sub{font-family:var(--mono);font-size:10px;letter-spacing:.06em;fill:var(--ink-muted)}
.info-sub-mini{font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;fill:var(--ink-muted)}
.shift-note{opacity:0;transition:opacity .55s var(--ease-soft)}
.shift-note.in{opacity:1}
.exp-foot{
  display:flex;justify-content:space-between;align-items:center;gap:32px;
  padding:36px 0 0;flex-wrap:wrap;
}
@media (max-width:1080px){
  .exp-row{grid-template-columns:50px 1fr;gap:20px}
  .exp-info{grid-column:1 / -1;margin-left:70px;max-width:480px}
}

/* =========================================================================
   HERO COMPOSITE — KINETIC INTRO
   ========================================================================= */
.hero-stage{perspective:1400px}
.hero-backdrop{opacity:0;animation:hero-fade-in .9s var(--ease-soft) .1s forwards}

.hero-card{
  opacity:0;
  transform:translate3d(0,18px,0) scale(.985);
  animation-fill-mode:forwards;
  animation-timing-function:var(--ease-soft);
  animation-duration:.9s;
}
.hero-card.card-1{transform:translate3d(20px,-18px,0) scale(.985);animation-delay:.25s;animation-name:hero-card-1}
.hero-card.card-2{transform:translate3d(-26px,8px,0) scale(.985);animation-delay:.95s;animation-name:hero-card-2}
.hero-card.card-3{transform:translate3d(18px,18px,0) scale(.985);animation-delay:1.55s;animation-name:hero-card-3}
.hero-card.card-4{transform:translate3d(-22px,18px,0) scale(.985);animation-delay:2.15s;animation-name:hero-card-4}

@keyframes hero-card-1{to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes hero-card-2{to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes hero-card-3{to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes hero-card-4{to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes hero-fade-in{to{opacity:1}}

/* Amber pulse for the active-decision card */
.amber-pulse{
  animation: hero-card-2 .9s var(--ease-soft) .95s forwards, amber-pulse 2.6s ease-in-out 2s infinite;
}
@keyframes amber-pulse{
  0%,100%{box-shadow: 0 12px 40px -20px rgba(22,25,26,0.35), 0 0 0 0 rgba(193,138,54,0.0)}
  50%{box-shadow: 0 12px 40px -20px rgba(22,25,26,0.35), 0 0 0 8px rgba(193,138,54,0.12)}
}

/* Live pulse dots in the cards */
.pulse-dot{position:relative}
.pulse-dot::before{
  content:"";position:absolute;inset:-3px;border-radius:50%;
  background:inherit;opacity:.45;
  animation:pulse-ring 2s ease-out infinite;
}
@keyframes pulse-ring{
  0%{transform:scale(.6);opacity:.6}
  100%{transform:scale(2.4);opacity:0}
}

/* Production sparkline bars — grow up from 0 to --barH on a per-bar delay */
.hero-bar{
  height:0;
  animation:bar-grow .55s var(--ease-soft) forwards;
  animation-delay:var(--barDelay);
}
@keyframes bar-grow{to{height:var(--barH)}}

/* Flywheel arcs — draw on, then label fades in */
.hero-arc{
  stroke-dasharray:1000;
  stroke-dashoffset:1000;
  opacity:.85;
}
.hero-arc.arc-1{animation:arc-draw 1.1s var(--ease-soft) .55s forwards}
.hero-arc.arc-2{animation:arc-draw 1.1s var(--ease-soft) 1.25s forwards}
.hero-arc.arc-3{animation:arc-draw 1.1s var(--ease-soft) 1.85s forwards}
.hero-arc.arc-4{animation:arc-draw 1.3s var(--ease-soft) 2.45s forwards}
@keyframes arc-draw{
  0%{stroke-dashoffset:1000}
  100%{stroke-dashoffset:0;stroke-dasharray:3 5}
}

.arc-label{opacity:0;animation-fill-mode:forwards;animation-timing-function:var(--ease-soft);animation-duration:.55s}
.arc-label.label-1{animation-name:label-in;animation-delay:1.3s}
.arc-label.label-2{animation-name:label-in;animation-delay:2.0s}
.arc-label.label-3{animation-name:label-in;animation-delay:2.6s}
.arc-label.label-4{animation-name:label-in;animation-delay:3.2s}
@keyframes label-in{to{opacity:.85}}

/* Photons riding the arcs — invisible until path is drawn */
.photon{opacity:0;animation:photon-show .4s ease forwards}
.photon-1{animation-delay:1.5s}
.photon-2{animation-delay:2.2s}
.photon-3{animation-delay:2.8s}
.photon-4{animation-delay:3.4s}
@keyframes photon-show{to{opacity:.85}}

/* Check mark drawing in the loop-closed card */
.check-draw path{
  stroke-dasharray:1;stroke-dashoffset:1;
  animation:check-draw .55s ease-out 2.7s forwards;
}
@keyframes check-draw{to{stroke-dashoffset:0}}

/* Reduced motion respects user pref via media query already set */

/* =========================================================================
   PERSONAL — Chris, the consultant
   ========================================================================= */
.nav-avatar{
  position:relative;display:inline-flex;width:36px;height:36px;border-radius:999px;
  overflow:hidden;background:var(--stone-3);box-shadow:0 0 0 1px var(--line);
  flex-shrink:0;
}
.nav-avatar img{width:100%;height:100%;object-fit:cover;display:block;filter:contrast(1.02)}
.nav-avatar-dot{
  position:absolute;right:0;bottom:0;width:8px;height:8px;border-radius:50%;
  background:var(--green);box-shadow:0 0 0 2px var(--stone);
  animation:pulse-dot 2.2s ease-in-out infinite;
}

.hero-signoff{
  margin-top:36px;
  padding-top:24px;
  border-top:1px solid var(--line-soft);
  display:grid;
  grid-template-columns:64px 1fr;
  gap:18px;
  align-items:start;
}
.hero-signoff-avatar{
  width:64px;height:64px;border-radius:50%;overflow:hidden;
  background:var(--stone-3);box-shadow:0 0 0 1px var(--line), 0 8px 24px -14px rgba(0,0,0,0.35);
  flex-shrink:0;
}
.hero-signoff-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.hero-signoff-eyebrow{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:4px}
.hero-signoff-name{font-family:var(--serif);font-size:18px;color:var(--ink);letter-spacing:-.008em;line-height:1.2}
.hero-signoff-meta{color:var(--ink-muted);font-family:var(--serif);font-size:15px;font-style:italic}
.hero-signoff-line{
  margin-top:6px;font-family:var(--serif);font-size:15px;font-style:italic;
  color:var(--ink-2);max-width:48ch;line-height:1.35;
}

/* About / Credentials personal intro */
.about-intro{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:56px;
  align-items:start;
  padding-bottom:64px;
  margin-bottom:64px;
  border-bottom:1px solid var(--line);
  position:relative;
}
.about-intro::before{
  /* tiny corner crop marks for editorial feel */
  content:"";position:absolute;left:0;top:-12px;width:14px;height:1px;background:var(--copper);
}
.about-portrait{position:relative;display:flex;flex-direction:column;gap:14px}
.about-portrait img{
  width:100%;aspect-ratio:1/1;object-fit:cover;
  filter:grayscale(1) contrast(1.04);
  background:var(--stone-3);
  border:1px solid var(--ink);
  border-radius:2px;
  box-shadow:0 24px 60px -36px rgba(0,0,0,0.55), 0 6px 18px -10px rgba(0,0,0,0.2);
  transition:filter .6s var(--ease-soft), transform .6s var(--ease-soft);
}
.about-portrait:hover img{filter:grayscale(0) contrast(1.02);transform:translateY(-2px)}
.about-portrait-meta{display:flex;flex-direction:column;gap:2px;padding-top:4px}
.about-portrait-meta .mono{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.about-portrait-sub{color:var(--ink-muted) !important}
.about-copy{display:flex;flex-direction:column;gap:18px;max-width:64ch}
.about-headline{
  font-family:var(--serif);font-size:64px;line-height:1;letter-spacing:-.025em;
  margin-top:8px;text-wrap:balance;
}
.about-lede{font-size:18px;line-height:1.55;color:var(--ink-2);max-width:58ch}
.about-lede-sub{font-size:16.5px;color:var(--ink-2)}
.about-credentials-row{
  display:grid;grid-template-columns:1fr 1fr;gap:10px 28px;
  margin-top:14px;padding-top:18px;border-top:1px solid var(--line-soft);
}
.about-credential{display:flex;gap:12px;font-size:13.5px;color:var(--ink-2);align-items:baseline}
.about-credential .mono{font-size:10px;color:var(--copper);letter-spacing:.14em}

/* Footer sign-off */
.footer-signoff{
  display:grid;grid-template-columns:54px 1fr;gap:18px;align-items:center;
  padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,0.06);
}
.footer-avatar{width:54px;height:54px;border-radius:50%;overflow:hidden;background:rgba(255,255,255,0.06);box-shadow:0 0 0 1px rgba(255,255,255,0.1)}
.footer-avatar img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) contrast(1.1)}
.footer-sig{display:block;margin-top:6px;font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(242,238,230,0.55)}

@media (max-width:900px){
  .about-intro{grid-template-columns:1fr;gap:32px;padding-bottom:40px;margin-bottom:40px}
  .about-portrait{max-width:220px}
  .about-headline{font-size:44px}
  .about-credentials-row{grid-template-columns:1fr}
  .hero-signoff{grid-template-columns:48px 1fr}
  .hero-signoff-avatar{width:48px;height:48px}
}

/* =========================================================================
   HERO PHOTO BACKDROP
   ========================================================================= */
.hero-photo{
  position:relative;width:100%;height:460px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#0f1213;
  box-shadow:inset 0 0 80px rgba(0,0,0,0.5);
}
.hero-photo img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center 60%;
  filter:grayscale(.45) contrast(1.06) brightness(.78) sepia(.18);
  mix-blend-mode:luminosity;
  opacity:.95;
  animation:hero-photo-in 1.6s var(--ease-soft) forwards;
  transform:scale(1.04);
}
@keyframes hero-photo-in{
  0%{opacity:0;transform:scale(1.1)}
  100%{opacity:.95;transform:scale(1.04)}
}
.hero-photo::after{
  /* warm tonal wash to bring photo into the stone palette */
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(135deg, rgba(242,238,230,0.18), rgba(139,90,60,0.10) 60%, rgba(22,25,26,0.45)),
    radial-gradient(ellipse at 30% 30%, rgba(255,255,255,0.08), transparent 60%);
  mix-blend-mode:soft-light;
  pointer-events:none;
}
.hero-photo-grain{
  position:absolute;inset:0;pointer-events:none;opacity:.18;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxNjAnIGhlaWdodD0nMTYwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjkyJyBudW1PY3RhdmVzPScyJyBzdGl0Y2hUaWxlcz0nc3RpdGNoJy8+PC9maWx0ZXI+PHJlY3Qgd2lkdGg9JzEwMCUnIGhlaWdodD0nMTAwJScgZmlsdGVyPSd1cmwoI24pJy8+PC9zdmc+");
}
.hero-photo-caption{
  position:absolute;left:14px;bottom:12px;
  font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(242,238,230,0.72);
  padding:5px 9px;
  background:rgba(0,0,0,0.42);
  backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:2px;
  z-index:3;
}

/* =========================================================================
   MAGAZINE PLATE DIVIDER
   ========================================================================= */
.plate-divider{
  position:relative;
  background:var(--ink);
  padding:80px 0;
}
.plate-frame{
  position:relative;
  width:100%;
  max-width:1320px;
  margin:0 auto;
  padding:0 40px;
  aspect-ratio:21/9;
  overflow:visible;
}
.plate-img{
  position:absolute;left:40px;right:40px;top:0;bottom:0;
  width:calc(100% - 80px);height:100%;
  object-fit:cover;object-position:center;
  filter:grayscale(.85) contrast(1.08) brightness(.82) sepia(.12);
  will-change:transform;
  z-index:1;
}
.plate-vignette{
  position:absolute;left:40px;right:40px;top:0;bottom:0;pointer-events:none;
  background:
    radial-gradient(ellipse at center, transparent 30%, rgba(0,0,0,0.55) 95%),
    linear-gradient(180deg, rgba(0,0,0,0.18), transparent 30%, transparent 70%, rgba(0,0,0,0.25));
  z-index:2;
}
.plate-grain{
  position:absolute;left:40px;right:40px;top:0;bottom:0;pointer-events:none;
  opacity:.15;mix-blend-mode:overlay;z-index:2;
  background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxNjAnIGhlaWdodD0nMTYwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjkyJyBudW1PY3RhdmVzPScyJyBzdGl0Y2hUaWxlcz0nc3RpdGNoJy8+PC9maWx0ZXI+PHJlY3Qgd2lkdGg9JzEwMCUnIGhlaWdodD0nMTAwJScgZmlsdGVyPSd1cmwoI24pJy8+PC9zdmc+");
}

/* Plate metadata */
.plate-meta-top, .plate-meta-bottom{
  position:absolute;left:60px;right:60px;
  display:flex;justify-content:space-between;align-items:flex-end;
  color:rgba(242,238,230,0.78);
  z-index:4;
  pointer-events:none;
}
.plate-meta-top{top:20px;align-items:flex-start}
.plate-meta-bottom{bottom:20px;gap:24px;flex-wrap:wrap}
.plate-plate{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--copper-soft);
  border:1px solid rgba(176,122,85,0.45);
  padding:4px 10px;
  background:rgba(0,0,0,0.35);
  backdrop-filter:blur(4px);
}
.plate-loc{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(242,238,230,0.62)}
.plate-date{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(242,238,230,0.55);min-width:60px}
.plate-caption{
  font-family:var(--serif);
  font-style:italic;
  font-size:24px;
  line-height:1.2;
  letter-spacing:-.014em;
  color:var(--stone);
  flex:1;
  max-width:46ch;
  text-wrap:balance;
  text-shadow:0 1px 8px rgba(0,0,0,0.55);
}
.plate-credit{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(242,238,230,0.4);
  writing-mode:vertical-rl;transform:rotate(180deg);
  position:absolute;right:38px;bottom:24px;
}

/* L-shaped corner crops */
.plate-corner{
  position:absolute;width:18px;height:18px;border:1px solid var(--copper-soft);
  z-index:4;
}
.plate-tl{top:8px;left:48px;border-right:0;border-bottom:0}
.plate-tr{top:8px;right:48px;border-left:0;border-bottom:0}
.plate-bl{bottom:8px;left:48px;border-right:0;border-top:0}
.plate-br{bottom:8px;right:48px;border-left:0;border-top:0}

@media (max-width:900px){
  .plate-frame{padding:0 20px;aspect-ratio:4/5}
  .plate-img,.plate-vignette,.plate-grain{left:20px;right:20px;width:calc(100% - 40px)}
  .plate-meta-top,.plate-meta-bottom{left:34px;right:34px}
  .plate-caption{font-size:17px;max-width:32ch}
  .plate-credit{display:none}
  .plate-corner{display:none}
}

/* =========================================================================
   POV CARDS — restrained motion, hover reveals evidence
   ========================================================================= */
.pov-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.pov-grid > .reveal{background:var(--stone);height:100%}
.pov-card{
  position:relative;
  background:var(--stone);
  padding:36px 34px 32px;
  min-height:300px;
  height:100%;
  display:flex;flex-direction:column;gap:14px;
  transition:background .35s var(--ease-soft), transform .45s var(--ease-soft);
  overflow:hidden;
  cursor:default;
}
.pov-card::before{
  /* copper top-edge rule that wipes in on hover */
  content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--copper);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .55s var(--ease-soft);
}
.pov-card.is-active::before{transform:scaleX(1)}
.pov-card.is-active{background:#F5F1E8;transform:translateY(-2px)}

.pov-corner{
  position:absolute;width:10px;height:10px;
  border-color:var(--copper);opacity:0;
  transition:opacity .45s var(--ease-soft) .05s;
}
.pov-corner-tl{top:14px;left:14px;border-top:1px solid var(--copper);border-left:1px solid var(--copper)}
.pov-corner-br{bottom:14px;right:14px;border-bottom:1px solid var(--copper);border-right:1px solid var(--copper)}
.pov-card.is-active .pov-corner{opacity:1}

.pov-head{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.pov-num{
  font-family:var(--serif);font-style:italic;
  font-size:42px;line-height:1;letter-spacing:-.022em;color:var(--copper);
  transition:transform .5s var(--ease-soft);
}
.pov-card.is-active .pov-num{transform:translateX(-2px) rotate(-2deg)}
.pov-tag{
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-muted);display:inline-flex;align-items:center;gap:7px;
}
.pov-tag-dot{
  width:5px;height:5px;border-radius:50%;background:var(--ink-subtle);
  transition:background .35s ease, box-shadow .35s ease;
}
.pov-card.is-active .pov-tag-dot{
  background:var(--copper);
  box-shadow:0 0 0 3px rgba(139,90,60,0.15);
  animation:pulse-dot 1.8s ease-in-out infinite;
}

.pov-glyph{
  margin-top:4px;margin-bottom:6px;
  height:30px;display:flex;align-items:center;
  opacity:.85;
}
.pov-glyph .glyph{width:100%;max-width:200px;height:auto;display:block}

.pov-title{
  font-family:var(--serif);font-size:25px;line-height:1.18;letter-spacing:-.012em;
  color:var(--ink);max-width:26ch;text-wrap:balance;
}
.pov-body{
  color:var(--ink-muted);font-size:14.5px;line-height:1.55;
  max-height:0;opacity:0;
  transition:max-height .55s var(--ease-soft), opacity .35s var(--ease-soft) .1s, margin-top .3s ease;
  overflow:hidden;
}
@media (hover:none){
  .pov-body{max-height:none;opacity:1}
}
.pov-card.is-active .pov-body{max-height:200px;opacity:1;margin-top:2px}

/* Always-visible short body for non-hover state — render as fallback */
@media (hover:hover){
  .pov-card:not(.is-active) .pov-body{
    max-height:80px;
    opacity:.72;
    color:var(--ink-muted);
    /* truncate via line-clamp */
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  }
}

.pov-evidence{
  margin-top:auto;padding-top:18px;
  border-top:1px dashed var(--line);
  display:flex;align-items:flex-end;
  gap:14px;
  opacity:.55;
  transform:translateY(4px);
  transition:opacity .45s var(--ease-soft), transform .45s var(--ease-soft);
}
.pov-card.is-active .pov-evidence{opacity:1;transform:none}
.pov-stat{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pov-stat .stat-big{font-size:26px;color:var(--copper)}
.pov-stat-label{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted)}

.pov-rule{
  position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--copper);
  transition:width .8s var(--ease-soft);
}
.pov-card.is-active .pov-rule{width:100%}

/* Glyph animations */
.alarm-ring{transform-origin:center;opacity:0}
.alarm-ring.on{animation:alarm-ring 1.6s ease-out infinite}
@keyframes alarm-ring{
  0%{transform:scale(.85);opacity:.85}
  100%{transform:scale(1.35);opacity:0}
}
.mem-dot{opacity:.25;transition:opacity .35s ease}
.mem-dot.on{animation:mem-drift 2.6s ease-in-out infinite}
@keyframes mem-drift{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-1.5px)}
}
.night-dot.on{filter:drop-shadow(0 0 4px rgba(122,180,138,0.6))}

@media (max-width:900px){
  .pov-grid{grid-template-columns:1fr}
  .pov-card{padding:28px 26px}
}

/* =========================================================================
   FLYWHEEL ORBIT
   ========================================================================= */
.fw-layout{
  display:grid;
  grid-template-columns:320px 1fr;
  gap:32px;
  align-items:stretch;
}
.fw-list{display:flex;flex-direction:column;gap:6px}
.fw-list-item{
  position:relative;
  text-align:left;
  padding:18px 18px 18px 26px;
  cursor:pointer;
  background:var(--stone);
  color:var(--ink);
  border:1px solid var(--line);
  display:flex;flex-direction:column;gap:6px;
  transition:background .25s var(--ease-soft), color .25s, border-color .25s, transform .35s var(--ease-soft);
  overflow:hidden;
}
.fw-list-item:hover{border-color:var(--ink-muted)}
.fw-list-item.on{background:var(--ink);color:var(--stone);border-color:var(--ink);transform:translateX(4px)}

/* a vertical copper pip on the left edge — animates when active */
.fw-list-pip{
  position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--copper);
  transform:scaleY(0);transform-origin:top center;
  transition:transform .5s var(--ease-soft);
}
.fw-list-item.on .fw-list-pip{transform:scaleY(1)}

.fw-list-id{font-size:10px;letter-spacing:.16em;color:var(--copper)}
.fw-list-item.on .fw-list-id{color:var(--copper-soft)}
.fw-list-text{display:flex;flex-direction:column;gap:3px}
.fw-list-t{font-family:var(--serif);font-size:21px;line-height:1;letter-spacing:-.012em}
.fw-list-b{font-size:12.5px;opacity:.75;line-height:1.45}
.fw-list-foot{
  margin-top:8px;display:flex;justify-content:space-between;align-items:center;
  padding:10px 14px;border:1px dashed var(--line);background:var(--stone-2);
}
.fw-list-foot .mono{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}
.fw-cycle{font-size:14px;color:var(--copper)}

/* Orbit canvas */
.fw-orbit-wrap{
  position:relative;
  background:radial-gradient(circle at 50% 40%, #FAF6EC 0%, var(--stone) 65%);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:20px 20px 24px;
  display:flex;flex-direction:column;align-items:stretch;
  overflow:hidden;
}
.fw-orbit-wrap::before{
  /* fine grid behind the orbit */
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.45;
  background-image:
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:radial-gradient(circle at 50% 45%, black 0%, transparent 75%);
}
.fw-orbit{display:block;width:100%;height:auto;max-height:520px;position:relative;z-index:1}

/* Rim drawing animation — runs on key change (rerenders) */
.fw-rim-draw{
  animation:fw-rim-draw 1.6s var(--ease-soft) forwards;
}
@keyframes fw-rim-draw{
  to{stroke-dashoffset:0}
}
.fw-rim-spin{
  transform-origin:center center;
  animation:fw-spin 60s linear infinite;
}
@keyframes fw-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Core */
.fw-core{
  filter:drop-shadow(0 4px 14px rgba(22,25,26,0.06));
  opacity:0;
  animation:fw-fade-in .55s var(--ease-soft) .2s forwards;
}
@keyframes fw-fade-in{to{opacity:1}}
.fw-core-id{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  fill:var(--copper);opacity:0;animation:fw-fade-in .5s var(--ease-soft) .4s forwards;
}
.fw-core-t{
  font-family:var(--serif);font-style:italic;
  font-size:28px;letter-spacing:-.014em;
  fill:var(--ink);opacity:0;animation:fw-fade-in .5s var(--ease-soft) .55s forwards;
}
.fw-core-sub{
  font-family:var(--mono);font-size:9px;letter-spacing:.32em;
  fill:var(--ink-muted);opacity:0;animation:fw-fade-in .5s var(--ease-soft) .75s forwards;
}

/* Photons */
.fw-photon{opacity:0;animation:fw-fade-in .4s ease 1.4s forwards}

/* Inputs animating in from the left */
.fw-in{opacity:0;animation:fw-in 0.55s var(--ease-soft) forwards}
.fw-in-path{
  stroke-dasharray:200;stroke-dashoffset:200;
  animation:fw-line-draw 0.75s var(--ease-soft) forwards;
}
@keyframes fw-in{
  0%{opacity:0;transform:translateX(-14px)}
  100%{opacity:1;transform:translateX(0)}
}
.fw-in-label{
  font-family:var(--sans);font-size:11px;
  fill:var(--ink-2);
}

/* Outputs animating out to the right */
.fw-out{opacity:0;animation:fw-out 0.55s var(--ease-soft) forwards}
.fw-out-path{
  stroke-dasharray:200;stroke-dashoffset:200;
  animation:fw-line-draw 0.75s var(--ease-soft) forwards;
}
@keyframes fw-out{
  0%{opacity:0;transform:translateX(14px)}
  100%{opacity:1;transform:translateX(0)}
}
.fw-out-label{
  font-family:var(--sans);font-size:11px;font-weight:500;
  fill:var(--green);
}
@keyframes fw-line-draw{to{stroke-dashoffset:0}}

/* Cap labels */
.fw-cap{
  font-family:var(--mono);font-size:9px;letter-spacing:.28em;
  fill:var(--ink-muted);
  opacity:0;animation:fw-fade-in .5s var(--ease-soft) .95s forwards;
}
.fw-cap-read{fill:var(--steel)}
.fw-cap-prod{fill:var(--green)}

/* Bottom strip */
.fw-orbit-foot{
  margin-top:14px;padding-top:16px;
  border-top:1px solid var(--line-soft);
  display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  z-index:2;position:relative;
}
.fw-fix-label{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--copper);margin-bottom:6px}
.fw-fix-text{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--ink);line-height:1.2;max-width:42ch}
.fw-foot-link{font-size:12px;color:var(--ink)}

@media (max-width:980px){
  .fw-layout{grid-template-columns:1fr}
  .fw-orbit{max-height:440px}
}

/* =========================================================================
   ENGAGEMENT STAGES (Services rewrite)
   ========================================================================= */
.engage-stack{display:flex;flex-direction:column;gap:8px;border-top:1px solid rgba(242,238,230,0.12)}
.engage-row{
  display:grid;grid-template-columns:120px 1fr;gap:0;
  padding:32px 0 30px;
  border-bottom:1px solid rgba(242,238,230,0.08);
  position:relative;
  transition:background .35s var(--ease-soft);
}
.engage-row:hover{background:rgba(255,255,255,0.018)}
.engage-row:hover .engage-rule{transform:scaleY(1)}
.engage-gutter{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding-top:6px}
.engage-n{
  font-family:var(--serif);font-style:italic;
  font-size:48px;line-height:1;letter-spacing:-.022em;
  color:var(--copper-soft);
}
.engage-rule{
  position:absolute;left:0;top:60px;bottom:0;
  width:1px;background:linear-gradient(180deg,var(--copper-soft),transparent);
  transform:scaleY(0);transform-origin:top center;
  transition:transform .65s var(--ease-soft);
}
.engage-body{display:flex;flex-direction:column;gap:14px;max-width:78ch}
.engage-head{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap}
.engage-t{font-family:var(--serif);font-size:38px;color:var(--stone);letter-spacing:-.018em;line-height:1}
.engage-time{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper-soft)}
.engage-lead{font-size:16px;line-height:1.55;color:rgba(242,238,230,0.78);max-width:62ch}
.engage-out{
  display:grid;grid-template-columns:90px 1fr;gap:18px;
  padding:14px 16px;
  border:1px solid rgba(242,238,230,0.1);
  background:rgba(0,0,0,0.18);
  border-radius:3px;
  align-items:start;
}
.engage-out-label{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper-soft);padding-top:4px}
.engage-out ul{
  margin:0;padding:0;list-style:none;
  display:flex;flex-wrap:wrap;gap:8px 18px;
}
.engage-out li{
  font-size:13px;color:var(--stone);position:relative;padding-left:14px;line-height:1.4;
}
.engage-out li::before{
  content:"";position:absolute;left:0;top:8px;
  width:5px;height:5px;background:var(--copper-soft);border-radius:50%;
}
@media (max-width:780px){
  .engage-row{grid-template-columns:1fr}
  .engage-gutter{flex-direction:row;align-items:center;gap:14px}
  .engage-rule{display:none}
  .engage-t{font-size:30px}
}

/* =========================================================================
   OFFER — ANIMATED CLOSING SECTION
   ========================================================================= */
.offer-section{position:relative;overflow:hidden}
.offer-grid-bg{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(242,238,230,0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,238,230,0.018) 1px, transparent 1px);
  background-size:64px 64px;
  background-position:-1px -1px;
  mask-image:radial-gradient(ellipse at 70% 30%, rgba(0,0,0,0.6), transparent 70%);
  z-index:1;
  animation:offer-grid-drift 80s linear infinite;
}
@keyframes offer-grid-drift{
  from{background-position:0 0, 0 0}
  to{background-position:64px 64px, 64px 64px}
}

.offer-head{
  display:grid;grid-template-columns:1.1fr 0.9fr;gap:64px;
  margin-top:18px;margin-bottom:48px;align-items:end;
}
.offer-headline{
  color:var(--stone);font-size:78px;letter-spacing:-0.024em;line-height:0.96;
  max-width:18ch;
}
.offer-head-side{display:flex;flex-direction:column;gap:24px}
.offer-head-copy{font-size:17px;line-height:1.55;color:rgba(242,238,230,0.72);max-width:54ch}

.offer-availability{
  display:flex;flex-direction:column;gap:10px;
  padding:14px 16px;border:1px solid rgba(242,238,230,0.12);
  background:rgba(0,0,0,0.18);
}
.offer-availability-bar{display:flex;gap:6px}
.offer-slot{
  flex:1;height:6px;border-radius:1px;
  background:rgba(242,238,230,0.12);
}
.offer-slot.is-taken{background:linear-gradient(90deg,rgba(242,238,230,0.28),rgba(242,238,230,0.12))}
.offer-slot.is-open{
  background:linear-gradient(90deg, var(--copper), var(--copper-bright));
  box-shadow:0 0 8px rgba(198,132,88,0.45);
}
.offer-availability-text{
  display:flex;justify-content:space-between;gap:14px;
  font-size:10px !important;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(242,238,230,0.6) !important;flex-wrap:wrap;
}

/* Three doors */
.offer-doors{
  display:grid;grid-template-columns:0.85fr 1.3fr 0.85fr;gap:16px;
  margin-bottom:64px;
}
.offer-door{
  position:relative;
  border:1px solid rgba(242,238,230,0.14);
  background:rgba(255,255,255,0.018);
  padding:24px 24px 26px;
  display:flex;flex-direction:column;gap:14px;
  transition:transform .5s var(--ease-soft), border-color .35s ease, background .35s ease;
  opacity:0;
  animation:offer-door-in .6s var(--ease-soft) forwards;
}
.offer-door-1{animation-delay:.15s}
.offer-door-2{animation-delay:.3s}
.offer-door-3{animation-delay:.45s}
@keyframes offer-door-in{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}
.offer-door:hover{border-color:rgba(242,238,230,0.28);transform:translateY(-3px)}
.offer-door.is-anchor{
  border-color:rgba(176,122,85,0.5);
  background:linear-gradient(180deg, rgba(176,122,85,0.08), rgba(176,122,85,0.02));
  box-shadow:0 24px 60px -36px rgba(176,122,85,0.5);
}
.offer-door.is-anchor:hover{
  border-color:var(--copper-bright);
  box-shadow:0 32px 80px -36px rgba(176,122,85,0.6);
}
.offer-door-anchor-tag{
  position:absolute;top:-11px;left:22px;
  background:var(--copper);color:var(--panel);
  font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;
  padding:4px 11px;text-transform:uppercase;
  box-shadow:0 4px 12px -2px rgba(176,122,85,0.5);
}
.offer-door-corner{
  position:absolute;width:14px;height:14px;
  border-color:var(--copper-soft);opacity:0;
  transition:opacity .35s ease;
}
.offer-door-corner-tl{top:8px;left:8px;border-top:1px solid;border-left:1px solid}
.offer-door-corner-br{bottom:8px;right:8px;border-bottom:1px solid;border-right:1px solid}
.offer-door:hover .offer-door-corner{opacity:1}

.offer-door-eyebrow{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(242,238,230,0.5);
}
.offer-door-title{
  font-family:var(--serif);font-size:32px;line-height:1;letter-spacing:-0.015em;
  color:var(--stone);
}
.offer-door-title.is-big{font-size:42px;letter-spacing:-0.022em;line-height:0.98}
.offer-door-price{
  font-size:10.5px;letter-spacing:.1em;color:var(--copper-soft);
}
.offer-door-price.is-bright{color:var(--copper-bright);font-size:11.5px;letter-spacing:.12em}
.offer-door-body{
  font-size:13px;color:rgba(242,238,230,0.65);line-height:1.55;flex:1;
}
.offer-door-body.is-bright{color:rgba(242,238,230,0.82);font-size:13.5px}
.offer-door-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:4px}
.offer-door-chip{
  font-size:9px;padding:6px 6px;
  border:1px solid rgba(242,238,230,0.15);color:rgba(242,238,230,0.55);
  letter-spacing:.1em;text-transform:uppercase;text-align:center;
  transition:border-color .25s ease, color .25s ease;
}
.offer-door-chip:hover{border-color:var(--copper-soft);color:var(--copper-soft)}
.offer-door-cta{
  margin-top:10px;font-size:11px !important;letter-spacing:.14em;text-transform:uppercase;
  color:var(--copper) !important;
  border-top:1px solid rgba(242,238,230,0.12);
  padding-top:14px;
  display:inline-flex;align-items:center;justify-content:space-between;
}
.offer-cta-arrow{display:inline-block;transition:transform .25s var(--ease-soft)}
.offer-door-cta:hover .offer-cta-arrow{transform:translateX(4px)}
.offer-door-typical{
  font-family:var(--mono);font-size:10px;color:rgba(242,238,230,0.5);
  letter-spacing:.08em;line-height:1.6;display:flex;flex-direction:column;gap:2px;
  margin-top:auto;padding-top:12px;
}
.offer-door-typical-val{
  color:var(--stone);font-size:14px;font-family:var(--serif);letter-spacing:-.008em;
}

/* Trust gauge inside Door 2 */
.offer-trust-gauge{
  margin-top:auto;padding-top:18px;
  display:flex;flex-direction:column;gap:8px;
  border-top:1px dashed rgba(176,122,85,0.35);
}
.offer-trust-head{
  display:flex;justify-content:space-between;align-items:baseline;
  font-size:9.5px !important;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(242,238,230,0.55) !important;
}
.offer-trust-week{color:var(--copper-bright) !important;font-size:10.5px !important}
.offer-trust-track{
  position:relative;height:8px;background:rgba(242,238,230,0.08);border-radius:99px;overflow:hidden;
}
.offer-trust-fill{
  display:block;height:100%;
  background:linear-gradient(90deg, rgba(176,122,85,0.65), var(--copper-bright));
  border-radius:99px;
  transition:width 1s var(--ease-soft);
  box-shadow:0 0 12px rgba(198,132,88,0.45);
}
.offer-trust-baseline{
  position:absolute;left:6.66%;top:-2px;bottom:-2px;width:1px;
  background:rgba(242,238,230,0.45);
}
.offer-trust-foot{
  display:flex;justify-content:space-between;align-items:baseline;
  font-size:9.5px !important;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(242,238,230,0.4) !important;
}
.offer-trust-val{
  font-family:var(--serif) !important;font-size:28px !important;
  color:var(--stone) !important;
  letter-spacing:-.02em !important;text-transform:none !important;
  line-height:1;
}

/* Timeline / week ribbon */
.offer-timeline-wrap{
  border:1px solid rgba(242,238,230,0.18);
  background:rgba(255,255,255,0.025);
  position:relative;
  margin-bottom:32px;
}
.offer-timeline-head{
  display:flex;justify-content:space-between;align-items:center;gap:24px;
  padding:18px 28px;border-bottom:1px solid rgba(242,238,230,0.1);flex-wrap:wrap;
}
.offer-timeline-legend{
  display:inline-flex;align-items:center;gap:10px;
  font-size:10px !important;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(242,238,230,0.7) !important;
}
.offer-legend-dot{width:7px;height:7px;border-radius:50%;display:inline-block;
  box-shadow:0 0 0 4px rgba(198,132,88,0.18);
}

.offer-stat-strip{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-bottom:1px solid rgba(242,238,230,0.12);
}
.offer-stat{padding:22px 28px;border-right:1px solid rgba(242,238,230,0.1);display:flex;flex-direction:column;gap:8px}
.offer-stat:last-child{border-right:0}
.offer-stat.is-accent{background:rgba(176,122,85,0.1)}
.offer-stat-key{
  font-size:10px !important;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(242,238,230,0.5) !important;
}
.offer-stat-val{font-family:var(--serif);font-size:36px;color:var(--stone);line-height:1;letter-spacing:-.02em}
.offer-stat-val.is-small{font-size:22px;line-height:1.18}
.offer-stat-val.is-tiny{font-size:16px;line-height:1.3;color:var(--stone)}
.offer-stat-foot{
  font-size:10px !important;letter-spacing:.06em;color:rgba(242,238,230,0.5) !important;
}

/* Week ribbon */
.offer-ribbon{padding:28px 28px 36px;position:relative}
.offer-ribbon-track{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;
}
.offer-ribbon-line{
  position:absolute;left:0;right:0;top:14px;height:1px;
  background:rgba(242,238,230,0.12);z-index:0;
}
.offer-ribbon-line-fill{
  display:block;height:100%;background:var(--copper-bright);
  transition:width .55s var(--ease-soft);
  box-shadow:0 0 8px rgba(198,132,88,0.4);
}
.offer-week{
  position:relative;z-index:1;
  text-align:left;
  display:flex;flex-direction:column;gap:8px;
  padding:0 16px 0 0;
  cursor:pointer;
  transition:padding .35s var(--ease-soft);
}
.offer-week-marker{
  position:relative;width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;
  background:var(--panel);border:1px solid rgba(242,238,230,0.2);border-radius:50%;
  margin-bottom:6px;
  transition:border-color .35s ease, transform .35s var(--ease-soft);
}
.offer-week-marker-dot{
  width:8px;height:8px;border-radius:50%;background:rgba(242,238,230,0.2);
  transition:background .35s ease, transform .35s var(--ease-soft);
}
.offer-week.is-past .offer-week-marker{border-color:var(--copper-soft)}
.offer-week.is-past .offer-week-marker-dot{background:var(--copper-soft)}
.offer-week.is-active .offer-week-marker{
  border-color:var(--copper-bright);
  box-shadow:0 0 0 6px rgba(198,132,88,0.14);
  transform:scale(1.08);
}
.offer-week.is-active .offer-week-marker-dot{
  background:var(--copper-bright);transform:scale(1.2);
}

.offer-week-key{
  font-size:10px !important;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(242,238,230,0.5);transition:color .3s ease;
}
.offer-week.is-active .offer-week-key{color:var(--copper-bright)}
.offer-week-title{
  font-family:var(--serif);font-size:19px;color:rgba(242,238,230,0.55);line-height:1.1;
  letter-spacing:-.012em;transition:color .3s ease;
}
.offer-week.is-active .offer-week-title,
.offer-week:hover .offer-week-title{color:var(--stone)}
.offer-week-body{
  font-size:12.5px;color:rgba(242,238,230,0.45);line-height:1.5;max-width:30ch;
  transition:color .3s ease;
}
.offer-week.is-active .offer-week-body{color:rgba(242,238,230,0.75)}
.offer-week-metric{
  display:inline-flex;align-items:baseline;gap:10px;
  padding-top:10px;margin-top:auto;
  border-top:1px dashed rgba(242,238,230,0.12);
  font-size:9.5px !important;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(242,238,230,0.4) !important;
}
.offer-week-metric-val{
  font-family:var(--serif) !important;font-size:22px !important;
  color:rgba(242,238,230,0.55);text-transform:none !important;letter-spacing:-.012em !important;
  transition:color .3s ease;
}
.offer-week.is-active .offer-week-metric-val{color:var(--copper-bright)}

/* Deliverables strip */
.offer-deliverables{
  border-top:1px solid rgba(242,238,230,0.12);
  padding:22px 28px;background:rgba(0,0,0,0.22);
}
.offer-deliverables-head{
  font-size:10px !important;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(242,238,230,0.5) !important;margin-bottom:14px;
}
.offer-deliverables ul{
  margin:0;padding:0;list-style:none;
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;
}
.offer-deliverable{
  display:grid;grid-template-columns:24px 1fr 22px;gap:10px;align-items:start;
  font-size:13px;color:var(--stone);line-height:1.45;
  padding:8px 0;
  opacity:0;transform:translateX(-6px);
  animation:offer-deliverable-in .55s var(--ease-soft) forwards;
}
@keyframes offer-deliverable-in{to{opacity:1;transform:translateX(0)}}
.offer-deliverable:nth-child(1){animation-delay:0.2s}
.offer-deliverable:nth-child(2){animation-delay:0.32s}
.offer-deliverable:nth-child(3){animation-delay:0.44s}
.offer-deliverable:nth-child(4){animation-delay:0.56s}
.offer-deliverable-num{
  font-family:var(--serif) !important;font-size:14px !important;
  color:var(--copper-soft) !important;text-transform:none !important;
  letter-spacing:-.005em !important;padding-top:1px;
}
.offer-deliverable-check svg{display:block}

/* Booking row */
.offer-booking{
  margin-top:8px;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding-top:28px;border-top:1px solid rgba(242,238,230,0.12);
}
.offer-booking-status{
  display:inline-flex;align-items:center;gap:10px;margin-right:auto;
}
.offer-booking-status .mono{
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(242,238,230,0.55);
}
.offer-booking-dot{
  width:7px;height:7px;border-radius:50%;background:var(--copper-bright);
  box-shadow:0 0 0 4px rgba(198,132,88,0.2);
}
.offer-booking-mail{border:1px solid rgba(242,238,230,0.3);color:var(--stone)}
.offer-booking-mail:hover{background:rgba(242,238,230,0.06)}

@media (max-width:1080px){
  .offer-doors{grid-template-columns:1fr;gap:14px}
  .offer-head{grid-template-columns:1fr;gap:24px}
  .offer-headline{font-size:54px}
  .offer-stat-strip{grid-template-columns:repeat(2,1fr)}
  .offer-stat:nth-child(2){border-right:0}
  .offer-stat:nth-child(1),.offer-stat:nth-child(2){border-bottom:1px solid rgba(242,238,230,0.1)}
  .offer-ribbon-track{grid-template-columns:1fr;gap:18px}
  .offer-ribbon-line{display:none}
  .offer-deliverables ul{grid-template-columns:1fr}
}
.exp-ownership{
  display:grid;grid-template-columns:1fr 2fr 1fr;gap:32px;
  align-items:start;
  padding:24px 28px;
  border:1px solid var(--ink);
  background:linear-gradient(180deg, rgba(139,90,60,0.045), rgba(139,90,60,0));
  margin-bottom:48px;
  position:relative;
}
.exp-ownership::before{
  content:"";position:absolute;left:-1px;top:-1px;width:54px;height:1px;background:var(--copper);
}
.exp-ownership-meta{display:flex;flex-direction:column;gap:8px;padding-top:2px}
.exp-ownership-label{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper)}
.exp-ownership-count{font-family:var(--serif) !important;font-size:34px !important;letter-spacing:-.022em !important;color:var(--ink) !important;line-height:1;text-transform:none !important}
.exp-ownership-copy{
  font-family:var(--serif);font-size:21px;line-height:1.32;color:var(--ink);
  letter-spacing:-.008em;max-width:50ch;
}
.exp-ownership-copy .emph{color:var(--copper)}
.exp-ownership-foot{
  font-size:11px !important;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);
  line-height:1.5;padding-top:6px;border-top:1px solid var(--line-soft);
}
@media (max-width:980px){
  .exp-ownership{grid-template-columns:1fr;gap:18px}
  .exp-ownership-foot{padding-top:14px}
}

/* Origin block — the "seen at" field journal entry */
.exp-origin{
  display:grid;grid-template-columns:74px 1fr;gap:14px;
  padding:14px 16px;
  background:rgba(22,25,26,0.025);
  border-left:2px solid var(--copper);
  margin-top:6px;
  align-items:start;
}
.exp-origin-tag{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper);
  padding-top:4px;
}
.exp-origin-text{
  font-family:var(--serif);font-style:italic;font-size:15.5px;line-height:1.45;
  color:var(--ink-2);letter-spacing:-.005em;text-wrap:pretty;
}

/* Real-problem tag — copper variant */
.exp-tag-real{
  border-color:var(--copper) !important;color:var(--copper) !important;
  background:rgba(139,90,60,0.06);
}
.exp-tag-real .live-dot{box-shadow:0 0 0 4px rgba(139,90,60,0.18)}

/* =========================================================================
   ESSAYS — THE READING ROOM
   ========================================================================= */
.essays-section{position:relative}
.essays-room{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);
  gap:32px;
  border-top:1px solid var(--ink);
  padding-top:32px;
  align-items:start;
}

/* Featured manuscript card */
.essays-feature{
  position:relative;
  display:flex;flex-direction:column;gap:18px;
  padding:0;
}
.essays-feature-head{
  display:flex;justify-content:space-between;align-items:center;gap:18px;
  padding-bottom:18px;border-bottom:1px solid var(--line-soft);
  flex-wrap:wrap;
}
.essays-feature-meta{display:inline-flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.essays-feature-meta .mono{font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.essays-feature-cat{color:var(--copper) !important;font-size:10.5px !important}
.essays-feature-min{color:var(--ink-muted) !important;font-size:10.5px !important}

.essays-live{display:inline-flex;align-items:center;gap:9px}
.essays-live-dot{
  width:7px;height:7px;border-radius:50%;background:var(--green);
  box-shadow:0 0 0 4px rgba(46,74,58,0.14);
}
.essays-live .mono{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted)}

.essays-manuscript{
  position:relative;
  display:grid;grid-template-columns:64px 1fr;gap:0;
  background:linear-gradient(180deg, #F7F2E5 0%, var(--stone) 100%);
  border:1px solid var(--line);
  padding:36px 36px 32px 0;
  animation:essays-feature-in .55s var(--ease-soft) both;
  overflow:hidden;
}
.essays-manuscript::before{
  /* faint paper grain */
  content:"";position:absolute;inset:0;pointer-events:none;
  opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyMDAnIGhlaWdodD0nMjAwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjg2JyBudW1PY3RhdmVzPScyJy8+PC9maWx0ZXI+PHJlY3Qgd2lkdGg9JzEwMCUnIGhlaWdodD0nMTAwJScgZmlsdGVyPSd1cmwoI24pJy8+PC9zdmc+");
}
.essays-manuscript-rail{
  border-right:1px solid var(--line-soft);
  padding:6px 12px 0 18px;
  display:flex;flex-direction:column;gap:18px;
  align-items:flex-end;
}
.essays-rail-num{
  font-size:9.5px;letter-spacing:.14em;color:var(--ink-subtle) !important;
  font-variant-numeric:tabular-nums;
}
.essays-manuscript-body{
  padding:0 0 0 36px;display:flex;flex-direction:column;gap:18px;
  position:relative;z-index:1;
}
.essay-glyph{width:80px;height:auto;display:block;margin-bottom:4px}

.essays-feature-title{
  font-family:var(--serif);font-size:40px;line-height:1.04;letter-spacing:-.018em;
  color:var(--ink);text-wrap:balance;max-width:24ch;
}
.essays-feature-open{
  font-family:var(--serif);font-size:22px;font-style:italic;
  line-height:1.42;letter-spacing:-.005em;color:var(--ink-2);
  margin:0;max-width:38ch;text-wrap:pretty;min-height:5em;
}
.essays-feature-drop{
  font-family:var(--serif);font-size:54px;line-height:0.85;
  float:left;color:var(--copper);font-style:normal;
  padding:6px 8px 0 0;letter-spacing:-.04em;
}
.type-stream{display:inline}
.type-caret{
  display:inline-block;color:var(--copper);font-style:normal;
  animation:essay-caret-blink 1.05s steps(1) infinite;margin-left:1px;
}
@keyframes essay-caret-blink{0%,49%{opacity:1}50%,100%{opacity:0}}

.essays-feature-body{
  font-size:14.5px;line-height:1.6;color:var(--ink-muted);max-width:54ch;
}
.essays-feature-foot{
  display:flex;justify-content:space-between;align-items:center;gap:18px;
  padding-top:18px;margin-top:6px;border-top:1px dashed var(--line);flex-wrap:wrap;
}
.essays-feature-progress{
  display:inline-flex;align-items:center;gap:10px;
  font-size:10px !important;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-muted) !important;
}
.essays-progress-track{
  display:inline-block;width:84px;height:2px;background:var(--line);position:relative;overflow:hidden;
}
.essays-progress-fill{
  display:block;width:0;height:100%;background:var(--copper);
  animation:essays-progress-tick 6.5s linear infinite;
}
@keyframes essays-progress-tick{
  0%{width:0}
  100%{width:42%}
}
.essays-feature-cta{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px !important;letter-spacing:.16em;text-transform:uppercase;
  color:var(--copper) !important;
  transition:gap .25s var(--ease-soft);
}
.essays-feature-cta:hover{gap:14px}

@keyframes essays-feature-in{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

/* Index column */
.essays-index{
  display:flex;flex-direction:column;gap:24px;
  position:sticky;top:88px;
}
.essays-index-head{
  display:flex;justify-content:space-between;align-items:baseline;
  padding-bottom:14px;border-bottom:1px solid var(--ink);
}
.essays-index-count{font-size:10px !important;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted) !important}

.essays-index-list{
  margin:0;padding:0;list-style:none;
  display:flex;flex-direction:column;
}
.essays-index-row{
  display:grid;grid-template-columns:48px 1fr 36px;gap:14px;
  padding:12px 0;border-top:1px solid var(--line-soft);
  cursor:pointer;align-items:center;
  transition:padding .25s var(--ease-soft), background .25s ease;
}
.essays-index-row:first-child{border-top:0}
.essays-index-row:hover{padding-left:6px;padding-right:6px;background:rgba(139,90,60,0.025)}
.essays-index-row.is-active{padding-left:6px;padding-right:6px}
.essays-row-num{
  font-size:10.5px;letter-spacing:.14em;color:var(--ink-subtle);
  transition:color .3s ease;
}
.essays-index-row.is-active .essays-row-num{color:var(--copper)}
.essays-row-body{display:flex;flex-direction:column;gap:4px}
.essays-row-title{
  font-family:var(--serif);font-size:16px;letter-spacing:-.005em;line-height:1.2;
  color:var(--ink-muted);transition:color .3s ease;text-wrap:balance;
}
.essays-index-row:hover .essays-row-title,
.essays-index-row.is-active .essays-row-title{color:var(--ink)}
.essays-row-meta{
  font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-subtle);
}
.essays-row-bar{display:block;width:32px;height:2px;background:var(--line);position:relative;overflow:hidden}
.essays-row-bar-fill{
  display:block;height:100%;width:0;background:var(--copper);
  transition:width .55s var(--ease-soft);
}
.essays-index-row.is-active .essays-row-bar-fill{width:100%}
.essays-index-row:hover .essays-row-bar-fill{width:50%}
.essays-index-row.is-active:hover .essays-row-bar-fill{width:100%}

/* Marginalia — "now drafting" notebook card */
.essays-margin{
  margin-top:8px;
  padding:18px 20px 20px;
  border:1px dashed var(--copper);
  background:rgba(139,90,60,0.04);
  display:flex;flex-direction:column;gap:10px;
  position:relative;
}
.essays-margin::before{
  content:"";position:absolute;top:-6px;left:18px;
  background:var(--stone);padding:0 8px;
}
.essays-margin-head{
  display:inline-flex;align-items:center;gap:10px;
  font-size:10px !important;letter-spacing:.16em;text-transform:uppercase;color:var(--copper);
}
.essays-margin-dot{
  width:7px;height:7px;border-radius:50%;background:var(--copper);
  box-shadow:0 0 0 4px rgba(139,90,60,0.18);
}
.essays-margin-text{
  font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.4;
  color:var(--ink-2);text-wrap:pretty;
}
.essays-margin-foot{
  font-size:9.5px !important;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-subtle) !important;padding-top:6px;border-top:1px solid rgba(139,90,60,0.18);
}

/* Teaching credentials band */
.essays-teach{
  display:flex;flex-direction:column;gap:0;
  padding-top:8px;
}
.essays-teach-row{
  display:grid;grid-template-columns:80px 1fr;gap:14px;
  padding:10px 0;border-top:1px solid var(--line-soft);
  font-size:13px;line-height:1.35;
}
.essays-teach-key{
  font-size:9.5px !important;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-subtle);
}
.essays-teach-val{color:var(--ink-2);font-family:var(--serif);font-size:15px;letter-spacing:-.005em}

@media (max-width:980px){
  .essays-room{grid-template-columns:1fr;gap:32px}
  .essays-index{position:relative;top:auto}
  .essays-manuscript{grid-template-columns:48px 1fr;padding:28px 24px 24px 0}
  .essays-manuscript-rail{padding-left:12px}
  .essays-manuscript-body{padding-left:24px}
  .essays-feature-title{font-size:30px}
  .essays-feature-open{font-size:18px;min-height:auto}
  .essays-feature-drop{font-size:42px}
}
.facet-section{position:relative;overflow:hidden}
.facet-section-head{
  display:grid;grid-template-columns:1fr 1fr;gap:64px;
  align-items:end;margin-bottom:64px;
}
.facet-headline{
  font-size:80px;line-height:0.96;letter-spacing:-0.025em;margin-top:18px;
  color:var(--ink);
}
.facet-section-intro{display:flex;flex-direction:column;gap:14px;max-width:50ch}
.facet-section-intro p{font-size:16.5px;line-height:1.55;color:var(--ink-2)}
.facet-section-intro-sub{color:var(--ink-muted) !important;font-size:15px !important}

.facet-wheel-layout{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:48px;align-items:stretch;
  border-top:1px solid var(--ink);
  padding-top:32px;
}

/* Wheel */
.facet-wheel{
  position:relative;width:100%;aspect-ratio:1/1;max-width:640px;
  margin:0 auto;
}
.facet-wheel-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.facet-wheel-meta{
  position:absolute;top:0;left:0;display:flex;align-items:baseline;gap:14px;
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted);
  z-index:2;
}
.facet-wheel-counter{font-family:var(--serif) !important;font-size:34px !important;
  letter-spacing:0 !important;text-transform:none !important;color:var(--ink) !important;
  line-height:1;
}
.facet-wheel-counter span{font-size:13px;color:var(--ink-subtle);margin-left:4px;font-family:var(--mono)}

.facet-vertex-halo{
  transform-box:fill-box;transform-origin:center;
  animation:facet-halo 2.4s ease-in-out infinite;
}
@keyframes facet-halo{
  0%,100%{opacity:.5;transform:scale(1)}
  50%{opacity:.15;transform:scale(1.25)}
}

/* Portrait at center */
.facet-portrait{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:31%;aspect-ratio:1/1;border-radius:50%;overflow:hidden;
  background:var(--stone-3);
  box-shadow:0 12px 38px -16px rgba(22,25,26,0.45),inset 0 0 0 1px rgba(22,25,26,0.08);
  z-index:1;
}
.facet-portrait img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.06);
  transition:filter .6s var(--ease-soft);
}
.facet-wheel:hover .facet-portrait img{filter:grayscale(0) contrast(1.02)}
.facet-portrait-ring{
  position:absolute;inset:-6px;border-radius:50%;
  border:1px solid var(--line);pointer-events:none;
}

/* Facet labels around the hex */
.facet-label{
  position:absolute;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;gap:3px;
  padding:6px 10px;background:transparent;
  text-align:center;cursor:pointer;
  min-width:128px;max-width:170px;
  transition:transform .35s var(--ease-soft);
  z-index:3;
}
.facet-label[data-anchor="left"]{text-align:left;transform:translate(0,-50%)}
.facet-label[data-anchor="right"]{text-align:right;transform:translate(-100%,-50%)}
.facet-label-roman{
  font-size:9.5px;letter-spacing:.22em;color:var(--ink-subtle);
  text-transform:uppercase;
  transition:color .4s ease;
}
.facet-label-name{
  font-family:var(--serif);font-size:21px;line-height:1.05;
  color:var(--ink-muted);letter-spacing:-0.012em;
  transition:color .4s ease;
}
.facet-label-disc{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;
  color:var(--ink-subtle);text-transform:uppercase;line-height:1.4;
  opacity:0;max-height:0;transition:opacity .35s ease,max-height .35s ease;
  overflow:hidden;
}
.facet-label.is-active .facet-label-roman{color:var(--copper)}
.facet-label.is-active .facet-label-name{color:var(--ink)}
.facet-label.is-active .facet-label-disc{opacity:1;max-height:32px}
.facet-label:hover .facet-label-name{color:var(--ink)}

/* Detail panel */
.facet-detail{
  display:flex;flex-direction:column;
  background:var(--stone);
  border:1px solid var(--line-soft);
  padding:28px 30px 24px;
  position:relative;min-height:520px;
}
.facet-detail::before{
  content:"";position:absolute;top:-1px;left:-1px;width:42px;height:1px;background:var(--copper);
}
.facet-detail-head{
  display:flex;align-items:center;justify-content:space-between;
  padding-bottom:18px;border-bottom:1px solid var(--line-soft);
  margin-bottom:24px;
}
.facet-detail-roman{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted);
}
.facet-detail-progress{display:flex;gap:6px}
.facet-tick{
  width:22px;height:2px;background:var(--line);border-radius:1px;
  transition:background .3s ease,width .3s ease;
}
.facet-tick.is-active{background:var(--copper);width:32px}
.facet-tick:hover{background:var(--ink-muted)}

.facet-detail-body{animation:facet-fadein .55s var(--ease-soft) both}
@keyframes facet-fadein{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}
.facet-detail-disc{
  font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--copper);margin-bottom:10px;
}
.facet-detail-title{
  font-family:var(--serif);font-size:44px;letter-spacing:-0.022em;line-height:1;
  color:var(--ink);margin-bottom:14px;
}
.facet-detail-tagline{
  font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.3;
  color:var(--ink-2);margin-bottom:18px;text-wrap:balance;
}
.facet-detail-body-copy{
  font-size:14.5px;line-height:1.6;color:var(--ink-muted);margin-bottom:24px;
  max-width:48ch;
}

.facet-evidence{margin-top:auto}
.facet-evidence-label{color:var(--ink-muted) !important;margin-bottom:10px}
.facet-evidence ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:0}
.facet-evidence-item{
  display:grid;grid-template-columns:18px 1fr auto;gap:12px;align-items:center;
  padding:10px 0;border-top:1px solid var(--line-soft);font-size:13px;
}
.facet-evidence-item:last-child{border-bottom:1px solid var(--line-soft)}
.facet-evidence-text{color:var(--ink)}
.facet-evidence-status{
  font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);
}

.facet-detail-foot{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:18px;margin-top:20px;border-top:1px solid var(--line-soft);
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted);
}
.facet-next{
  display:inline-flex;align-items:center;gap:8px;color:var(--copper);
  font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;
  transition:gap .25s ease;
}
.facet-next:hover{gap:12px}

/* Signature line — bio facts as one instrument reading */
.facet-signature{
  margin-top:64px;padding-top:32px;
  position:relative;
}
.facet-signature-rule{
  height:1px;background:var(--ink);width:100%;margin-bottom:24px;
}
.facet-signature-row{
  display:grid;grid-template-columns:repeat(6,1fr);gap:24px;
  padding-bottom:28px;border-bottom:1px solid var(--line-soft);
  margin-bottom:32px;
}
.facet-signature-cell{display:flex;flex-direction:column;gap:6px}
.facet-signature-key{
  font-family:var(--serif);font-size:22px;color:var(--ink);line-height:1.05;
  letter-spacing:-0.012em;
}
.facet-signature-val{
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);
  line-height:1.4;
}
.facet-signature-quote{max-width:34ch}

@media (max-width:1100px){
  .facet-wheel-layout{grid-template-columns:1fr;gap:40px}
  .facet-wheel{max-width:560px}
  .facet-signature-row{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  .facet-section-head{grid-template-columns:1fr;gap:24px;margin-bottom:40px}
  .facet-headline{font-size:48px}
  .facet-wheel{max-width:420px}
  .facet-label{min-width:96px;max-width:120px}
  .facet-label-name{font-size:15px}
  .facet-label-disc{display:none}
  .facet-detail{padding:24px 22px}
  .facet-detail-title{font-size:34px}
  .facet-signature-row{grid-template-columns:repeat(2,1fr)}
}

/* Mobile */
@media (max-width:900px){
  .container{padding:0 24px}
  .section-pad{padding:80px 0}
  .section-head{flex-direction:column;align-items:flex-start;gap:20px;margin-bottom:36px}
  .section-head h2{font-size:38px}
  .pullquote{font-size:30px}
}


/* =========================================================================
   V3 STYLES — additions for sections-a-v3, sections-b-v3, experiments-v3
   Keeps v2 styles intact; loads additively.
   ========================================================================= */

/* -------------------- NAV V3 -------------------- */
.nav-v3{
  position:sticky;top:0;z-index:50;
  background:rgba(242,238,230,0.88);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line-soft);
}
.nav-v3-inner{display:flex;align-items:center;padding:14px 40px;gap:32px}
.nav-v3-brand{display:flex;align-items:center;gap:12px}
.nav-v3-brand-text{display:flex;flex-direction:column;line-height:1.15}
.nav-v3-name{font-family:var(--serif);font-size:15px;color:var(--ink)}
.nav-v3-discipline{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}
.nav-v3-links{display:flex;gap:22px;margin-left:auto}
.nav-v3-link{
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-muted);padding-bottom:4px;
  border-bottom:1px solid transparent;
  transition:color .2s ease, border-color .2s ease;
}
.nav-v3-link.is-on,.nav-v3-link:hover{color:var(--ink);border-bottom-color:var(--ink)}
.nav-v3-cta{padding:9px 16px;font-size:12.5px}

/* -------------------- HERO V3 -------------------- */
.hero-v3{padding:48px 0 80px;border-bottom:1px solid var(--line-soft);position:relative}
.hero-v3-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:64px;align-items:start}
.hero-v3-left{display:flex;flex-direction:column;gap:0}
.hero-v3-eyebrow{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted);
  display:flex;align-items:center;gap:14px;margin-bottom:28px;
}
.hero-v3-eyebrow-rule{display:inline-block;width:22px;height:1px;background:var(--copper)}
.hero-v3-eyebrow-accent{color:var(--copper)}
.hero-v3-headline{
  font-size:64px;letter-spacing:-0.022em;line-height:1.02;
  margin:0 0 18px;font-weight:400;max-width:18ch;
}
.hero-v3-lede{
  font-size:17px;line-height:1.5;color:var(--ink-2);max-width:54ch;
  margin:0 0 28px;
}

/* Services strip — three named services */
.hero-v3-services{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--line);
  margin-bottom:32px;
}
.svc-v3-card{
  position:relative;padding:18px 18px 22px 18px;
  border-right:1px solid var(--line-soft);
  display:flex;flex-direction:column;gap:8px;
  transition:background .25s ease;
  overflow:hidden;
}
.svc-v3-card:last-child{border-right:0}
.svc-v3-card:hover{background:rgba(255,255,255,0.5)}
.svc-v3-head{display:flex;align-items:center;gap:10px}
.svc-v3-n{
  font-size:10px;letter-spacing:.14em;color:var(--copper);
  font-feature-settings:"zero";
}
.svc-v3-icon{color:var(--ink-muted);display:inline-flex}
.svc-v3-card:hover .svc-v3-icon{color:var(--copper);transition:color .3s ease}
.svc-v3-live{
  margin-left:auto;font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--green);display:inline-flex;align-items:center;gap:5px;
}
.svc-v3-live-dot{width:5px;height:5px;border-radius:50%;background:var(--green);animation:pulse-dot 1.6s ease-in-out infinite}
.svc-v3-t{font-family:var(--serif);font-size:18px;line-height:1.15;color:var(--ink);margin:0}
.svc-v3-b{font-size:12.5px;line-height:1.5;color:var(--ink-muted);margin:0}
.svc-v3-rule{
  position:absolute;left:0;bottom:0;height:2px;width:0;
  background:var(--copper);transition:width .55s var(--ease-soft);
}
.svc-v3-card:hover .svc-v3-rule{width:100%}

/* Offer block */
.hero-v3-offer{
  border:1px solid var(--ink);padding:24px 26px 22px;background:var(--stone);
  position:relative;margin-top:4px;
}
.hero-v3-offer-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:12px;flex-wrap:wrap}
.hero-v3-offer-eyebrow{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper);margin-bottom:6px}
.hero-v3-offer-title{font-family:var(--serif);font-size:30px;line-height:1;margin:0}
.hero-v3-offer-meta{font-size:11px;color:var(--ink-muted);letter-spacing:.08em}
.hero-v3-offer-body{font-size:14.5px;line-height:1.55;color:var(--ink-2);margin:0 0 18px;max-width:54ch}
.hero-v3-offer-ctas{display:flex;gap:14px;align-items:center;flex-wrap:wrap}

/* The hero stage shrinks slightly — saves vertical */
.hero-stage-v3{position:relative;height:680px}
.hero-stage-v3 .hero-card.card-1{position:absolute;top:0;right:0;width:280px;background:var(--stone);box-shadow:0 12px 40px -20px rgba(22,25,26,0.35);z-index:2}
.hero-stage-v3 .hero-card.card-2{position:absolute;top:200px;left:-10px;width:320px;background:var(--stone);box-shadow:0 12px 40px -20px rgba(22,25,26,0.35);border:1px solid var(--signal-amber);z-index:2}
.hero-stage-v3 .hero-card.card-3{position:absolute;bottom:80px;right:0;width:260px;padding:16px 18px;border-radius:4px;z-index:2}
.hero-stage-v3 .hero-card.card-4{position:absolute;bottom:0;left:30px;width:310px;background:var(--stone);box-shadow:0 12px 40px -20px rgba(22,25,26,0.35);z-index:2}
.hero-stage-v3 .hero-backdrop{position:absolute;top:30px;left:20px;right:20px;z-index:0}

/* POV trimmed — slightly tighter card */
.pov-section-v3 .pov-stat{display:flex;flex-direction:column;gap:2px}
.pov-section-v3 .pov-stat .stat-big{color:var(--copper);font-style:italic}

/* =========================================================================
   ARTIFACT V3 — single-viewport autoplay teardown
   ========================================================================= */
.artifact-v3{padding:80px 0 96px}
.artifact-stage{
  display:grid;grid-template-columns:340px 1fr;gap:28px;
  align-items:start;
  margin-top:8px;
}

/* LEFT — narrator + scrubber */
.artifact-narrator{
  background:var(--stone);
  border:1px solid var(--ink);
  padding:22px 22px 18px;
  display:flex;flex-direction:column;gap:18px;
  min-height:480px;
  position:relative;
  overflow:hidden;
}
.artifact-narrator::before{
  content:"";position:absolute;left:0;top:0;width:3px;height:100%;
  background:linear-gradient(180deg,var(--copper-bright),var(--copper) 60%,transparent);
  opacity:.7;
}
.artifact-narrator-head{display:flex;justify-content:space-between;align-items:center}
.artifact-narrator-eyebrow{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper)}
.artifact-playctl{
  display:inline-flex;align-items:center;gap:7px;
  font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink);background:var(--stone);
  border:1px solid var(--ink);padding:5px 10px;cursor:pointer;
  transition:background .2s ease,color .2s ease;
}
.artifact-playctl:hover{background:var(--ink);color:var(--stone)}
.artifact-pause-glyph{display:inline-flex;gap:3px}
.artifact-pause-glyph span{width:3px;height:9px;background:currentColor;display:inline-block}

/* Narrator content — animated swap */
.narrator-panel{
  flex:1;display:flex;flex-direction:column;gap:12px;
  animation:narrator-in .5s var(--ease-soft);
}
@keyframes narrator-in{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}
.narrator-tag{
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-muted);display:inline-flex;align-items:center;gap:8px;
}
.narrator-pin-glyph{
  font-family:var(--serif);font-style:italic;
  color:var(--copper);font-size:18px;line-height:1;
}
.narrator-title{
  font-family:var(--serif);font-size:24px;line-height:1.12;color:var(--ink);
  margin:0;text-wrap:balance;
}
.narrator-body{font-size:13.5px;line-height:1.55;color:var(--ink-2);margin:0}
.narrator-fix{
  margin-top:auto;padding:10px 12px;background:var(--stone-2);
  border-left:2px solid var(--copper);
  display:flex;flex-direction:column;gap:4px;
}
.narrator-fix-tag{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper)}
.narrator-fix-text{font-size:12.5px;line-height:1.45;color:var(--ink-2);font-style:italic}
.narrator-fix-link{font-size:12px;color:var(--copper);display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);letter-spacing:.04em}

/* Beat timeline */
.artifact-timeline{
  display:flex;gap:6px;margin-top:6px;
}
.artifact-beat{
  flex:1;background:transparent;border:0;padding:6px 0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.artifact-beat-tick{
  display:block;width:100%;height:2px;background:var(--line);
  transition:background .3s ease,height .3s ease;
}
.artifact-beat.is-past .artifact-beat-tick{background:var(--copper-soft)}
.artifact-beat.is-on .artifact-beat-tick{background:var(--copper-bright);height:3px}

.artifact-progress{
  height:1px;background:var(--line-soft);position:relative;overflow:hidden;
}
.artifact-progress-fill{
  position:absolute;left:0;top:0;height:100%;
  background:linear-gradient(90deg,var(--copper),var(--copper-bright));
  transition:width .9s var(--ease-soft);
}
.artifact-counter{
  display:flex;justify-content:space-between;font-size:10px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);
}
.artifact-counter-issues{color:var(--copper)}

/* RIGHT — the kiosk */
.artifact-screen-wrap{position:relative}
.artifact-kiosk{margin:0}
.artifact-screen{
  position:relative;background:var(--panel);color:var(--stone);
  aspect-ratio:16/9;overflow:hidden;
}

/* Boot scan line — sweeps once on beat 0 */
.artifact-scan{
  position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--copper-bright),transparent);
  box-shadow:0 0 16px rgba(198,132,88,0.5);
  animation:scan-sweep 1.6s ease-in-out;
  pointer-events:none;z-index:5;
}
@keyframes scan-sweep{
  0%{top:0;opacity:.0}
  10%{opacity:1}
  100%{top:100%;opacity:0}
}

.artifact-topbar{
  display:flex;justify-content:space-between;align-items:center;
  padding:10px 16px;border-bottom:1px solid var(--panel-line);
  background:rgba(0,0,0,0.25);
}
.artifact-topbar .mono{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(242,238,230,0.55);
}

/* Alarms */
.artifact-alarms{
  position:absolute;top:56px;left:5%;right:32%;
  display:flex;flex-direction:column;gap:6px;
}
.artifact-alarm{
  display:flex;align-items:center;gap:10px;
  padding:8px 12px;background:rgba(162,74,72,0);
  border:1px solid rgba(162,74,72,0);
  opacity:0;transform:translateX(-12px);
  transition:opacity .55s var(--ease-soft),transform .55s var(--ease-soft),background .55s ease,border-color .55s ease;
}
.artifact-alarms.is-in .artifact-alarm{
  opacity:1;transform:translateX(0);
  background:rgba(162,74,72,0.25);
  border-color:var(--signal-rose);
}
.artifact-alarm-tag{font-size:9.5px;color:var(--signal-rose);letter-spacing:.1em;text-transform:uppercase}
.artifact-alarm-id{font-size:10px;color:rgba(242,238,230,0.5)}
.artifact-alarm-t{font-size:12px;color:var(--stone)}
.artifact-alarm-age{font-size:10px;color:rgba(242,238,230,0.45);margin-left:auto}

/* Trend */
.artifact-trend{
  position:absolute;top:56px;right:5%;width:22%;padding:12px;
  background:rgba(255,255,255,0.03);border:1px solid var(--panel-line);
  opacity:0;transform:translateY(-8px);
  transition:opacity .55s var(--ease-soft),transform .55s var(--ease-soft);
}
.artifact-trend.is-in{opacity:1;transform:translateY(0)}
.artifact-trend-label{font-size:9.5px;color:rgba(242,238,230,0.5);letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px}
.artifact-trend-val{font-family:var(--serif);font-size:28px;line-height:1;color:var(--stone)}
.artifact-trend-bars{display:flex;gap:2px;margin-top:10px;align-items:flex-end;height:32px}
.artifact-trend-bar{opacity:0;transition:opacity .35s ease}
.artifact-trend-bar.is-in{opacity:.8}

/* AI recommendation */
.artifact-reco{
  position:absolute;top:46%;left:8%;width:34%;padding:14px;
  background:rgba(193,138,54,0.12);border:1px solid var(--signal-amber);
  opacity:0;transform:translateY(8px) scale(.97);
  transition:opacity .55s var(--ease-soft),transform .55s var(--ease-soft);
}
.artifact-reco.is-in{opacity:1;transform:translateY(0) scale(1)}
.artifact-reco-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.artifact-reco-ai{font-size:9.5px;padding:1px 5px;border:1px solid var(--signal-amber);color:var(--signal-amber);letter-spacing:.08em}
.artifact-reco-id{font-size:10px;color:rgba(242,238,230,0.55);letter-spacing:.1em}
.artifact-reco-body{font-size:13px;color:var(--stone);line-height:1.4;margin:0}
.artifact-reco-actions{margin-top:10px;display:flex;gap:6px}
.artifact-reco-actions .mono{
  font-size:9.5px;padding:4px 8px;border:1px solid rgba(242,238,230,0.3);
  color:rgba(242,238,230,0.65);letter-spacing:.06em;text-transform:uppercase;
}

/* KPI strip */
.artifact-kpis{
  position:absolute;bottom:0;left:0;right:0;
  display:grid;grid-template-columns:repeat(5,1fr);
  border-top:1px solid var(--panel-line);background:rgba(0,0,0,0.25);
  opacity:0;transform:translateY(12px);
  transition:opacity .55s var(--ease-soft),transform .55s var(--ease-soft);
}
.artifact-kpis.is-in{opacity:1;transform:translateY(0)}
.artifact-kpi{padding:10px 14px;border-right:1px solid var(--panel-line)}
.artifact-kpi:last-child{border-right:0}
.artifact-kpi-k{font-size:9.5px;color:rgba(242,238,230,0.45);letter-spacing:.12em;text-transform:uppercase}
.artifact-kpi-v{font-family:var(--serif);font-size:16px;color:var(--stone);margin-top:2px}

/* Pins */
.artifact-pin{
  position:absolute;
  width:30px;height:30px;
  margin:-15px 0 0 -15px;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transform:scale(.5);
  transition:opacity .45s var(--ease-soft),transform .45s var(--ease-soft);
  cursor:pointer;z-index:8;
}
.artifact-pin.is-in{opacity:1;transform:scale(1)}
.artifact-pin-ring{
  position:absolute;inset:-6px;border-radius:99px;
  background:rgba(162,74,72,0.25);
}
.artifact-pin.is-active .artifact-pin-ring,
.artifact-pin.is-hover .artifact-pin-ring{
  background:rgba(198,132,88,0.4);
  animation:pin-pulse 1.6s ease-in-out infinite;
}
@keyframes pin-pulse{
  0%,100%{transform:scale(1);opacity:.6}
  50%{transform:scale(1.3);opacity:.25}
}
.artifact-pin-dot{
  position:relative;width:28px;height:28px;border-radius:50%;
  background:var(--signal-rose);color:var(--stone);
  font-family:var(--serif);font-style:italic;font-size:14px;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 3px var(--panel),0 4px 14px -4px rgba(0,0,0,0.5);
}
.artifact-pin.is-active .artifact-pin-dot,
.artifact-pin.is-hover .artifact-pin-dot{
  background:var(--copper-bright);
  transform:scale(1.12);
  transition:transform .25s ease,background .25s ease;
}

/* LEDs glow when "on" */
.led{transition:box-shadow .35s ease,opacity .35s ease;opacity:.35}
.led.on{opacity:1}
.led.on.led-grn{box-shadow:0 0 6px rgba(122,180,138,0.7)}
.led.on.led-amb{box-shadow:0 0 6px rgba(193,138,54,0.7)}
.led.on.led-rose{box-shadow:0 0 6px rgba(162,74,72,0.7)}

.artifact-takeaway{
  margin-top:32px;text-align:center;
  font-family:var(--serif);font-size:22px;line-height:1.35;color:var(--ink-2);
  max-width:48ch;margin-left:auto;margin-right:auto;text-wrap:balance;
}
.artifact-takeaway .emph{color:var(--ink)}

/* =========================================================================
   SERVICES V3 — merged Method + How We Work
   ========================================================================= */
.services-v3{padding:80px 0 88px;border-bottom:1px solid var(--panel-line)}
.services-v3-headline{
  margin-top:18px;color:var(--stone);font-size:46px;line-height:1.05;max-width:18ch;
}
.services-v3-grid{
  display:grid;grid-template-columns:0.95fr 1fr;gap:60px;align-items:start;
}

.services-v3-loop{
  position:sticky;top:80px;display:flex;flex-direction:column;align-items:center;
}
.svc-loop-wrap{width:100%;display:flex;flex-direction:column;align-items:center;gap:20px}
.svc-loop{width:100%;max-width:460px;height:auto;display:block}
.svc-loop-caption{
  text-align:center;display:flex;flex-direction:column;gap:6px;
  padding-top:8px;
}
.svc-loop-caption-eyebrow{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(242,238,230,0.5)}
.svc-loop-caption-name{
  font-family:var(--serif);font-size:28px;color:var(--copper-bright);line-height:1;
}
.svc-loop-caption-transform{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(242,238,230,0.6);
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
}
.svc-loop-caption-transform-dot{
  width:6px;height:6px;border-radius:50%;background:var(--copper-bright);
  box-shadow:0 0 0 3px rgba(198,132,88,0.18);
  animation:pulse-dot 1.8s ease-in-out infinite;
}
.svc-vertex-halo{animation:halo-spin 3s linear infinite;transform-origin:center;transform-box:fill-box}
@keyframes halo-spin{to{transform:rotate(360deg)}}

/* Stack on right */
.services-v3-stack{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:0;
  border-top:1px solid rgba(242,238,230,0.15);
}
.svc-row{
  position:relative;padding:22px 0;
  border-bottom:1px solid rgba(242,238,230,0.12);
  cursor:pointer;
  transition:background .25s ease;
}
.svc-row::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:100%;
  background:linear-gradient(180deg,rgba(198,132,88,0.04),transparent);
  opacity:0;transition:opacity .35s ease;
  pointer-events:none;
}
.svc-row.is-on::before{opacity:1}
.svc-row-progress{
  position:absolute;left:0;bottom:-1px;height:2px;width:100%;
  background:var(--copper-bright);
  transform:scaleX(0);transform-origin:left;
  transition:transform .55s var(--ease-soft);
}
.svc-row-head{
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  gap:18px;align-items:baseline;
  position:relative;z-index:1;
}
.svc-row-n{
  font-size:11px;letter-spacing:.18em;color:var(--copper-bright);
}
.svc-row-k{
  font-family:var(--serif);font-size:28px;color:var(--stone);line-height:1;
  transition:color .25s ease;
}
.svc-row.is-on .svc-row-k{color:var(--copper-bright)}
.svc-row-time{
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(242,238,230,0.5);
}
.svc-row-transform{
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(242,238,230,0.6);
  display:inline-flex;align-items:center;gap:8px;
  padding:4px 10px;border:1px solid rgba(242,238,230,0.18);
  border-radius:99px;
}
.svc-row-transform-dot{
  width:5px;height:5px;border-radius:50%;background:var(--copper-bright);
}
.svc-row.is-on .svc-row-transform{
  border-color:var(--copper-bright);color:var(--copper-bright);
}

/* Detail — collapsed by default; expanded on active */
.svc-row-detail{
  display:grid;grid-template-columns:1.1fr 1fr;gap:24px;
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .5s var(--ease-soft),opacity .35s ease,margin-top .5s var(--ease-soft);
  margin-top:0;
}
.svc-row.is-on .svc-row-detail{
  max-height:300px;opacity:1;margin-top:14px;
}
.svc-row-lead{
  font-size:14px;line-height:1.55;color:rgba(242,238,230,0.85);margin:0;
}
.svc-row-out{
  list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;
}
.svc-row-out li{
  display:flex;align-items:flex-start;gap:8px;
  font-size:12.5px;color:rgba(242,238,230,0.7);line-height:1.45;
}
.svc-row-out-tick{display:inline-flex;margin-top:2px;flex-shrink:0}

.services-v3-foot{
  margin-top:48px;padding:20px 24px;
  border:1px solid rgba(242,238,230,0.15);background:rgba(0,0,0,0.18);
  display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;
}
.services-v3-foot-copy{
  font-family:var(--serif);font-size:19px;font-style:italic;
  color:rgba(242,238,230,0.85);max-width:58ch;line-height:1.35;margin:0;
}
.services-v3-foot-link{color:var(--stone);font-family:var(--mono)}

/* =========================================================================
   EXPERIMENTS V3 — condensed tab carousel
   ========================================================================= */
.exp-v3{padding:80px 0}

.exp-v3-tabs{
  display:grid;grid-template-columns:repeat(6,1fr);gap:0;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);
  margin-bottom:36px;
}
.exp-v3-tab{
  position:relative;background:transparent;border:0;cursor:pointer;
  padding:18px 14px 18px;text-align:left;
  border-right:1px solid var(--line-soft);
  display:flex;flex-direction:column;gap:6px;
  transition:background .2s ease;
}
.exp-v3-tab:last-child{border-right:0}
.exp-v3-tab:hover{background:var(--stone-2)}
.exp-v3-tab.is-on{background:var(--stone-2)}
.exp-v3-tab-n{
  font-size:10px;letter-spacing:.16em;color:var(--ink-muted);
}
.exp-v3-tab.is-on .exp-v3-tab-n{color:var(--copper)}
.exp-v3-tab-label{
  font-family:var(--serif);font-size:16px;color:var(--ink);line-height:1.12;
  text-wrap:balance;
}
.exp-v3-tab-industry{
  font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-subtle);
}
.exp-v3-tab-bar{
  position:absolute;left:0;bottom:-1px;height:3px;width:100%;
  background:var(--copper);transform:scaleX(0);transform-origin:left;
  transition:transform .45s var(--ease-soft);
}
.exp-v3-tab.is-on .exp-v3-tab-bar{transform:scaleX(1)}

/* Active panel */
.exp-v3-panel{
  display:grid;grid-template-columns:1.1fr 0.9fr;gap:48px;align-items:center;
  min-height:380px;
  animation:exp-fade .55s var(--ease-soft);
}
@keyframes exp-fade{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}
.exp-v3-body{display:flex;flex-direction:column;gap:14px}
.exp-v3-num{display:flex;align-items:baseline;gap:14px;margin-bottom:4px}
.exp-v3-num-glyph{
  font-family:var(--serif);font-style:italic;
  font-size:64px;line-height:1;letter-spacing:-.02em;
  color:var(--copper);
}
.exp-v3-num-tag{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted)}
.exp-v3-title{
  font-family:var(--serif);font-size:38px;line-height:1.05;
  letter-spacing:-.014em;color:var(--ink);margin:0;text-wrap:balance;
  max-width:22ch;
}
.exp-v3-text{font-size:14.5px;line-height:1.55;color:var(--ink-2);max-width:54ch;margin:0}
.exp-v3-seen{
  margin-top:6px;padding:12px 14px;background:var(--stone-2);
  border-left:2px solid var(--copper);
  display:flex;flex-direction:column;gap:4px;
}
.exp-v3-seen-tag{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper)}
.exp-v3-seen-text{font-size:12.5px;line-height:1.5;color:var(--ink-2);font-style:italic}
.exp-v3-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.exp-v3-tag{
  font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);
  padding:4px 10px;border:1px solid var(--line);border-radius:99px;
  display:inline-flex;align-items:center;gap:6px;
}
.exp-v3-controls{
  display:flex;align-items:center;gap:14px;margin-top:12px;
}
.exp-v3-arrow{
  width:34px;height:34px;border:1px solid var(--line);background:var(--stone);
  border-radius:50%;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
  color:var(--ink-muted);transition:all .2s ease;
}
.exp-v3-arrow:hover{border-color:var(--ink);color:var(--ink);background:var(--stone-2)}
.exp-v3-progress{
  flex:1;height:1px;background:var(--line-soft);position:relative;
}
.exp-v3-progress-fill{
  position:absolute;left:0;top:0;height:100%;
  background:var(--copper);transition:width .55s var(--ease-soft);
}
.exp-v3-cta{color:var(--ink);font-family:var(--mono);font-size:12px;letter-spacing:.04em}

/* Info svg — make it slightly taller */
.exp-v3-info{position:relative}
.exp-v3-info .info-svg{height:auto}

/* Responsive narrowing for the artifact + services + exps */
@media (max-width: 900px){
  .artifact-stage{grid-template-columns:1fr;gap:24px}
  .services-v3-grid{grid-template-columns:1fr;gap:40px}
  .services-v3-loop{position:relative;top:0}
  .exp-v3-panel{grid-template-columns:1fr;gap:32px}
  .exp-v3-tabs{grid-template-columns:repeat(3,1fr)}
  .hero-v3-grid{grid-template-columns:1fr;gap:48px}
  .hero-v3-services{grid-template-columns:1fr}
  .svc-v3-card{border-right:0;border-bottom:1px solid var(--line-soft)}
  .svc-v3-card:last-child{border-bottom:0}
}

/* At medium-desktop, tighten the hero so the composite fits */
@media (max-width: 1280px){
  .hero-v3-headline{font-size:54px}
  .hero-stage-v3{height:620px}
  .services-v3-headline{font-size:40px}
  .exp-v3-title{font-size:32px}
  .exp-v3-num-glyph{font-size:54px}
}


/* =========================================================================
   V3 TYPOGRAPHY — bespoke type system applied
   Newsreader (display) + Hanken Grotesk (body) + JetBrains Mono (data)
   + Big Shoulders Display (industrial stencil, used sparingly)
   ========================================================================= */

/* Stencil utility — for industrial signage moments only */
.stencil{
  font-family:var(--stencil);
  font-weight:700;
  letter-spacing:0.02em;
  font-feature-settings:"tnum";
  font-variant-numeric:tabular-nums;
}

/* Mono refinements — JetBrains has more character; tighten tracking */
.mono{
  font-family:var(--mono);
  font-feature-settings:"zero","ss02","cv16";
  font-variant-numeric:tabular-nums;
}

/* Italic emphasis — Newsreader italic is the star; lean into it */
.emph{
  font-style:italic;
  font-feature-settings:"ss01","ss02";
  font-variation-settings:"opsz" 36;
  letter-spacing:-0.01em;
}
.emph-light{font-style:italic;color:var(--copper);font-variation-settings:"opsz" 24}
.emph-quiet{font-style:italic;color:var(--ink-muted);font-variation-settings:"opsz" 18}

/* Pull quotes — larger optical size, slight extra weight */
.pullquote{
  font-family:var(--serif);
  font-style:italic;
  font-size:30px;
  line-height:1.18;
  letter-spacing:-0.014em;
  color:var(--ink);
  max-width:24ch;
  text-wrap:balance;
  font-variation-settings:"opsz" 32;
  font-weight:420;
}

/* =========================================================================
   STENCIL APPLICATIONS — industrial signage for the right moments
   ========================================================================= */

/* Big section numerals on prototype carousel — factory stencil feel */
.exp-v3-num-glyph{
  font-family:var(--stencil);
  font-style:normal;
  font-weight:700;
  font-size:78px;
  line-height:0.88;
  letter-spacing:-0.01em;
  color:var(--copper);
  font-feature-settings:"tnum";
  font-variant-numeric:tabular-nums;
  position:relative;
}
/* Stamped-on-metal feel: copper number, subtle dropshadow notch */
.exp-v3-num-glyph::after{
  content:"";position:absolute;left:0;right:0;bottom:6px;height:2px;
  background:var(--copper);opacity:.4;
}

/* POV roman numerals — keep editorial italic, but tune optical sizing */
.pov-num{
  font-family:var(--serif);
  font-style:italic;
  font-size:46px;line-height:1;letter-spacing:-.018em;
  color:var(--copper);
  font-variation-settings:"opsz" 48;
  font-weight:420;
}

/* The "PRACTICE" wordmark band — stencil under the name in the nav */
.nav-v3-discipline{
  font-family:var(--sans);
  font-weight:500;
  font-size:11.5px;
  letter-spacing:0.02em;
  text-transform:none;
  color:var(--ink-muted);
}

/* Eyebrow numeric markers — stencil instead of mono, looks like a placard */
.eyebrow > .mono{
  font-family:var(--stencil);
  font-weight:500;
  font-size:13px;
  letter-spacing:0.18em;
  color:var(--copper-soft);
}

/* Hero offer "$48k", trust scores, big stats — already use serif, tune them */
.stat-big,.tn{
  font-family:var(--serif);
  font-weight:420;
  font-feature-settings:"tnum","ss01";
  font-variant-numeric:tabular-nums;
  letter-spacing:-0.012em;
}

/* Hero headline — pull bigger optical size, slight italic tilt for emph */
.hero-v3-headline{
  font-variation-settings:"opsz" 72;
  font-weight:420;
  letter-spacing:-0.022em;
  line-height:1.0;
}

/* Section h2's get a slightly heavier weight for grounding */
.section-head h2,
.services-v3-headline,
.offer-headline,
.facet-headline{
  font-variation-settings:"opsz" 60;
  font-weight:430;
  letter-spacing:-0.018em;
}

/* Narrator + small serif titles — keep crisp at smaller opsz */
.narrator-title,
.exp-v3-title,
.svc-row-k,
.engage-t,
.hero-v3-offer-title{
  font-variation-settings:"opsz" 32;
  font-weight:440;
}

/* SCRAMBLE numbers / clock-style — JetBrains Mono with tab nums */
.scramble,
.hero-countdown{
  font-feature-settings:"tnum","zero";
  font-variant-numeric:tabular-nums;
}

/* Section rail labels in V3 inherit mono font naturally */

/* Engagement step numerals (services-v3) — stencil for industrial step markers */
.svc-row-n{
  font-family:var(--stencil);
  font-weight:700;
  font-size:16px;
  letter-spacing:0.06em;
  color:var(--copper-bright);
}

/* Hero composite "06:42" clock — stencil ticker */
.frag-head .tn{
  font-family:var(--stencil);
  font-weight:500;
  letter-spacing:0.08em;
  font-size:13px;
}

/* Subtle: cursor companion label — stencil for that industrial label feel */
.cursor-label{
  font-family:var(--stencil);
  font-weight:500;
  letter-spacing:0.14em;
  font-size:11px;
}

/* Service card numerals in the hero strip */
.svc-v3-n{
  font-family:var(--stencil);
  font-weight:700;
  font-size:13px;
  letter-spacing:0.18em;
  color:var(--copper);
}

/* Facet wheel — roman numerals stay serif italic, but counter gets stencil */
.facet-wheel-counter{
  font-family:var(--stencil);
  font-weight:700;
  letter-spacing:0.1em;
}
.facet-detail-roman{
  font-family:var(--stencil);
  font-weight:500;
  letter-spacing:0.18em;
  font-size:11px;
}

/* Tab numbers in exp carousel — stencil placards */
.exp-v3-tab-n{
  font-family:var(--stencil);
  font-weight:700;
  font-size:13px;
  letter-spacing:0.14em;
}

/* Closing tier numerals + week markers — stencil */
.offer-week-key,
.offer-deliverable-num,
.offer-stat-key{
  font-family:var(--stencil);
  font-weight:700;
  letter-spacing:0.14em;
}

/* Newsreader italic in headlines — slightly larger optical size for flow */
.hero-v3-headline .emph,
.section-head h2 .emph,
.services-v3-headline .emph,
.offer-headline .emph,
.facet-headline .emph,
.exp-v3-title .emph{
  font-style:italic;
  font-variation-settings:"opsz" 72;
  font-weight:400;
  letter-spacing:-0.018em;
}

/* Bigger first-paragraph lead — Newsreader at body-italic feels too cute, keep sans here */
.hero-v3-lede,.section-intro{
  font-family:var(--sans);
  font-weight:380;
  letter-spacing:-0.005em;
  font-feature-settings:"ss01","ss02";
}

/* Small/all-caps mono labels: a touch wider tracking with JetBrains */
.numlabel,
.eyebrow{
  font-family:var(--mono);
  letter-spacing:0.16em;
}

/* Body paragraphs — Hanken Grotesk benefits from slightly looser line-height */
p{line-height:1.55;text-wrap:pretty;font-feature-settings:"ss01","cv11"}

/* Buttons — Hanken Grotesk medium weight reads better than 500 */
.btn,.btn-primary,.btn-secondary,.btn-arrow{
  font-family:var(--sans);
  font-weight:520;
  letter-spacing:-0.002em;
}

/* Footer sig — keep serif italic */
.footer-sig{font-family:var(--serif);font-style:italic;font-variation-settings:"opsz" 18}


/* =========================================================================
   FOOTER V3 — slim signoff with inline credential marks
   ========================================================================= */
.footer-v3{
  background:var(--panel-2);
  color:rgba(242,238,230,0.55);
  padding:36px 0 28px;
  border-top:1px solid rgba(255,255,255,0.05);
  position:relative;
  overflow:hidden;
}
.footer-v3::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent 0%, rgba(198,132,88,0.4) 25%, rgba(198,132,88,0.4) 75%, transparent 100%);
}
.footer-v3-inner{
  display:grid;
  grid-template-columns:1.05fr auto;
  gap:40px;
  align-items:center;
  margin-bottom:20px;
}
.footer-v3-signoff{
  display:flex;align-items:flex-start;gap:18px;
}
.footer-v3-quote{
  font-family:var(--serif);
  font-style:italic;
  font-size:19px;
  line-height:1.32;
  color:rgba(242,238,230,0.88);
  max-width:46ch;
  margin:0;
  font-variation-settings:"opsz" 26;
  font-weight:420;
  letter-spacing:-0.005em;
}

/* Inline credential marks — small monogram chips */
.footer-marks{
  display:flex;flex-direction:column;align-items:flex-end;gap:8px;
}
.footer-marks-label{
  font-size:9.5px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:rgba(242,238,230,0.45);
}
.footer-marks-row{
  display:flex;align-items:center;gap:6px;
}
.footer-mark{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:30px;height:30px;padding:0 7px;
  background:rgba(0,0,0,0.25);
  border:1px solid rgba(242,238,230,0.12);
  border-radius:50%;
  font-family:var(--stencil);
  font-weight:700;
  font-size:11px;
  letter-spacing:0.04em;
  color:rgba(242,238,230,0.7);
  cursor:default;
  transition:color .25s ease, border-color .25s ease, background .25s ease, transform .25s ease;
  opacity:0;
  animation:mark-in .55s var(--ease-soft) forwards;
}
@keyframes mark-in{
  from{opacity:0;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}
.footer-mark:hover{
  color:var(--copper-bright);
  border-color:var(--copper-bright);
  background:rgba(198,132,88,0.12);
  transform:translateY(-2px);
}

/* Bottom meta */
.footer-v3-meta{
  display:flex;justify-content:space-between;align-items:center;
  gap:24px;flex-wrap:wrap;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,0.06);
}
.footer-v3-meta-cell{font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase}
.footer-v3-meta-links{display:flex;gap:18px}

@media (max-width: 900px){
  .footer-v3-inner{grid-template-columns:1fr;gap:18px}
  .footer-marks{align-items:flex-start}
}


/* =========================================================================
   SCROLL REVEAL SYSTEM
   [data-reveal="up|left|right|fade|scale|draw"] — hidden by default, fades in
   [data-stagger="up"] on a parent — auto-applies reveal+--i to children
   ========================================================================= */
[data-reveal]{
  opacity:0;
  transform:translateY(20px);
  transition:opacity .9s var(--ease-soft), transform .9s var(--ease-soft);
  transition-delay:calc(var(--i, 0) * 70ms);
  will-change:opacity,transform;
}
[data-reveal="left"]{transform:translateX(-28px)}
[data-reveal="right"]{transform:translateX(28px)}
[data-reveal="fade"]{transform:none}
[data-reveal="scale"]{transform:scale(.96);transform-origin:left bottom}
[data-reveal="draw"]{transform:scaleX(0);transform-origin:left center}
[data-reveal="rise"]{transform:translateY(40px)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal="draw"].is-in{transform:scaleX(1)}

/* Tighter stagger when the parent says so via data-stagger-fast */
[data-stagger-fast] > [data-reveal]{transition-delay:calc(var(--i, 0) * 45ms)}
[data-stagger-slow] > [data-reveal]{transition-delay:calc(var(--i, 0) * 100ms)}

/* Parallax helper */
[data-parallax]{
  transform:translateY(var(--py, 0));
  will-change:transform;
}

/* Section enter — a horizontal copper hairline draws across each section
   as it enters the viewport. Subtle but ties the page together. */
section{position:relative}
section::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg, transparent 0%, var(--copper) 50%, transparent 100%);
  opacity:0;
  transform:scaleX(0);transform-origin:center;
  transition:transform 1.2s var(--ease-soft), opacity .5s ease;
  pointer-events:none;
  z-index:1;
}
section.sec-in::before{opacity:.35;transform:scaleX(1)}
/* Hero doesn't need the hairline (it has its own treatment) */
section#top::before{display:none}

/* Section heads: stagger the title block and the intro block by animating
   the two child divs only — not their internal elements. */
.section-head > div:first-child,
.section-head > div:nth-child(2){
  opacity:0;transform:translateY(16px);
  transition:opacity .9s var(--ease-soft), transform .9s var(--ease-soft);
}
section.sec-in .section-head > div:first-child{transition-delay:.1s;opacity:1;transform:none}
section.sec-in .section-head > div:nth-child(2){transition-delay:.3s;opacity:1;transform:none}

/* H2 underline draw on enter — appears under h2 inside section heads */
.section-head h2{position:relative;display:inline-block}
.section-head h2::after{
  content:"";position:absolute;left:0;bottom:-10px;height:2px;width:64px;
  background:var(--copper);
  transform:scaleX(0);transform-origin:left;
  transition:transform 1.1s var(--ease-soft) .4s;
}
section.sec-in .section-head h2::after{transform:scaleX(1)}

/* =========================================================================
   PER-SECTION ENTRY CHOREO
   ========================================================================= */

/* HERO — already animates on load; add scroll-tied drift to the wheel */
.hero-wheel{transition:transform .6s var(--ease-soft)}
.hero-stage-v3 .hero-card{transform-style:preserve-3d}

/* POV grid — cards rise + slight scale, staggered by index */
.pov-grid > .reveal{
  opacity:1; /* container shown */
}
.pov-card{
  opacity:0;
  transform:translateY(24px) scale(.985);
  transition:opacity .9s var(--ease-soft), transform .9s var(--ease-soft);
}
.pov-section-v3.sec-in .pov-card{opacity:1;transform:none}
.pov-section-v3.sec-in .pov-grid > .reveal:nth-child(1) .pov-card{transition-delay:.15s}
.pov-section-v3.sec-in .pov-grid > .reveal:nth-child(2) .pov-card{transition-delay:.28s}
.pov-section-v3.sec-in .pov-grid > .reveal:nth-child(3) .pov-card{transition-delay:.41s}
.pov-section-v3.sec-in .pov-grid > .reveal:nth-child(4) .pov-card{transition-delay:.54s}

/* The pull quote at the bottom drifts in */
.pov-section-v3 .pullquote{
  opacity:0;transform:translateX(-16px);
  transition:opacity .9s var(--ease-soft) .6s, transform .9s var(--ease-soft) .6s;
}
.pov-section-v3.sec-in .pullquote{opacity:1;transform:none}

/* ARTIFACT — the kiosk frame slides up + the narrator slides in from left */
.artifact-narrator{
  opacity:0;transform:translateX(-24px);
  transition:opacity .9s var(--ease-soft) .35s, transform .9s var(--ease-soft) .35s;
}
.artifact-v3.sec-in .artifact-narrator{opacity:1;transform:none}
.artifact-screen-wrap{
  opacity:0;transform:translateY(26px) scale(.98);
  transition:opacity 1.0s var(--ease-soft) .25s, transform 1.0s var(--ease-soft) .25s;
}
.artifact-v3.sec-in .artifact-screen-wrap{opacity:1;transform:none}
.artifact-takeaway{
  opacity:0;transform:translateY(12px);
  transition:opacity .8s var(--ease-soft) .9s, transform .8s var(--ease-soft) .9s;
}
.artifact-v3.sec-in .artifact-takeaway{opacity:1;transform:none}

/* SERVICES — loop scales in, stack rows stagger up */
.services-v3-loop{
  opacity:0;transform:scale(.94);
  transition:opacity 1.1s var(--ease-soft) .25s, transform 1.1s var(--ease-soft) .25s;
  transform-origin:center;
}
.services-v3.sec-in .services-v3-loop{opacity:1;transform:scale(1)}
.svc-row{
  opacity:0;transform:translateX(24px);
  transition:opacity .8s var(--ease-soft), transform .8s var(--ease-soft), background .25s ease;
}
.services-v3.sec-in .svc-row{opacity:1;transform:translateX(0)}
.services-v3.sec-in .svc-row:nth-child(1){transition-delay:.4s}
.services-v3.sec-in .svc-row:nth-child(2){transition-delay:.5s}
.services-v3.sec-in .svc-row:nth-child(3){transition-delay:.6s}
.services-v3.sec-in .svc-row:nth-child(4){transition-delay:.7s}
.services-v3-foot{
  opacity:0;transform:translateY(14px);
  transition:opacity .8s var(--ease-soft) .9s, transform .8s var(--ease-soft) .9s;
}
.services-v3.sec-in .services-v3-foot{opacity:1;transform:none}

/* EXPERIMENTS — tabs slide down from above, panel fades in */
.exp-v3-runline{
  position:relative;height:1px;background:var(--line-soft);
  margin-bottom:0;overflow:hidden;
  opacity:0;transition:opacity .5s ease .2s;
}
.exp-v3-runline-fill{
  position:absolute;left:0;top:0;height:100%;
  background:linear-gradient(90deg, var(--copper), var(--copper-bright));
  transition:width .8s var(--ease-soft);
}
.exp-v3.sec-in .exp-v3-runline{opacity:1}

.exp-v3-tabs{
  opacity:0;transform:translateY(-12px);
  transition:opacity .8s var(--ease-soft) .25s, transform .8s var(--ease-soft) .25s;
}
.exp-v3.sec-in .exp-v3-tabs{opacity:1;transform:none}
.exp-v3-tab{
  opacity:0;transform:translateY(-8px);
  transition:opacity .55s var(--ease-soft), transform .55s var(--ease-soft), background .2s ease;
}
.exp-v3.sec-in .exp-v3-tab{opacity:1;transform:translateY(0)}
.exp-v3.sec-in .exp-v3-tab:nth-child(1){transition-delay:.4s}
.exp-v3.sec-in .exp-v3-tab:nth-child(2){transition-delay:.46s}
.exp-v3.sec-in .exp-v3-tab:nth-child(3){transition-delay:.52s}
.exp-v3.sec-in .exp-v3-tab:nth-child(4){transition-delay:.58s}
.exp-v3.sec-in .exp-v3-tab:nth-child(5){transition-delay:.64s}
.exp-v3.sec-in .exp-v3-tab:nth-child(6){transition-delay:.70s}

/* FACET section — wheel scales in, detail slides from right */
.facet-section .facet-wheel{
  opacity:0;transform:scale(.92) rotate(-3deg);
  transition:opacity 1.2s var(--ease-soft) .3s, transform 1.2s var(--ease-soft) .3s;
  transform-origin:center;
}
.facet-section.sec-in .facet-wheel{opacity:1;transform:scale(1) rotate(0deg)}
.facet-section .facet-detail{
  opacity:0;transform:translateX(24px);
  transition:opacity .9s var(--ease-soft) .5s, transform .9s var(--ease-soft) .5s;
}
.facet-section.sec-in .facet-detail{opacity:1;transform:translateX(0)}

/* ESSAYS — manuscript drifts in from left, index from right, stagger */
.essays-section .essays-feature{
  opacity:0;transform:translateX(-22px);
  transition:opacity 1.0s var(--ease-soft) .25s, transform 1.0s var(--ease-soft) .25s;
}
.essays-section.sec-in .essays-feature{opacity:1;transform:translateX(0)}
.essays-section .essays-index{
  opacity:0;transform:translateX(22px);
  transition:opacity 1.0s var(--ease-soft) .4s, transform 1.0s var(--ease-soft) .4s;
}
.essays-section.sec-in .essays-index{opacity:1;transform:translateX(0)}
.essays-section .essays-index-row{
  opacity:0;transform:translateX(8px);
  transition:opacity .55s var(--ease-soft), transform .55s var(--ease-soft);
}
.essays-section.sec-in .essays-index-row{opacity:1;transform:none}
.essays-section.sec-in .essays-index-row:nth-child(1){transition-delay:.55s}
.essays-section.sec-in .essays-index-row:nth-child(2){transition-delay:.62s}
.essays-section.sec-in .essays-index-row:nth-child(3){transition-delay:.69s}
.essays-section.sec-in .essays-index-row:nth-child(4){transition-delay:.76s}
.essays-section.sec-in .essays-index-row:nth-child(5){transition-delay:.83s}
.essays-section.sec-in .essays-index-row:nth-child(6){transition-delay:.90s}

/* CLOSING — three doors stagger in from below */
.offer-section .offer-door{
  opacity:0;transform:translateY(28px);
  transition:opacity .9s var(--ease-soft), transform .9s var(--ease-soft);
}
.offer-section.sec-in .offer-door-1{transition-delay:.25s;opacity:1;transform:none}
.offer-section.sec-in .offer-door-2{transition-delay:.4s;opacity:1;transform:none}
.offer-section.sec-in .offer-door-3{transition-delay:.55s;opacity:1;transform:none}

.offer-section .offer-timeline-wrap,
.offer-section .offer-booking{
  opacity:0;transform:translateY(16px);
  transition:opacity .85s var(--ease-soft) .8s, transform .85s var(--ease-soft) .8s;
}
.offer-section.sec-in .offer-timeline-wrap,
.offer-section.sec-in .offer-booking{opacity:1;transform:none}

/* FOOTER — quote fades, marks pop in one by one */
.footer-v3 .footer-v3-quote{
  opacity:0;transform:translateY(10px);
  transition:opacity .8s var(--ease-soft) .15s, transform .8s var(--ease-soft) .15s;
}
.footer-v3.sec-in .footer-v3-quote{opacity:1;transform:none}
/* Replace the auto-running mark animation with an IO-triggered one */
.footer-mark{animation:none;opacity:0;transform:translateY(6px)}
.footer-v3.sec-in .footer-mark{
  animation:mark-in .55s var(--ease-soft) forwards;
}

/* HMI kiosk inside the artifact gains a soft warm glow as it enters */
.artifact-kiosk{
  filter:brightness(.92) saturate(.96);
  transition:filter 1.4s var(--ease-soft);
}
.artifact-v3.sec-in .artifact-kiosk{filter:brightness(1) saturate(1)}

/* The hero stat cards' entrance is already timed; we add a soft drift on
   scroll via parallax — driven by [data-parallax] (set in JSX). */

/* Increase POV glyph entrance — they grow in */
.pov-glyph{
  opacity:0;transform:scale(.88);
  transition:opacity .7s var(--ease-soft) .25s, transform .7s var(--ease-soft) .25s;
}
.pov-card .pov-glyph{opacity:0}
.pov-section-v3.sec-in .pov-card .pov-glyph{opacity:1;transform:scale(1)}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  [data-reveal],
  .pov-card, .artifact-narrator, .artifact-screen-wrap, .artifact-takeaway,
  .services-v3-loop, .svc-row, .services-v3-foot,
  .exp-v3-tabs, .exp-v3-tab,
  .facet-section .facet-wheel, .facet-section .facet-detail,
  .essays-section .essays-feature, .essays-section .essays-index, .essays-section .essays-index-row,
  .offer-section .offer-door, .offer-section .offer-timeline-wrap, .offer-section .offer-booking,
  .footer-v3 .footer-v3-quote, .footer-mark, .pov-glyph,
  section::before, .section-head h2::after
  { transition:none !important; animation:none !important; opacity:1 !important; transform:none !important; }
}


/* =========================================================================
   HERO V3 — KINETIC MARQUEE (headline cycle + ticker eyebrow)
   ========================================================================= */

/* Eyebrow with live pulse + ticker */
.hero-v3-eyebrow{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--ink-muted);
  margin-bottom:28px;
}
.hero-v3-live-pulse{
  display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--copper-bright);
  box-shadow:0 0 0 3px rgba(198,132,88,0.18);
  animation:pulse-dot 1.8s ease-in-out infinite;
  flex-shrink:0;
}
.hero-v3-eyebrow-accent{color:var(--copper)}
.hero-v3-eyebrow-sep{opacity:0.5}

/* Ticker — grid-stack of locations; one is "on" at a time */
.hero-v3-eyebrow-ticker{
  display:inline-grid;
  grid-template-areas:"t";
  vertical-align:baseline;
  text-transform:none;
  letter-spacing:-0.005em;
  font-family:var(--serif);
  font-style:italic;
  font-size:13px;
  color:var(--ink-2);
  font-variation-settings:"opsz" 18;
}
.hero-v3-eyebrow-ticker-w{
  grid-area:t;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .55s var(--ease-soft), transform .55s var(--ease-soft);
  white-space:nowrap;
}
.hero-v3-eyebrow-ticker-w.is-on{opacity:1;transform:translateY(0)}

/* The main headline — bigger, with cycling verb */
.hero-v3-headline{
  font-size:64px;
  letter-spacing:-0.022em;
  line-height:1.02;
  margin:0 0 22px;
  font-weight:430;
  max-width:18ch;
  font-variation-settings:"opsz" 72;
  text-wrap:balance;
}
.hero-v3-headline-anchor{
  /* The static anchor phrase — "physical economy" — gets a subtle wire
     underline that draws on load to anchor the eye. */
  position:relative;
  display:inline-block;
  white-space:nowrap;
}
.hero-v3-headline-anchor::after{
  content:"";position:absolute;left:0;right:0;bottom:0.08em;height:1.5px;
  background:var(--copper);
  transform:scaleX(0);transform-origin:left;
  animation:anchor-draw 1.4s var(--ease-soft) .8s forwards;
}
@keyframes anchor-draw{to{transform:scaleX(1)}}

/* The rotating verb */
.hero-v3-headline-cycle{
  display:inline-grid;
  grid-template-areas:"v";
  vertical-align:baseline;
  margin-left:0.22em;
  position:relative;
}
.hero-v3-cycle-w{
  grid-area:v;
  font-style:italic;
  color:var(--copper);
  font-variation-settings:"opsz" 72;
  font-weight:380;
  letter-spacing:-0.018em;
  white-space:nowrap;
  opacity:0;
  transform:translateY(14px);
  filter:blur(4px);
  transition:opacity .65s var(--ease-soft), transform .7s var(--ease-soft), filter .55s ease;
}
.hero-v3-cycle-w.is-on{
  opacity:1;
  transform:translateY(0);
  filter:blur(0);
}
/* Soft copper highlight underline on the active verb */
.hero-v3-headline-cycle::before{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0.08em;height:2px;
  background:var(--copper-bright);
  opacity:0.32;
  transform:scaleX(0);transform-origin:left;
  animation:cycle-underline 3.2s var(--ease-soft) infinite;
}
@keyframes cycle-underline{
  0%{transform:scaleX(0);opacity:0}
  20%{transform:scaleX(1);opacity:0.4}
  85%{transform:scaleX(1);opacity:0.3}
  100%{transform:scaleX(0);opacity:0;transform-origin:right}
}

/* Lede — Hanken grotesk feels right, but bump opt size + max width */
.hero-v3-lede{
  font-size:18px;
  line-height:1.5;
  color:var(--ink-2);
  max-width:54ch;
  margin:0 0 30px;
  font-weight:380;
  letter-spacing:-0.005em;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .hero-v3-cycle-w,.hero-v3-eyebrow-ticker-w{
    transition:none;
    filter:none;
    transform:none;
  }
  .hero-v3-cycle-w:not(.is-on),.hero-v3-eyebrow-ticker-w:not(.is-on){display:none}
  .hero-v3-headline-cycle::before{animation:none;display:none}
  .hero-v3-headline-anchor::after{animation:none;transform:scaleX(1)}
  .hero-v3-live-pulse{animation:none}
}


/* =========================================================================
   V3.1 — repositioning copy additions
   ========================================================================= */

/* POV section foot — secondary support line under pull quote */
.pov-section-foot{
  margin-top:16px;
  font-size:11.5px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ink-subtle);
  max-width:48ch;
  line-height:1.5;
}

/* Hero — secondary lede paragraph */
.hero-v3-lede-sub{
  margin-top:14px;
  font-size:16px;
  color:var(--ink-muted);
  max-width:58ch;
}

/* Hero working modes block — same chrome as old offer block but different title size */
.hero-v3-modes .hero-v3-offer-title{
  font-size:22px;
  line-height:1.18;
  max-width:24ch;
}

/* Facet section intro quote */
.facet-section-intro-quote{
  margin-top:14px;
  font-family:var(--serif);
  font-style:italic;
  font-size:18px;
  line-height:1.4;
  color:var(--ink);
  font-variation-settings:"opsz" 24;
  letter-spacing:-0.005em;
  text-wrap:balance;
}

/* Closing — categories pill row replaces the old availability bar */
.offer-categories{
  display:flex;flex-wrap:wrap;gap:8px 10px;
  align-items:center;
  font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;
  color:rgba(242,238,230,0.7);
  margin-top:14px;
}
.offer-categories > span{display:inline-block}

/* Stage gauge — replaces the old trust gauge in the anchor card */
.offer-stage-gauge{
  margin-top:14px;
  padding:14px;
  background:rgba(0,0,0,0.25);
  border:1px solid rgba(242,238,230,0.12);
  display:flex;flex-direction:column;gap:10px;
}
.offer-stage-head{
  display:flex;justify-content:space-between;align-items:center;
  font-size:10px;letter-spacing:0.16em;text-transform:uppercase;
  color:rgba(242,238,230,0.55);
}
.offer-stage-week{
  font-family:var(--stencil);
  font-weight:700;
  font-size:14px;
  color:var(--copper-bright);
  letter-spacing:0.14em;
}
.offer-stage-track{
  position:relative;height:2px;background:rgba(242,238,230,0.12);
  overflow:hidden;
}
.offer-stage-fill{
  position:absolute;left:0;top:0;height:100%;
  background:linear-gradient(90deg, var(--copper) 0%, var(--copper-bright) 100%);
  transition:width 1.2s var(--ease-soft);
}
.offer-stage-foot{
  display:flex;flex-direction:column;gap:4px;
}
.offer-stage-name{
  font-family:var(--serif);
  font-style:italic;
  font-size:18px;
  color:var(--copper-bright);
  letter-spacing:-0.005em;
  font-variation-settings:"opsz" 22;
}
.offer-stage-body{
  font-size:11.5px;
  letter-spacing:0.04em;
  text-transform:none;
  color:rgba(242,238,230,0.7);
}

/* Lab takeaway sub line */
.exp-v3-takeaway-sub{
  margin-top:10px;
  font-size:10.5px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ink-subtle);
  font-family:var(--mono);
}


/* =========================================================================
   POV T-SHAPE — section's signature glyph (5 surfaces, 1 spine)
   ========================================================================= */
.pov-tshape{
  margin:64px auto 36px;
  max-width:1100px;
  width:100%;
  padding:0 12px;
}
.pov-tshape-svg{
  width:100%;
  height:auto;
  display:block;
  overflow:visible;
}

/* Labels above each surface node */
.pov-tshape-label{
  font-family:var(--stencil);
  font-weight:500;
  font-size:13px;
  letter-spacing:0.18em;
  fill:var(--ink);
  text-transform:uppercase;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .55s var(--ease-soft), transform .55s var(--ease-soft);
}
.pov-tshape.is-in .pov-tshape-label{opacity:1;transform:translateY(0)}

/* Horizontal top stroke draws left to right */
.pov-tshape-top{
  stroke-dasharray:1000;
  stroke-dashoffset:1000;
  transition:stroke-dashoffset 1.1s var(--ease-soft) .2s;
}
.pov-tshape.is-in .pov-tshape-top{stroke-dashoffset:0}

/* Surface nodes pop into place after the line passes */
.pov-tshape-node{
  opacity:0;
  transform:scale(.4);
  transform-origin:center;
  transition:opacity .35s var(--ease-soft), transform .45s cubic-bezier(.34,1.56,.64,1);
  transform-box:fill-box;
}
.pov-tshape.is-in .pov-tshape-node{opacity:1;transform:scale(1)}

/* Converging guide lines from each surface down to the spine origin */
.pov-tshape-converge{
  stroke-dasharray:60;
  stroke-dashoffset:60;
  opacity:0;
  transition:stroke-dashoffset .55s var(--ease-soft), opacity .35s ease;
}
.pov-tshape.is-in .pov-tshape-converge{
  stroke-dashoffset:0;
  opacity:0.55;
}

/* Vertical spine — drops down from center */
.pov-tshape-spine{
  stroke-dasharray:300;
  stroke-dashoffset:300;
  transition:stroke-dashoffset 1s var(--ease-soft) 1.5s;
}
.pov-tshape.is-in .pov-tshape-spine{stroke-dashoffset:0}

/* Spine label — the "depth" */
.pov-tshape-spine-label{
  font-family:var(--serif);
  font-style:italic;
  font-size:22px;
  letter-spacing:-0.012em;
  fill:var(--ink);
  font-variation-settings:"opsz" 28;
  opacity:0;
  transition:opacity .65s var(--ease-soft) 2.1s;
}
.pov-tshape.is-in .pov-tshape-spine-label{opacity:1}
.pov-tshape-spine-sub{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  fill:var(--ink-muted);
  opacity:0;
  transition:opacity .65s var(--ease-soft) 2.3s;
}
.pov-tshape.is-in .pov-tshape-spine-sub{opacity:1}

/* Foot wrap — gives the pull quote + foot line a tighter cluster */
.pov-section-foot-wrap{
  display:flex;flex-direction:column;gap:10px;
  margin-top:24px;
  align-items:center;
  text-align:center;
}
.pov-section-foot-wrap .pullquote{
  text-align:center;
  margin:0 auto;
}
.pov-section-foot-wrap .pov-section-foot{
  margin:0 auto;
  max-width:64ch;
  text-align:center;
}

@media (prefers-reduced-motion: reduce){
  .pov-tshape-label,.pov-tshape-top,.pov-tshape-node,
  .pov-tshape-converge,.pov-tshape-spine,
  .pov-tshape-spine-label,.pov-tshape-spine-sub{
    transition:none !important;
    opacity:1 !important;
    transform:none !important;
    stroke-dashoffset:0 !important;
  }
}

/* Mobile: narrow the diagram, hide surface labels (nodes still draw the visual) */
@media (max-width: 700px){
  .pov-tshape-label{font-size:10px;letter-spacing:0.12em}
}
