/* Cyberelf Labs — static launch surface */
:root {
  --void: #02080d;
  --void-deep: #010407;
  --panel: #07131b;
  --panel-bright: #0a1b25;
  --paper: #edfbff;
  --paper-soft: #c5dce5;
  --muted: #829aa7;
  --cyan: #43f5e7;
  --cyan-hot: #9efff7;
  --blue: #18abff;
  --violet: #8567ff;
  --amber: #ffc85e;
  --red: #ff5e78;
  --line: rgba(165, 231, 242, .17);
  --line-soft: rgba(165, 231, 242, .08);
  --glass: rgba(4, 15, 22, .68);
  --display: "Arial Narrow", "Aptos Display", "Segoe UI Variable Display", "Helvetica Neue", sans-serif;
  --body: "Segoe UI Variable Text", "Aptos", "Helvetica Neue", Arial, sans-serif;
  --mono: "Cascadia Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --page-pad: clamp(1.25rem, 4vw, 5rem);
  --header-height: 82px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

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

html {
  min-width: 320px;
  background: var(--void-deep);
  color-scheme: dark;
  scroll-behavior: smooth;
  scrollbar-color: var(--cyan) var(--void-deep);
}

body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 76% 6%, rgba(24, 171, 255, .11), transparent 29rem),
    radial-gradient(circle at 16% 38%, rgba(133, 103, 255, .07), transparent 35rem),
    var(--void);
  color: var(--paper);
  font-family: var(--body);
  font-size: 16px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body::before {
  content: "";
  position: fixed;
  z-index: 50;
  inset: 0;
  pointer-events: none;
  opacity: .055;
  background-image:
    repeating-radial-gradient(circle at 17% 31%, rgba(255,255,255,.75) 0 .42px, transparent .62px 3.1px),
    repeating-radial-gradient(circle at 73% 68%, rgba(255,255,255,.4) 0 .35px, transparent .6px 4.2px);
  background-size: 7px 7px, 11px 11px;
  mix-blend-mode: screen;
}

::selection { background: var(--cyan); color: var(--void); }

a { color: inherit; text-decoration: none; }
button { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img, picture, canvas, svg { display: block; max-width: 100%; }
button { font: inherit; }

:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 5px;
}

.skip-link {
  position: fixed;
  z-index: 999;
  top: 1rem;
  left: 1rem;
  transform: translateY(-180%);
  border: 1px solid var(--cyan);
  background: var(--void);
  color: var(--cyan);
  font: 800 .7rem/1 var(--mono);
  letter-spacing: .1em;
  padding: .8rem 1rem;
  text-transform: uppercase;
  transition: transform .2s;
}

.skip-link:focus { transform: translateY(0); }

.scroll-progress {
  position: fixed;
  z-index: 200;
  top: 0;
  right: 0;
  left: 0;
  height: 2px;
  background: transparent;
  pointer-events: none;
}

.scroll-progress span {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left;
  background: linear-gradient(90deg, var(--cyan), var(--blue), var(--violet));
  box-shadow: 0 0 14px var(--cyan);
}

.ambient-canvas {
  position: fixed;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .42;
  pointer-events: none;
}

main, .site-footer { position: relative; z-index: 1; }
section[id] { scroll-margin-top: var(--header-height); }

.site-header {
  position: fixed;
  z-index: 100;
  top: 0;
  right: 0;
  left: 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: clamp(1rem, 3vw, 3rem);
  height: var(--header-height);
  padding: 0 var(--page-pad);
  border-bottom: 1px solid var(--line-soft);
  background: linear-gradient(180deg, rgba(1, 6, 10, .88), rgba(1, 6, 10, .52));
  -webkit-backdrop-filter: blur(20px) saturate(130%);
  backdrop-filter: blur(20px) saturate(130%);
  transition: height .35s var(--ease-out), background .35s, border-color .35s;
}

.site-header.is-scrolled {
  height: 68px;
  border-color: var(--line);
  background: rgba(1, 7, 11, .92);
}

.brand {
  display: flex;
  align-items: center;
  gap: .8rem;
  width: max-content;
}

.brand-mark {
  position: relative;
  width: 44px;
  height: 44px;
  flex: none;
  filter: drop-shadow(0 0 14px rgba(67, 245, 231, .24));
  transition: transform .45s var(--ease-out), filter .3s;
}

.brand:hover .brand-mark {
  transform: rotate(8deg) scale(1.05);
  filter: drop-shadow(0 0 18px rgba(67, 245, 231, .55));
}

.brand-mark::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  box-shadow: 0 0 20px var(--cyan);
  opacity: .18;
}

.brand-copy {
  display: flex;
  flex-direction: column;
  gap: .05rem;
}

.brand-copy strong {
  font-family: var(--display);
  font-size: 1.06rem;
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1;
  text-transform: uppercase;
}

.brand-copy small {
  color: var(--muted);
  font: 650 .52rem/1.4 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.4vw, 2.7rem);
}

.site-nav a {
  position: relative;
  color: var(--paper-soft);
  font: 750 .62rem/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: color .2s;
}

.site-nav a span {
  color: var(--cyan);
  font-size: .48rem;
  margin-right: .28rem;
  opacity: .65;
}

.site-nav a::after {
  content: "";
  position: absolute;
  right: 100%;
  bottom: -.62rem;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, var(--cyan), var(--blue));
  box-shadow: 0 0 9px var(--cyan);
  transition: right .28s var(--ease-out);
}

.site-nav a:hover { color: var(--paper); }
.site-nav a:hover::after { right: 0; }

.header-cta {
  display: inline-flex;
  justify-self: end;
  align-items: center;
  gap: .55rem;
  min-height: 39px;
  padding: .7rem .9rem;
  border: 1px solid rgba(67, 245, 231, .42);
  background: rgba(67, 245, 231, .06);
  color: var(--cyan-hot);
  font: 800 .6rem/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: transform .2s var(--ease-out), background .2s, border-color .2s;
}

.header-cta:hover {
  transform: translateY(-2px);
  border-color: var(--cyan);
  background: rgba(67, 245, 231, .13);
}

.live-pip, .signal-dot {
  width: 7px;
  height: 7px;
  flex: none;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 0 5px rgba(67,245,231,.09), 0 0 13px var(--cyan);
  animation: signal-pulse 2.2s ease-in-out infinite;
}

.nav-toggle { display: none; }

.hero {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: max(780px, 100svh);
  overflow: hidden;
  padding: calc(var(--header-height) + clamp(3rem, 8vh, 7rem)) var(--page-pad) clamp(5.5rem, 10vh, 8rem);
  border-bottom: 1px solid var(--line);
}

.hero::before {
  content: "";
  position: absolute;
  z-index: -3;
  inset: 0;
  background-image:
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size: clamp(70px, 7vw, 130px) clamp(70px, 7vw, 130px);
  -webkit-mask-image: linear-gradient(to bottom, #000 6%, transparent 86%);
  mask-image: linear-gradient(to bottom, #000 6%, transparent 86%);
}

.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(1, 6, 10, .99) 0%, rgba(1, 6, 10, .93) 30%, rgba(1, 6, 10, .38) 58%, rgba(1, 6, 10, .1) 100%),
    linear-gradient(180deg, rgba(1, 6, 10, .08) 48%, rgba(1, 6, 10, .86) 100%);
  pointer-events: none;
}

.hero-art {
  position: absolute;
  z-index: -2;
  inset: 0;
  margin: 0;
  overflow: hidden;
  background: var(--void);
  transform: translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0) scale(1.012);
  transition: transform 1.1s var(--ease-out);
}

.hero-art picture, .hero-art img {
  width: 100%;
  height: 100%;
}

.hero-art img {
  object-fit: cover;
  object-position: 67% 44%;
  transform: scale(1.025);
  filter: saturate(1.08) contrast(1.04);
  animation: hero-breathe 14s ease-in-out infinite alternate;
}

.hero-art-wash {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 78% 34%, transparent 0 15%, rgba(35, 226, 235, .08) 24%, transparent 45%),
    linear-gradient(90deg, rgba(2,8,13,.34), transparent 60%);
  mix-blend-mode: screen;
}

.hero-orbits {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: -13vw;
  width: min(67vw, 1040px);
  aspect-ratio: 1;
  transform: translateY(-50%);
  opacity: .45;
  pointer-events: none;
}

.orbit {
  position: absolute;
  inset: 0;
  border: 1px solid rgba(67,245,231,.15);
  border-radius: 50%;
  animation: orbit-spin 26s linear infinite;
}

.orbit::before, .orbit::after {
  content: "";
  position: absolute;
  top: 50%;
  left: -4px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 16px var(--cyan);
}

.orbit::after { right: -4px; left: auto; background: var(--violet); box-shadow: 0 0 16px var(--violet); }
.orbit-b { inset: 12%; animation-duration: 19s; animation-direction: reverse; transform: rotate(31deg); }
.orbit-c { inset: 27%; animation-duration: 13s; opacity: .65; }
.orbit i { position: absolute; inset: 50% 0 auto; height: 1px; background: linear-gradient(90deg, transparent, rgba(67,245,231,.22), transparent); }

.hero-copy {
  position: relative;
  z-index: 5;
  width: min(70vw, 1040px);
}

