:root {
  --ink: #f2ece7;
  --muted: #a49b9d;
  --dim: #736b70;
  --black: #070607;
  --panel: #110d10;
  --blood: #8f2635;
  --blood-bright: #bd3a4e;
  --blood-wash: rgba(143,38,53,.12);
  --line: rgba(242,236,231,.16);
  --soft-line: rgba(242,236,231,.075);
  --serif: Georgia, "Times New Roman", Times, serif;
  --sans: Inter, "Helvetica Neue", Arial, ui-sans-serif, system-ui, sans-serif;
  --gutter: clamp(1.25rem,5.25vw,6rem);
  --ease: cubic-bezier(.22,1,.36,1);
}

body {
  min-width: 20rem;
  background:
    radial-gradient(ellipse 52rem 34rem at 83% 8%, rgba(143,38,53,.1), transparent 68%),
    radial-gradient(ellipse 38rem 30rem at 8% 62%, rgba(255,255,255,.025), transparent 72%),
    var(--black);
  font-family: var(--sans);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
body::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  opacity: .24;
  background-image: linear-gradient(rgba(255,255,255,.013) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.013) 1px,transparent 1px);
  background-size: 4rem 4rem;
  mask-image: linear-gradient(to bottom,black,transparent 75%);
}
::selection { background: var(--blood-bright); color: #fff; }
:focus-visible { outline: 1px solid var(--ink); outline-offset: .35rem; }

.site-header { height: 5rem; padding-inline: var(--gutter); background: linear-gradient(to bottom,rgba(7,6,7,.98),rgba(7,6,7,.82) 55%,transparent); }
.wordmark { position: relative; padding-left: 1.1rem; font-size: .65rem; letter-spacing: .35em; }
.wordmark::before { content: ""; position: absolute; left: 0; top: 50%; width: .38rem; height: .38rem; border-radius: 50%; background: var(--blood-bright); box-shadow: 0 0 1.15rem rgba(189,58,78,.68); transform: translateY(-50%); }
.site-header nav { gap: clamp(.9rem,2.15vw,2.25rem); }
.site-header nav a { position: relative; padding: .65rem 0; font-size: .61rem; font-weight: 700; letter-spacing: .2em; }
.site-header nav a::after { content: ""; position: absolute; left: 0; right: .2em; bottom: .35rem; height: 1px; background: var(--blood-bright); transform: scaleX(0); transform-origin: right; transition: transform .35s var(--ease); }
.site-header nav a:hover::after,.site-header nav a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }

.hero,.section,.closing { padding-inline: var(--gutter); }
.hero { isolation: isolate; overflow: hidden; }
.hero::before { z-index: -1; width: min(54rem,72vw); right: -19rem; border-color: var(--soft-line); background: radial-gradient(circle,transparent 52%,rgba(143,38,53,.045) 72%,transparent 73%); box-shadow: 0 0 10rem rgba(143,38,53,.07),inset 0 0 8rem rgba(255,255,255,.012); }
.hero::after { content: ""; position: absolute; z-index: -1; top: 22%; bottom: 16%; left: calc(var(--gutter) - clamp(.8rem,1.8vw,2rem)); width: 1px; background: linear-gradient(transparent,var(--blood),transparent); opacity: .7; }
.hero-copy { max-width: 76rem; }
.eyebrow { font-size: .65rem; font-weight: 750; line-height: 1.4; text-transform: uppercase; }
.eyebrow::before { content: "//"; margin-right: .8rem; color: var(--blood-bright); letter-spacing: -.05em; }
h1,h2,h3,.closing-line,.signal strong,.next-grid a strong { font-family: var(--serif); font-weight: 400; text-wrap: balance; }
h1 { font-size: clamp(4.35rem,12.5vw,12rem); line-height: .76; }
.principle { font-family: var(--serif); font-size: clamp(1.3rem,2.15vw,2rem); letter-spacing: -.02em; }
.principle strong { font-weight: 400; font-style: italic; }
.intro { max-width: 49rem; margin-top: 1.65rem; line-height: 1.82; }
.intro strong { color: #d7ceca; }
.enter,.back-top { display: inline-flex; align-items: center; gap: .85rem; padding: .7rem 0; font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; transition: border-color .25s,color .25s; }
.enter span { margin-left: 0; transition: transform .3s var(--ease); }
.enter:hover,.back-top:hover { border-color: var(--blood-bright); }
.enter:hover span { transform: translateY(.3rem); }
.mark .human,.mark .machine { width: 3.5rem; }
.mark .meeting { background: var(--blood-bright); box-shadow: 0 0 1.5rem rgba(189,58,78,.8); }

.section { grid-template-columns: minmax(3rem,7rem) minmax(0,1fr); gap: clamp(1.5rem,5vw,6.5rem); }
.section::after { content: ""; position: absolute; top: -1px; left: var(--gutter); width: clamp(3rem,8vw,8rem); height: 1px; background: var(--blood-bright); }
.section-number { font-family: var(--serif); font-size: .83rem; font-style: italic; letter-spacing: .1em; }
.section-copy { max-width: 62rem; }
h2 { font-size: clamp(3.2rem,7.7vw,7.6rem); line-height: .88; }
.section-copy>p:not(.eyebrow):not(.signature):not(.lead) { max-width: 48rem; line-height: 1.82; }
.section-copy .lead { max-width: 52rem; color: #d7ceca; font-family: var(--serif); font-size: clamp(1.45rem,2.45vw,2.25rem); line-height: 1.38; }
.signature { font-family: var(--serif); font-size: 1.1rem; font-style: italic; text-transform: none; }
.signature span { color: var(--blood-bright); }
.belief blockquote { max-width: 58rem; padding: clamp(1.5rem,3vw,2.5rem) clamp(1.5rem,4vw,3.5rem); border-color: var(--blood-bright); background: linear-gradient(90deg,var(--blood-wash),transparent 75%); }
.belief blockquote p { font-family: var(--serif); font-size: clamp(1.6rem,3.15vw,3rem); line-height: 1.3; }

.build-grid { border: 1px solid var(--line); background: rgba(255,255,255,.012); }
.build-grid article { position: relative; min-height: 24rem; overflow: hidden; transition: background .35s; }
.build-grid article:first-child { padding-left: clamp(1.25rem,3vw,2.5rem); }
.build-grid article::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: var(--blood-bright); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.build-grid article:hover { background: var(--blood-wash); }
.build-grid article:hover::after { transform: scaleX(1); }
.card-number { font-weight: 700; }
h3 { font-size: clamp(2.1rem,3.35vw,3.25rem); }

.signal-grid { border: 1px solid var(--line); }
.signal { background: rgba(255,255,255,.01); }
.signal.live { transition: background .35s; }
.signal.live::before { border-color: rgba(189,58,78,.28); box-shadow: 0 0 6rem rgba(143,38,53,.1); transition: transform .6s var(--ease),border-color .3s; }
.signal.live:hover { background: var(--blood-wash); }
.signal.live:hover::before { border-color: rgba(189,58,78,.55); }
.signal.live .signal-status::before { content: ""; display: inline-block; width: .4rem; height: .4rem; margin-right: .65rem; border-radius: 50%; background: var(--blood-bright); box-shadow: 0 0 .8rem rgba(189,58,78,.8); }
.signal strong { font-size: clamp(2.7rem,5.5vw,5.5rem); }
.signal-arrow { transition: transform .3s var(--ease),color .25s; }

.closing { overflow: hidden; }
.closing::before { content: ""; position: absolute; width: 36rem; aspect-ratio: 1; right: -15rem; border: 1px solid rgba(189,58,78,.2); border-radius: 50%; box-shadow: 0 0 8rem rgba(143,38,53,.08); }
.closing-line { position: relative; }
.closing-line strong { font-weight: 400; font-style: italic; }
footer { padding-inline: var(--gutter); }

.inner-page { background: radial-gradient(ellipse 48rem 35rem at 86% 6%,rgba(143,38,53,.11),transparent 70%),var(--black); }
.page-hero,.identity-hero { position: relative; min-height: 84svh; padding-inline: var(--gutter); isolation: isolate; }
.page-hero::before,.identity-hero::before { content: ""; position: absolute; z-index: -1; left: var(--gutter); bottom: -1px; width: clamp(4rem,10vw,10rem); height: 1px; background: var(--blood-bright); }
.page-hero h1,.identity-hero h1 { font-size: clamp(4.3rem,10.75vw,10.5rem); line-height: .8; }
.page-intro { max-width: 55rem; font-family: var(--serif); font-size: clamp(1.25rem,2.1vw,1.75rem); line-height: 1.55; letter-spacing: -.018em; }
.identity-hero::after { border-color: rgba(189,58,78,.2); box-shadow: 0 0 8rem rgba(143,38,53,.08),inset 0 0 6rem rgba(255,255,255,.012); }
.human-page::after { border-radius: 52% 48% 44% 56% / 58% 44% 56% 42%; transform: rotate(-10deg); }
.machine-page::after { border-color: rgba(189,58,78,.2); background: repeating-linear-gradient(90deg,transparent 0 1.6rem,rgba(189,58,78,.035) 1.6rem 1.68rem); }

.story-beat { grid-template-columns: minmax(3rem,7rem) minmax(0,58rem); }
.story-beat::after { content: ""; position: absolute; left: calc(var(--gutter) + 1.1rem); top: 0; bottom: 0; width: 1px; background: var(--soft-line); }
.story-index { position: relative; z-index: 1; width: 2.25rem; height: 2.25rem; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--black); color: var(--blood-bright); font-family: var(--serif); font-style: italic; }
.story-beat h2 { font-size: clamp(2.9rem,6vw,6.2rem); }

.identity-body { grid-template-columns: minmax(8rem,14rem) minmax(0,54rem); padding-inline: var(--gutter); }
.identity-body aside { position: sticky; top: 7rem; height: fit-content; font-weight: 700; }
.identity-body aside::before { content: ""; width: 2.5rem; height: 1px; margin-bottom: .65rem; background: var(--blood-bright); }
.prose .lead { font-family: var(--serif); font-size: clamp(1.6rem,2.85vw,2.6rem); }
.prose>p:not(.lead):not(.eyebrow) { line-height: 1.9; }
.prose h2 { font-size: clamp(2.8rem,5.25vw,5.4rem); }
.prose blockquote { padding-block: clamp(1.3rem,3vw,2.3rem); border-color: var(--blood-bright); background: linear-gradient(90deg,var(--blood-wash),transparent 80%); }
.prose blockquote p { font-family: var(--serif); }

.manifesto { padding-inline: var(--gutter); }
.manifesto-line { font-family: var(--serif); transition: color .3s,padding-left .4s var(--ease); }
.manifesto-line:hover { padding-left: clamp(.5rem,2vw,2rem); color: var(--ink); }
.principles-grid article,.architecture-grid article { position: relative; overflow: hidden; transition: background .35s; }
.principles-grid article:hover,.architecture-grid article:hover { background: var(--blood-wash); }
.principles-grid article>span,.architecture-grid article>span { color: var(--blood-bright); font-family: var(--serif); font-size: .78rem; font-style: italic; }
.page-next { padding-inline: var(--gutter); }
.next-grid { border: 1px solid var(--line); }
.next-grid a { overflow: hidden; transition: background .35s; }
.next-grid a::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: var(--blood-bright); transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease); }
.next-grid a:hover { background: var(--blood-wash); }
.next-grid a:hover::after { transform: scaleX(1); }
.next-grid a b { transition: transform .3s var(--ease),color .25s; }

