:root {
  --cream: #F4EFE6;
  --cream-2: #E7DFD1;
  --ink: #12140F;
  --coral: #D9553B;
  --coral-ink: #B33F27;
  --amber: #D9992B;
  --amber-ink: #A66C10;
  --teal: #1B6F6A;
  --green: #2F5D3A;
  --ink-82: rgba(18, 20, 15, .82);
  --ink-74: rgba(18, 20, 15, .74);
  --ink-62: rgba(18, 20, 15, .62);
  --rule: rgba(18, 20, 15, .2);
  --rule-strong: rgba(18, 20, 15, .5);
  --pad: clamp(20px, 4.5vw, 96px);
  --display: 'Anton', 'Archivo Black', 'Bebas Neue', Oswald, Impact, sans-serif;
  --body: 'Archivo', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --nf-gutter: var(--pad);
  --nf-ink: #F4EFE6;
  --nf-ink-soft: #C2BFB7;
  --nf-faint: #95938C;
  --nf-accent: var(--coral);
  --nf-accent-ink: var(--amber);
  --nf-on-accent: var(--ink);
  --nf-focus: var(--amber);
  --nf-line: #32332D;
  --nf-line-strong: #7A7972;
  --nf-underline: #565650;
  --nf-mono: var(--mono);
  --nf-display: Georgia, "Noto Serif", "Times New Roman", serif;
}

*, *::before, *::after { box-sizing: border-box; }

[hidden] { display: none !important; }