.system-label, .kicker, .card-index {
  margin: 0;
  color: var(--muted);
  font: 760 .66rem/1.4 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}

.system-label {
  display: flex;
  align-items: center;
  gap: .8rem;
}

.system-label b {
  color: var(--cyan);
  font-weight: 800;
}

.hero h1 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: clamp(1.2rem, 3vh, 2.5rem) 0 0;
  font-family: var(--display);
  font-size: clamp(4.65rem, 9vw, 10.4rem);
  font-weight: 880;
  letter-spacing: -.085em;
  line-height: .73;
  text-transform: uppercase;
}

.hero h1 span { display: block; white-space: nowrap; }

.hero h1 .outline-word {
  margin-top: .09em;
  color: transparent;
  -webkit-text-stroke: clamp(1px, .08vw, 2px) rgba(222, 251, 255, .88);
  text-shadow: .045em .03em 0 rgba(24,171,255,.21);
}

.hero h1 .glow-word {
  position: relative;
  color: var(--cyan-hot);
  text-shadow: 0 0 35px rgba(67,245,231,.26);
}

.hero h1 .glow-word::after {
  content: "";
  position: absolute;
  right: -.08em;
  bottom: .02em;
  left: .02em;
  height: .055em;
  background: linear-gradient(90deg, var(--cyan), var(--blue), transparent);
  box-shadow: 0 0 14px var(--cyan);
  transform: skewX(-24deg);
}

.hero-lede {
  max-width: 710px;
  margin: clamp(1.8rem, 4vh, 3rem) 0 0;
  color: var(--paper-soft);
  font-size: clamp(1.08rem, 1.5vw, 1.42rem);
  line-height: 1.6;
}

.hero-lede strong { color: var(--paper); font-weight: 720; }

.hero-actions, .product-actions, .founder-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  margin-top: 2rem;
}

.button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .85rem;
  min-height: 51px;
  padding: .95rem 1.25rem;
  overflow: hidden;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--paper);
  font: 800 .64rem/1 var(--mono);
  letter-spacing: .085em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .25s, border-color .25s, transform .25s var(--ease-out), box-shadow .25s;
}

.button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 34%, rgba(255,255,255,.18) 50%, transparent 66%);
  transform: translateX(-130%);
  transition: transform .65s var(--ease-out);
}

.button:hover::before { transform: translateX(130%); }
.button:hover { transform: translateY(-3px); }

.button-primary {
  border-color: var(--cyan);
  background: var(--cyan);
  color: #031015;
  box-shadow: 0 0 0 0 rgba(67,245,231,0);
}

.button-primary:hover { box-shadow: 0 10px 32px rgba(67,245,231,.18), 0 0 25px rgba(67,245,231,.14); }
.button-ghost { background: rgba(5, 17, 24, .6); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.button-ghost:hover { border-color: var(--cyan); }
.button span { position: relative; z-index: 1; }

.founder-line {
  margin: 1.35rem 0 0;
  color: var(--muted);
  font: 650 .59rem/1.5 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.founder-line a {
  color: var(--paper-soft);
  border-bottom: 1px solid var(--line);
  transition: color .2s, border-color .2s;
}

.founder-line a:hover { color: var(--cyan); border-color: var(--cyan); }
.founder-line span { margin: 0 .5rem; color: var(--cyan); }

.glass-panel {
  border: 1px solid rgba(127, 218, 235, .24);
  background: linear-gradient(145deg, rgba(255,255,255,.055), transparent 40%), var(--glass);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
  box-shadow: 0 28px 90px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.04);
}

.hero-receipt {
  position: absolute;
  z-index: 7;
  right: var(--page-pad);
  bottom: clamp(5.8rem, 10vh, 8rem);
  width: min(370px, 28vw);
  min-width: 305px;
  transform: rotate(-1deg);
}

.hero-receipt::before, .hero-receipt::after,
.evaluation-console::before, .evaluation-console::after {
  content: "";
  position: absolute;
  width: 13px;
  height: 13px;
  pointer-events: none;
}

.hero-receipt::before, .evaluation-console::before { top: -1px; left: -1px; border-top: 2px solid var(--cyan); border-left: 2px solid var(--cyan); }
.hero-receipt::after, .evaluation-console::after { right: -1px; bottom: -1px; border-right: 2px solid var(--blue); border-bottom: 2px solid var(--blue); }

.panel-topline, .receipt-hash {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: var(--muted);
  font: 700 .51rem/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.panel-topline { padding: .8rem .9rem; border-bottom: 1px solid var(--line); }

.panel-topline strong {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .34rem .43rem;
  background: rgba(67,245,231,.12);
  color: var(--cyan);
  font-size: .54rem;
}

.panel-topline strong i { width: 5px; height: 5px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 9px var(--cyan); }

.receipt-score { display: flex; align-items: baseline; padding: .9rem 1rem .3rem; }
.receipt-score span { margin-right: auto; color: var(--paper-soft); font: 700 .58rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.receipt-score b { font-family: var(--display); font-size: 3.5rem; letter-spacing: -.08em; line-height: 1; }
.receipt-score small { color: var(--muted); font: 700 .7rem/1 var(--mono); }

.receipt-delta { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.receipt-delta span { padding: .62rem .5rem; border-right: 1px solid var(--line); color: var(--paper-soft); font: 700 .48rem/1.25 var(--mono); letter-spacing: .05em; text-align: center; text-transform: uppercase; }
.receipt-delta span:first-child { color: var(--cyan); }
.receipt-delta span:last-child { border-right: 0; }
.receipt-hash { padding: .65rem .9rem; font-size: .45rem; }
.receipt-hash span:last-child { color: var(--cyan); }

.hero-coordinates {
  position: absolute;
  z-index: 5;
  right: var(--page-pad);
  bottom: 1.2rem;
  left: var(--page-pad);
  display: flex;
  justify-content: space-between;
  color: rgba(180, 220, 229, .38);
  font: 650 .5rem/1 var(--mono);
  letter-spacing: .12em;
}

.scroll-cue {
  position: absolute;
  z-index: 8;
  right: 50%;
  bottom: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  color: var(--muted);
  font: 700 .47rem/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
  transform: translateX(50%);
}

.scroll-cue i { position: relative; width: 1px; height: 24px; overflow: hidden; background: var(--line); }
.scroll-cue i::after { content: ""; position: absolute; inset: -100% 0 auto; height: 100%; background: var(--cyan); animation: scroll-drop 2s ease-in-out infinite; }

.signal-marquee {
  position: relative;
  z-index: 3;
  overflow: hidden;
  border-bottom: 1px solid rgba(0,0,0,.5);
  background: var(--cyan);
  color: #031015;
}

.signal-marquee > div {
  display: flex;
  align-items: center;
  width: max-content;
  min-height: 50px;
  animation: marquee 30s linear infinite;
}

.signal-marquee span {
  padding: 0 2rem;
  font: 900 .61rem/1 var(--mono);
  letter-spacing: .12em;
  white-space: nowrap;
}

.signal-marquee i { width: 5px; height: 5px; border-radius: 50%; background: var(--violet); box-shadow: 0 0 0 4px rgba(133,103,255,.12); }

.section-shell {
  position: relative;
  display: grid;
  grid-template-columns: minmax(78px, .14fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 6.5rem);
  width: 100%;
  padding: clamp(6.5rem, 10vw, 11rem) var(--page-pad);
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}

.section-index {
  grid-row: 1 / span 8;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  color: var(--muted);
}

.section-index > span {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  flex: none;
  border: 1px solid var(--line);
  color: var(--cyan);
  font: 800 .63rem/1 var(--mono);
  box-shadow: inset 0 0 20px rgba(67,245,231,.03);
}

.section-index p {
  margin: .75rem 0 0;
  font: 750 .57rem/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space: nowrap;
  writing-mode: vertical-rl;
}

.section-heading { grid-column: 2; min-width: 0; }
.section-heading .kicker, .thesis-statement .kicker, .founder-copy .kicker { color: var(--cyan); }

.section-heading h2, .thesis-statement h2, .founder-copy h2, .contact-section h2 {
  margin: 1.25rem 0 0;
  font-family: var(--display);
  font-size: clamp(3.6rem, 7.4vw, 9rem);
  font-weight: 850;
  letter-spacing: -.075em;
  line-height: .82;
  text-transform: uppercase;
}

.section-heading h2 em, .thesis-statement h2 em, .founder-copy h2 em {
  color: transparent;
  font-style: normal;
  -webkit-text-stroke: 1px rgba(197, 220, 229, .8);
  text-shadow: .035em .035em 0 rgba(24,171,255,.2);
}

.section-heading > p:last-of-type {
  max-width: 790px;
  margin: 2.1rem 0 0;
  color: var(--paper-soft);
  font-size: clamp(1.05rem, 1.65vw, 1.42rem);
  line-height: 1.65;
}

.stack-section {
  background:
    linear-gradient(90deg, transparent 0 64%, rgba(67,245,231,.022) 64% 64.08%, transparent 64.08%),
    radial-gradient(circle at 22% 35%, rgba(133,103,255,.11), transparent 30rem),
    radial-gradient(circle at 76% 66%, rgba(24,171,255,.08), transparent 34rem),
    #02080d;
}

.stack-heading { max-width: 1390px; }
.stack-heading h2 { font-size: clamp(3.5rem, 7.15vw, 8.5rem); }
.stack-heading h2 em { color: var(--cyan-hot); -webkit-text-stroke: 0; text-shadow: 0 0 38px rgba(67,245,231,.18); }

.stack-console {
  grid-column: 2;
  min-width: 0;
  margin-top: clamp(3.5rem, 7vw, 6rem);
  overflow: hidden;
  background: linear-gradient(145deg, rgba(8,24,34,.94), rgba(2,8,13,.97));
  box-shadow: 0 38px 110px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.035);
}

.stack-console-head,
.stack-console-foot {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 50px;
  padding: .8rem 1rem;
  color: var(--muted);
  font: 720 .54rem/1.25 var(--mono);
  letter-spacing: .09em;
  text-transform: uppercase;
}

.stack-console-head { border-bottom: 1px solid var(--line); }
.stack-console-foot { min-height: 44px; border-top: 1px solid var(--line); font-size: .48rem; }
.stack-console-head strong { display: flex; align-items: center; gap: .55rem; color: var(--cyan); font: inherit; }
.stack-console-head strong i { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 12px var(--cyan); animation: signal-pulse 2s ease-in-out infinite; }
.stack-boundary { color: var(--amber); }

.stack-stage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(130px,.75fr) 34px minmax(220px,1.25fr) 34px minmax(145px,.86fr) 34px minmax(145px,.86fr) 34px minmax(130px,.75fr);
  align-items: center;
  gap: 0;
  min-height: 420px;
  padding: clamp(2rem, 4vw, 4.2rem) clamp(1rem, 2.4vw, 2.5rem);
  background:
    linear-gradient(rgba(165,231,242,.036) 1px, transparent 1px),
    linear-gradient(90deg, rgba(165,231,242,.036) 1px, transparent 1px),
    radial-gradient(circle at 50% 50%, rgba(24,171,255,.09), transparent 45%);
  background-size: 42px 42px, 42px 42px, auto;
}

.stack-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(2,8,13,.75), transparent 7% 93%, rgba(2,8,13,.75));
}