.signup-form>div { border-color: var(--line); transition: border-color .25s; }
.signup-form>div:focus-within { border-color: var(--blood-bright); }
.signup-honeypot { left: 0!important; width: 1px!important; height: 1px!important; overflow: hidden!important; clip-path: inset(50%)!important; white-space: nowrap!important; }
.signup-honeypot input { width: 1px!important; min-width: 0!important; padding: 0!important; }
.signup-form input { font-family: var(--serif); font-size: clamp(1.25rem,2.2vw,1.7rem); }
.signup-form input::placeholder { color: var(--dim); }
.signup-form button,.message-page button { font-size: .69rem; letter-spacing: .11em; text-transform: uppercase; transition: background .25s,border-color .25s,color .25s; }
.signup-form button:hover,.message-page button:hover { border-color: var(--blood-bright); background: var(--blood-bright); color: #fff; }
.journal-hero,.journal-archive,.journal-post { padding-inline: var(--gutter); }
.journal-hero>p:last-child { font-family: var(--serif); }
.journal-entry a::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px; background: var(--blood-bright); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.journal-entry a:hover::after { transform: scaleX(1); }
.journal-entry b { transition: transform .3s var(--ease),color .25s; }
.journal-meta { font-family: var(--serif); font-style: italic; }
.journal-meta span::after { color: var(--blood-bright); }
.journal-body { line-height: 1.9; }
.journal-body blockquote { border-color: var(--blood-bright); font-family: var(--serif); }
.journal-body a { text-decoration-color: var(--blood-bright); }

.gallery-wrap { max-width: 110rem; margin: 0 auto; padding: clamp(10rem,12vw,13rem) var(--gutter) clamp(6rem,11vw,12rem); }
.gallery-head { max-width: 68rem; margin-bottom: clamp(4rem,8vw,7rem); }
.gallery-head h1 { max-width: none; font-size: clamp(4.4rem,10.75vw,10.5rem); line-height: .8; }
.gallery-head .lead { max-width: 51rem; margin: 2.5rem 0 0; color: var(--muted); font-family: var(--serif); font-size: clamp(1.25rem,2.1vw,1.75rem); line-height: 1.6; }
.gallery-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(2rem,4vw,5rem) clamp(1rem,2vw,2rem); }
.gallery-item { grid-column: span 8; margin: 0; cursor: zoom-in; }
.gallery-item:nth-child(even) { grid-column: 5/span 8; }
.gallery-item img { display: block; width: 100%; aspect-ratio: 8/5; object-fit: cover; border: 1px solid var(--line); background: var(--panel); filter: saturate(.75) contrast(1.04); transition: transform .55s var(--ease),border-color .3s,filter .4s,box-shadow .4s; }
.gallery-item:hover img { transform: translateY(-.4rem); border-color: rgba(189,58,78,.6); filter: saturate(1) contrast(1.02); box-shadow: 0 1.5rem 5rem rgba(0,0,0,.45); }
.gallery-item figcaption { display: flex; justify-content: space-between; gap: 2rem; padding: 1rem 0 0; color: var(--muted); font-size: .74rem; line-height: 1.5; }
.gallery-item figcaption strong { color: var(--ink); font-size: .65rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.gallery-note { color: var(--dim); }
dialog { width: min(96vw,110rem); height: min(94vh,70rem); max-width: none; max-height: none; padding: 0; border: 1px solid var(--line); background: var(--black); color: var(--ink); overflow: hidden; }
dialog::backdrop { background: rgba(0,0,0,.9); backdrop-filter: blur(10px); }
.lightbox-stage { height: calc(100% - 3.75rem); overflow: auto; background: #030304; display: flex; align-items: flex-start; justify-content: flex-start; overscroll-behavior: contain; }
.lightbox-stage img { display: block; width: auto; height: auto; max-width: none; max-height: none; transform-origin: top left; cursor: zoom-in; user-select: none; -webkit-user-drag: none; }
.lightbox-bar { height: 3.75rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .75rem 1.25rem; color: var(--muted); font-size: .74rem; border-top: 1px solid var(--line); }
.lightbox-actions { display: flex; align-items: center; gap: .9rem; white-space: nowrap; }
.lightbox-bar button { border: 0; background: none; color: var(--ink); font: inherit; cursor: pointer; letter-spacing: .08em; text-transform: uppercase; padding: .35rem; transition: color .2s; }
.lightbox-bar button:hover { color: var(--blood-bright); }
#zoom-level { min-width: 3.5rem; text-align: center; color: var(--muted); }

@media (max-width:900px) {
  .build-grid article,.build-grid article:first-child { padding-inline: 1.75rem; }
  .story-beat::after { left: calc(var(--gutter) + 1.1rem); bottom: auto; height: clamp(5rem,9vw,9rem); }
  .identity-body aside { position: static; }
}
@media (max-width:700px) {
  body::before { background-size: 2.5rem 2.5rem; }
  .site-header { height: 4.5rem; padding-inline: 1.15rem; }
  .wordmark { font-size: .58rem; }
  .site-header nav { gap: 1rem; }
  .site-header nav a { font-size: .54rem; letter-spacing: .13em; }
  .site-header nav a:nth-child(2),.site-header nav a:nth-child(3) { display: block; }
  .site-header nav a:nth-child(n+4) { display: none; }
  .hero::after { left: .7rem; }
  .hero::before { right: -25rem; }
  h1 { font-size: clamp(4rem,23vw,7rem); }
  h2 { font-size: clamp(3.15rem,17vw,5.6rem); }
  .intro br { display: block; content: ""; margin-top: 1.2rem; }
  .build-grid article,.build-grid article:first-child { padding-inline: 1.5rem; }
  .page-hero,.identity-hero { min-height: 76svh; }
  .page-hero h1,.identity-hero h1 { font-size: clamp(3.8rem,20vw,6.5rem); }
  .story-beat::after { left: 2.45rem; }
  .signup-form button { width: 100%; border-top: 1px solid var(--line); text-align: left; }
  .gallery-wrap { padding-inline: 1.35rem; }
  .gallery-item,.gallery-item:nth-child(even) { grid-column: 1/-1; }
  .gallery-item figcaption { flex-direction: column; gap: .35rem; }
  .lightbox-bar { padding: .65rem .8rem; }
  .lightbox-bar>span:first-child { display: none; }
}
@media (max-width:390px) {
  .site-header nav a:nth-child(n+3) { display: none; }
  .lightbox-actions { gap: .45rem; }
}
@media (hover:none) { .manifesto-line:hover { padding-left: 0; } }
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition-duration: .01ms!important; animation-duration: .01ms!important; animation-iteration-count: 1!important; }
}
