:root {
  --bone: #f4f1ea;
  --ink: #161513;
  --red: #d9333f;
  --hair-ink: rgba(22, 21, 19, .16);
  --hair-bone: rgba(244, 241, 234, .18);
  --mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --arch: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --ease: cubic-bezier(.16, 1, .3, 1);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: auto; }
html, body { overflow-x: clip; }
body {
  background: var(--bone);
  color: var(--ink);
  font-family: var(--arch);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: var(--red); color: var(--bone); }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; background: none; border: 0; cursor: pointer; color: inherit; }
.mono { font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }

/* grain */
body::after {
  content: ""; position: fixed; inset: -50%; z-index: 90; pointer-events: none; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
  animation: v2-grain 7s steps(10) infinite;
}
@keyframes v2-grain {
  0%, 100% { transform: translate(0, 0); }
  20% { transform: translate(-3%, 2%); }
  40% { transform: translate(2%, -3%); }
  60% { transform: translate(-2%, -2%); }
  80% { transform: translate(3%, 3%); }
}

/* cursor */
.v2-cursor {
  position: fixed; z-index: 99; top: 0; left: 0; width: 8px; height: 8px; border-radius: 50%;
  background: var(--red); pointer-events: none; transform: translate(-50%, -50%);
  transition: width .3s var(--ease), height .3s var(--ease), opacity .3s;
}
.v2-cursor.is-link { width: 42px; height: 42px; background: transparent; border: 1px solid var(--red); }
@media (pointer: coarse) { .v2-cursor { display: none; } }

/* veil */
.v2-veil {
  position: fixed; inset: 0; z-index: 80; background: var(--ink);
  display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 14px;
}
.v2-veil .mono { color: rgba(244, 241, 234, .55); }
.v2-veil .mark {
  font-family: var(--arch); font-weight: 900; font-size: clamp(18px, 3vw, 28px);
  letter-spacing: .04em; color: var(--bone);
}

/* nav */
.v2-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 70; display: flex; align-items: center;
  justify-content: space-between; padding: 18px 3.2vw; mix-blend-mode: difference; color: #fff;
}
.v2-nav .wordmark {
  font-weight: 900; font-size: 15px; letter-spacing: .05em;
  font-variation-settings: 'wght' 900; transition: font-variation-settings .5s var(--ease);
}
.v2-nav .wordmark:hover { font-variation-settings: 'wght' 100; }
.v2-nav .links { display: flex; gap: 26px; align-items: center; }
.v2-nav .links a {
  font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
  position: relative;
}
.v2-nav .links a::after {
  content: ""; position: absolute; left: 0; bottom: -5px; height: 1px; width: 0;
  background: currentColor; transition: width .35s var(--ease);
}
.v2-nav .links a:hover::after { width: 100%; }
.v2-nav .buy {
  border: 1px solid currentColor; padding: 9px 18px; font-family: var(--mono);
  font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
}
/* ── mobile burger menu + drawer ──────────────────────────────────────── */
.v2-burger {
  display: none; position: fixed; top: 14px; right: 3.2vw; z-index: 90;
  flex-direction: column; justify-content: center; gap: 6px; width: 42px; height: 42px;
  background: none; border: 0; cursor: pointer; padding: 9px; color: var(--ink);
}
.v2-burger span { display: block; width: 100%; height: 2px; background: currentColor; transition: transform .4s var(--ease), opacity .3s; }
.v2-burger.open { color: var(--bone); }
.v2-burger.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.v2-burger.open span:nth-child(2) { opacity: 0; }
.v2-burger.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
.v2-drawer {
  position: fixed; inset: 0; z-index: 80; background: var(--ink); color: var(--bone);
  display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 14vh 8vw;
  transform: translateY(-100%); transition: transform .5s var(--ease); visibility: hidden;
}
.v2-drawer.open { transform: translateY(0); visibility: visible; }
.v2-drawer a {
  font-family: var(--arch); font-weight: 900; text-transform: uppercase; text-decoration: none;
  font-size: clamp(30px, 10vw, 56px); letter-spacing: -.02em; line-height: 1.05; color: var(--bone);
  padding: 10px 0; border-bottom: 1px solid rgba(244, 241, 234, .12);
}
.v2-drawer a:hover { color: var(--red); }
body.v2-drawer-open { overflow: hidden; }
@media (max-width: 760px) {
  .v2-nav .links { display: none; }
  .v2-burger { display: flex; }
  /* Drop the mix-blend nav + animated grain on phones — both repaint on scroll
     and cause a white flash at the top. Use a frosted bar instead. */
  .v2-nav { mix-blend-mode: normal; color: var(--ink); background: rgba(244, 241, 234, .9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid var(--hair-ink); }
  body::after { display: none; }
}
@media (min-width: 761px) { .v2-drawer { display: none; } }

section { position: relative; }
.v2-stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }
.v2-scene-tag {
  position: absolute; right: 3.2vw; bottom: 18px; z-index: 5;
  font-family: var(--mono); font-size: 10px; letter-spacing: .2em; color: inherit; opacity: .4; text-transform: uppercase;
}