.stack-node {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  min-height: 126px;
  padding: 1.1rem;
  border: 1px solid var(--line);
  background: rgba(3,12,18,.94);
  box-shadow: inset 0 1px rgba(255,255,255,.025), 0 16px 38px rgba(0,0,0,.28);
  transition: border-color .25s, background .25s, transform .3s var(--ease-out);
}

a.stack-node:hover { z-index: 4; border-color: var(--node-accent, var(--cyan)); background: rgba(8,25,34,.98); transform: translateY(-5px); }
.stack-node span { color: var(--node-accent, var(--cyan)); font: 800 .48rem/1.2 var(--mono); letter-spacing: .09em; }
.stack-node strong { margin-top: 1.2rem; font: 800 clamp(1.15rem, 1.6vw, 1.8rem)/.95 var(--display); letter-spacing: -.045em; text-transform: uppercase; overflow-wrap: anywhere; }
.stack-node small { margin-top: .6rem; color: var(--muted); font-size: .7rem; line-height: 1.4; }
.stack-candidate { --node-accent: var(--paper-soft); }
.stack-formal { --node-accent: var(--violet); }
.stack-empirical { --node-accent: var(--cyan); }
.stack-foundry { --node-accent: var(--amber); }
.stack-runtime { --node-accent: var(--blue); }
.stack-baseline { --node-accent: var(--cyan-hot); border-color: rgba(67,245,231,.35); background: linear-gradient(145deg, rgba(67,245,231,.12), rgba(3,12,18,.96)); }

.stack-authorities {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr;
  gap: .7rem;
}

.stack-authorities .stack-node { min-height: 116px; }
.stack-authorities .stack-node strong { margin-top: .85rem; }

.stack-wire {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  height: 1px;
  overflow: visible;
  background: linear-gradient(90deg, rgba(67,245,231,.18), rgba(67,245,231,.72));
}

.stack-wire::before {
  content: "";
  position: absolute;
  top: -3px;
  right: -1px;
  width: 7px;
  height: 7px;
  border-top: 1px solid var(--cyan);
  border-right: 1px solid var(--cyan);
  transform: rotate(45deg);
}

.stack-wire::after {
  content: "";
  position: absolute;
  top: -2px;
  left: -4px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--cyan-hot);
  box-shadow: 0 0 12px 3px var(--cyan);
  animation: stack-packet 2.8s linear infinite;
}

.stack-wire:nth-of-type(2)::after { animation-delay: -.55s; }
.stack-wire:nth-of-type(3)::after { animation-delay: -1.1s; }
.stack-wire:nth-of-type(4)::after { animation-delay: -1.65s; }

.stack-products {
  grid-column: 2;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  margin-top: 1rem;
  border: 1px solid var(--line);
  background: var(--line);
}

.stack-products a {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 245px;
  padding: clamp(1.25rem, 2.4vw, 2.1rem);
  overflow: hidden;
  background: rgba(2,8,13,.94);
  transition: background .25s, transform .3s var(--ease-out);
}

.stack-products a::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 100% 0, rgba(67,245,231,.12), transparent 44%); opacity: 0; transition: opacity .25s; }
.stack-products a:hover { z-index: 2; background: rgba(8,25,34,.98); transform: translateY(-5px); }
.stack-products a:hover::before { opacity: 1; }
.stack-products span { position: relative; color: var(--cyan); font: 800 .5rem/1 var(--mono); letter-spacing: .09em; }
.stack-products strong { position: relative; margin-top: 2.8rem; font: 820 clamp(1.5rem,2.15vw,2.4rem)/.95 var(--display); letter-spacing: -.05em; text-transform: uppercase; }
.stack-products small { position: relative; margin-top: .8rem; color: var(--muted); font-size: .8rem; line-height: 1.55; }
.stack-products b { position: relative; margin-top: auto; padding-top: 1.5rem; color: var(--paper-soft); font: 760 .52rem/1.3 var(--mono); letter-spacing: .06em; text-transform: uppercase; }

.product-section {
  background:
    radial-gradient(circle at 78% 38%, rgba(67,245,231,.08), transparent 30rem),
    linear-gradient(180deg, rgba(7,19,27,.6), transparent 35%);
}

.product-heading { max-width: 1320px; }
.product-heading h2 { font-size: clamp(3.4rem, 6.8vw, 8rem); }
.product-actions { margin-top: 2.2rem; }

.text-link {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  padding: .45rem 0;
  border-bottom: 1px solid var(--paper-soft);
  color: var(--paper-soft);
  font: 780 .62rem/1.2 var(--mono);
  letter-spacing: .075em;
  text-transform: uppercase;
  transition: color .2s, border-color .2s;
}

.text-link span { color: var(--cyan); }
.text-link:hover { color: var(--cyan); border-color: var(--cyan); }

.evaluation-console {
  position: relative;
  grid-column: 2;
  min-width: 0;
  margin-top: clamp(3.5rem, 7vw, 6rem);
  overflow: hidden;
}

.console-header, .console-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: var(--muted);
  font: 720 .56rem/1 var(--mono);
  letter-spacing: .09em;
  text-transform: uppercase;
}

.console-header { min-height: 50px; padding: .8rem 1rem; border-bottom: 1px solid var(--line); }
.console-rune { margin-right: .6rem; color: var(--cyan); text-shadow: 0 0 12px var(--cyan); }
.console-status { display: flex; align-items: center; gap: .5rem; color: var(--cyan); }
.console-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }

.console-body { position: relative; height: clamp(330px, 45vw, 590px); min-height: 330px; overflow: hidden; }
.console-body::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 0 97%, rgba(67,245,231,.07) 97%); background-size: 100% 7px; mix-blend-mode: screen; }
#whetstone-signal { width: 100%; height: 100%; cursor: crosshair; }

.promotion-line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 76%;
  width: 1px;
  border-left: 1px dashed rgba(67,245,231,.65);
  pointer-events: none;
  filter: drop-shadow(0 0 7px var(--cyan));
}

.promotion-line span {
  position: absolute;
  top: 1.1rem;
  right: .7rem;
  color: var(--cyan);
  font: 750 .49rem/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}