html { background: var(--ink); scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--ink);
  color: var(--ink);
  font-family: var(--body);
  font-size: var(--fs-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

img, video, canvas, picture { display: block; }
h1, h2, h3, p { margin: 0; }
a { color: var(--coral-ink); }
a:hover { color: var(--ink); }

:focus-visible { outline: 2px solid var(--coral-ink); outline-offset: 3px; border-radius: 2px; }
.hero :focus-visible, .close :focus-visible, .watch :focus-visible, .netbar :focus-visible, .sitefoot :focus-visible { outline-color: var(--amber); }

.skip {
  font-family: var(--mono);
  font-size: var(--fs-small);
  letter-spacing: .12em;
  text-transform: uppercase;
  background: var(--amber);
  color: var(--ink);
  padding: 12px 16px;
}

.vh {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.page { background: var(--ink); }
main { display: block; }
main:focus { outline: none; }

.netbar {
  background: var(--ink);
  padding-block: 12px;
  gap: 8px 12px;
}
.netbar-chip {
  order: -1;
  flex: 0 1 auto;
  min-width: 0;
  white-space: normal;
  padding: 4px 14px;
  border-radius: 12px;
  line-height: 1.45;
}
.netbar-mark, .foot-mark { font-weight: 700; }
@media (min-width: 1100px) {
  .netbar-chip { order: 0; white-space: nowrap; border-radius: 999px; padding: 0 13px; }
}

.sitefoot { background: var(--ink); }

.eyebrow { display: inline-flex; flex-direction: column; gap: 7px; }
.eyebrow b {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--coral-ink);
}
.eyebrow i { display: block; height: 2px; background: var(--coral); }

.btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 14px 22px;
  text-decoration: none;
  white-space: nowrap;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.btn-light { border: 1px solid rgba(244, 239, 230, .6); color: var(--cream); background: rgba(18, 20, 15, .55); }
.btn-light:hover { background: var(--cream); color: var(--ink); border-color: var(--cream); }
.btn-dark { border: 1px solid var(--rule-strong); color: var(--ink); }
.btn-dark:hover { background: var(--ink); color: var(--cream); border-color: var(--ink); }
.btn-amber { background: var(--amber); border: 1px solid var(--amber); color: var(--ink); }
.btn-amber:hover { background: var(--cream); border-color: var(--cream); color: var(--ink); }

.hero { position: relative; height: 400vh; background: var(--ink); }
.hero-stage {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  width: 100%;
  overflow: hidden;
  background: var(--ink);
}
.hero-frame { position: absolute; inset: -2%; will-change: transform; }
.hero-frame img, .hero-frame canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-frame .still-3 { opacity: 0; }
.hero-canvas { opacity: 0; transition: opacity .35s linear; }
.hero-canvas.is-live { opacity: 1; }
.hero-scrim, .hero-shade, .hero-band {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.hero-scrim { background: linear-gradient(180deg, rgba(18, 20, 15, .8) 0%, rgba(18, 20, 15, .46) 12%, rgba(18, 20, 15, .1) 26%, rgba(18, 20, 15, 0) 40%, rgba(18, 20, 15, .1) 70%, rgba(18, 20, 15, .72) 100%); }
.hero-shade { background: linear-gradient(0deg, rgba(18, 20, 15, .88) 0%, rgba(18, 20, 15, .8) 34%, rgba(18, 20, 15, .7) 60%, rgba(18, 20, 15, .46) 78%, rgba(18, 20, 15, 0) 96%); }
.hero-band { opacity: 0; background: linear-gradient(180deg, rgba(18, 20, 15, 0) 12%, rgba(18, 20, 15, .8) 33%, rgba(18, 20, 15, .82) 50%, rgba(18, 20, 15, .8) 67%, rgba(18, 20, 15, 0) 88%); }
.site-head {
  position: absolute;
  top: clamp(18px, 3.2vw, 40px);
  left: var(--pad);
  right: var(--pad);
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px 20px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--cream);
}
.site-head .brand { display: flex; align-items: center; gap: 11px; }
.site-head .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--coral); }
.site-head .made { letter-spacing: .14em; color: var(--cream); }
.site-head, .hero-count, .cue { text-shadow: 0 1px 3px rgba(18, 20, 15, .9); }
.hero-copy {
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(76px, 10vh, 124px);
  padding: 0 var(--pad);
  will-change: transform, opacity;
}
.hero-copy h1 {
  font-family: var(--display);
  font-weight: 400;
  font-size: min(19vw, max(15vw, 114px), 19.5vh);
  line-height: .9;
  letter-spacing: -.025em;
  text-transform: uppercase;
  color: var(--cream);
  text-shadow: 0 2px 44px rgba(18, 20, 15, .32);
}
.hero-copy h1 > span { display: block; }
.hero-copy h1 .accent { color: var(--amber); }
.hero-sub {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 18px 24px;
  margin-top: clamp(16px, 2.4vh, 30px);
}
.hero-sub p {
  max-width: 40ch;
  font-size: clamp(15px, 1.05vw, 17px);
  line-height: 1.6;
  color: rgba(244, 239, 230, .92);
  text-shadow: 0 1px 18px rgba(18, 20, 15, .5);
  text-wrap: pretty;
}
.hero-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px clamp(16px, 2.4vw, 32px); }
.hero-count {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .24em;
  text-transform: uppercase;
  color: rgba(244, 239, 230, .9);
}
.hero-lines { position: absolute; inset: 0; display: flex; align-items: center; padding: 0 var(--pad); pointer-events: none; }
.hero-lines .inner { position: relative; width: 100%; }
.hero-line {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--display);
  font-weight: 400;
  font-size: min(16vw, max(9vw, 96px));
  line-height: .9;
  letter-spacing: -.028em;
  text-transform: uppercase;
  color: var(--cream);
  text-shadow: 0 2px 44px rgba(18, 20, 15, .34);
  will-change: transform, opacity;
}
.hero-line.amber { color: var(--amber); }
.js .hero-line { opacity: 0; visibility: hidden; }
.cue {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--cream);
}
.cue .bar { position: relative; display: block; width: 1px; height: 36px; overflow: hidden; background: rgba(244, 239, 230, .2); }
.cue .bar span { position: absolute; inset: 0; background: var(--cream); animation: cue 2s cubic-bezier(.6, 0, .35, 1) infinite; }
@keyframes cue { 0% { transform: translateY(-110%); } 100% { transform: translateY(110%); } }

html:not(.js) .hero-lines { position: static; padding: clamp(60px, 10vh, 120px) var(--pad); display: block; }
html:not(.js) .hero-line { position: static; transform: none; margin: 0 0 .12em; }
html:not(.js) .hero { height: auto; }
html:not(.js) .hero-stage { position: static; height: auto; overflow: visible; padding-bottom: clamp(40px, 8vh, 90px); }
html:not(.js) .hero-frame { position: relative; inset: auto; height: 64vh; }
html:not(.js) .hero-canvas, html:not(.js) .hero-scrim, html:not(.js) .hero-shade, html:not(.js) .hero-band, html:not(.js) .cue { display: none; }
html:not(.js) .site-head { position: static; padding: clamp(20px, 3.6vw, 44px) var(--pad) 0; }
html:not(.js) .hero-copy { position: static; padding: clamp(28px, 5vh, 64px) var(--pad) 0; }
html:not(.js) .manifesto { height: auto; }
html:not(.js) .m-stage { position: static; height: auto; }
html:not(.js) .m-view { overflow-x: auto; }
html:not(.js) .m-foot { display: none; }
html:not(.js) .close { height: auto; }
html:not(.js) .close-stage { position: relative; height: auto; min-height: 100vh; }
html:not(.js) .sitefoot .linkish { display: none; }

