@font-face {
  font-family: "Newsreader";
  src: url("/fonts/Newsreader-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Newsreader";
  src: url("/fonts/Newsreader-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

:root {
  --ink: #171611;
  --ink-soft: #35332c;
  --paper: #fafaf7;
  --paper-bright: #ffffff;
  --line: rgba(23, 22, 17, 0.18);
  --line-dark: rgba(245, 241, 232, 0.18);
  --brass: #aa7622;
  --brass-bright: #d2a34c;
  --rust: #c64e26;
  --acid: #e8ef9b;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --serif: "Newsreader", Georgia, serif;
  --shell: min(1440px, calc(100vw - 80px));
  --header-h: 82px;
}

* { box-sizing: border-box; }

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

body {
  margin: 0;
  color: var(--ink);
  background: #fbfbf8;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
img { display: block; max-width: 100%; }

::selection { background: var(--acid); color: var(--ink); }

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 12px;
  left: 12px;
  padding: 10px 14px;
  color: var(--paper);
  background: var(--ink);
  transform: translateY(-150%);
}
.skip-link:focus { transform: none; }

.section-shell {
  width: var(--shell);
  margin-inline: auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  height: var(--header-h);
  border-bottom: 1px solid var(--line);
  background: #fbfbf8;
  isolation:isolate;
  transform:translateZ(0);
  backface-visibility:hidden;
  transition: height 220ms ease, background 220ms ease;
}

.site-header.is-compact { height: 68px; background: #fbfbf8; }

.header-inner {
  width: var(--shell);
  height: 100%;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.brand { display:inline-flex; flex-direction:column; align-items:flex-start; line-height:1; }
.brand img { width: 126px; height: auto; }
.brand span { margin:3px 0 0 49px; color:var(--brass); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:7px; font-weight:700; line-height:1; letter-spacing:.2em; text-transform:uppercase; }

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 34px;
  margin-left: auto;
  margin-right: 42px;
  color: var(--ink-soft);
  font-size: 14px;
}

.desktop-nav > a,
.nav-menu > button {
  position: relative;
  padding: 12px 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.desktop-nav > a::after,
.nav-menu > button::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 5px;
  left: 0;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 180ms ease;
}

.desktop-nav > a:hover::after,
.nav-menu > button:hover::after { transform: scaleX(1); transform-origin: left; }

.nav-menu { position: relative; }
.nav-menu button span { margin-left: 5px; color: var(--rust); }

.nav-popover {
  position: absolute;
  top: 48px;
  left: 50%;
  width: 390px;
  padding: 20px;
  border: 1px solid var(--ink);
  background: var(--paper-bright);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 8px);
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
  box-shadow: 12px 12px 0 rgba(23, 22, 17, 0.09);
}

.nav-menu:hover .nav-popover,
.nav-menu:focus-within .nav-popover,
.nav-menu.is-open .nav-popover {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.nav-popover p {
  margin: 0 0 18px;
  padding: 0 0 16px;
  border-bottom: 1px solid var(--line);
  color: #726e63;
  font-family: var(--serif);
  font-size: 18px;
}

.nav-popover a {
  display: flex;
  justify-content: space-between;
  padding: 9px 0;
  border-bottom: 1px solid transparent;
  color: var(--ink);
  font-size: 14px;
}
.nav-popover a:hover { border-color: var(--ink); }
.nav-popover a span:last-child { color: #9b9588; font-size: 11px; letter-spacing: 0.12em; }
.nav-popover.compact { width: 260px; }

.header-actions { display: flex; align-items: center; gap: 26px; font-size: 14px; }

.button {
  min-height: 50px;
  padding: 0 22px;
  border: 1px solid var(--ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.025em;
  transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}
.button:hover { transform: translateY(-2px); }
.button span { font-size: 14px; }
.button-small { min-height: 42px; padding: 0 18px; gap: 16px; }
.button-dark { color: var(--paper-bright); background: var(--ink); }
.button-dark:hover { color: var(--ink); background: var(--brass-bright); }
.button-line { background: transparent; }
.button-line:hover { background: var(--paper-bright); }
.button-light { color: var(--ink); border-color: var(--paper-bright); background: var(--paper-bright); }
.button-light:hover { background: var(--brass-bright); border-color: var(--brass-bright); }
.button-ghost { color: var(--paper-bright); border-color: rgba(255,255,255,0.5); }
.button-ghost:hover { border-color: var(--paper-bright); background: rgba(255,255,255,0.08); }

.menu-toggle,
.mobile-nav { display: none; }

.hero {
  min-height: auto;
  padding: clamp(26px, 3vw, 46px) 0 56px;
  display: grid;
  grid-template-columns: minmax(480px, 0.9fr) minmax(560px, 1.1fr);
  align-items: start;
  gap: clamp(44px, 6vw, 96px);
}

.hero-copy { padding-top: clamp(22px, 3.3vw, 50px); }

.eyebrow,
.section-index {
  margin: 0;
  color: #736d61;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.live-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--rust);
  box-shadow: 0 0 0 5px rgba(198, 78, 38, 0.13);
  animation: breathe 2.6s ease-in-out infinite;
}

.hero h1 {
  max-width: 680px;
  margin: 26px 0 28px;
  font-family: var(--serif);
  font-size: clamp(64px, 5.7vw, 92px);
  font-weight: 400;
  line-height: 0.91;
  letter-spacing: -0.05em;
}

.hero-dek {
  max-width: 590px;
  margin: 0;
  color: #514d43;
  font-family: var(--serif);
  font-size: clamp(20px, 1.55vw, 27px);
  line-height: 1.36;
}

.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 38px; }

.context-field {
  position: relative;
  min-height: clamp(520px, 46vw, 660px);
  overflow: hidden;
  border: 0;
  background-color:#0b0b09;
  background-image:
    radial-gradient(ellipse at 11% 91%,rgba(198,78,38,.92) 0,rgba(137,47,27,.62) 20%,transparent 54%),
    radial-gradient(ellipse at 82% 7%,rgba(210,163,76,.7) 0,rgba(127,83,30,.35) 22%,transparent 50%),
    radial-gradient(circle at 54% 50%,rgba(118,70,28,.52) 0,rgba(55,34,19,.34) 25%,transparent 49%),
    linear-gradient(137deg,#070706 0%,#17100c 44%,#0b0b09 100%);
  isolation: isolate;
  cursor: crosshair;
}

.context-field::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity:.46;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");
  mix-blend-mode:screen;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 8%, transparent 72%);
  mask-image: radial-gradient(ellipse at center, #000 8%, transparent 72%);
}

.context-field::after {
  content: "";
  position: absolute;
  z-index: -1;
  top:25%;
  left:12%;
  width:80%;
  height:45%;
  border-radius:50%;
  background:linear-gradient(105deg,rgba(198,78,38,.75),rgba(210,163,76,.4) 42%,rgba(245,241,232,.08) 70%,transparent);
  filter:blur(38px);
  opacity:.62;
  transform:rotate(-11deg) skewX(-10deg);
}

.field-grid {
  position: absolute;
  inset: 0;
  opacity:.16;
  background-image:linear-gradient(rgba(245,241,232,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(245,241,232,.24) 1px,transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 5%, transparent 69%);
  mask-image: radial-gradient(ellipse at center, #000 5%, transparent 69%);
}

.field-meta {
  position: absolute;
  z-index: 3;
  top: 18px;
  right: 18px;
  left: 18px;
  display: flex;
  justify-content: space-between;
  font-family: var(--sans);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.16em;
  color:rgba(245,241,232,.72);
}

.field-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.field-lines path {
  fill: none;
  stroke:rgba(245,241,232,.24);
  stroke-width: 1;
  stroke-linecap:round;
  vector-effect: non-scaling-stroke;
}
.field-pulse { fill:var(--paper-bright); filter:drop-shadow(0 0 5px rgba(245,241,232,.7)); }
.field-pulse-output { fill:var(--brass-bright); filter:drop-shadow(0 0 5px rgba(210,163,76,.75)); }

.signal {
  position: absolute;
  z-index: 2;
  min-width:118px;
  padding: 9px 11px 9px 13px;
  border:1px solid rgba(245,241,232,.18);
  border-left:2px solid var(--rust);
  border-radius:4px;
  color:var(--paper-bright);
  background:rgba(13,12,10,.54);
  box-shadow:0 14px 36px rgba(0,0,0,.18);
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
  backdrop-filter:blur(10px);
  transition: transform 180ms ease;
}
.signal small { display:block; margin-bottom:2px; color:rgba(245,241,232,.6); font-family:var(--sans); font-size:7px; font-weight:700; letter-spacing:.12em; line-height:1.2; text-transform:uppercase; }
.signal.output { color:var(--ink); border:0; border-left:2px solid var(--brass); background:rgba(250,250,247,.94); }
.signal.output small { color:var(--rust); }
.signal-a { top: 21%; left: 5%; }
.signal-b { top: 62%; left: 8%; }
.signal-c { top: 10%; left: 22%; }
.signal-h { bottom: 10%; left: 9%; }
.signal-d { top: 15%; right: 7%; }
.signal-f { top: 36%; right: 4%; }
.signal-g { top: 56%; right: 4%; }
.signal-e { right: 7%; bottom: 13%; }

.agent-core {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 53%;
  width: 220px;
  color:var(--paper-bright);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
}
.agent-mark { position:relative; width:194px; height:146px; display:grid; place-items:center; filter:drop-shadow(0 0 26px rgba(210,163,76,.28)); }
.hero-monogram { width:132px; height:132px; overflow:visible; }
.hero-monogram-body { fill:#eee3c3; }
.hero-monogram-pixel { fill:#c69b50; }
.agent-core p { margin: -6px 0 2px; font-family:var(--serif); font-size:19px; font-weight:500; }
.agent-core small { color:var(--brass-bright); font-family:var(--sans); font-size:7px; font-weight:700; letter-spacing:0.09em; text-transform:uppercase; }

.field-status {
  position: absolute;
  right: 18px;
  bottom: 16px;
  left: 18px;
  padding-top: 11px;
  color:rgba(245,241,232,.76);
  border-top:1px solid rgba(245,241,232,.28);
  font-family: var(--sans);
  font-size: 9px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.field-status span { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--rust); }

.thesis {
  padding: clamp(72px, 7vw, 110px) 0;
  display: grid;
  grid-template-columns: minmax(210px,.62fr) minmax(0,1.85fr) minmax(250px,.85fr);
  grid-template-rows: auto auto;
  column-gap:50px;
  row-gap:28px;
  align-items:start;
  border-top: 1px solid var(--line);
}
.thesis > .section-index { grid-column:1 / -1; grid-row:1; }
.thesis-poster { position:relative; grid-column:1; grid-row:2; width:100%; margin:0;
  aspect-ratio:900/1125; overflow:hidden; background:#1d1a15; }
.thesis-poster img { display:block; width:100%; height:100%; object-fit:cover; }
.thesis h2 {
  grid-column:2;
  grid-row:2;
  margin:0;
  font-family: var(--serif);
  font-size: clamp(48px, 5.5vw, 88px);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -0.042em;
}
.thesis > p:last-child { grid-column:3; grid-row:2; max-width: 360px; margin:5px 0 0; color: #676155; font-size: 17px; line-height: 1.65; }

.system-section { padding: clamp(72px, 7vw, 110px) 0; color: var(--paper); background: var(--ink); }

.section-heading {
  display: grid;
  grid-template-columns: 1.55fr 0.55fr;
  gap: 90px;
  align-items: end;
  margin-bottom: 54px;
}
.section-heading h2 {
  margin: 22px 0 0;
  font-family: var(--serif);
  font-size: clamp(58px, 6vw, 92px);
  font-weight: 400;
  line-height: 0.96;
  letter-spacing: -0.045em;
}
.system-section .section-index { color: #9c978c; }
.section-heading > p { max-width: 390px; margin: 0; color: #817b6e; font-size: 17px; line-height: 1.6; }
.system-section .section-heading > p { color: #b5afa1; }

.system-rows { border-top: 1px solid var(--line-dark); }
.system-row {
  min-height: 270px;
  padding: 42px 0;
  border-bottom: 1px solid var(--line-dark);
  display: grid;
  grid-template-columns: 70px 1.35fr 0.8fr 0.95fr;
  gap: 42px;
  align-items: center;
}
.row-number { align-self: start; padding-top: 5px; color: var(--brass-bright); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; }
.row-title > span { color: #a6a093; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; }
.row-title h3 { margin: 15px 0 0; font-family: var(--serif); font-size: clamp(36px, 3.1vw, 52px); font-weight: 400; line-height: 1.02; letter-spacing: -0.03em; }
.system-row > p { max-width: 310px; margin: 0; color: #b6b0a3; line-height: 1.65; }

.row-visual {
  position: relative;
  height: 150px;
  overflow: hidden;
  border-left: 1px solid var(--line-dark);
  background: rgba(255,255,255,0.025);
}

.capture-visual::before,
.capture-visual::after { content: ""; position: absolute; top: 50%; left: 50%; border: 1px solid rgba(232,239,155,0.38); border-radius: 50%; transform: translate(-50%,-50%); }
.capture-visual::before { width: 94px; height: 94px; animation:system-capture-ring 3.2s ease-in-out infinite; }
.capture-visual::after { width: 54px; height: 54px; animation:system-capture-ring 3.2s .55s ease-in-out infinite; }
.pulse { position: absolute; top: 50%; width: 6px; height: 6px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 18px var(--acid); transform:translateY(-50%); animation:system-capture-point 3.2s ease-in-out infinite; }
.p1 { left: 17%; }.p2 { left: 50%; animation-delay:.55s; }.p3 { left: 79%; animation-delay:1.1s; }
.wave-bars { position: absolute; inset: 30px 12px; opacity: 0.4; background: repeating-linear-gradient(90deg, transparent 0 8px, var(--brass-bright) 8px 10px); background-size:120px 100%; clip-path: polygon(0 50%, 10% 46%, 20% 60%, 30% 28%, 40% 67%, 50% 20%, 60% 71%, 70% 36%, 80% 55%, 90% 43%, 100% 50%, 100% 52%, 90% 48%, 80% 59%, 70% 40%, 60% 75%, 50% 24%, 40% 71%, 30% 32%, 20% 64%, 10% 50%, 0 54%); animation:system-wave-scan 3.2s linear infinite; }

.memory-visual span { position: absolute; width: 12px; height: 12px; border: 1px solid var(--paper); border-radius: 50%; background: var(--ink); z-index: 2; animation:system-memory-node 4.8s ease-in-out infinite; }
.memory-visual span:nth-child(1) { left: 18%; top: 24%; }
.memory-visual span:nth-child(2) { left: 38%; top: 68%; animation-delay:.7s; }
.memory-visual span:nth-child(3) { left: 62%; top: 27%; animation-delay:1.4s; }
.memory-visual span:nth-child(4) { right: 15%; top: 64%; background: var(--brass-bright); animation-delay:2.1s; }
.memory-visual i { position: absolute; height: 1px; background: rgba(245,241,232,.35); transform-origin: left; }
.memory-visual i:nth-of-type(1) { width: 46%; left: 20%; top: 30%; transform: rotate(17deg); }
.memory-visual i:nth-of-type(2) { width: 42%; left: 39%; top: 70%; transform: rotate(-37deg); }
.memory-visual i:nth-of-type(3) { width: 26%; left: 63%; top: 32%; transform: rotate(42deg); }
.memory-visual i::after { content:""; position:absolute; top:-2px; left:0; width:5px; height:5px; border-radius:50%; background:var(--acid); box-shadow:0 0 12px rgba(232,239,155,.7); opacity:0; animation:system-memory-trace 4.8s linear infinite; }
.memory-visual i:nth-of-type(2)::after { animation-delay:1.1s; }
.memory-visual i:nth-of-type(3)::after { animation-delay:2.2s; }

.action-visual { padding:12px 14px; display:grid; grid-template-rows:1fr 22px; gap:7px; }
.action-steps { display:flex; flex-direction:column; justify-content:center; gap:6px; }
.action-steps span { position:relative; min-height:24px; padding:5px 9px; border:1px solid rgba(245,241,232,.2); color:#746f65; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:8px; letter-spacing:.13em; transition:color 180ms ease,background 180ms ease,border-color 180ms ease,transform 180ms ease; }
.action-steps span::after { content:""; position:absolute; top:50%; right:10px; width:4px; height:4px; border-radius:50%; background:currentColor; transform:translateY(-50%); }
.action-steps span.is-active { color:var(--ink); border-color:var(--acid); background:var(--acid); animation:system-action-click 380ms cubic-bezier(.2,.8,.2,1); }
.action-outcome { display:flex; align-items:center; justify-content:space-between; padding-top:6px; border-top:1px solid rgba(245,241,232,.16); color:#827c70; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; opacity:.36; transform:translateY(2px); transition:color 200ms ease,opacity 200ms ease,transform 200ms ease; }
.action-outcome small { font-size:7px; letter-spacing:.15em; }
.action-outcome strong { color:inherit; font-size:8px; font-weight:500; letter-spacing:.1em; }
.action-visual.is-complete .action-outcome { color:var(--acid); opacity:1; transform:none; }

.agent-section { padding: clamp(80px, 8vw, 130px) 0; display: grid; grid-template-columns: 0.72fr 1.28fr; gap: clamp(60px, 8vw, 130px); align-items: center; }
.agent-copy h2,
.hardware-copy h2 {
  margin: 25px 0 30px;
  font-family: var(--serif);
  font-size: clamp(55px, 5.5vw, 86px);
  font-weight: 400;
  line-height: .96;
  letter-spacing: -.045em;
}
.agent-copy > p:not(.section-index),
.hardware-copy > p:not(.section-index) { max-width: 560px; margin: 0; color: #676155; font-size: 17px; line-height: 1.65; }
.plain-list { margin: 42px 0 36px; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.plain-list li { padding: 16px 0; border-bottom: 1px solid var(--line); color: #4a463e; font-size: 14px; }
.plain-list span { display: inline-block; width: 45px; color: var(--rust); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; }
.arrow-link { display: inline-flex; gap: 34px; padding-bottom: 7px; border-bottom: 1px solid var(--ink); font-size: 14px; font-weight: 700; }
.arrow-link span { color: var(--rust); }

.agent-proof { min-width:0; margin:0; }
.agent-stage {
  position:relative;
  min-height:660px;
  padding:64px 28px 24px;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 14% 82%,rgba(198,78,38,.18),transparent 34%),
    radial-gradient(circle at 83% 18%,rgba(210,163,76,.2),transparent 31%),
    radial-gradient(circle at 60% 72%,rgba(53,51,44,.09),transparent 44%),
    linear-gradient(135deg,#f4f1ea 0%,#fbfbf8 55%,#ede8dc 100%);
}
.agent-stage::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  opacity:.28;
  background-image:radial-gradient(rgba(23,22,17,.34) .65px,transparent .65px);
  background-size:12px 12px;
  mask-image:linear-gradient(120deg,#000,transparent 38%,transparent 64%,#000);
}
.agent-stage::after {
  content:"";
  position:absolute;
  z-index:-1;
  right:-10%;
  bottom:-35%;
  width:62%;
  aspect-ratio:1;
  border:1px solid rgba(23,22,17,.12);
  border-radius:50%;
  box-shadow:0 0 0 38px rgba(23,22,17,.035),0 0 0 92px rgba(198,78,38,.025);
}
.agent-stage-meta {
  position:absolute;
  z-index:2;
  top:20px;
  right:24px;
  left:24px;
  display:flex;
  justify-content:space-between;
  color:#625d53;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:8px;
  letter-spacing:.15em;
}
.agent-flow {
  position:relative;
  z-index:1;
  min-height:570px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.agent-flow-phones {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,230px));
  justify-content:center;
  align-items:start;
  gap:clamp(14px,2vw,28px);
}
.agent-flow-rail {
  position:absolute;
  z-index:1;
  top:48%;
  right:8%;
  left:8%;
  height:1px;
  background:transparent;
}
.agent-flow-rail span {
  position:absolute;
  top:50%;
  left:0;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--rust);
  box-shadow:0 0 0 6px rgba(198,78,38,.13),0 0 26px rgba(198,78,38,.55);
  transform:translate(-50%,-50%);
  transition:left 650ms cubic-bezier(.2,.75,.2,1);
}
.agent-stage[data-flow-step="1"] .agent-flow-rail span { left:50%; }
.agent-stage[data-flow-step="2"] .agent-flow-rail span { left:100%; }
.agent-phone {
  min-width:0;
  opacity:.46;
  transform:translateY(18px) scale(.965);
  transition:opacity 500ms ease,transform 600ms cubic-bezier(.2,.75,.2,1),filter 500ms ease;
  filter:saturate(.72);
}
.agent-phone.is-active {
  opacity:1;
  transform:translateY(0) scale(1.015);
  filter:saturate(1);
}
.agent-step-label {
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 10px 4px;
  color:#625d53;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:8px;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.agent-step-label b { color:var(--rust); font-size:8px; font-weight:600; }
.agent-phone-crop {
  position:relative;
  width:100%;
  aspect-ratio:.433;
  overflow:hidden;
  border:1px solid rgba(23,22,17,.12);
  border-radius:28px;
  background:#f8f6f1;
  box-shadow:0 20px 40px rgba(23,22,17,.09);
}
.agent-phone-crop img {
  display:block;
  width:300%;
  max-width:none;
  height:auto;
}
.agent-phone:nth-child(2) .agent-phone-crop img { transform:translateX(-33.333333%); }
.agent-phone:nth-child(3) .agent-phone-crop img { transform:translateX(-66.666667%); }
.agent-phone > p {
  margin:11px 4px 0;
  color:#6e685d;
  font-size:11px;
  line-height:1.35;
}
.agent-phone.is-active > p { color:var(--ink); }
.agent-flow-bottom {
  position:relative;
  z-index:3;
  margin-top:22px;
  display:grid;
  grid-template-columns:auto minmax(150px,1fr) auto;
  align-items:center;
  gap:18px;
}
.agent-flow-progress { display:flex; gap:6px; }
.agent-flow-progress i { width:22px; height:2px; background:rgba(23,22,17,.16); transition:background 300ms ease; }
.agent-flow-progress i.is-active { background:var(--rust); }
.agent-flow-status {
  color:#5f594f;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:8px;
  letter-spacing:.13em;
}
.agent-outcomes { display:flex; justify-content:flex-end; gap:5px; }
.agent-outcomes span {
  padding:5px 7px;
  border:1px solid rgba(23,22,17,.14);
  color:#817a6e;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:6px;
  letter-spacing:.1em;
  opacity:.35;
  transform:translateY(3px);
  transition:opacity 300ms ease,transform 300ms ease,color 300ms ease,border-color 300ms ease;
}
.agent-stage[data-flow-step="2"] .agent-outcomes span { color:var(--ink); border-color:rgba(198,78,38,.42); opacity:1; transform:none; }
.agent-stage[data-flow-step="2"] .agent-outcomes span:nth-child(2) { transition-delay:80ms; }
.agent-stage[data-flow-step="2"] .agent-outcomes span:nth-child(3) { transition-delay:160ms; }
.agent-stage[data-flow-step="2"] .agent-outcomes span:nth-child(4) { transition-delay:240ms; }
.agent-proof figcaption { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); display:flex; justify-content:space-between; color:#746f65; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; letter-spacing:.12em; }
.agent-proof figcaption i { display:inline-block; width:6px; height:6px; margin-right:7px; border-radius:50%; background:var(--rust); }

.integrations-section {
  position:relative;
  overflow:hidden;
  padding:clamp(82px,8vw,126px) 0;
  color:var(--paper-bright);
  background:
    radial-gradient(circle at 12% 14%,rgba(198,78,38,.22),transparent 29%),
    radial-gradient(circle at 88% 72%,rgba(210,163,76,.18),transparent 34%),
    #0d0d0b;
}
.integrations-section::before { content:""; position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(245,241,232,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(245,241,232,.16) 1px,transparent 1px); background-size:30px 30px; mask-image:linear-gradient(90deg,#000,transparent 62%); }
.integrations-heading { position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(52px,8vw,130px); align-items:end; }
.integrations-heading h2 { max-width:930px; margin:24px 0 0; font-family:var(--serif); font-size:clamp(54px,5.7vw,90px); font-weight:400; line-height:.94; letter-spacing:-.05em; }
.integrations-heading > p { max-width:600px; margin:0 0 6px; color:#aaa397; font-size:16px; line-height:1.7; }
.integration-stage { position:relative; margin-top:clamp(52px,6vw,86px); padding:58px clamp(20px,3vw,44px) 28px; border:1px solid rgba(245,241,232,.14); background:rgba(18,17,14,.7); box-shadow:0 36px 90px rgba(0,0,0,.25); }
.integration-stage::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(105deg,rgba(198,78,38,.08),transparent 35%,transparent 70%,rgba(210,163,76,.07)); }
.integration-stage-meta { position:absolute; z-index:2; top:18px; right:20px; left:20px; display:flex; justify-content:space-between; color:#827b70; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:8px; letter-spacing:.16em; }
.integration-logos { position:relative; z-index:2; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); border-top:1px solid rgba(245,241,232,.12); border-left:1px solid rgba(245,241,232,.12); }
.integration-logos > span { min-width:0; min-height:76px; padding:13px 12px; border-right:1px solid rgba(245,241,232,.12); border-bottom:1px solid rgba(245,241,232,.12); display:flex; align-items:center; gap:10px; color:#9b958a; font-size:11px; transition:color 260ms ease,background 260ms ease,box-shadow 260ms ease; }
.integration-logos > span.is-active { color:#fff; background:rgba(245,241,232,.07); box-shadow:inset 0 -2px 0 var(--brass-bright); }
.integration-logo { width:28px; height:28px; flex:0 0 28px; display:grid; place-items:center; }
.integration-logo svg { width:100%; height:100%; display:block; overflow:visible; }
.logo-notion,.logo-apple { padding:2px; border-radius:6px; background:#fff; }
.integration-workflow { position:relative; z-index:2; min-height:218px; padding:34px 2%; display:grid; grid-template-columns:minmax(170px,1fr) auto minmax(155px,.64fr) auto minmax(180px,1fr); align-items:center; gap:clamp(14px,2.3vw,38px); }
.workflow-context,.workflow-output { min-height:104px; padding:18px; border:1px solid rgba(245,241,232,.16); display:flex; flex-direction:column; justify-content:space-between; background:rgba(245,241,232,.025); }
.workflow-context small,.workflow-output small,.workflow-agent small { color:#8b8479; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:7px; letter-spacing:.14em; }
.workflow-context strong,.workflow-output strong { max-width:25ch; font-family:var(--serif); font-size:clamp(19px,1.7vw,27px); font-weight:400; line-height:1.1; }
.workflow-output span { width:fit-content; padding:4px 6px; color:var(--acid); border:1px solid rgba(232,239,155,.34); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:6px; letter-spacing:.11em; }
.workflow-agent { text-align:center; display:grid; justify-items:center; gap:6px; }
.workflow-agent > span { width:74px; height:74px; display:grid; place-items:center; color:#16140f; background:linear-gradient(145deg,#eee3c3,#c69b50); font-family:var(--serif); font-size:52px; line-height:1; box-shadow:0 0 0 10px rgba(210,163,76,.06),0 0 45px rgba(210,163,76,.2); }
.workflow-agent > span img { width:100%; height:100%; display:block; object-fit:cover; }
.workflow-agent strong { font-size:12px; }
.workflow-arrow { color:var(--brass-bright); font-size:28px; opacity:.7; animation:integration-arrow 2.2s ease-in-out infinite; }
.integration-platforms { position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(245,241,232,.14); }
.integration-platforms article { min-height:156px; padding:24px 22px; border-right:1px solid rgba(245,241,232,.14); display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start; }
.integration-platforms article:last-child { border-right:0; }
.integration-platforms article > span { color:var(--brass-bright); font-family:var(--serif); font-size:clamp(34px,3vw,52px); line-height:.9; }
.integration-platforms strong { display:block; margin-bottom:8px; font-size:13px; }
.integration-platforms p { margin:0; color:#8f887c; font-size:11px; line-height:1.55; }
@keyframes integration-arrow { 0%,100%{transform:translateX(0);opacity:.35} 50%{transform:translateX(5px);opacity:1} }

.research-section { padding: clamp(76px, 8vw, 125px) 0; color: var(--paper-bright); background: #24221c; }
.research-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(70px, 9vw, 150px); align-items: center; }
.section-index.light,.eyebrow.light { color: #b9b2a3; }
.research-copy h2 { max-width: 650px; margin: 25px 0 30px; font-family: var(--serif); font-size: clamp(54px,5.6vw,88px); font-weight:400; line-height:.98; letter-spacing:-.045em; }
.research-copy > p:not(.section-index) { max-width: 560px; margin: 0; color:#b8b1a4; font-size:17px; line-height:1.65; }
.research-copy .button { margin-top: 38px; }

.research-art { position: relative; min-height: 620px; overflow:hidden; background: radial-gradient(circle at 48% 48%, #d5a144 0 4%, #885826 5%, transparent 18%), radial-gradient(circle at 50% 50%, rgba(210,163,76,.2), transparent 55%), #12110e; }
.research-art::before { content:""; position:absolute; inset:0; opacity:.25; background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px); background-size:24px 24px; mask-image:radial-gradient(circle at center,#000,transparent 74%); }
.paper-meta { position:absolute; z-index:3; top:20px; right:20px; left:20px; display:flex; justify-content:space-between; color:#c5beaf; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; letter-spacing:.14em; }
.evidence-points { position:absolute; inset:0; }
.evidence-points i {
  --orbit-size:48%;
  --orbit-speed:14s;
  --orbit-phase:0deg;
  position:absolute;
  top:50%;
  left:50%;
  width:var(--orbit-size);
  aspect-ratio:1;
  border:1px solid rgba(232,239,155,.13);
  border-radius:50%;
  animation:evidence-orbit var(--orbit-speed) linear infinite;
}
.evidence-points i::after {
  content:"";
  position:absolute;
  top:50%;
  right:-4px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--acid);
  box-shadow:0 0 18px rgba(232,239,155,.7);
  transform:translateY(-50%);
}
.evidence-points i:nth-child(1){--orbit-size:29%;--orbit-speed:8s;--orbit-phase:18deg}
.evidence-points i:nth-child(2){--orbit-size:38%;--orbit-speed:11s;--orbit-phase:94deg;animation-direction:reverse}
.evidence-points i:nth-child(3){--orbit-size:47%;--orbit-speed:13s;--orbit-phase:156deg}
.evidence-points i:nth-child(4){--orbit-size:55%;--orbit-speed:17s;--orbit-phase:238deg;animation-direction:reverse}
.evidence-points i:nth-child(5){--orbit-size:63%;--orbit-speed:19s;--orbit-phase:302deg}
.evidence-points i:nth-child(6){--orbit-size:70%;--orbit-speed:23s;--orbit-phase:52deg;animation-direction:reverse}
.evidence-points i:nth-child(7){--orbit-size:76%;--orbit-speed:27s;--orbit-phase:188deg}
.evidence-points i:nth-child(1),.evidence-points i:nth-child(3),.evidence-points i:nth-child(5),.evidence-points i:nth-child(7){border-color:rgba(232,239,155,.28)}
.belief-core { position:absolute; z-index:2; top:57%; left:50%; display:flex; align-items:center; gap:14px; transform:translate(-50%,-50%); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.belief-core strong { color:var(--brass-bright); font-size:25px; font-weight:400; }
.research-art > p { position:absolute; right:24px; bottom:18px; left:24px; margin:0; font-family:var(--serif); font-size:clamp(40px,4vw,66px); line-height:1; }

.hardware-section { padding:clamp(80px,8vw,130px) 0 clamp(48px,4.5vw,76px); display:grid; grid-template-columns:1.18fr .82fr; gap:clamp(70px,9vw,150px); align-items:center; }
.hardware-visual { position:relative; min-height:660px; overflow:hidden; background:radial-gradient(circle at 50% 50%,rgba(210,163,76,.14),transparent 29%),radial-gradient(ellipse at center,#e9ece9 0,#fbfbf8 58%,transparent 78%); }
.hardware-visual::before { content:"CAPTURE / 001"; position:absolute; top:20px; left:20px; z-index:2; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; letter-spacing:.16em; }
.hardware-visual > .capture-device { position:absolute; z-index:3; top:47%; left:50%; width:74%; height:74%; object-fit:contain; transform:translate(-50%,-50%) rotate(-7deg); filter:drop-shadow(30px 28px 24px rgba(23,22,17,.22)); }
.red-dot-award { position:absolute; z-index:5; top:18px; right:18px; }
.red-dot-award img { width:96px; height:auto; filter:drop-shadow(0 9px 18px rgba(23,22,17,.15)); }
.capture-rings { position:absolute; inset:0; display:grid; place-items:center; perspective:900px; }
.capture-rings::before { content:""; position:absolute; width:18%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(210,163,76,.24),rgba(210,163,76,.06) 48%,transparent 72%); animation:capture-pulse 3.8s ease-in-out infinite; }
.capture-rings i { --tilt:0deg; --speed:15s; position:absolute; top:50%; left:50%; width:40%; aspect-ratio:1; border:1px solid rgba(23,22,17,.24); border-radius:50%; transform:translate(-50%,-50%) rotate(var(--tilt)) scaleY(.56); transform-origin:center; }
.capture-rings i span { position:absolute; inset:0; border-radius:50%; animation:electron-orbit var(--speed) linear infinite; }
.capture-rings i span::after { content:""; position:absolute; top:50%; right:-4px; width:7px; height:7px; border-radius:50%; background:var(--brass-bright); box-shadow:0 0 0 4px rgba(210,163,76,.12),0 0 18px rgba(210,163,76,.45); transform:translateY(-50%) scaleY(1.78); }
.capture-rings i:nth-child(1){--tilt:14deg;--speed:8s;width:25%}.capture-rings i:nth-child(2){--tilt:-31deg;--speed:12s;width:45%}.capture-rings i:nth-child(2) span{animation-direction:reverse}.capture-rings i:nth-child(3){--tilt:54deg;--speed:17s;width:68%;border-color:rgba(23,22,17,.17)}.capture-rings i:nth-child(4){--tilt:-10deg;--speed:23s;width:91%;border-color:rgba(210,163,76,.3)}.capture-rings i:nth-child(4) span{animation-direction:reverse}
.hardware-tag { position:absolute; z-index:4; right:18px; bottom:18px; left:18px; padding-top:12px; border-top:1px solid rgba(23,22,17,.4); display:flex; justify-content:space-between; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; letter-spacing:.12em; }
.hardware-note { margin-top:25px!important; padding:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:var(--ink)!important; font-family:var(--serif); font-size:21px!important; }
.hardware-copy .arrow-link { margin-top:32px; }

.pricing-section { padding:clamp(48px,4.5vw,76px) 0 clamp(72px,6vw,100px); background:#fff; border-block:1px solid var(--line); }
.pricing-heading { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); align-items:end; gap:clamp(38px,7vw,110px); }
.pricing-heading h2 { max-width:12ch; margin-top:14px; font-size:clamp(50px,5.8vw,88px); line-height:.95; letter-spacing:-.05em; }
.pricing-heading > p { max-width:52ch; color:var(--muted); font-size:16px; line-height:1.65; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:clamp(44px,5vw,72px); border-block:1px solid var(--line); }
.pricing-grid article { min-width:0; display:flex; flex-direction:column; padding:clamp(28px,3vw,46px); }
.pricing-grid article + article { border-left:1px solid var(--line); }
.pricing-grid .pricing-pro { box-shadow:inset 0 3px 0 var(--brass); }
.pricing-grid h3 { margin:0; font-family:var(--serif); font-size:clamp(32px,3vw,46px); font-weight:500; line-height:1; letter-spacing:-.03em; }
.pricing-audience { min-height:48px; margin:14px 0 0; color:var(--muted); font-size:14px; line-height:1.55; }
.pricing-price { min-height:70px; display:flex; align-items:baseline; gap:7px; margin:26px 0 0; }
.pricing-price strong { font-family:var(--serif); font-size:clamp(42px,4vw,60px); font-weight:500; line-height:1; letter-spacing:-.04em; }
.pricing-price span { color:var(--muted); font-size:14px; }
.pricing-price.pricing-custom strong { font-size:clamp(34px,3.2vw,48px); }
.pricing-grid ul { min-height:176px; display:grid; align-content:start; gap:12px; margin:24px 0 30px; padding:24px 0 0; border-top:1px solid var(--line); list-style:none; }
.pricing-grid li { position:relative; padding-left:20px; color:#4f4c46; font-size:13px; line-height:1.45; }
.pricing-grid li::before { position:absolute; left:0; color:var(--brass); content:"✓"; }
.pricing-grid .button { width:100%; min-height:52px; margin-top:auto; justify-content:center; }
.pricing-note { margin:18px 0 0; color:var(--muted); font-size:12px; }

.audience-section { padding:clamp(64px,6vw,100px) 0; border-top:1px solid var(--line); }
.audience-section .section-heading { padding-top:20px; border-top:0; }
/* Gapped, not butted. Three dark tiles edge to edge read as one slab with hairlines
   drawn on it; the gap is what makes them three cards. The dividers go with it —
   a border between two things that no longer touch is just a stray line. */
.audience-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(12px,1.3vw,20px); margin-top:clamp(26px,2.6vw,38px); }
.audience-card { position:relative; min-height:340px; padding:clamp(26px,2.1vw,34px); display:flex; flex-direction:column; justify-content:space-between; }

/* THE POSTER IS THE CARD, AND THE TEXT IS WRITTEN ON IT.
   Each card carries an abstract from the gallery — cropped out of the poster's
   clean band, because every poster has its own headline, wordmark and URL baked
   in, and a card with a headline of its own would then be showing two.
   WHY THE CARD IS DARK. The first version kept the paper ground and ghosted the
   image behind ink text. Rendered at .12, .26 and .38 it was grey dirt at every
   value and never a picture: all three abstracts are dark-toned photographs, so
   over near-white at low alpha they can only wash out. On ink they are legible
   and the paper text is crisper than the ink text ever was.
   THE HOVER KEEPS ITS SHAPE. Same 220ms, same easing, same one property moving:
   the scrim lifts and the photograph comes up to full instead of a flat fill. */
.audience-card { overflow:hidden; color:var(--paper); background:var(--ink); border-radius:3px; }
.audience-art { position:absolute; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; opacity:.5; transition:opacity 260ms ease,transform 480ms cubic-bezier(.2,.7,.1,1); }
/* A scrim under the words, not over the whole picture. Without it legibility
   depended on where the bright part of each photograph happened to fall — the
   drop of water put its brightest reflection directly behind three lines of the
   Enterprise card. Angled so it protects the top-left text and thins out toward
   the arrow, leaving most of the image untouched. */
.audience-card::before { position:absolute; z-index:1; inset:0; background:linear-gradient(102deg,rgba(23,22,17,.88) 0%,rgba(23,22,17,.62) 40%,rgba(23,22,17,.16) 76%,rgba(23,22,17,0) 100%); box-shadow:inset 0 0 0 1px rgba(245,241,232,0); content:""; transition:background 260ms ease,box-shadow 260ms ease; }
/* Only the text is lifted, so the rule between cards is not painted over. */
.audience-card > span, .audience-card strong, .audience-card i { position:relative; z-index:2; }
.audience-card > span { color:rgba(245,241,232,.72); }
/* THE HOVER IS ON THE CHILDREN, AND THAT IS NOT A STYLE CHOICE.
   `.js .reveal` sets `transition: opacity 700ms, transform 700ms` and beats
   `.audience-card` on specificity, so the card's own transition never applied and
   any transform put on the card would animate over 700ms with the reveal's easing
   — and lose to `.is-visible { transform:none }` anyway. The art, the scrim and the
   arrow carry no reveal, so they can move at hover speed without touching it. */
.audience-card:hover .audience-art, .audience-card:focus-visible .audience-art { opacity:.94; transform:scale(1.045); }
.audience-card:hover::before, .audience-card:focus-visible::before { background:linear-gradient(102deg,rgba(23,22,17,.8) 0%,rgba(23,22,17,.5) 42%,rgba(23,22,17,.08) 78%,rgba(23,22,17,0) 100%); box-shadow:inset 0 0 0 1px rgba(245,241,232,.22); }
.audience-card:hover i, .audience-card:focus-visible i { transform:translate(3px,-3px); }
.audience-card > span { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px; letter-spacing:.15em; }
.audience-card strong { max-width:370px; font-family:var(--serif); font-size:clamp(32px,3vw,46px); font-weight:400; line-height:1.06; }
.audience-card i { align-self:flex-end; font-size:22px; font-style:normal; color:var(--rust); transition:transform 260ms cubic-bezier(.2,.7,.1,1); }

.privacy-section { position:relative; overflow:hidden; padding:clamp(58px,6vw,96px) 0; color:var(--paper-bright); background:radial-gradient(circle at 80% 20%,rgba(210,163,76,.16),transparent 28%),linear-gradient(135deg,#11110e,#211f18); }
.privacy-section::before { position:absolute; inset:0; opacity:.13; background-image:linear-gradient(rgba(245,241,232,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(245,241,232,.2) 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(90deg,transparent,#000 45%,#000); content:""; }
.privacy-section::after { position:absolute; z-index:0; top:-64px; right:0; left:42%; height:64px; opacity:0; background:linear-gradient(180deg,transparent 12%,rgba(91,184,220,.02) 68%,rgba(91,184,220,.14) calc(100% - 1px),rgba(210,163,76,.68)); filter:drop-shadow(0 5px 12px rgba(91,184,220,.16)); content:""; animation:privacy-scan 7.6s ease-in-out infinite alternate; }
.privacy-layout { position:relative; display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(65px,9vw,145px); align-items:start; }
.privacy-layout { z-index:1; }
.privacy-copy h2 { max-width:8ch; margin:24px 0; font-family:var(--serif); font-size:clamp(58px,6.4vw,96px); font-weight:400; line-height:.91; letter-spacing:-.055em; }
.privacy-copy > p:not(.section-index) { max-width:42ch; margin:0; color:#aaa496; font-size:16px; line-height:1.65; }
.privacy-copy .button { margin-top:34px; }
.privacy-controls { border-top:1px solid rgba(245,241,232,.25); }
.privacy-controls article { display:grid; grid-template-columns:36px minmax(140px,.7fr) 1fr; gap:18px; align-items:baseline; padding:22px 0; border-bottom:1px solid rgba(245,241,232,.16); }
.privacy-controls article > span { color:#8e887c; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:8px; letter-spacing:.13em; }
.privacy-controls strong { font-size:13px; }
.privacy-controls article p { margin:0; color:#a8a195; font-size:13px; line-height:1.55; }
.privacy-status { display:grid; gap:7px; padding-top:20px; color:#d2a34c; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:8px; line-height:1.5; letter-spacing:.1em; }

@keyframes privacy-scan {
  0% { top:-64px; opacity:.2; }
  12%, 88% { opacity:.62; }
  100% { top:calc(100% - 64px); opacity:.2; }
}

.closing-section { padding:clamp(88px,9vw,140px) 0; color:var(--paper-bright); background:var(--ink); }
.closing-inner { text-align:center; }
.closing-inner h2 { max-width:1050px; margin:30px auto 24px; font-family:var(--serif); font-size:clamp(62px,7.2vw,110px); font-weight:400; line-height:.9; letter-spacing:-.05em; }
.closing-inner > p:not(.eyebrow) { color:#aaa496; font-family:var(--serif); font-size:24px; }
.closing-inner .hero-actions { justify-content:center; }

.site-footer { padding:64px 0 28px; color:#b9b3a7; background:#11100d; }
.footer-grid { display:grid; grid-template-columns:2fr repeat(4,1fr); gap:70px; }
.footer-brand img { width:142px; filter:invert(1) grayscale(1) brightness(2); }
.footer-brand > span { display:block; margin:3px 0 0 57px; color:var(--brass-bright); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:7px; font-weight:700; line-height:1; letter-spacing:.2em; text-transform:uppercase; }
.footer-brand p { max-width:310px; margin:28px 0 18px; font-family:var(--serif); font-size:24px; line-height:1.25; }
.footer-brand a { color:var(--paper); font-size:13px; }
.footer-column { display:flex; flex-direction:column; align-items:flex-start; gap:12px; font-size:13px; }
.footer-column p { margin:0 0 12px; color:#6f6a60; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; letter-spacing:.15em; text-transform:uppercase; }
.footer-column a:hover { color:var(--paper); }
.footer-bottom { margin-top:78px; padding-top:20px; border-top:1px solid rgba(245,241,232,.15); display:flex; justify-content:space-between; color:#6f6a60; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }

.js .reveal { opacity:0; transform:translateY(44px); transition:opacity 720ms ease,transform 720ms cubic-bezier(.2,.7,.1,1); will-change:opacity,transform; }
.js .reveal.is-visible { opacity:1; transform:none; }
.pricing-grid article:nth-child(2) { transition-delay:90ms; }
.pricing-grid article:nth-child(3) { transition-delay:180ms; }

@keyframes breathe { 50% { transform:scale(.78); box-shadow:0 0 0 8px rgba(198,78,38,.05); } }
@keyframes capture-pulse { 50% { transform:scale(1.28); opacity:.55; } }
@keyframes electron-orbit { to { transform:rotate(360deg); } }
@keyframes system-capture-ring {
  0%,100% { opacity:.18; transform:translate(-50%,-50%) scale(.76); }
  46% { opacity:.72; transform:translate(-50%,-50%) scale(1.08); }
}
@keyframes system-capture-point {
  0%,100% { opacity:.28; transform:translateY(-50%) scale(.7); }
  44% { opacity:1; transform:translateY(-50%) scale(1.45); }
}
@keyframes system-wave-scan { to { background-position:120px 0; } }
@keyframes system-memory-node {
  0%,100% { border-color:rgba(245,241,232,.45); box-shadow:none; }
  34% { border-color:var(--acid); box-shadow:0 0 0 4px rgba(232,239,155,.08),0 0 14px rgba(232,239,155,.36); }
}
@keyframes system-memory-trace {
  0%,12% { left:0; opacity:0; }
  20% { opacity:1; }
  54% { left:calc(100% - 5px); opacity:1; }
  62%,100% { left:calc(100% - 5px); opacity:0; }
}
@keyframes system-action-click {
  0% { transform:scale(1); }
  48% { transform:scale(.965); }
  100% { transform:scale(1); }
}
@keyframes evidence-orbit {
  from { transform:translate(-50%,-50%) rotate(var(--orbit-phase)); }
  to { transform:translate(-50%,-50%) rotate(calc(var(--orbit-phase) + 360deg)); }
}

/* 09 / VISION - the reel. Uniform 4:5 cards on native scroll-snap. These are
   finished brand pictures, so nothing here tints them: at rest a card sits a
   shade back, hovering brings it forward. No dots - the half-visible next card
   is what says there is more. */
.gallery-section { padding:clamp(80px,8vw,130px) 0; border-top:1px solid var(--line); }
.reel-wrap { position:relative; }
.reel {
  display:flex; gap:clamp(12px,1.4vw,20px);
  overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-behavior:smooth;
  scrollbar-width:none; -ms-overflow-style:none;
  margin-right:calc((100vw - var(--shell)) / -2);
  padding-right:calc((100vw - var(--shell)) / 2);
}
.reel::-webkit-scrollbar { display:none; }
.reel-card { position:relative; flex:0 0 clamp(210px,21vw,310px); margin:0; aspect-ratio:1122/1402; overflow:hidden; scroll-snap-align:start; background:#e8e6e0; }
.reel-card img { display:block; width:100%; height:100%; object-fit:cover; filter:brightness(.94) saturate(.96); transform:scale(1.005); transition:filter 620ms cubic-bezier(.22,.61,.36,1),transform 620ms cubic-bezier(.22,.61,.36,1); }
.reel-card:hover img,.reel-card:focus-within img { filter:none; transform:scale(1.035); }
.reel-foot { display:flex; align-items:center; gap:clamp(20px,3vw,40px); margin-top:28px; }
.reel-rail { position:relative; flex:1; height:1px; background:var(--line); }
.reel-rail i { position:absolute; top:-1px; left:0; height:3px; width:14%; background:var(--brass); }
.reel-nav { display:flex; gap:8px; }
.reel-nav button { width:44px; height:44px; padding:0; border:1px solid var(--line); background:transparent; color:var(--ink); font:15px/1 var(--sans); cursor:pointer; transition:background 220ms ease,border-color 220ms ease,color 220ms ease; }
.reel-nav button:hover:not(:disabled) { border-color:var(--ink); background:var(--ink); color:var(--paper); }
.reel-nav button:disabled { opacity:.32; cursor:default; }

.gallery-page-hero { padding:clamp(24px,2.6vw,40px) 0 clamp(28px,3vw,42px); }
.gallery-page-hero h1 { margin:0; font-family:var(--serif); font-size:clamp(38px,6.4vw,104px); font-weight:400; line-height:.95; letter-spacing:-.05em; text-wrap:balance; }
.gallery-page-hero p { max-width:52ch; margin:26px 0 0; color:#6f695d; font-size:clamp(17px,1.5vw,19px); line-height:1.62; }
.gallery-grid-section { padding:0 0 clamp(80px,8vw,130px); }

/* /gallery - an editorial mosaic, not a chessboard. The rhythm is not decoration:
   twenty-five of these pictures carry a headline burnt into the artwork and can
   never be cropped, so they hold an exact 4:5 cell. The seventeen documentary
   photographs have no text, so they take the wide, square and banner cells. The
   constraint is what makes the page vary. */
.gallery-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(10px,1.1vw,16px); }
.gallery-grid figure { position:relative; margin:0; overflow:hidden; background:#e8e6e0; }
.gallery-grid .reveal:nth-child(3n+2) { transition-delay:70ms; }
.gallery-grid .reveal:nth-child(3n+3) { transition-delay:140ms; }
.gallery-grid img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 32%; filter:brightness(.95) saturate(.96); transform:scale(1.004); transition:filter 800ms cubic-bezier(.22,.61,.36,1),transform 800ms cubic-bezier(.22,.61,.36,1); }
.gallery-grid figure:hover img,.gallery-grid figure:focus-within img { filter:none; transform:scale(1.055); }
.gallery-grid figcaption { position:absolute; right:0; bottom:0; left:0; z-index:2; display:flex; align-items:baseline; gap:10px; padding:20px 18px 16px; color:#f7f5f0; font-family:var(--sans); font-size:12.5px; line-height:1.45; background:linear-gradient(to top,rgba(23,22,17,.74),rgba(23,22,17,0)); opacity:0; transform:translateY(9px); transition:opacity 480ms cubic-bezier(.22,.61,.36,1),transform 480ms cubic-bezier(.22,.61,.36,1); }
.gallery-grid figure:hover figcaption,.gallery-grid figure:focus-within figcaption { opacity:1; transform:none; }
.gallery-grid figcaption b { flex:none; color:var(--brass-bright); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; font-weight:600; letter-spacing:.16em; }
.gallery-grid figure::after { content:""; position:absolute; right:0; bottom:0; left:0; z-index:3; height:2px; background:var(--brass); transform:scaleX(0); transform-origin:left; transition:transform 700ms cubic-bezier(.22,.61,.36,1); }
.gallery-grid figure:hover::after,.gallery-grid figure:focus-within::after { transform:scaleX(1); }
.g-poster { grid-column:span 3; aspect-ratio:1122/1402; }
.g-poster-wide { grid-column:span 4; aspect-ratio:1122/1402; }
.g-poster-big { grid-column:span 6; aspect-ratio:1122/1402; }
.g-wide { grid-column:span 8; aspect-ratio:8/5; }
.g-full { grid-column:span 12; aspect-ratio:8/5; }
.g-tall { grid-column:span 4; aspect-ratio:4/5; }
.g-third { grid-column:span 4; aspect-ratio:1/1; }
.g-half { grid-column:span 6; aspect-ratio:3/2; }

@media (max-width: 1180px) {
  .g-poster { grid-column:span 4; }
  :root { --shell:min(100% - 48px, 1100px); }
  .desktop-nav { gap:22px; margin-right:26px; }
  .hero { grid-template-columns:1fr 1fr; gap:38px; }
  .hero h1 { font-size:clamp(62px,6.5vw,84px); }
  .system-row { grid-template-columns:52px 1.15fr .75fr 1fr; gap:26px; }
  .agent-section { grid-template-columns:.8fr 1.2fr; gap:60px; }
  .research-grid { gap:70px; }
  .research-art { min-height:520px; }
  .hardware-section { gap:70px; }
  .footer-grid { grid-template-columns:1.7fr repeat(4,1fr); gap:35px; }
}

@media (max-width: 900px) {
  :root { --shell:calc(100vw - 40px); --header-h:70px; }
  .site-header.is-compact { height:var(--header-h); }
  .desktop-nav,.header-actions .button { display:none; }
  .menu-toggle { width:42px; height:42px; padding:0; border:1px solid var(--ink); background:transparent; display:grid; place-content:center; gap:6px; }
  .menu-toggle span { width:18px; height:1px; background:var(--ink); transition:transform 180ms ease; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform:translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform:translateY(-3.5px) rotate(-45deg); }
  .mobile-nav { position:fixed; top:var(--header-h); right:0; bottom:0; left:0; z-index:90; padding:25px 20px max(40px,env(safe-area-inset-bottom)); overflow:auto; overscroll-behavior:contain; background:var(--paper); }
  .mobile-nav.is-open { display:flex; flex-direction:column; }
  .mobile-nav a { padding:15px 0; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; font-family:var(--serif); font-size:30px; line-height:1; }
  .mobile-nav .nav-arrow { font-family:Arial,sans-serif; font-size:18px; line-height:1; }
  .mobile-nav p { margin:25px 0 2px; color:#847d70; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; letter-spacing:.15em; text-transform:uppercase; }
  body.menu-open { overflow:hidden; }
  .hero { min-height:auto; padding-top:44px; grid-template-columns:1fr; }
  .hero-copy { padding-top:0; }
  .hero-copy { max-width:760px; }
  .hero h1 { font-size:clamp(68px,11vw,94px); }
  .context-field { min-height:620px; }
  .thesis { grid-template-columns:1fr; grid-template-rows:auto; gap:34px; }
  .thesis > .section-index,.thesis-poster,.thesis h2,.thesis > p:last-child { grid-column:1; grid-row:auto; }
  .thesis > .section-index { order:1; }
  .thesis h2 { order:2; }
  .thesis > p:last-child { order:3; }
  .thesis-poster { order:4; width:min(100%,500px); margin-top:8px; }
  .thesis > p:last-child { max-width:620px; }
  .section-heading { grid-template-columns:1fr; gap:30px; }
  .section-heading > p { max-width:580px; }
  .system-row { grid-template-columns:48px 1fr .7fr; }
  .system-row > p { grid-column:2; }
  .row-visual { grid-column:3; grid-row:1 / span 2; height:100%; min-height:180px; }
  .agent-section,.research-grid,.hardware-section { grid-template-columns:1fr; }
  .integrations-heading { grid-template-columns:1fr; gap:28px; }
  .integrations-heading > p { max-width:650px; }
  .integration-logos { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .integration-workflow { grid-template-columns:1fr auto .7fr auto 1fr; gap:14px; }
  .integration-platforms article { grid-template-columns:1fr; }
  .privacy-layout { grid-template-columns:1fr; gap:54px; }
  .pricing-heading { grid-template-columns:1fr; gap:22px; }
  .pricing-grid { grid-template-columns:1fr; }
  .pricing-grid article + article { border-left:0; border-top:1px solid var(--line); }
  .pricing-audience,.pricing-price,.pricing-grid ul { min-height:0; }
  .agent-copy,.hardware-copy { max-width:700px; }
  .agent-proof { width:100%; }
  .research-art { min-height:650px; }
  .hardware-visual { order:2; min-height:650px; }
  .hardware-copy { order:1; }
  .audience-grid { grid-template-columns:1fr; }
  .audience-card { min-height:280px; }
    .footer-grid { grid-template-columns:2fr repeat(2,1fr); }
  .reel-card { flex:0 0 clamp(190px,34vw,250px); }
  .g-poster,.g-poster-wide,.g-poster-big { grid-column:span 6; }
  .g-wide,.g-full { grid-column:span 12; }
  .g-tall,.g-third,.g-half { grid-column:span 6; }
  .gallery-grid img { filter:none; transform:none; }
  .gallery-grid figcaption,.gallery-grid figure::after { display:none; }
  .reel-card img { filter:none; transform:none; }
}

@media (max-width: 600px) {
  :root { --shell:calc(100vw - 28px); }
  .brand img { width:112px; }
  .hero { padding-top:52px; gap:48px; }
  .hero h1 { margin-top:22px; font-size:clamp(52px,15vw,70px); line-height:.88; }
  .hero-dek { font-size:20px; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .button { justify-content:space-between; }
  .context-field { min-height:460px; }
  .agent-core { width:170px; }
  .agent-mark { width:142px; height:108px; }
  .hero-monogram { width:96px; height:96px; }
  .agent-core p { margin-top:2px; font-size:11px; }
  .signal { font-size:7px; padding:5px 6px; }
  .signal-c,.signal-g { display:none; }
  .field-status { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .thesis { padding:72px 0; }
  .thesis-poster { width:100%; }
  .thesis h2,.section-heading h2,.agent-copy h2,.research-copy h2,.hardware-copy h2 { font-size:clamp(47px,14vw,67px); }
  .system-section { padding:72px 0; }
  .system-row { min-height:unset; padding:36px 0; grid-template-columns:32px 1fr; gap:18px; }
  .row-number { grid-row:1; }
  .row-title { grid-column:2; }
  .row-title h3 { font-size:37px; }
  .system-row > p { grid-column:2; }
  .row-visual { grid-column:2; grid-row:auto; min-height:145px; }
  .agent-section,.hardware-section { padding:78px 0; }
  .agent-stage { min-height:700px; padding:54px 14px 18px; }
  .agent-stage::after { right:0; bottom:0; width:38%; box-shadow:none; }
  .agent-stage-meta { right:14px; left:14px; font-size:6px; }
  .agent-flow { min-height:625px; }
  .agent-flow-rail { display:none; }
  .agent-flow-phones { min-height:575px; grid-template-columns:minmax(0,240px); align-items:start; }
  .agent-phone { grid-column:1; grid-row:1; visibility:hidden; opacity:0; transform:translateX(20px) scale(.97); }
  .agent-phone.is-active { visibility:visible; opacity:1; transform:none; }
  .agent-phone-crop { border-radius:25px; }
  .agent-phone > p { text-align:center; }
  .agent-flow-bottom { margin-top:10px; grid-template-columns:auto 1fr; gap:12px; }
  .agent-flow-status { text-align:right; }
  .agent-outcomes { grid-column:1 / -1; justify-content:center; }
  .agent-proof figcaption { gap:8px; font-size:7px; line-height:1.5; }
  .integrations-section { padding:72px 0; }
  .integrations-heading h2 { font-size:clamp(47px,14vw,67px); }
  .integration-stage { margin-top:42px; padding:48px 10px 10px; }
  .integration-stage-meta { right:12px; left:12px; font-size:6px; }
  .integration-logos { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .integration-logos > span { min-height:62px; padding:9px 8px; gap:7px; font-size:9px; }
  .integration-logo { width:23px; height:23px; flex-basis:23px; }
  .integration-workflow { min-height:0; padding:30px 6px; grid-template-columns:1fr; gap:13px; }
  .workflow-context,.workflow-output { min-height:96px; }
  .workflow-agent { padding:8px 0; }
  .workflow-agent > span { width:62px; height:62px; font-size:44px; }
  .workflow-arrow { justify-self:center; line-height:1; transform:rotate(90deg); animation:none; }
  .integration-platforms { grid-template-columns:1fr; }
  .integration-platforms article { min-height:0; padding:21px 12px; border-right:0; border-bottom:1px solid rgba(245,241,232,.14); grid-template-columns:94px 1fr; }
  .integration-platforms article:last-child { border-bottom:0; }
  .integration-platforms article > span { font-size:38px; }
  .privacy-controls article { grid-template-columns:30px 1fr; gap:8px 14px; }
  .privacy-controls article p { grid-column:2; }
  .research-art { min-height:430px; }
  .research-art > p { right:18px; bottom:18px; left:18px; font-size:36px; }
  .hardware-visual { min-height:460px; }
  .hardware-visual > .capture-device { top:47%; width:76%; height:72%; transform:translate(-50%,-50%) rotate(-4deg); }
  .capture-rings i:nth-child(1) { width:22%; }
  .capture-rings i:nth-child(2) { width:38%; }
  .capture-rings i:nth-child(3) { width:55%; }
  .capture-rings i:nth-child(4) { width:70%; }
  .red-dot-award { top:14px; right:14px; }
  .red-dot-award img { width:76px; }
  .pricing-section { padding:72px 0; }
  .pricing-heading h2 { font-size:clamp(46px,13vw,60px); }
  .pricing-grid { margin-top:36px; }
  .pricing-grid article { padding:30px 0; }
  .audience-card { min-height:250px; padding:24px; }
  .audience-card strong { font-size:35px; }
  .closing-inner h2 { font-size:clamp(56px,17vw,76px); }
  .footer-grid { grid-template-columns:1fr 1fr; gap:45px 25px; }
  .footer-brand { grid-column:1 / -1; }
  .footer-bottom { flex-direction:column; gap:8px; }
  .reel-card { flex:0 0 min(74vw,300px); }
  .gallery-page-hero h1 { font-size:clamp(34px,8.6vw,52px); }
  /* Everything stacks on a phone. Posters used to stay two-up here, so any row
     holding an odd number of them left one at half width with dead space beside
     it - the same stranded-picture look, just only visible on a phone. */
  .g-wide,.g-tall,.g-third,.g-half,.g-full,.g-poster,.g-poster-wide,.g-poster-big { grid-column:span 12; }
  .reel-foot { gap:18px; margin-top:20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .js .reveal { opacity:1; transform:none; }
  .field-pulse { display:none; }
  .reel { scroll-behavior:auto; }
  .reel-card img,.reel-card:hover img,.reel-card:focus-within img { transform:none!important; transition:none!important; }
  .gallery-grid img,.gallery-grid figure:hover img,.gallery-grid figure:focus-within img { transform:none!important; transition:none!important; }
  .gallery-grid figcaption { transform:none!important; transition:none!important; }
  .gallery-grid figure::after,.gallery-grid figure:hover::after { transform:scaleX(1)!important; transition:none!important; }
}