.console-metrics { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.console-metrics > div { padding: clamp(.85rem, 2vw, 1.3rem); border-right: 1px solid var(--line); }
.console-metrics > div:last-child { border-right: 0; }
.console-metrics span { display: block; margin-bottom: .55rem; color: var(--muted); font: 700 .52rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.console-metrics strong { font-family: var(--display); font-size: clamp(1.4rem, 3vw, 3.1rem); font-weight: 760; letter-spacing: -.06em; line-height: 1; }
.console-metrics .positive { color: var(--cyan); text-shadow: 0 0 18px rgba(67,245,231,.2); }
.console-footer { min-height: 44px; padding: .75rem 1rem; font-size: .48rem; }

.gate-rail {
  grid-column: 2;
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
  align-items: stretch;
  margin-top: 1rem;
  border: 1px solid var(--line);
  background: rgba(2,8,13,.5);
}

.gate-rail > div { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; align-content: center; gap: .35rem .8rem; min-height: 100px; padding: 1rem; }
.gate-rail > div b { grid-row: 1 / span 2; align-self: center; color: var(--cyan); font: 800 .55rem/1 var(--mono); }
.gate-rail > div span { font: 750 .65rem/1.2 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.gate-rail > div small { color: var(--muted); font-size: .76rem; }
.gate-rail > i { display: grid; place-items: center; width: 32px; border-right: 1px solid var(--line); border-left: 1px solid var(--line); color: var(--cyan); font-style: normal; }
.gate-rail .gate-output { background: linear-gradient(135deg, rgba(67,245,231,.15), rgba(24,171,255,.08)); }

.authority-section {
  gap: clamp(3rem, 7vw, 8rem);
  background:
    radial-gradient(circle at 12% 25%, rgba(133,103,255,.1), transparent 31rem),
    radial-gradient(circle at 88% 78%, rgba(255,200,94,.075), transparent 28rem),
    var(--void-deep);
}

.authority-product {
  position: relative;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0,.9fr) minmax(430px,1.1fr);
  gap: clamp(2rem, 5vw, 6rem);
  align-items: center;
  min-width: 0;
  padding: clamp(2rem, 5vw, 5.5rem);
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(7,20,29,.94), rgba(2,8,13,.97));
  box-shadow: 0 30px 90px rgba(0,0,0,.28);
}

.authority-product::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  width: 28%;
  height: 1px;
  background: linear-gradient(90deg, var(--authority-accent, var(--cyan)), transparent);
  box-shadow: 0 0 16px var(--authority-accent, var(--cyan));
}

.salience-product { --authority-accent: var(--violet); }
.foundry-product { --authority-accent: var(--amber); }
.foundry-product .authority-instrument { order: -1; }

.authority-copy { min-width: 0; }
.authority-index { display: flex; align-items: center; gap: 1rem; margin-bottom: 3rem; color: var(--muted); }
.authority-index span { display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid var(--line); color: var(--authority-accent); font: 800 .63rem/1 var(--mono); }
.authority-index small { font: 750 .57rem/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.authority-copy .kicker { color: var(--authority-accent); }
.authority-copy h2 { margin: 1.25rem 0 0; font: 850 clamp(3rem,5.7vw,7rem)/.82 var(--display); letter-spacing: -.075em; text-transform: uppercase; }
.salience-product .authority-copy h2 { font-size: clamp(2.25rem,4vw,5.5rem); }
.authority-copy h2 em { color: transparent; font-style: normal; -webkit-text-stroke: 1px rgba(197,220,229,.8); text-shadow: .035em .035em 0 color-mix(in srgb, var(--authority-accent) 24%, transparent); }
.authority-copy > p:not(.kicker) { max-width: 700px; margin: 2rem 0 0; color: var(--paper-soft); font-size: clamp(1rem,1.3vw,1.2rem); line-height: 1.68; }
.authority-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem 1.5rem; margin-top: 2.2rem; }

.authority-instrument {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--authority-accent) 35%, transparent);
  background:
    linear-gradient(rgba(165,231,242,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(165,231,242,.032) 1px, transparent 1px),
    rgba(1,7,11,.93);
  background-size: 34px 34px, 34px 34px, auto;
  box-shadow: 0 24px 70px rgba(0,0,0,.38), inset 0 0 55px color-mix(in srgb, var(--authority-accent) 5%, transparent);
}

.authority-instrument::after {
  content: "";
  position: absolute;
  z-index: 4;
  inset: -70% auto -70% -28%;
  width: 20%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--authority-accent) 10%, transparent), transparent);
  transform: rotate(10deg);
  animation: instrument-scan 8.5s linear infinite;
}

.instrument-head {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 50px;
  padding: .8rem 1rem;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font: 720 .52rem/1.25 var(--mono);
  letter-spacing: .08em;
}

.instrument-head strong { display: flex; align-items: center; gap: .5rem; color: var(--authority-accent); font: inherit; }
.instrument-head strong i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px currentColor; animation: signal-pulse 2s ease-in-out infinite; }

.lean-code {
  display: grid;
  gap: .72rem;
  min-height: 280px;
  align-content: center;
  padding: clamp(1.4rem,3.5vw,3rem);
  color: var(--paper-soft);
  font: 650 clamp(.7rem,1.05vw,.95rem)/1.5 var(--mono);
  overflow-x: auto;
}

.lean-code span { white-space: pre; }
.lean-code b { color: var(--violet); font: inherit; }
.lean-code .code-proof { color: var(--cyan-hot); }

.instrument-gates {
  display: grid;
  grid-template-columns: repeat(5,1fr);
  border-top: 1px solid var(--line);
}

.instrument-gates span { display: grid; gap: .5rem; padding: .9rem .7rem; border-right: 1px solid var(--line); }
.instrument-gates span:last-child { border-right: 0; }
.instrument-gates b { color: var(--muted); font: 700 .43rem/1 var(--mono); letter-spacing: .08em; }
.instrument-gates i { color: var(--violet); font: 800 .55rem/1 var(--mono); font-style: normal; text-shadow: 0 0 10px rgba(133,103,255,.4); }

.instrument-receipt {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  min-height: 44px;
  padding: .75rem 1rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font: 710 .45rem/1.3 var(--mono);
  letter-spacing: .07em;
  text-transform: uppercase;
}

.instrument-receipt code { min-width: 0; overflow: hidden; color: var(--authority-accent); font: inherit; text-overflow: ellipsis; white-space: nowrap; }

.decision-ledger { display: grid; min-height: 372px; padding: clamp(1rem,2.5vw,2rem); }
.decision-ledger > div {
  position: relative;
  display: grid;
  grid-template-columns: 32px minmax(100px,.7fr) minmax(150px,1fr) auto;
  align-items: center;
  gap: .8rem;
  min-height: 62px;
  padding: .7rem .85rem;
  border-bottom: 1px solid var(--line);
}

.decision-ledger > div:last-child { border-bottom: 0; background: linear-gradient(90deg, rgba(255,200,94,.08), transparent); }
.decision-ledger span { color: var(--amber); font: 800 .47rem/1 var(--mono); }
.decision-ledger b { font: 780 .75rem/1.2 var(--mono); text-transform: uppercase; }
.decision-ledger small { color: var(--muted); font-size: .72rem; line-height: 1.35; }
.decision-ledger i { color: var(--amber); font: 800 .54rem/1 var(--mono); font-style: normal; text-shadow: 0 0 12px rgba(255,200,94,.34); }
.authority-boundary { grid-column: 1 / -1; margin: -3.2rem 0 0; padding: 0 clamp(2rem,5vw,5.5rem) 1.7rem; color: var(--muted); font: 680 .49rem/1.5 var(--mono); letter-spacing: .06em; text-transform: uppercase; }

.backplane-section {
  background:
    linear-gradient(90deg, transparent 0 9%, rgba(67,245,231,.025) 9% 9.08%, transparent 9.08%),
    radial-gradient(circle at 76% 42%, rgba(133,103,255,.13), transparent 30rem),
    radial-gradient(circle at 30% 82%, rgba(67,245,231,.07), transparent 27rem),
    #030a10;
}

.backplane-heading em {
  color: var(--cyan-hot) !important;
  -webkit-text-stroke: 0 !important;
  text-shadow: 0 0 36px rgba(67,245,231,.16) !important;
}

.backplane-console {
  --bus-tilt-x: 0deg;
  --bus-tilt-y: 0deg;
  position: relative;
  grid-column: 2;
  min-width: 0;
  margin-top: clamp(3.5rem, 7vw, 6rem);
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(8,24,34,.93), rgba(2,8,13,.96)),
    var(--glass);
  box-shadow: 0 38px 110px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.035);
  transform: perspective(1200px) rotateX(var(--bus-tilt-x)) rotateY(var(--bus-tilt-y));
  transform-style: preserve-3d;
  transition: transform .55s var(--ease-out), border-color .3s;
}

.backplane-console:hover { border-color: rgba(67,245,231,.32); }

.backplane-console::before {
  content: "";
  position: absolute;
  z-index: 3;
  inset: -70% auto -70% -24%;
  width: 22%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(158,255,247,.065), transparent);
  transform: rotate(9deg);
  animation: bus-scan 8s linear infinite;
}

.backplane-console-head,
.backplane-console-foot {
  position: relative;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 50px;
  padding: .8rem 1rem;
  color: var(--muted);
  font: 720 .54rem/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}

.backplane-console-head { border-bottom: 1px solid var(--line); }
.backplane-console-foot { min-height: 44px; border-top: 1px solid var(--line); font-size: .48rem; }
.backplane-console-head strong { display: flex; align-items: center; gap: .55rem; color: var(--cyan); font: inherit; }
.backplane-console-head strong i { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 12px var(--cyan); animation: signal-pulse 2s ease-in-out infinite; }

.backplane-stage {
  position: relative;
  min-height: clamp(340px, 34vw, 470px);
  overflow: hidden;
  padding: clamp(4.3rem, 7vw, 7rem) clamp(1rem, 3vw, 3rem) clamp(3rem, 5vw, 4.8rem);
  background:
    linear-gradient(rgba(165,231,242,.038) 1px, transparent 1px),
    linear-gradient(90deg, rgba(165,231,242,.038) 1px, transparent 1px),
    radial-gradient(circle at 50% 54%, rgba(24,171,255,.09), transparent 42%);
  background-size: 46px 46px, 46px 46px, auto;
}