/* hero */
.v2-hero {
  height: 100vh; height: 100svh; position: relative; display: flex; flex-direction: column;
  justify-content: center; padding: 0 3.2vw; background: var(--bone);
}
.v2-reg-v, .v2-reg-h { position: absolute; background: var(--hair-ink); z-index: 1; }
.v2-reg-v { top: 0; bottom: 0; width: 1px; left: 50%; transform-origin: top; transform: scaleY(0); }
.v2-reg-h { left: 0; right: 0; height: 1px; top: 50%; transform-origin: left; transform: scaleX(0); }
.v2-reg-cross { position: absolute; right: 3.2vw; top: 96px; width: 26px; height: 26px; opacity: 0; }
.v2-reg-cross::before, .v2-reg-cross::after { content: ""; position: absolute; background: var(--ink); }
.v2-reg-cross::before { left: 50%; top: 0; bottom: 0; width: 1px; }
.v2-reg-cross::after { top: 50%; left: 0; right: 0; height: 1px; }
.v2-hero-title { position: relative; z-index: 2; line-height: .92; user-select: none; }
.v2-hero-title .row { display: block; overflow: hidden; }
.v2-hero-title .row > span { display: inline-block; transform: translateY(115%); }
.v2-hero-title .ch {
  display: inline-block; font-weight: 900;
  font-size: clamp(48px, 11vw, 170px); letter-spacing: -.03em;
  font-variation-settings: 'wght' 900, 'wdth' 100;
}
.v2-hero-title .row.thin .ch { font-weight: 100; font-variation-settings: 'wght' 100, 'wdth' 100; color: var(--red); }
.v2-hero-meta {
  position: absolute; right: 3.2vw; bottom: 30vh; z-index: 2; text-align: right;
  font-family: var(--mono); font-size: 11px; letter-spacing: .14em; line-height: 2.1;
  text-transform: uppercase; color: rgba(22, 21, 19, .62);
}
.v2-hero-meta b { color: var(--ink); font-weight: 500; }
.v2-hero-kicker { position: absolute; left: 3.2vw; top: 96px; z-index: 2; }
.v2-hero-cue {
  position: absolute; left: 3.2vw; bottom: 18px; z-index: 2; opacity: .75;
  color: rgba(22, 21, 19, .6); animation: v2-cue 2.6s infinite;
}
@keyframes v2-cue { 50% { opacity: .15; } }
.v2-hero-sub {
  margin-top: 3.4vh; max-width: 430px; font-size: 15px; line-height: 1.6;
  color: rgba(22, 21, 19, .82); z-index: 2; position: relative;
  opacity: 0; transform: translateY(20px);
}
.v2-hero-actions { margin-top: 4vh; display: flex; gap: 14px; z-index: 2; position: relative; opacity: 0; transform: translateY(20px); }
.v2-btn {
  font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
  padding: 14px 22px; border: 1px solid var(--ink); color: var(--ink); background: transparent;
  position: relative; overflow: hidden; isolation: isolate;
  transition: color .45s var(--ease), border-color .45s var(--ease), transform .2s var(--ease);
}
.v2-btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--ink);
  transform: scaleX(0); transform-origin: right; transition: transform .55s var(--ease);
}
.v2-btn:hover { color: var(--bone); }
.v2-btn:hover::before { transform: scaleX(1); transform-origin: left; }
.v2-btn:active { transform: translateY(1px); }
.v2-btn--primary { background: var(--ink); color: var(--bone); }
.v2-btn--primary::before { background: var(--red); }
.v2-btn--primary:hover { color: var(--bone); border-color: var(--red); }
.v2-hero-bed {
  position: absolute; left: 0; right: 0; bottom: 0; height: 40vh; z-index: 1; margin: 0;
  overflow: hidden; opacity: 0;
}
.v2-hero-bed img {
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%;
  filter: grayscale(1) contrast(1.06) brightness(1.08); mix-blend-mode: multiply;
}
.v2-hero-bed::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(62% 80% at 22% 22%, rgba(244, 241, 234, .96) 0%, rgba(244, 241, 234, .78) 42%, rgba(244, 241, 234, 0) 76%),
    linear-gradient(180deg, var(--bone) 0, rgba(244, 241, 234, .88) 16%, rgba(244, 241, 234, .42) 44%, rgba(244, 241, 234, 0) 74%);
}
@media (max-width: 760px) { .v2-hero-bed { height: 24vh; } .v2-hero-meta { display: none; } }