.stacked {
  position: relative;
  background: var(--cream);
  color: var(--ink);
  padding: clamp(84px, 13vh, 160px) var(--pad) clamp(84px, 13vh, 150px);
}
.stacked .grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(330px, 100%), 1fr));
  gap: clamp(36px, 4.5vw, 80px);
  align-items: start;
}
.stacked .col { display: flex; flex-direction: column; align-items: flex-start; gap: clamp(30px, 4.4vh, 54px); }
.stacked .head { display: flex; flex-direction: column; gap: clamp(16px, 2.4vh, 26px); }
.stacked h2 {
  font-family: var(--display);
  font-weight: 400;
  font-size: min(14vw, max(9.5vw, 80px));
  line-height: .9;
  letter-spacing: -.028em;
  text-transform: uppercase;
  color: var(--ink);
}
.stacked h2 > span { display: block; }
.lede { max-width: 62ch; font-size: clamp(16px, 1.15vw, 18px); line-height: 1.68; color: var(--ink-82); text-wrap: pretty; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: clamp(20px, 2.4vw, 36px); margin: 0; padding: 0; }
.stat dt {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(52px, 5vw, 92px);
  line-height: .86;
  letter-spacing: -.03em;
  color: var(--amber-ink);
}
.stat dd {
  border-top: 1px solid var(--rule);
  padding-top: 12px;
  margin: 16px 0 0;
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-74);
  text-wrap: pretty;
}
.stats-wrap { display: flex; flex-direction: column; gap: clamp(14px, 2vh, 22px); align-self: stretch; }
.fiction-note {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .04em;
  line-height: 1.55;
  color: var(--ink-62);
  max-width: 66ch;
}
.figure { position: relative; width: 100%; overflow: hidden; background: var(--cream-2); }
.figure.tall { aspect-ratio: 5 / 7; }
.figure .px { position: absolute; left: 0; right: 0; top: -9%; height: 118%; }
.figure .px img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.canopy {
  position: relative;
  overflow: hidden;
  background: var(--teal);
  color: var(--cream);
  padding: clamp(84px, 13vh, 160px) var(--pad) 0;
}
.canopy .eyebrow b { color: var(--cream); }
.canopy .eyebrow { margin-bottom: clamp(22px, 3vh, 40px); }
.canopy h2 {
  font-family: var(--display);
  font-weight: 400;
  font-size: min(13vw, max(8vw, 78px));
  line-height: .9;
  letter-spacing: -.028em;
  text-transform: uppercase;
  color: var(--cream);
}
.canopy .claim {
  margin-top: clamp(20px, 3vh, 34px);
  max-width: 24ch;
  font-size: clamp(19px, 2vw, 30px);
  font-weight: 500;
  line-height: 1.28;
  color: var(--cream);
  text-wrap: pretty;
}
.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr));
  gap: clamp(28px, 3.4vw, 58px);
  margin-top: clamp(48px, 7vh, 96px);
  align-items: start;
}
.card .figure { aspect-ratio: 4 / 5; background: rgba(18, 20, 15, .28); }
.card .px { top: -8%; height: 116%; }
.card .px img { transition: transform 1.1s cubic-bezier(.2, .7, .3, 1); }
.card:hover .px img { transform: scale(1.055); }
.card .scrim {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(18, 20, 15, .42) 0%, rgba(18, 20, 15, .06) 26%, rgba(18, 20, 15, .16) 44%, rgba(18, 20, 15, .7) 70%, rgba(18, 20, 15, .92) 100%);
}
.card .cap {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  gap: clamp(10px, 1.4vh, 16px);
  padding: 72px clamp(20px, 2.4vw, 36px) clamp(20px, 2.4vw, 36px);
  background: linear-gradient(180deg, rgba(18, 20, 15, 0) 0%, rgba(18, 20, 15, .84) 60px, rgba(18, 20, 15, .9) 100%);
}
.card .cap h3 {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--amber);
}
.card .cap p {
  max-width: 46ch;
  font-size: clamp(15px, 1.02vw, 16px);
  line-height: 1.58;
  color: var(--cream);
  text-shadow: 0 2px 24px rgba(18, 20, 15, .7);
  text-wrap: pretty;
}
.card.offset { margin-top: clamp(0px, 7vh, 96px); }
.marquee {
  margin: clamp(44px, 6vh, 88px) calc(-1 * var(--pad)) 0;
  border-top: 1px solid rgba(244, 239, 230, .24);
  border-bottom: 1px solid rgba(244, 239, 230, .24);
  overflow: hidden;
  padding: clamp(20px, 2.8vh, 36px) 0;
}
.marquee .rail { display: flex; width: max-content; animation: marquee 42s linear infinite; }
.marquee span {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(30px, 4vw, 64px);
  line-height: 1.06;
  letter-spacing: -.01em;
  text-transform: uppercase;
  color: rgba(244, 239, 230, .92);
  padding-right: .35em;
  white-space: nowrap;
}
@keyframes marquee { to { transform: translateX(-50%); } }