.backplane-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(2,8,13,.75), transparent 8% 92%, rgba(2,8,13,.75));
}

.backplane-traces { position: absolute; z-index: 0; inset: 18% 2% 12%; pointer-events: none; }
.backplane-traces i {
  position: absolute;
  right: 0;
  left: 0;
  height: 1px;
  overflow: hidden;
  background: linear-gradient(90deg, transparent, rgba(67,245,231,.19) 11%, rgba(133,103,255,.17) 74%, transparent);
}
.backplane-traces i:nth-child(1) { top: 14%; }
.backplane-traces i:nth-child(2) { top: 53%; }
.backplane-traces i:nth-child(3) { top: 87%; }
.backplane-traces i::after {
  content: "";
  position: absolute;
  top: -2px;
  left: -10%;
  width: 8%;
  height: 5px;
  border-radius: 50%;
  background: var(--cyan-hot);
  box-shadow: 0 0 16px 4px var(--cyan);
  animation: trace-packet 4.8s linear infinite;
}
.backplane-traces i:nth-child(2)::after { animation-delay: -1.7s; animation-duration: 5.7s; }
.backplane-traces i:nth-child(3)::after { animation-delay: -3.1s; animation-duration: 4.1s; }

.backplane-rail {
  position: absolute;
  z-index: 1;
  right: clamp(1rem, 3vw, 3rem);
  bottom: clamp(1.1rem, 2vw, 2rem);
  left: clamp(1rem, 3vw, 3rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 31px;
  padding: 0 .8rem;
  border: 1px solid rgba(165,231,242,.2);
  background: linear-gradient(180deg, #0c202b, #050d13);
  color: rgba(197,220,229,.48);
  font: 720 .44rem/1 var(--mono);
  letter-spacing: .1em;
  box-shadow: 0 10px 24px rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.04);
}
.backplane-rail b { width: 8px; height: 8px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 12px var(--cyan); }

.backplane-slots {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(10, minmax(52px, 1fr));
  gap: clamp(.35rem, 1vw, .8rem);
  width: 100%;
  min-width: 720px;
  height: clamp(205px, 23vw, 310px);
}

.backplane-slots > span {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  border: 1px solid rgba(165,231,242,.17);
  border-radius: 7px 7px 3px 3px;
  background: linear-gradient(180deg, rgba(11,29,40,.92), rgba(3,10,15,.98));
  box-shadow: inset 0 1px rgba(255,255,255,.035), 0 12px 22px rgba(0,0,0,.4);
}

.backplane-slots small {
  position: absolute;
  top: -1.5rem;
  left: 50%;
  color: rgba(197,220,229,.46);
  font: 700 .45rem/1 var(--mono);
  transform: translateX(-50%);
}

.backplane-slots > span::before {
  content: "";
  position: absolute;
  top: 11%;
  bottom: 11%;
  left: 50%;
  width: 24%;
  border: 1px solid rgba(165,231,242,.15);
  background: repeating-linear-gradient(180deg, rgba(255,200,94,.42) 0 2px, transparent 2px 8px);
  transform: translateX(-50%);
}

.backplane-slots > span > i {
  width: 45%;
  height: 8px;
  margin-bottom: -5px;
  border: 1px solid rgba(165,231,242,.24);
  background: #07151e;
}

.backplane-slots .bus-card {
  justify-content: center;
  color: var(--card-accent, var(--cyan));
  border-color: color-mix(in srgb, var(--card-accent, var(--cyan)) 56%, transparent);
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--card-accent, var(--cyan)) 18%, #091923), rgba(3,10,15,.98));
  box-shadow: 0 0 24px color-mix(in srgb, var(--card-accent, var(--cyan)) 16%, transparent), inset 0 0 20px rgba(255,255,255,.025);
  transform: translateY(-9px);
  animation: card-current 3.2s ease-in-out infinite;
}

.backplane-slots .bus-card.is-routed {
  filter: brightness(1.35) saturate(1.18);
  box-shadow: 0 0 34px color-mix(in srgb, var(--card-accent, var(--cyan)) 31%, transparent), inset 0 0 24px rgba(255,255,255,.045);
}

.backplane-slots .bus-card::before {
  top: 14%;
  right: 13%;
  bottom: 14%;
  left: 13%;
  width: auto;
  border-color: color-mix(in srgb, var(--card-accent, var(--cyan)) 48%, transparent);
  background:
    linear-gradient(90deg, transparent 48%, color-mix(in srgb, var(--card-accent, var(--cyan)) 46%, transparent) 49% 51%, transparent 52%),
    repeating-linear-gradient(180deg, transparent 0 10px, color-mix(in srgb, var(--card-accent, var(--cyan)) 14%, transparent) 10px 11px);
  transform: none;
}

.backplane-slots .bus-card b {
  position: relative;
  z-index: 2;
  font: 800 clamp(.42rem, .67vw, .59rem)/1 var(--mono);
  letter-spacing: .07em;
  writing-mode: vertical-rl;
  text-shadow: 0 0 10px currentColor;
}

.backplane-slots .bus-card > i {
  position: absolute;
  z-index: 2;
  bottom: -5px;
  border-color: color-mix(in srgb, var(--card-accent, var(--cyan)) 55%, transparent);
  box-shadow: 0 0 11px color-mix(in srgb, var(--card-accent, var(--cyan)) 48%, transparent);
}

.lane-policy { --card-accent: var(--cyan); }
.lane-memory { --card-accent: var(--violet); animation-delay: -.7s !important; }
.lane-tool { --card-accent: var(--amber); animation-delay: -1.5s !important; }
.lane-sensor { --card-accent: var(--blue); animation-delay: -2.1s !important; }
.lane-adapter { --card-accent: #f485ff; animation-delay: -2.6s !important; }

.backplane-readout {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
}
.backplane-readout > div { padding: clamp(.85rem, 2vw, 1.25rem); border-right: 1px solid var(--line); }
.backplane-readout > div:last-child { border-right: 0; }
.backplane-readout span { display: block; margin-bottom: .55rem; color: var(--muted); font: 700 .49rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.backplane-readout strong { color: var(--paper); font: 760 clamp(1.2rem, 2.2vw, 2.1rem)/1 var(--display); letter-spacing: -.045em; text-transform: uppercase; }
.backplane-readout > div:first-child strong { color: var(--cyan); text-shadow: 0 0 18px rgba(67,245,231,.2); }

.backplane-pillars {
  grid-column: 2;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: 1rem;
  border: 1px solid var(--line);
  background: var(--line);
}
.backplane-pillars article { min-height: 230px; padding: clamp(1.4rem, 3vw, 2.3rem); background: rgba(2,8,13,.87); transition: background .25s, transform .25s var(--ease-out); }
.backplane-pillars article:hover { z-index: 1; background: rgba(8,25,34,.98); transform: translateY(-4px); }
.backplane-pillars article > span { color: var(--cyan); font: 800 .52rem/1 var(--mono); letter-spacing: .1em; }
.backplane-pillars h3 { margin: 3rem 0 .8rem; font-family: var(--display); font-size: clamp(1.45rem, 2.4vw, 2.45rem); line-height: .95; letter-spacing: -.04em; text-transform: uppercase; }
.backplane-pillars p { margin: 0; color: var(--muted); font-size: .91rem; line-height: 1.6; }

.thesis-section {
  background:
    linear-gradient(90deg, transparent 0 74%, rgba(67,245,231,.025) 74%),
    radial-gradient(circle at 20% 70%, rgba(133,103,255,.08), transparent 30rem),
    var(--void-deep);
}

.thesis-statement { grid-column: 2; min-width: 0; max-width: 1400px; }
.thesis-statement h2 { font-size: clamp(3.7rem, 7.5vw, 9rem); }
.thesis-statement h2 em { color: var(--cyan-hot); -webkit-text-stroke: 0; text-shadow: 0 0 35px rgba(67,245,231,.17); }

.principles {
  grid-column: 2;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: clamp(3.5rem, 7vw, 6.5rem);
  border: 1px solid var(--line);
  background: var(--line);
}

.principles article {
  position: relative;
  min-height: 390px;
  padding: clamp(1.5rem, 3vw, 3.2rem);
  overflow: hidden;
  background: rgba(3, 11, 16, .96);
  transition: background .3s, transform .3s var(--ease-out);
}

.principles article::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 90% 5%, rgba(67,245,231,.12), transparent 42%);
  opacity: 0;
  transition: opacity .3s;
}

.principles article:hover { z-index: 1; background: var(--panel); transform: translateY(-7px); }
.principles article:hover::before { opacity: 1; }
.principle-glyph { position: relative; display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 3rem; border: 1px solid var(--line); color: var(--cyan); font-size: 1.5rem; box-shadow: inset 0 0 20px rgba(67,245,231,.04); }
.principles .card-index { position: relative; color: var(--cyan); }
.principles h3 { position: relative; margin: 1.1rem 0 0; font-family: var(--display); font-size: clamp(2rem, 3.2vw, 3.5rem); letter-spacing: -.055em; line-height: .98; text-transform: uppercase; }
.principles p:last-child { position: relative; margin: 1.5rem 0 0; color: var(--muted); line-height: 1.7; }