/* ribbons */
.v2-ribbons {
  border-top: 1px solid var(--hair-ink); border-bottom: 1px solid var(--hair-ink);
  padding: 10px 0; background: var(--bone); overflow: clip;
}
.v2-ribbon { white-space: nowrap; will-change: transform; }
.v2-ribbon span {
  display: inline-block; font-size: clamp(22px, 3.6vw, 46px); letter-spacing: .01em;
  padding-right: 3vw; line-height: 1.25; font-variation-settings: 'wght' 800, 'wdth' 100;
}
.v2-ribbon.r2 span {
  font-variation-settings: 'wght' 150, 'wdth' 100; color: transparent;
  -webkit-text-stroke: 1px rgba(22, 21, 19, .6);
}

/* portal (zoom-through-letter) */
#v2-portal { height: 300vh; background: var(--ink); }
#v2-portal .v2-stage { display: flex; align-items: center; justify-content: center; background: var(--bone); }
#v2-portal .v2-stage.inked { background: var(--ink); }
.v2-o-wrap { position: relative; z-index: 2; line-height: 1; }
.v2-o-glyph { font-weight: 900; font-size: 64vmin; line-height: 1; display: block; font-variation-settings: 'wght' 900; color: var(--ink); }
.v2-portal-line {
  position: absolute; z-index: 3; left: 50%; top: 42%; transform: translate(-50%, -50%);
  color: var(--bone); opacity: 0; font-family: var(--mono); font-size: 12px; letter-spacing: .22em;
  text-transform: uppercase; white-space: nowrap;
}
.v2-shards { position: absolute; inset: 0; z-index: 2; pointer-events: none; color: var(--bone); }
.v2-shard { position: absolute; font-weight: 900; opacity: .16; will-change: transform; line-height: 1; }
.v2-shard.s-deep { font-size: 9vmin; opacity: .10; }
.v2-shard.s-mid { font-size: 16vmin; opacity: .14; }
.v2-shard.s-near { font-size: 26vmin; opacity: .2; }
.v2-portal-eyebrow { position: absolute; left: 3.2vw; top: 96px; z-index: 3; opacity: .55; }