.manifesto { position: relative; background: var(--cream); color: var(--ink); height: 320vh; }
.m-stage {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: clamp(20px, 3.4vh, 40px);
  overflow: hidden;
  padding: clamp(24px, 4vh, 52px) 0;
}
.m-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 0 var(--pad); }
.m-head .note, .m-foot .lab {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-62);
}
.m-view { flex: 0 1 auto; display: flex; align-items: center; overflow: hidden; }
.m-view:focus-visible { outline: 2px solid var(--coral-ink); outline-offset: -2px; }
.m-rail { display: flex; align-items: stretch; gap: clamp(16px, 2vw, 32px); padding: 0 var(--pad); margin: 0; list-style: none; will-change: transform; }
.m-card {
  flex: 0 0 auto;
  width: min(76vw, 430px);
  height: min(64vh, 600px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--ink);
  color: var(--cream);
}
.m-card.teal { background: var(--teal); }
.m-art { position: relative; flex: 1 1 auto; min-height: 0; background: rgba(244, 239, 230, .05); }
.m-body { display: flex; flex-direction: column; gap: 9px; padding: clamp(18px, 2vw, 28px); }
.m-body .num { font-family: var(--mono); font-size: var(--fs-micro); font-weight: 500; letter-spacing: .22em; color: var(--amber); }
.m-card.teal .m-body .num { color: var(--cream); }
.m-body h3 {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(27px, 2.5vw, 42px);
  line-height: .95;
  letter-spacing: -.022em;
  text-transform: uppercase;
}
.m-body h3 > span { display: block; }
.m-body p { max-width: 44ch; font-size: 15px; line-height: 1.5; color: rgba(244, 239, 230, .8); text-wrap: pretty; }
.m-card.teal .m-body p { color: rgba(244, 239, 230, .94); }
.m-foot { display: flex; align-items: center; gap: clamp(14px, 2vw, 28px); padding: 0 var(--pad); }
.m-foot .lab { white-space: nowrap; }
.m-track { position: relative; flex: 1; height: 1px; background: rgba(18, 20, 15, .18); }
.m-bar { position: absolute; left: 0; top: -1px; height: 3px; width: 0; background: var(--coral); }
.art-bars { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: clamp(14px, 2.8vh, 28px); padding: clamp(26px, 3vw, 42px); }
.art-bars i { display: block; height: 8px; }
.art-bars i:nth-child(1) { width: 32%; background: rgba(244, 239, 230, .28); }
.art-bars i:nth-child(2) { width: 48%; background: rgba(244, 239, 230, .4); }
.art-bars i:nth-child(3) { width: 64%; background: rgba(244, 239, 230, .54); }
.art-bars i:nth-child(4) { width: 80%; background: rgba(244, 239, 230, .72); }
.art-bars i:nth-child(5) { width: 100%; background: var(--amber); }
.art-grid {
  position: absolute;
  inset: clamp(26px, 3vw, 42px);
  border: 1px solid rgba(244, 239, 230, .34);
  background-image: repeating-linear-gradient(90deg, rgba(244, 239, 230, .2) 0 1px, transparent 1px 25%), repeating-linear-gradient(0deg, rgba(244, 239, 230, .2) 0 1px, transparent 1px 20%);
}
.art-grid i { position: absolute; width: 25%; height: 20%; background: var(--green); box-shadow: inset 0 0 0 1px rgba(244, 239, 230, .38); }
.art-grid i:nth-child(1) { left: 25%; top: 0; }
.art-grid i:nth-child(2) { left: 0; top: 40%; }
.art-grid i:nth-child(3) { left: 50%; top: 20%; }
.art-grid i:nth-child(4) { left: 75%; top: 60%; }
.art-grid i:nth-child(5) { left: 25%; top: 80%; }
.art-shade { position: absolute; inset: clamp(26px, 3vw, 42px); display: flex; flex-direction: column; }
.art-shade .top { height: 10px; background: var(--amber); }
.art-shade .hatch { flex: 1 1 auto; background-image: repeating-linear-gradient(135deg, rgba(201, 160, 99, .45) 0 1px, transparent 1px 13px); }
.art-shade .box { height: 36%; border: 1px dashed rgba(244, 239, 230, .34); }
.art-levels { position: absolute; inset: clamp(26px, 3vw, 42px); background-image: repeating-linear-gradient(0deg, rgba(244, 239, 230, .68) 0 4px, transparent 4px 20%); }
.art-levels i { position: absolute; width: 12px; height: 11px; background: rgba(244, 239, 230, .85); }
.art-levels i:nth-child(1) { left: 12%; top: calc(80% - 15px); background: var(--amber); }
.art-levels i:nth-child(2) { left: 58%; top: calc(80% - 15px); }
.art-levels i:nth-child(3) { left: 30%; top: calc(60% - 15px); }
.art-levels i:nth-child(4) { left: 70%; top: calc(40% - 15px); background: var(--coral); }
.art-levels i:nth-child(5) { left: 20%; top: calc(20% - 15px); }
.art-levels i:nth-child(6) { left: 62%; top: calc(100% - 15px); background: var(--amber); }