.systems-section {
  background: radial-gradient(circle at 84% 48%, rgba(24,171,255,.07), transparent 31rem), var(--void);
}

.systems-heading { max-width: 1400px; }
.system-card {
  grid-column: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(330px, .82fr);
  min-height: 620px;
  min-width: 0;
  max-width: 100%;
  margin-top: clamp(3rem, 6vw, 6rem);
  border: 1px solid var(--line);
  background: rgba(3, 10, 15, .86);
  box-shadow: 0 32px 100px rgba(0,0,0,.25);
}

.system-card + .system-card { margin-top: 1.25rem; }
.system-visual { position: relative; min-width: 0; min-height: 620px; overflow: hidden; }
.system-copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: clamp(2rem, 4vw, 5rem); }
.system-copy .card-index { color: var(--cyan); }
.system-copy h3 { margin: 1.25rem 0 0; font-family: var(--display); font-size: clamp(4rem, 6vw, 7.2rem); font-weight: 850; letter-spacing: -.075em; line-height: .78; text-transform: uppercase; }
.system-copy > p:not(.card-index) { max-width: 650px; margin: 2rem 0 0; color: var(--muted); font-size: clamp(1rem, 1.25vw, 1.2rem); line-height: 1.72; }

.entoptic-card { grid-template-columns: minmax(330px,.82fr) minmax(0,1.18fr); }
.entoptic-card .system-copy { border-right: 1px solid var(--line); }
.entoptic-card .text-link { width: max-content; max-width: 100%; margin-top: 2rem; }
.entoptic-visual {
  display: grid;
  place-items: center;
  padding: clamp(1rem,3vw,3.2rem);
  background:
    linear-gradient(rgba(165,231,242,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(165,231,242,.035) 1px, transparent 1px),
    radial-gradient(circle at 48% 44%, rgba(87,67,255,.18), transparent 42%),
    #02070a;
  background-size: 38px 38px, 38px 38px, auto, auto;
}

.entoptic-monitor {
  width: min(100%,760px);
  overflow: hidden;
  border: 1px solid rgba(165,231,242,.22);
  background: rgba(1,6,10,.96);
  box-shadow: 0 30px 90px rgba(0,0,0,.42), 0 0 50px rgba(67,245,231,.06), inset 0 1px rgba(255,255,255,.04);
}

.entoptic-head,
.entoptic-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  min-height: 42px;
  padding: .7rem .85rem;
  color: var(--muted);
  font: 720 .46rem/1.2 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.entoptic-head { border-bottom: 1px solid var(--line); }
.entoptic-head strong { display: flex; align-items: center; gap: .5rem; color: var(--cyan); font: inherit; }
.entoptic-head strong i { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 11px var(--cyan); animation: signal-pulse 2s ease-in-out infinite; }

.entoptic-field {
  position: relative;
  min-height: clamp(245px,25vw,350px);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 47% 110%, rgba(255,66,183,.7), transparent 41%),
    radial-gradient(ellipse at 16% 105%, rgba(67,245,231,.72), transparent 37%),
    radial-gradient(ellipse at 82% 108%, rgba(101,72,255,.88), transparent 42%),
    linear-gradient(180deg, #030811, #07172a 55%, #140e38);
}

.entoptic-field::before {
  content: "";
  position: absolute;
  z-index: 4;
  inset: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(180deg, transparent 0 5px, rgba(210,250,255,.035) 5px 6px),
    linear-gradient(180deg, transparent 0 47%, rgba(158,255,247,.18) 49%, transparent 52%);
  background-size: auto, 100% 220%;
  animation: entoptic-scan 5.5s linear infinite;
}

.entoptic-field i {
  position: absolute;
  top: 16%;
  bottom: -16%;
  left: 13%;
  width: 24%;
  border-radius: 50% 50% 18% 18%;
  background: linear-gradient(90deg, transparent, rgba(67,245,231,.76), rgba(133,103,255,.72), transparent);
  filter: blur(12px);
  mix-blend-mode: screen;
  transform: skewX(-8deg) rotate(8deg);
  animation: entoptic-drift 6.8s ease-in-out infinite alternate;
}

.entoptic-field i:nth-child(2) { top: 4%; left: 39%; width: 28%; background: linear-gradient(90deg, transparent, rgba(255,200,94,.6), rgba(255,73,184,.72), transparent); animation-delay: -2.2s; animation-duration: 8.1s; }
.entoptic-field i:nth-child(3) { top: 22%; left: 67%; width: 21%; background: linear-gradient(90deg, transparent, rgba(82,125,255,.75), rgba(67,245,231,.65), transparent); animation-delay: -4.1s; animation-duration: 7.4s; }
.entoptic-field b { position: absolute; z-index: 3; top: 14%; left: 50%; width: 38%; aspect-ratio: 1; border: 1px solid rgba(158,255,247,.28); border-radius: 50%; box-shadow: inset 0 0 45px rgba(67,245,231,.08), 0 0 35px rgba(133,103,255,.08); transform: translateX(-50%); animation: orbit-spin 19s linear infinite; }

.entoptic-surfaces { display: grid; grid-template-columns: repeat(7,1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.entoptic-surfaces span { padding: .6rem .35rem; border-right: 1px solid var(--line); color: var(--cyan); font: 780 .45rem/1 var(--mono); text-align: center; }
.entoptic-surfaces span:last-child { border-right: 0; }

.entoptic-rack { display: grid; grid-template-columns: repeat(5,1fr); min-height: 96px; }
.entoptic-rack span { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: .7rem; padding: .75rem .55rem; border-right: 1px solid var(--line); color: var(--paper-soft); font: 720 .44rem/1.3 var(--mono); text-transform: uppercase; }
.entoptic-rack span:last-child { border-right: 0; }
.entoptic-rack b { color: var(--muted); font: inherit; }
.entoptic-rack i { display: block; width: 100%; height: 3px; background: linear-gradient(90deg,var(--cyan),var(--violet)); box-shadow: 0 0 10px rgba(67,245,231,.28); }
.entoptic-foot { flex-wrap: wrap; border-top: 1px solid var(--line); font-size: .42rem; }
.entoptic-foot span:last-child { color: var(--cyan); }

.morpho-card .system-copy { border-left: 1px solid var(--line); }
.morpho-visual {
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle, rgba(67,245,231,.16), transparent 49%),
    linear-gradient(45deg, rgba(255,255,255,.025) 25%, transparent 25% 75%, rgba(255,255,255,.025) 75%) 0 0 / 26px 26px,
    #02070a;
}

.morpho-visual picture { position: relative; z-index: 2; width: min(68%, 540px); aspect-ratio: 1; overflow: hidden; border-radius: 50%; box-shadow: 0 0 80px rgba(67,245,231,.12); }
.morpho-visual img { width: 100%; height: 100%; object-fit: cover; image-rendering: pixelated; filter: hue-rotate(95deg) saturate(1.2) contrast(1.08); }
.specimen-rings { position: absolute; z-index: 1; inset: 8%; border: 1px solid rgba(67,245,231,.2); border-radius: 50%; animation: orbit-spin 24s linear infinite; }
.specimen-rings span { position: absolute; inset: 12%; border: 1px dashed rgba(24,171,255,.18); border-radius: 50%; }
.specimen-rings span:nth-child(2) { inset: 24%; border-style: solid; }
.specimen-rings span:nth-child(3) { inset: 41%; border-color: rgba(67,245,231,.35); }
.specimen-rings::before, .specimen-rings::after { content: ""; position: absolute; top: 50%; left: -4px; width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 13px var(--cyan); }
.specimen-rings::after { right: -4px; left: auto; background: var(--blue); }
.visual-caption { position: absolute; z-index: 3; right: 1.2rem; bottom: 1.2rem; left: 1.2rem; display: flex; justify-content: space-between; color: var(--cyan); font: 750 .52rem/1 var(--mono); letter-spacing: .1em; }
.visual-caption span::before { content: "◆"; margin-right: .45rem; color: var(--blue); font-size: .55em; }

.tag-list { display: flex; flex-wrap: wrap; gap: .45rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.tag-list li { padding: .58rem .7rem; border: 1px solid var(--line); color: var(--paper-soft); font: 700 .54rem/1 var(--mono); letter-spacing: .07em; text-transform: uppercase; }

.substrate-card { grid-template-columns: minmax(330px, .78fr) minmax(0, 1.22fr); }
.substrate-card .system-copy { border-right: 1px solid var(--line); }
.substrate-card .system-copy h3 { font-size: clamp(3.5rem, 5.2vw, 6.5rem); }
.substrate-card .text-link { width: max-content; margin-top: 2rem; }

.atlas-visual {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.5rem, 4vw, 4.5rem);
  background:
    radial-gradient(circle at 78% 15%, rgba(133,103,255,.19), transparent 38%),
    radial-gradient(circle at 15% 80%, rgba(67,245,231,.09), transparent 34%),
    #030a0f;
}

.atlas-header, .atlas-axis { display: flex; justify-content: space-between; gap: 1rem; color: var(--muted); font: 700 .52rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.atlas-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: clamp(5px, .65vw, 11px); margin: clamp(2rem, 4vw, 4rem) 0 1.15rem; }
.atlas-grid span { position: relative; aspect-ratio: 1; border: 1px solid rgba(205,248,255,.12); background: #0b5675; background: color-mix(in srgb, var(--blue) calc(var(--cell) * 72%), #071019); opacity: calc(.48 + var(--cell) * .52); transition: transform .2s var(--ease-out), border-color .2s, filter .2s; }
.atlas-grid span:nth-child(7n), .atlas-grid span:nth-child(11n) { background: color-mix(in srgb, var(--cyan) calc(var(--cell) * 74%), #071019); }
.atlas-grid span:hover { z-index: 2; transform: scale(1.22) rotate(3deg); border-color: var(--cyan); filter: brightness(1.35); }
.atlas-grid span::after { content: ""; position: absolute; inset: 35%; border-radius: 50%; background: rgba(223,255,255,.85); opacity: calc(var(--cell) - .45); box-shadow: 0 0 10px var(--cyan); }
.atlas-readout { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 1.5rem; border: 1px solid var(--line); background: var(--line); }
.atlas-readout > div { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: 1rem; background: rgba(3,10,15,.93); }
.atlas-readout span { color: var(--muted); font: 650 .52rem/1.3 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.atlas-readout strong { color: var(--cyan); font-family: var(--display); font-size: clamp(1.5rem, 2.3vw, 2.6rem); letter-spacing: -.055em; }

.founder-section {
  grid-template-columns: minmax(78px, .14fr) minmax(260px, .44fr) minmax(0, .9fr);
  background:
    radial-gradient(circle at 22% 52%, rgba(67,245,231,.08), transparent 25rem),
    linear-gradient(125deg, #02090e, #040a10 55%, #03070b);
}

.founder-monogram {
  position: relative;
  grid-column: 2;
  display: grid;
  place-items: center;
  align-self: center;
  width: min(33vw, 470px);
  aspect-ratio: 1;
  border: 1px solid var(--line);
  transform: rotate(-3deg);
  box-shadow: inset 0 0 80px rgba(67,245,231,.04), 0 35px 80px rgba(0,0,0,.28);
}

.founder-monogram::before, .founder-monogram::after { content: ""; position: absolute; inset: 10%; border: 1px solid rgba(67,245,231,.13); transform: rotate(45deg); }
.founder-monogram::after { inset: 24%; border-style: dashed; animation: orbit-spin 18s linear infinite; }
.founder-monogram span { position: relative; z-index: 2; color: transparent; font-family: var(--display); font-size: clamp(6rem, 13vw, 13rem); font-weight: 900; letter-spacing: -.13em; line-height: 1; -webkit-text-stroke: 1px var(--cyan); text-shadow: .05em .04em 0 rgba(24,171,255,.16); transform: translateX(-.05em); }
.founder-monogram i { position: absolute; z-index: 3; width: 10px; height: 10px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 22px var(--cyan), 0 0 0 8px rgba(67,245,231,.07); animation: signal-pulse 2s ease-in-out infinite; }
.founder-monogram b { position: absolute; right: 1rem; bottom: 1rem; color: var(--muted); font: 700 .48rem/1 var(--mono); letter-spacing: .09em; }

.founder-copy { grid-column: 3; align-self: center; min-width: 0; max-width: 840px; }
.founder-copy h2 { font-size: clamp(3.7rem, 6.5vw, 7.8rem); }
.founder-copy > p:not(.kicker) { max-width: 730px; margin: 1.65rem 0 0; color: var(--paper-soft); font-size: clamp(1rem, 1.2vw, 1.16rem); line-height: 1.72; }

.contact-section {
  position: relative;
  display: grid;
  place-items: center;
  min-height: min(780px, 85svh);
  padding: clamp(6rem, 12vw, 11rem) var(--page-pad);
  overflow: hidden;
  text-align: center;
  background:
    radial-gradient(circle at 50% 50%, rgba(67,245,231,.13), transparent 25rem),
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px),
    var(--void-deep);
  background-size: auto, 90px 90px, 90px 90px, auto;
  border-bottom: 1px solid var(--line);
}

.contact-section::before {
  content: "";
  position: absolute;
  width: min(78vw, 900px);
  aspect-ratio: 1;
  border: 1px solid rgba(67,245,231,.12);
  border-radius: 50%;
  box-shadow: 0 0 0 7vw rgba(67,245,231,.018), 0 0 0 14vw rgba(24,171,255,.012);
  animation: orbit-spin 32s linear infinite;
}

.contact-sigil { position: relative; z-index: 2; width: 84px; filter: drop-shadow(0 0 30px rgba(67,245,231,.35)); animation: float 4.5s ease-in-out infinite; }
.contact-section .kicker { position: relative; z-index: 2; margin-top: 2rem; color: var(--cyan); }
.contact-section h2 { position: relative; z-index: 2; margin: 1.1rem 0 0; font-size: clamp(4.8rem, 11vw, 13rem); text-shadow: 0 0 45px rgba(67,245,231,.08); }

.contact-link {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2.5rem;
  padding: 0 0 .55rem;
  border: 0;
  border-bottom: 1px solid var(--cyan);
  background: transparent;
  color: var(--cyan-hot);
  font: 800 .75rem/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}

.contact-link i { font-style: normal; transition: transform .2s var(--ease-out); }
.contact-link:hover i { transform: translate(4px, -4px); }

.site-footer {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3rem;
  align-items: center;
  padding: 2.5rem var(--page-pad);
  background: #010407;
}

.footer-brand { display: flex; align-items: center; gap: .75rem; width: max-content; }
.footer-brand img { filter: drop-shadow(0 0 10px rgba(67,245,231,.18)); }
.footer-brand span { display: flex; flex-direction: column; }
.footer-brand strong { font-family: var(--display); font-size: .92rem; letter-spacing: -.02em; text-transform: uppercase; }
.footer-brand small { color: var(--muted); font: 650 .48rem/1.5 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 1.5rem; }
.footer-links a, .footer-links button { padding: 0; border: 0; background: transparent; color: var(--paper-soft); font: 700 .55rem/1 var(--mono); letter-spacing: .07em; text-transform: uppercase; cursor: pointer; transition: color .2s; }
.footer-links a:hover, .footer-links button:hover { color: var(--cyan); }
.footer-meta { grid-column: 1 / -1; display: flex; justify-content: space-between; padding-top: 1.2rem; border-top: 1px solid var(--line-soft); color: rgba(150,180,190,.5); font: 650 .48rem/1 var(--mono); letter-spacing: .09em; text-transform: uppercase; }

.js [data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity .9s var(--ease-out), transform .9s var(--ease-out);
}

.js [data-reveal][data-delay="1"] { transition-delay: .1s; }
.js [data-reveal][data-delay="2"] { transition-delay: .2s; }
.js [data-reveal].is-visible { opacity: 1; transform: translateY(0); }

@keyframes signal-pulse { 50% { opacity: .45; transform: scale(.85); } }
@keyframes orbit-spin { to { transform: rotate(360deg); } }
@keyframes hero-breathe { from { transform: scale(1.025); } to { transform: scale(1.055); } }
@keyframes scroll-drop { 0% { transform: translateY(0); } 65%, 100% { transform: translateY(210%); } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes float { 50% { transform: translateY(-12px) rotate(2deg); } }
@keyframes trace-packet { to { left: 104%; } }
@keyframes card-current { 50% { filter: brightness(1.18); transform: translateY(-13px); } }
@keyframes bus-scan { from { left: -24%; } to { left: 124%; } }
@keyframes stack-packet { to { left: calc(100% - 2px); } }
@keyframes stack-packet-vertical { to { top: calc(100% - 2px); } }
@keyframes instrument-scan { from { left: -28%; } to { left: 128%; } }
@keyframes entoptic-drift { from { transform: skewX(-12deg) rotate(4deg) translateX(-8%); } to { transform: skewX(7deg) rotate(13deg) translateX(16%); } }
@keyframes entoptic-scan { to { background-position: 0 0, 0 220%; } }

@media (max-width: 1250px) {
  .site-header { grid-template-columns: 1fr auto auto; }
  .site-nav { gap: 1.25rem; }
  .hero-copy { width: min(74vw, 900px); }
  .hero h1 { font-size: clamp(4.5rem, 9.2vw, 8.3rem); }
  .hero-receipt { width: 310px; min-width: 0; }
  .principles article { min-height: 420px; }
  .system-card, .system-visual { min-height: 560px; }
}

@media (max-width: 980px) {
  :root { --header-height: 72px; }
  .site-header { grid-template-columns: 1fr auto; }
  .header-cta { display: none; }
  .nav-toggle {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    justify-self: end;
    width: 43px;
    height: 43px;
    padding: 0;
    border: 1px solid var(--line);
    background: rgba(4,14,20,.65);
    cursor: pointer;
  }
  .nav-toggle span { position: absolute; width: 18px; height: 1px; background: var(--cyan); transition: transform .25s, top .25s; }
  .nav-toggle span:first-child { top: 17px; }
  .nav-toggle span:last-child { top: 24px; }
  .nav-toggle[aria-expanded="true"] span:first-child { top: 21px; transform: rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:last-child { top: 21px; transform: rotate(-45deg); }
  .site-nav {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    display: grid;
    gap: 0;
    padding: .5rem var(--page-pad) 1.2rem;
    border-bottom: 1px solid var(--line);
    background: rgba(1,7,11,.97);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-12px);
    transition: opacity .25s, transform .25s, visibility .25s;
  }
  .site-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .site-nav a { padding: 1rem 0; border-bottom: 1px solid var(--line-soft); }
  .site-nav a::after { display: none; }
  .hero { min-height: 900px; }
  .hero::after { background: linear-gradient(90deg, rgba(1,6,10,.98), rgba(1,6,10,.72) 57%, rgba(1,6,10,.2)), linear-gradient(180deg, rgba(1,6,10,.08) 45%, rgba(1,6,10,.94)); }
  .hero-art img { object-position: 62% center; opacity: .82; }
  .hero-copy { width: 88vw; }
  .hero h1 { font-size: clamp(4rem, 12vw, 7.1rem); }
  .hero-receipt { right: var(--page-pad); bottom: 5.2rem; width: 300px; }
  .section-shell { grid-template-columns: 1fr; gap: 2.5rem; }
  .section-index { grid-row: auto; display: flex; grid-column: 1; }
  .section-index p { margin: 0; align-self: center; writing-mode: initial; }
  .section-heading, .thesis-statement, .stack-console, .stack-products, .evaluation-console, .gate-rail, .backplane-console, .backplane-pillars, .principles, .system-card { grid-column: 1; }
  .stack-stage { overflow-x: auto; }
  .stack-products { grid-template-columns: 1fr 1fr; }
  .authority-product { grid-template-columns: 1fr; }
  .foundry-product .authority-instrument { order: initial; }
  .authority-boundary { margin-top: -1rem; }
  .gate-rail { grid-template-columns: 1fr 1fr; }
  .gate-rail > i { display: none; }
  .gate-rail > div { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .gate-rail > div:nth-of-type(2n) { border-right: 0; }
  .gate-rail > div:nth-last-of-type(-n+2) { border-bottom: 0; }
  .principles { grid-template-columns: 1fr; }
  .backplane-pillars { grid-template-columns: 1fr; }
  .backplane-pillars article { min-height: 220px; }
  .principles article { min-height: 320px; }
  .system-card { grid-template-columns: 1fr; }
  .system-visual { min-height: 520px; }
  .morpho-card .system-copy, .entoptic-card .system-copy, .substrate-card .system-copy { border: 0; border-top: 1px solid var(--line); }
  .entoptic-card .system-copy, .substrate-card .system-copy { order: 2; }
  .entoptic-card .entoptic-visual, .substrate-card .atlas-visual { order: 1; }
  .founder-section { grid-template-columns: 1fr; }
  .founder-section .section-index, .founder-monogram, .founder-copy { grid-column: 1; }
  .founder-monogram { width: min(78vw, 440px); margin: 0 auto; }
  .founder-copy { max-width: 850px; margin: 1rem auto 0; }
}

@media (max-width: 680px) {
  :root { --page-pad: 1.1rem; }
  .brand-copy strong { font-size: .92rem; }
  .brand-copy small { font-size: .44rem; }
  .brand-mark { width: 38px; height: 38px; }
  .hero { align-items: flex-end; min-height: 900px; padding-top: calc(var(--header-height) + 2.5rem); padding-bottom: 5.5rem; }
  .hero-art { height: 72%; }
  .hero-art img { object-position: 67% 20%; opacity: .74; }
  .hero::after { background: linear-gradient(180deg, rgba(1,6,10,.25), rgba(1,6,10,.54) 35%, rgba(1,6,10,.98) 70%), linear-gradient(90deg, rgba(1,6,10,.75), transparent); }
  .hero-orbits { top: 30%; right: -50vw; width: 120vw; }
  .hero-copy { width: 100%; }
  .hero h1 { font-size: clamp(3.55rem, 17.5vw, 5.4rem); line-height: .77; }
  .hero h1 span { white-space: normal; }
  .hero-lede { font-size: 1rem; line-height: 1.55; }
  .hero-actions { display: grid; grid-template-columns: 1fr; }
  .button { width: 100%; }
  .hero-receipt { display: none; }
  .hero-coordinates span:last-child, .scroll-cue { display: none; }
  .signal-marquee span { padding: 0 1.25rem; }
  .section-shell { padding-top: 6rem; padding-bottom: 6rem; }
  .section-heading h2, .thesis-statement h2, .founder-copy h2 { font-size: clamp(3.25rem, 14vw, 5rem); }
  .systems-heading h2 { font-size: clamp(2.8rem, 11.7vw, 4rem); }
  .systems-heading h2 em { display: block; }
  .product-heading h2 { font-size: clamp(3rem, 13vw, 4.8rem); }
  .section-heading > p:last-of-type { font-size: 1rem; }
  .stack-console-head, .stack-console-foot { flex-wrap: wrap; }
  .stack-stage {
    grid-template-columns: 1fr;
    min-height: 0;
    overflow: visible;
    padding: 2rem 1.1rem;
  }
  .stack-authorities { grid-template-columns: 1fr 1fr; width: 100%; }
  .stack-wire {
    justify-self: center;
    width: 1px;
    height: 38px;
    background: linear-gradient(180deg, rgba(67,245,231,.18), rgba(67,245,231,.72));
  }
  .stack-wire::before { top: auto; right: -3px; bottom: -1px; transform: rotate(135deg); }
  .stack-wire::after { top: -4px; left: -2px; animation-name: stack-packet-vertical; }
  .stack-products { grid-template-columns: 1fr; }
  .stack-products a { min-height: 220px; }
  .authority-product { padding: 1.35rem; }
  .authority-copy h2 { font-size: clamp(2.9rem,13vw,4.8rem); }
  .authority-actions { display: grid; }
  .instrument-head, .instrument-receipt { flex-wrap: wrap; }
  .lean-code { min-height: 260px; padding: 1.2rem; font-size: .65rem; }
  .instrument-gates { grid-template-columns: repeat(5,1fr); }
  .instrument-gates span { padding: .8rem .35rem; }
  .decision-ledger { min-height: 0; padding: .8rem; }
  .decision-ledger > div { grid-template-columns: 26px 1fr auto; gap: .5rem; }
  .decision-ledger small { grid-column: 2 / -1; }
  .authority-boundary { margin: 0; padding: 0 1.35rem 1.35rem; }
  .console-body { height: 360px; }
  .console-header { font-size: .48rem; }
  .console-metrics { grid-template-columns: 1fr 1fr; }
  .console-metrics > div:nth-child(2) { border-right: 0; }
  .console-metrics > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .console-metrics strong { font-size: 1.8rem; }
  .console-footer { flex-wrap: wrap; }
  .backplane-stage { overflow-x: auto; padding-right: 1.2rem; padding-left: 1.2rem; scrollbar-color: var(--cyan) transparent; }
  .backplane-slots { width: 790px; }
  .backplane-readout { grid-template-columns: 1fr 1fr; }
  .backplane-readout > div:nth-child(2) { border-right: 0; }
  .backplane-readout > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .backplane-console-head, .backplane-console-foot { flex-wrap: wrap; }
  .gate-rail { grid-template-columns: 1fr; }
  .gate-rail > div { border-right: 0; border-bottom: 1px solid var(--line) !important; }
  .gate-rail > div:last-child { border-bottom: 0 !important; }
  .principles article { min-height: 350px; }
  .principle-glyph { margin-bottom: 2.2rem; }
  .system-card, .system-visual { min-height: auto; }
  .system-visual { height: 430px; }
  .entoptic-visual { height: auto; min-height: 520px; padding: 1rem; }
  .system-copy { padding: 2.2rem 1.35rem 2.7rem; }
  .system-copy h3, .substrate-card .system-copy h3 { font-size: clamp(3.4rem, 17vw, 5.2rem); }
  .morpho-visual picture { width: 72%; }
  .atlas-visual { height: auto; min-height: 510px; padding: 1.5rem 1rem; }
  .atlas-grid { gap: 5px; }
  .atlas-readout { grid-template-columns: 1fr; }
  .founder-monogram { width: min(88vw, 370px); }
  .founder-actions { display: grid; }
  .contact-section { min-height: 650px; }
  .contact-section h2 { font-size: clamp(4rem, 19vw, 7rem); }
  .site-footer { grid-template-columns: 1fr; gap: 2rem; }
  .footer-links { justify-content: flex-start; gap: 1.1rem; }
  .footer-meta { flex-direction: column; gap: .7rem; }
}

@media (max-width: 390px) {
  .brand-copy small { display: none; }
  .hero h1 { font-size: 3.35rem; }
  .system-label { font-size: .55rem; }
  .founder-line { font-size: .52rem; }
  .console-header > div:first-child { max-width: 170px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .ambient-canvas { display: none; }
  .hero-art img { transform: none; }
  .backplane-console { transform: none !important; }
  .js [data-reveal] { opacity: 1; transform: none; }
}