/* manifesto */
#v2-manifesto { height: 220vh; background: var(--ink); }
.v2-manifesto {
  background: var(--ink); color: var(--bone); display: flex; align-items: center;
  padding: 0 3.2vw;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 7%, #000 93%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}
.v2-manifesto .inner { max-width: 1000px; margin: 0 auto; position: relative; z-index: 2; }
.v2-manifesto p {
  font-size: clamp(20px, min(3.8vw, 6vh), 50px); line-height: 1.2; font-weight: 700; letter-spacing: -.02em;
}
.v2-manifesto p .w { opacity: .14; display: inline-block; transition: opacity .4s linear; }
.v2-manifesto p .w.on { opacity: 1; }
.v2-manifesto .mono { display: block; margin-bottom: 5vh; color: rgba(244, 241, 234, .5); }
.v2-mani-shard {
  position: absolute; font-weight: 900; color: rgba(244, 241, 234, .05); z-index: 1;
  font-size: 32vmin; line-height: 1; will-change: transform;
}

/* process */
#v2-process { height: 260vh; background: var(--ink); }
#v2-process .v2-stage { background: var(--ink); color: var(--bone); display: flex; align-items: center; justify-content: center; }
.v2-proc-rule { position: absolute; left: 6vw; right: 6vw; height: 1px; background: var(--hair-bone); }
.v2-proc-rule small {
  position: absolute; right: 0; top: -18px; font-family: var(--mono); font-size: 10px;
  letter-spacing: .2em; color: rgba(244, 241, 234, .4); text-transform: uppercase;
}
.v2-proc-mask { overflow: hidden; line-height: .92; text-align: center; }
#v2ProcTitle {
  display: block; font-size: clamp(64px, 15vw, 220px); letter-spacing: -.02em; white-space: nowrap;
  font-variation-settings: 'wght' 100; will-change: transform; transform: translateY(115%);
}
.v2-proc-hud { position: absolute; left: 6vw; bottom: 9vh; opacity: 0; max-width: 60vw; }
.v2-proc-rail { position: relative; width: min(300px, 40vw); height: 1px; background: var(--hair-bone); margin-bottom: 14px; }
.v2-proc-rail i { position: absolute; top: -3px; width: 1px; height: 7px; background: rgba(244, 241, 234, .4); }
#v2ProcTick { position: absolute; top: -6px; width: 2px; height: 13px; background: var(--red); }
.v2-proc-read { display: flex; gap: 14px; align-items: baseline; font-family: var(--mono); text-transform: uppercase; letter-spacing: .16em; }
#v2ProcNum { font-size: 13px; color: var(--bone); }
#v2ProcName { font-size: 11px; color: rgba(244, 241, 234, .55); max-width: 44vw; }
#v2ProcName.stamped { animation: v2-stamp .4s var(--ease); }
@keyframes v2-stamp { 0% { opacity: 0; transform: translateY(6px); } 100% { opacity: 1; transform: none; } }

/* what we do band */
.v2-svcband { background: var(--bone); padding: 12vh 3.2vw; }
.v2-svcband h2 { font-weight: 900; font-size: clamp(26px, 3.4vw, 44px); letter-spacing: -.02em; margin-bottom: 6vh; }
.v2-svcband-row {
  display: grid; grid-template-columns: 60px 1fr 2fr; gap: 3vw; align-items: baseline;
  border-top: 1px solid var(--hair-ink); padding: 28px 0;
}
.v2-svcband-row:last-child { border-bottom: 1px solid var(--hair-ink); }
.v2-svcband-row .idx { font-family: var(--mono); font-size: 11px; color: rgba(22, 21, 19, .45); letter-spacing: .14em; }
.v2-svcband-row h3 { font-weight: 700; font-size: clamp(18px, 2.2vw, 26px); letter-spacing: -.01em; }
.v2-svcband-row p { font-size: 14px; line-height: 1.55; color: rgba(22, 21, 19, .65); max-width: 56ch; }
@media (max-width: 760px) { .v2-svcband-row { grid-template-columns: 32px 1fr; } .v2-svcband-row > p, .v2-svcband-row .svc-copy { grid-column: 1 / -1; margin-top: 6px; } }