.close { position: relative; height: 210vh; background: var(--ink); }
.close-stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; background: var(--ink); }
.close-stage > picture > img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
.close-fig { filter: drop-shadow(0 26px 54px rgba(18, 20, 15, .35)); }
.close h2 {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  padding: 0 var(--pad);
  transform: translateY(-50%);
  font-family: var(--display);
  font-weight: 400;
  font-size: min(13.83vw, 33.9vh);
  line-height: .86;
  letter-spacing: -.034em;
  text-transform: uppercase;
  color: var(--amber);
  text-shadow: 0 4px 60px rgba(18, 20, 15, .5);
  will-change: transform, opacity;
}
.close h2 > span { display: block; }
.close h2 .line2 { margin-top: .14em; }
.close h2 .cream { color: var(--cream); }
.js .close h2 { opacity: 0; transform: translateY(calc(-50% + 78vh)); }
.close-band {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(18, 20, 15, 0) 6%, rgba(18, 20, 15, .76) 24%, rgba(18, 20, 15, .8) 50%, rgba(18, 20, 15, .76) 76%, rgba(18, 20, 15, .3) 94%);
}
.js .close-band { opacity: 0; }
.close-scrim {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: clamp(230px, 38vh, 360px);
  pointer-events: none;
  background: linear-gradient(180deg, rgba(18, 20, 15, 0) 0%, rgba(18, 20, 15, .5) 42%, rgba(18, 20, 15, .9) 100%);
}
.close-copy {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0 var(--pad) clamp(24px, 3.4vh, 44px);
  display: flex;
  flex-direction: column;
  gap: clamp(18px, 2.6vh, 30px);
  max-width: min(720px, 66%);
}
.close-copy .row { display: flex; flex-wrap: wrap; gap: 14px; }
.close-sig {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid rgba(244, 239, 230, .3);
  padding-top: 16px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(244, 239, 230, .84);
}

