:root {
  --ink: #070605;
  --ink-soft: #100e0c;
  --pearl: #eee8de;
  --champagne: #c9b89f;
  --muted: #978b7b;
  --line: rgba(230, 218, 198, .24);
  --serif: Didot, "Bodoni 72", "Bodoni MT", "Times New Roman", serif;
  --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; color: var(--pearl); background: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { display: block; max-width: 100%; }
button, a { color: inherit; }
button { font: inherit; }
::selection { color: #0a0908; background: var(--champagne); }

.skip-link { position: fixed; z-index: 100; top: 12px; left: 12px; padding: 12px 16px; color: #090807; background: var(--pearl); transform: translateY(-160%); transition: transform .2s ease; }
.skip-link:focus { transform: translateY(0); }

.hero { position: relative; min-height: 100svh; overflow: hidden; isolation: isolate; background: #030303; }
.hero__media, .hero__media img, .hero__veil { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__media { z-index: -3; }
.hero__media img { object-fit: cover; object-position: center; }
.hero__veil { z-index: -2; background: linear-gradient(90deg, transparent 40%, rgba(5,4,3,.04) 52%, rgba(5,4,3,.3) 100%); }
.hero__content { width: 43%; min-height: 100svh; margin-left: 55%; padding: clamp(42px, 5.2vh, 80px) clamp(34px, 5vw, 100px) 28px; display: flex; flex-direction: column; align-items: center; text-align: center; }

.identity { width: 100%; }
.wordmark { margin: 0; color: #f4efe7; font-family: var(--serif); font-size: clamp(72px, 8vw, 136px); font-weight: 400; line-height: .82; letter-spacing: .065em; text-indent: .065em; text-shadow: 0 0 30px rgba(255,245,226,.08); }
.wordmark span { font-size: .72em; vertical-align: .08em; padding: 0 .035em; }
.eyebrow { margin: 25px 0 0; color: var(--champagne); font-size: clamp(10px, .92vw, 15px); font-weight: 400; letter-spacing: .55em; line-height: 1.5; text-transform: uppercase; text-indent: .55em; }

.hero__statement { margin-top: clamp(22px, 4.2vh, 54px); }
.rule { display: block; width: 54px; height: 1px; margin: 0 auto clamp(16px, 2.5vh, 28px); background: linear-gradient(90deg, transparent, var(--muted), transparent); }
.hero h1 { margin: 0; font-family: var(--serif); font-size: clamp(22px, 2vw, 34px); font-weight: 400; letter-spacing: .1em; line-height: 1.18; }

.biometric { appearance: none; border: 0; margin: clamp(20px, 3vh, 34px) 0 0; padding: 0; color: var(--pearl); background: transparent; cursor: pointer; display: flex; flex-direction: column; align-items: center; }
.biometric__orb { position: relative; width: clamp(180px, 18vw, 278px); aspect-ratio: 1; border: 1px solid rgba(207,190,166,.28); border-radius: 50%; display: grid; place-items: center; transition: border-color .6s ease, box-shadow .6s ease, transform .6s cubic-bezier(.2,.8,.2,1); overflow: hidden; }
.biometric__orb::before, .biometric__orb::after { content: ""; position: absolute; inset: 10%; border-radius: 50%; border: 1px solid transparent; transition: border-color .6s ease, inset .6s ease; }
.biometric__orb::after { inset: 12%; background: radial-gradient(circle at 42% 42%, rgba(218,198,169,.16), rgba(145,126,101,.05) 48%, transparent 72%); }
.fingerprint { position: relative; z-index: 1; width: 58%; height: 74%; object-fit: contain; filter: brightness(1.6) contrast(1.06) drop-shadow(0 4px 4px rgba(0,0,0,.72)); transition: filter .6s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.scan-line { position: absolute; z-index: 2; left: 22%; right: 22%; top: 18%; height: 1px; opacity: 0; background: linear-gradient(90deg, transparent, #e5d2b2, transparent); box-shadow: 0 0 14px #c5a97e; }
.biometric__label { margin-top: 18px; font-size: 11px; letter-spacing: .48em; text-transform: uppercase; text-indent: .48em; }
.arrow { width: 14px; height: 34px; margin-top: 12px; border-bottom: 1px solid var(--champagne); position: relative; transform: rotate(45deg); }
.arrow::after { content: ""; position: absolute; right: -1px; bottom: -1px; width: 9px; border-bottom: 1px solid var(--champagne); transform-origin: right; transform: rotate(-45deg); }
.biometric:hover .biometric__orb, .biometric:focus-visible .biometric__orb { border-color: rgba(220,199,166,.65); box-shadow: inset 0 0 36px rgba(194,163,118,.06), 0 0 32px rgba(194,163,118,.08); transform: scale(1.025); }
.biometric:hover .fingerprint, .biometric:focus-visible .fingerprint { filter: brightness(1.08) contrast(1.08) sepia(.16) drop-shadow(0 0 8px rgba(220,194,153,.42)); transform: scale(1.035); }
.biometric:focus-visible { outline: 1px solid var(--champagne); outline-offset: 12px; border-radius: 2px; }
.biometric.is-scanning .scan-line { animation: scan 1.05s cubic-bezier(.4,0,.2,1); }
.biometric.is-scanning .biometric__orb::before { border-color: rgba(225,205,174,.48); inset: 4%; }
@keyframes scan { 0% { top: 18%; opacity: 0; } 15%,85% { opacity: 1; } 100% { top: 82%; opacity: 0; } }

.signature { margin: auto 0 0; padding-top: 16px; color: #b8aa97; font-size: 8px; line-height: 1.8; letter-spacing: .42em; text-transform: uppercase; }
.signature span { color: #e3d7c7; }
.hero__index { position: absolute; right: 22px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: center; gap: 10px; color: rgba(226,213,194,.5); font-size: 8px; letter-spacing: .15em; }
.hero__index i { display: block; width: 1px; height: 62px; background: linear-gradient(var(--champagne) 33%, rgba(202,184,159,.22) 33%); }

[data-reveal] { opacity: 0; transform: translateY(12px); transition: opacity 1.2s ease, transform 1.2s cubic-bezier(.2,.8,.2,1); }
body.is-ready [data-reveal] { opacity: 1; transform: translateY(0); }
body.is-ready .hero__statement { transition-delay: .18s; }
body.is-ready .signature { transition-delay: .4s; }

.section { position: relative; min-height: 100svh; padding: clamp(80px, 10vw, 160px); overflow: hidden; }
.section__number { color: var(--muted); font-size: 9px; letter-spacing: .4em; text-transform: uppercase; }
.kicker { margin: 0 0 24px; color: var(--champagne); font-family: var(--serif); font-size: 18px; font-style: italic; letter-spacing: .08em; }
.manifesto { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(360px, 2fr) minmax(240px, 1fr); align-items: center; gap: 7vw; background: radial-gradient(circle at 84% 46%, #17130f 0, #0d0b09 30%, #070605 65%); }
.manifesto__copy h2, .portrait__content h2, .finale h2 { margin: 0; font-family: var(--serif); font-weight: 400; letter-spacing: -.015em; }
.manifesto__copy h2 { max-width: 840px; font-size: clamp(48px, 6.2vw, 106px); line-height: .99; }
.lede { max-width: 620px; margin: 50px 0 0 auto; color: #aaa094; font-family: var(--serif); font-size: clamp(18px, 1.5vw, 25px); line-height: 1.55; }
.manifesto__mark { justify-self: end; font-family: var(--serif); font-size: clamp(170px, 24vw, 440px); line-height: .7; color: rgba(205,186,157,.04); user-select: none; }
.manifesto__mark span { color: rgba(205,186,157,.1); }

[data-inview] { opacity: 0; transform: translateY(28px); transition: opacity 1s ease, transform 1s cubic-bezier(.2,.8,.2,1); }
[data-inview].is-visible { opacity: 1; transform: translateY(0); }

.portrait { padding: 0; display: grid; grid-template-columns: 1fr 1fr; background: #0a0908; }
.portrait__visual { position: relative; min-height: 100svh; overflow: hidden; }
.portrait__visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 65%, #0a0908 100%); }
.portrait__visual img { width: 100%; height: 100%; object-fit: cover; }
.portrait__line { position: absolute; z-index: 1; right: 7%; bottom: 8%; width: 24%; height: 1px; background: var(--champagne); }
.portrait__content { padding: clamp(70px, 8vw, 150px); display: flex; flex-direction: column; justify-content: center; }
.portrait__content h2 { margin-top: 42px; font-size: clamp(42px, 4.4vw, 78px); line-height: 1.04; }
.principles { list-style: none; margin: clamp(54px, 7vh, 90px) 0 0; padding: 0; border-top: 1px solid var(--line); }
.principles li { display: grid; grid-template-columns: 48px 1fr; gap: 22px; padding: 25px 0; border-bottom: 1px solid var(--line); }
.principles li > span { color: var(--muted); font-size: 9px; letter-spacing: .2em; padding-top: 5px; }
.principles h3 { margin: 0 0 8px; font-family: var(--serif); font-size: 21px; font-weight: 400; letter-spacing: .04em; }
.principles p { margin: 0; color: #9f968a; font-size: 13px; line-height: 1.6; }

.finale { display: flex; flex-direction: column; justify-content: space-between; min-height: 100svh; background: #060504; }
.finale__glow { position: absolute; top: 50%; left: 50%; width: min(54vw, 750px); aspect-ratio: 1; transform: translate(-50%,-50%); border: 1px solid rgba(201,184,159,.15); border-radius: 50%; box-shadow: 0 0 120px rgba(158,125,83,.06), inset 0 0 100px rgba(158,125,83,.03); }
.finale__glow::before, .finale__glow::after { content: ""; position: absolute; inset: 12%; border: 1px solid rgba(201,184,159,.08); border-radius: 50%; }
.finale__glow::after { inset: 28%; background: radial-gradient(circle, rgba(184,149,103,.08), transparent 65%); }
.finale__content { position: relative; z-index: 1; align-self: center; text-align: center; }
.finale__content .eyebrow { margin: 0 0 35px; }
.finale h2 { font-size: clamp(64px, 9vw, 164px); line-height: .83; }
.site-link { width: min(340px, 75vw); margin: 60px auto 0; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; color: var(--champagne); font-size: 11px; letter-spacing: .42em; text-transform: uppercase; text-decoration: none; transition: color .3s, border-color .3s; }
.site-link:hover, .site-link:focus-visible { color: white; border-color: rgba(238,232,222,.6); }
.site-link:focus-visible { outline: 1px solid var(--champagne); outline-offset: 5px; }
.site-link i { font-family: var(--serif); font-size: 20px; font-style: normal; }
footer { z-index: 1; display: flex; justify-content: space-between; gap: 20px; color: #7d7468; font-size: 8px; letter-spacing: .3em; text-transform: uppercase; }

@media (max-width: 1024px) {
  .hero__veil { background: linear-gradient(90deg, transparent 18%, rgba(4,4,4,.08) 50%, rgba(4,4,4,.62) 100%); }
  .hero__content { width: 52%; margin-left: 48%; padding-inline: 5vw; }
  .wordmark { font-size: clamp(62px, 10vw, 110px); }
  .biometric__orb { width: clamp(176px, 26vw, 250px); }
  .manifesto { grid-template-columns: 1fr 3fr; }
  .manifesto__mark { display: none; }
  .portrait { grid-template-columns: .92fr 1.08fr; }
  .portrait__content { padding: 8vw 6vw; }
  .finale__glow { width: 72vw; }
}

@media (max-width: 640px) {
  .hero { min-height: 100svh; }
  .hero__media img { object-position: center; }
  .hero__veil { background: linear-gradient(180deg, rgba(3,3,3,.36) 0, transparent 28%, rgba(3,3,3,.05) 45%, rgba(3,3,3,.92) 78%, #050403 100%); }
  .hero__content { width: 100%; min-height: 100svh; margin: 0; padding: max(28px, env(safe-area-inset-top)) 24px max(18px, env(safe-area-inset-bottom)); justify-content: flex-start; }
  .wordmark { font-size: clamp(58px, 20vw, 88px); text-shadow: 0 2px 20px rgba(0,0,0,.45); }
  .eyebrow { margin-top: 14px; font-size: 8px; letter-spacing: .48em; }
  .hero__statement { margin-top: auto; }
  .hero h1 { font-size: 23px; text-shadow: 0 2px 14px #000; }
  .rule { margin-bottom: 15px; }
  .biometric { margin-top: 16px; }
  .biometric__orb { width: min(35vw, 146px); }
  .biometric__label { margin-top: 12px; font-size: 8px; }
  .arrow { height: 22px; margin-top: 7px; }
  .signature { margin: 8px 0 0; padding-top: 0; font-size: 6px; line-height: 1.65; }
  .hero__index { display: none; }

  .section { min-height: auto; padding: 100px 24px; }
  .manifesto { display: block; }
  .manifesto__copy { margin-top: 70px; }
  .manifesto__copy h2 { font-size: clamp(45px, 14.5vw, 65px); }
  .lede { margin-top: 40px; font-size: 18px; }
  .portrait { display: block; padding: 0; }
  .portrait__visual { min-height: 66svh; }
  .portrait__visual::after { background: linear-gradient(180deg, transparent 70%, #0a0908 100%); }
  .portrait__content { padding: 90px 24px 110px; }
  .portrait__content h2 { font-size: 45px; }
  .principles li { grid-template-columns: 36px 1fr; }
  .finale { min-height: 100svh; padding: 54px 24px 28px; }
  .finale__glow { width: 130vw; }
  .finale h2 { font-size: clamp(62px, 22vw, 96px); }
  footer { flex-direction: column; align-items: center; text-align: center; line-height: 1.7; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal], [data-inview] { opacity: 1; transform: none; }
}