/* tester */
.v2-tester { background: var(--bone); padding: 16vh 3.2vw; position: relative; }
.v2-tester .v2-head {
  display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 12px;
  border-bottom: 1px solid var(--hair-ink); padding-bottom: 18px; margin-bottom: 7vh;
}
.v2-tester h2 { font-weight: 900; font-size: clamp(26px, 3.4vw, 44px); letter-spacing: -.02em; }
#v2TesterLine {
  display: block; width: 100%; border: 0; outline: none; background: transparent; color: var(--ink);
  font-family: var(--arch); line-height: 1.06; min-height: 1.2em;
  white-space: pre-wrap; word-break: break-word; caret-color: var(--red);
  font-size: clamp(28px, 5vw, 72px);
  font-variation-settings: 'wght' 700, 'wdth' 100;
}
#v2TesterLine:empty::before { content: "Type something true"; color: rgba(22, 21, 19, .25); }
.v2-tester-controls {
  display: grid; grid-template-columns: repeat(3, minmax(160px, 1fr)) auto; gap: 4vw;
  margin-top: 8vh; border-top: 1px solid var(--hair-ink); padding-top: 26px; align-items: center;
}
.v2-ctl label {
  display: flex; justify-content: space-between; margin-bottom: 12px;
  font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: rgba(22, 21, 19, .6);
}
.v2-ctl label b { color: var(--ink); font-weight: 500; }
.v2-tester input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 1px; background: var(--hair-ink); outline: none; }
.v2-tester input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 14px; height: 14px;
  border-radius: 50%; background: var(--red); cursor: pointer; border: 0;
}
.v2-tester input[type=range]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: var(--red); cursor: pointer; border: 0; }
.v2-presets { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.v2-presets button {
  font-family: var(--mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
  padding: 6px 12px; border: 1px solid var(--hair-ink); transition: .25s var(--ease);
}
.v2-presets button:hover, .v2-presets button.on { background: var(--ink); color: var(--bone); border-color: var(--ink); }
@media (max-width: 900px) { .v2-tester-controls { grid-template-columns: 1fr 1fr; gap: 26px; } }
@media (max-width: 560px) { .v2-tester-controls { grid-template-columns: 1fr; } }

/* features */
.v2-features { background: var(--bone); padding: 4vh 3.2vw 16vh; }
.v2-feat-row {
  display: grid; grid-template-columns: 60px 1fr 1.1fr; gap: 3vw; align-items: center;
  border-top: 1px solid var(--hair-ink); padding: 34px 0; cursor: default;
}
.v2-feat-row:last-child { border-bottom: 1px solid var(--hair-ink); }
.v2-feat-row .idx { font-family: var(--mono); font-size: 11px; color: rgba(22, 21, 19, .45); letter-spacing: .14em; }
.v2-feat-row h3 { font-weight: 700; font-size: clamp(18px, 2.2vw, 28px); letter-spacing: -.01em; }
.v2-feat-row .demo {
  font-size: clamp(22px, 3vw, 40px); text-align: right; white-space: nowrap; overflow: hidden;
  font-variation-settings: 'wght' 500; color: rgba(22, 21, 19, .84); transition: color .3s;
}
.v2-feat-row:hover .demo { color: var(--red); }
.v2-feat-row .demo .tnum { font-variant-numeric: tabular-nums; }
@media (max-width: 760px) { .v2-feat-row { grid-template-columns: 40px 1fr; } .v2-feat-row .demo { display: none; } }

/* interlude */
.v2-interlude { position: relative; height: 90vh; overflow: clip; background: var(--ink); }
.v2-interlude img {
  position: absolute; left: 0; top: -12%; width: 100%; height: 124%; object-fit: cover;
  filter: grayscale(1) contrast(1.08) brightness(.5); will-change: transform;
}
.v2-interlude::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(0, 0, 0, .30), rgba(0, 0, 0, .58) 36%, rgba(0, 0, 0, .58) 66%, rgba(0, 0, 0, .32));
}
.v2-interlude .knock {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  z-index: 2; mix-blend-mode: difference; color: #fff; text-align: center; line-height: .92;
}
.v2-interlude .knock .fill { line-height: .92; }
.v2-interlude .knock span { display: block; font-weight: 900; font-size: clamp(40px, 8.5vw, 130px); letter-spacing: -.03em; }
.v2-interlude .credit { position: absolute; right: 3.2vw; bottom: 16px; z-index: 3; color: rgba(255, 255, 255, .5); }

/* Photo shows through the headline in full colour, while the surrounding image
   stays dimmed grayscale. Only applied when an image is actually loaded
   (.has-fill), otherwise the transparent text would be invisible. */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .v2-interlude.has-fill .knock { mix-blend-mode: normal; }
  .v2-interlude.has-fill .knock .fill span {
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /* Make the colour photo inside the letters pop off the b&w background:
       richer colour + a soft light halo so the letters read like they glow. */
    filter: saturate(1.35) brightness(1.12) contrast(1.06)
            drop-shadow(0 0 26px rgba(255, 255, 255, .22));
  }
  .v2-interlude.has-fill .knock .fill span:nth-child(1) { background-position: 50% 40%; }
  .v2-interlude.has-fill .knock .fill span:nth-child(2) { background-position: 50% 60%; }
}