.about {
  background: var(--cream);
  color: var(--ink);
  padding: clamp(84px, 12vh, 150px) var(--pad) clamp(84px, 12vh, 140px);
}
.about .grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
  gap: clamp(40px, 5vw, 96px);
  align-items: start;
}
.about .head { display: flex; flex-direction: column; gap: clamp(16px, 2.4vh, 26px); margin-bottom: clamp(24px, 3.4vh, 40px); }
.about h2 {
  font-family: var(--display);
  font-weight: 400;
  font-size: min(13vw, max(7vw, 72px));
  line-height: .9;
  letter-spacing: -.028em;
  text-transform: uppercase;
}
.about h2 > span { display: block; }
.about .copy p { max-width: 60ch; font-size: clamp(16px, 1.1vw, 18px); line-height: 1.68; color: var(--ink-82); text-wrap: pretty; }
.about .copy p + p { margin-top: 16px; }
.about .copy strong { color: var(--ink); font-weight: 500; }
.about a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--coral); text-underline-offset: 3px; }
.about a:hover { color: var(--coral-ink); }
.faq { display: flex; flex-direction: column; }
.faq h3 {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--coral-ink);
  margin: 0 0 12px;
}
.faq-item { padding: 22px 0 24px; border-top: 1px solid var(--rule); }
.faq-item:last-child { border-bottom: 1px solid var(--rule); }
.faq-item h4 {
  margin: 0 0 8px;
  font-family: var(--body);
  font-size: clamp(18px, 1.3vw, 20px);
  font-weight: 500;
  line-height: 1.35;
  color: var(--ink);
}
.faq-item p { max-width: 62ch; font-size: 16px; line-height: 1.62; color: var(--ink-82); text-wrap: pretty; }

.watch {
  --yt-display: var(--display);
  --yt-body: var(--body);
  --yt-ui: var(--mono);
  --yt-ink: var(--cream);
  --yt-ink-soft: #C2BFB7;
  --yt-line: #32332D;
  --yt-underline: #7A7972;
  --yt-focus: var(--amber);
  --yt-radius: 0px;
  --yt-shadow: rgba(0, 0, 0, .7);
  --yt-display-case: uppercase;
  --yt-display-weight: 400;
  --yt-display-tracking: -.01em;
  --yt-name-size: clamp(22px, 2vw, 30px);
  --yt-label-size: clamp(24px, 2.5vw, 34px);
  --yt-label-weight: 400;
  --yt-band-gap: clamp(36px, 5vw, 60px);
  --yt-band-shadow: 0 22px 48px rgba(0, 0, 0, .4);
  --yt-band-shadow-hover: 0 28px 56px rgba(0, 0, 0, .5);
  background: var(--ink);
  color: var(--cream);
  padding: clamp(84px, 12vh, 150px) var(--pad) clamp(72px, 10vh, 120px);
}
.watch-inner { max-width: 1280px; }
.watch-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px 48px;
  margin-bottom: clamp(30px, 4vh, 48px);
}
.watch .eyebrow { margin-bottom: clamp(16px, 2.4vh, 26px); }
.watch .eyebrow b { color: var(--amber); }
.watch h2 {
  font-family: var(--display);
  font-weight: 400;
  font-size: min(13vw, max(7vw, 72px));
  line-height: .9;
  letter-spacing: -.028em;
  text-transform: uppercase;
  color: var(--cream);
}
.watch h2 > span { display: block; }
.watch h2 .accent { color: var(--amber); }
.watch-head > p { max-width: 44ch; font-size: clamp(16px, 1.1vw, 18px); line-height: 1.65; color: #C2BFB7; text-wrap: pretty; }
.watch .yt-player-note a:hover, .watch .yt-watch-meta a:hover { color: var(--amber); }

.js [data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity .75s cubic-bezier(.22, .61, .36, 1), transform .75s cubic-bezier(.22, .61, .36, 1);
}
.js [data-reveal].is-in { opacity: 1; transform: none; }

@media (max-width: 640px) {
  .close-copy { max-width: 100%; }
  .site-head .made { flex-basis: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
  }
  .js [data-reveal] { opacity: 1; transform: none; }
  .js .hero-line { opacity: 1; visibility: visible; position: static; transform: none; margin: 0 0 .12em; }
  .hero-lines { position: static; padding: clamp(60px, 10vh, 120px) var(--pad); display: block; }
  .hero { height: auto; }
  .hero-stage { position: relative; height: auto; min-height: 100vh; padding-bottom: clamp(40px, 8vh, 90px); }
  .hero-canvas { display: none; }
  .hero-copy { position: static; padding: clamp(120px, 18vh, 220px) var(--pad) 0; }
  .cue { display: none; }
  .manifesto { height: auto; }
  .m-stage { position: static; height: auto; }
  .m-view { overflow-x: auto; scroll-snap-type: x proximity; }
  .m-card { scroll-snap-align: start; }
  .close { height: auto; }
  .close-stage { position: relative; height: auto; min-height: 100vh; }
  .js .close h2 { opacity: 1; transform: translateY(-50%); }
  .js .close-band { opacity: 1; }
  .hero-band { display: none; }
}