/* featured work (horizontal scroll) */
#v2-work { background: var(--bone); }
#v2-work .v2-head {
  padding: 10vh 3.2vw 6vh; display: flex; justify-content: space-between; align-items: baseline; gap: 20px; flex-wrap: wrap;
}
#v2-work .v2-head h2 { font-weight: 900; font-size: clamp(26px, 3.4vw, 44px); letter-spacing: -.02em; }
.v2-track {
  display: flex; gap: 3vw; padding: 0 3.2vw; align-items: center; height: 70vh; will-change: transform; width: max-content;
}
.v2-frame { position: relative; height: 58vh; flex: none; width: 40vw; overflow: hidden; background: #dedacf; }
@media (max-width: 760px) {
  /* stack the recent-work frames vertically on phones — no horizontal scroll
     container to hijack the vertical swipe (which caused scroll jumping). */
  #v2WorkPin { overflow: visible; }
  .v2-track { transform: none !important; flex-direction: column; align-items: stretch; width: auto; height: auto; gap: 14px; padding: 2vh 3.2vw 4vh; }
  .v2-frame { width: 100%; height: 44vh; }
}
.v2-frame img { width: 112%; height: 112%; object-fit: cover; filter: grayscale(.25) contrast(1.04); will-change: transform; }
.v2-frame .cap {
  position: absolute; left: 14px; bottom: 12px; z-index: 2; color: #fff;
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .5); max-width: calc(100% - 28px);
}
.v2-frame .num { position: absolute; right: 14px; top: 12px; z-index: 2; color: var(--red); font-family: var(--mono); font-size: 11px; letter-spacing: .14em; }
.v2-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .38)); pointer-events: none; }
.v2-frame-empty { padding: 0 3.2vw 14vh; font-family: var(--mono); font-size: 12px; letter-spacing: .1em; color: rgba(22, 21, 19, .5); text-transform: uppercase; }

/* stats ledger */
.v2-ledger { background: var(--ink); color: var(--bone); padding: 16vh 3.2vw; }
.v2-ledger .v2-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 6vw; max-width: 1400px; margin: 0 auto; }
@media (max-width: 900px) { .v2-ledger .v2-grid2 { grid-template-columns: 1fr; } }
.v2-ledger h2 { font-weight: 900; font-size: clamp(24px, 3.2vw, 40px); letter-spacing: -.02em; margin-bottom: 6vh; }
.v2-led-row { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--hair-bone); padding: 20px 2px; }
.v2-led-row .k { font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: rgba(244, 241, 234, .55); }
.v2-led-row .v { font-variant-numeric: tabular-nums; font-weight: 700; font-size: clamp(26px, 3vw, 40px); }
.v2-svc-row { border-bottom: 1px solid var(--hair-bone); padding: 20px 2px; }
.v2-svc-row .t { font-weight: 700; font-size: clamp(16px, 1.6vw, 20px); margin-bottom: 6px; }
.v2-svc-row .d { font-size: 13px; line-height: 1.5; color: rgba(244, 241, 234, .6); max-width: 46ch; }

/* glyph grid (sits side-by-side with stats inside .v2-ledger) */
.v2-glyphs { display: grid; grid-template-columns: repeat(8, 1fr); border: 1px solid var(--hair-bone); }
@media (max-width: 760px) { .v2-glyphs { grid-template-columns: repeat(5, 1fr); } }
.v2-glyph {
  aspect-ratio: 1; display: grid; place-items: center; border-right: 1px solid var(--hair-bone);
  border-bottom: 1px solid var(--hair-bone); font-size: clamp(16px, 1.8vw, 26px); font-weight: 500;
  font-variation-settings: 'wght' 500;
  transition: background .25s var(--ease), color .25s var(--ease), font-variation-settings .35s var(--ease);
  opacity: 0; transform: scale(.8);
}
.v2-glyph:hover { background: var(--bone); color: var(--ink); font-variation-settings: 'wght' 900; }

/* pricing-style rows (service tiers, no fixed pricing) */
.v2-tiers { background: var(--bone); padding: 16vh 3.2vw; }
.v2-tiers .v2-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 12px; margin-bottom: 7vh; }
.v2-tiers h2 { font-weight: 900; font-size: clamp(26px, 3.4vw, 44px); letter-spacing: -.02em; }
.v2-tier-row {
  display: grid; grid-template-columns: 1fr clamp(150px, 20vw, 260px); gap: 3vw; align-items: center;
  border-top: 1px solid var(--hair-ink); padding: 38px 0; position: relative; cursor: pointer;
  transition: padding-left .4s var(--ease);
}
.v2-tier-row:last-of-type { border-bottom: 1px solid var(--hair-ink); }
.v2-tier-row:hover { padding-left: 18px; }
.v2-tier-row::before {
  content: ""; position: absolute; left: 0; top: -1px; height: 1px; width: 0; background: var(--red);
  transition: width .5s var(--ease);
}
.v2-tier-row:hover::before { width: 100%; }
.v2-tier-row h3 { font-weight: 900; font-size: clamp(22px, 3.2vw, 42px); letter-spacing: -.02em; }
.v2-tier-row p { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(22, 21, 19, .5); margin-top: 8px; }
.v2-tier-row .go {
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  display: flex; align-items: center; gap: 10px; justify-self: end;
}
.v2-tier-row .go i { font-style: normal; transition: transform .35s var(--ease); }
.v2-tier-row:hover .go i { transform: translateX(8px); }
.v2-tier-note { margin-top: 5vh; font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(22, 21, 19, .45); }

/* cta */
.v2-cta { background: var(--bone); padding: 16vh 3.2vw; }
.v2-cta-inner {
  border-top: 1px solid var(--hair-ink); border-bottom: 1px solid var(--hair-ink);
  padding: 6vh 0; display: flex; justify-content: space-between; align-items: center; gap: 4vw; flex-wrap: wrap;
}
.v2-cta-inner h2 { font-weight: 900; font-size: clamp(28px, 4vw, 54px); letter-spacing: -.02em; max-width: 16ch; }
.v2-cta-inner p { margin-top: 1.6vh; font-size: 15px; color: rgba(22, 21, 19, .68); max-width: 42ch; }

/* footer */
main.v2-main { position: relative; z-index: 2; background: var(--bone); }
.v2-footer {
  position: sticky; bottom: 0; z-index: 1; background: #0c0b0a; color: var(--bone);
  padding: 10vh 3.2vw 4vh; min-height: 60vh; display: flex; flex-direction: column; justify-content: space-between; overflow: clip;
}
.v2-foot-zero {
  position: absolute; right: -5vw; bottom: -20vh; z-index: 0; pointer-events: none; user-select: none;
  font-weight: 900; font-size: 80vh; line-height: 1; color: transparent;
  -webkit-text-stroke: 1.5px rgba(244, 241, 234, .09); will-change: transform;
}
.v2-footer > div { position: relative; z-index: 1; }
.v2-foot-mark { font-weight: 900; font-size: clamp(36px, 8.4vw, 130px); letter-spacing: -.03em; line-height: .9; user-select: none; }
.v2-foot-mark .fch { display: inline-block; font-variation-settings: 'wght' 900; }
.v2-foot-cta {
  margin: 5vh 0 0; display: inline-flex; align-items: center; gap: 16px;
  font-family: var(--mono); font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
  border: 1px solid rgba(244, 241, 234, .4); padding: 16px 26px; width: max-content;
  position: relative; overflow: hidden; isolation: isolate; color: var(--bone);
  transition: color .45s var(--ease), border-color .45s var(--ease);
}
.v2-foot-cta::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--red);
  transform: scaleX(0); transform-origin: right; transition: transform .55s var(--ease);
}
.v2-foot-cta:hover { color: var(--bone); border-color: var(--red); }
.v2-foot-cta:hover::before { transform: scaleX(1); transform-origin: left; }
.v2-foot-cta span { transition: transform .4s var(--ease); }
.v2-foot-cta:hover span { transform: translateX(5px); }
.v2-foot-cols {
  display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  border-top: 1px solid rgba(244, 241, 234, .18); padding-top: 22px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(244, 241, 234, .75); line-height: 2;
}
.v2-foot-cols a:hover { color: var(--red); }

/* preview banner */
.v2-preview-banner {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; background: var(--red); color: #fff;
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  padding: 10px 3.2vw; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
}
.v2-preview-banner a { text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
  .v2-veil { display: none; }
  .v2-hero-title .row > span { transform: none; }
  .v2-reg-v { transform: scaleY(1); } .v2-reg-h { transform: scaleX(1); } .v2-reg-cross { opacity: 1; }
  .v2-hero-sub, .v2-hero-actions { opacity: 1; transform: none; }
  #v2ProcTitle { transform: none; }
  .v2-hero-bed { opacity: 1; }
  .v2-proc-hud { opacity: 1; }
  .v2-manifesto p .w { opacity: 1; }
  body::after { animation: none; }
}