@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "DM Mono";
  src: url("../fonts/dm-mono-300.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "DM Mono";
  src: url("../fonts/dm-mono-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --porcelain: #f3f1eb;
  --pearl: #fbfaf6;
  --navy: #07192d;
  --navy-2: #0b1f42;
  --ink-soft: #46515d;
  --blue: #128bdb;
  --cyan: #53d4ef;
  --metal: #bac4ca;
  --line: rgba(7,25,45,.15);
  --line-light: rgba(243,240,232,.19);
  --ease: cubic-bezier(.2,.8,.2,1);
}

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

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

body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  color: var(--navy);
  background:
    radial-gradient(circle at 88% 2%, rgba(255,255,255,.94) 0 9%, transparent 28%),
    linear-gradient(118deg, #eeece6 0%, var(--pearl) 48%, #e8edf0 100%);
  font-family: "Manrope", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

body.no-motion *,
body.no-motion *::before,
body.no-motion *::after {
  animation: none !important;
  transition: none !important;
}

body.no-motion .word-reveal span {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}

body.no-motion .nav-wrap,
body.no-motion .hero .eyebrow,
body.no-motion .hero .intro,
body.no-motion .hero .primary-cta,
body.no-motion .hero .hero-media {
  opacity: 1 !important;
  translate: 0 0 !important;
  scale: 1 !important;
  filter: none !important;
}

body.no-motion .hero-media video {
  display: none;
}

body.no-motion .hero-media::before {
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}

.site {
  overflow: hidden;
}

.shell {
  width: min(1500px, calc(100% - 96px));
  margin-inline: auto;
}

.nav-wrap {
  position: relative;
  z-index: 30;
}

.js .nav-wrap {
  opacity: 0;
  translate: 0 20px;
  filter: blur(8px);
  animation: entranceResolve .7s var(--ease) forwards;
  animation-delay: 0ms;
}

.nav {
  min-height: 104px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  border-bottom: 1px solid var(--line);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto;
}

.brand span {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .16em;
}

.nav-center {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 38px;
}

.nav-center a,
.login,
.eyebrow,
.rail-label,
.section-label,
.index,
.system-cell p,
.proof-row span,
.proof-row strong,
.steps span,
.embed-stage span,
.footer-contact,
.footer small {
  font-family: "DM Mono", "Courier New", monospace;
}

.nav-center a {
  position: relative;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.nav-center a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -8px;
  height: 1px;
  background: var(--blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease);
}

.nav-center a:hover::after,
.nav-center a:focus-visible::after {
  transform: scaleX(1);
}

.login {
  display: inline-flex;
  align-items: center;
  gap: 15px;
  flex: 0 0 auto;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.login::after {
  content: "↗";
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  transition: transform .32s var(--ease);
}

.login-light:hover::after,
.login-light:focus-visible::after {
  color: var(--pearl);
  background: var(--navy);
  transform: rotate(45deg);
}

.login-dark:hover::after,
.login-dark:focus-visible::after {
  color: var(--navy);
  background: var(--pearl);
  transform: rotate(45deg);
}

.hero {
  min-height: 765px;
  display: grid;
  grid-template-columns: minmax(0, 58%) minmax(340px, 42%);
  border-bottom: 1px solid var(--line);
}

.hero-copy {
  min-width: 0;
  padding: 92px 0 72px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  z-index: 2;
}

.eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.eyebrow::before {
  content: "";
  width: 30px;
  height: 1px;
  flex: 0 0 auto;
  background: var(--blue);
}

h1 {
  max-width: 950px;
  margin: 36px 0 0;
  font-size: clamp(58px, 5.7vw, 94px);
  line-height: .94;
  letter-spacing: -.06em;
  font-weight: 500;
}

h1 .muted-word {
  color: #78838d;
  font-weight: 400;
}

.word-reveal span {
  display: inline-block;
}

.js .word-reveal span {
  opacity: 0;
  transform: translateY(24px);
  filter: blur(10px);
  animation: wordBlurIn .82s var(--ease) forwards;
  animation-delay: calc(250ms + (var(--word-index) * 90ms));
}

.hero-bottom {
  display: flex;
  align-items: flex-end;
  gap: 70px;
  padding-right: 30px;
}

.intro {
  max-width: 470px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.65;
}

.primary-cta {
  min-width: 250px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
  padding: 18px 20px 18px 22px;
  color: white;
  background: var(--navy);
  box-shadow: 0 16px 42px rgba(7,25,45,.16);
  font-family: "DM Mono", "Courier New", monospace;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: transform .35s var(--ease);
}

.primary-cta span:last-child {
  color: var(--cyan);
  font-size: 17px;
}

.primary-cta:hover,
.primary-cta:focus-visible {
  background: var(--blue);
  transform: translateY(-3px);
}

.cta-button--inverse {
  color: var(--pearl);
  background: rgba(251,250,246,.08);
  border: 1px solid rgba(251,250,246,.34);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.16), 0 18px 50px rgba(0,0,0,.18);
  backdrop-filter: blur(8px);
}

.cta-button--inverse span:last-child {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid rgba(83,212,239,.68);
  border-radius: 50%;
  color: var(--cyan);
  transition: transform .32s var(--ease);
}

.cta-button--inverse:hover,
.cta-button--inverse:focus-visible {
  color: var(--pearl);
  background: rgba(251,250,246,.14);
  border-color: rgba(83,212,239,.72);
  transform: translateY(-3px);
}

.cta-button--inverse:active {
  transform: translateY(-1px) scale(.98);
}

.cta-button--inverse:hover span:last-child,
.cta-button--inverse:focus-visible span:last-child {
  color: var(--navy);
  background: var(--cyan);
  border-color: var(--cyan);
  transform: rotate(45deg);
}

.hero-art {
  min-width: 0;
  position: relative;
  display: grid;
  place-items: center;
  perspective: 1000px;
}

.hero-media {
  position: relative;
  margin: 0;
  width: min(460px, 86%);
  transform-style: preserve-3d;
  --tilt-y: -8deg;
  --tilt-x: 1.5deg;
  --tilt-shift-x: 0px;
  --tilt-shift-y: 0px;
  --scrub-y: 0px;
  --scrub-scale: 1;
  transform:
    translate3d(var(--tilt-shift-x), calc(var(--scrub-y) + var(--tilt-shift-y)), 0)
    rotateY(var(--tilt-y))
    rotateX(var(--tilt-x))
    scale(var(--scrub-scale));
  transition: transform .18s ease-out;
  will-change: transform;
}

.js .hero.section-reveal,
.js .hero.section-reveal > * {
  opacity: 1;
  transform: none;
  transition: none;
}

.js .hero .eyebrow,
.js .hero .intro,
.js .hero .primary-cta,
.js .hero .hero-media {
  opacity: 0;
  translate: 0 20px;
  filter: blur(8px);
  animation: entranceResolve .7s var(--ease) forwards;
}

.js .hero .eyebrow {
  animation-delay: 150ms;
}

.js .hero .intro {
  animation-delay: 500ms;
}

.js .hero .primary-cta {
  animation-delay: 650ms;
}

.js .hero .hero-media {
  animation-name: heroArtEntrance;
  animation-delay: 800ms;
  scale: .97;
}

.hero-media::before {
  content: "";
  display: none;
  width: 100%;
  aspect-ratio: 3 / 4;
  background: url("../assets/hero-ribbon-cutout.png") center / contain no-repeat;
}

.hero-media video {
  display: block;
  width: 100%;
  height: auto;
}

.hero-media video.masked {
  mix-blend-mode: multiply;
}

.hero-media .serial {
  position: absolute;
  bottom: 42px;
  left: -14px;
}

.coordinates {
  position: absolute;
  top: 38px;
  right: 0;
  color: #75818a;
  font: 300 9px/1.5 "DM Mono", "Courier New", monospace;
  letter-spacing: .12em;
  text-align: right;
  --coord-drift: 0px;
  transform: translate3d(0, var(--coord-drift), 0);
  will-change: transform;
}

.monolith {
  width: min(340px, 68%);
  height: 570px;
  position: relative;
  transform-style: preserve-3d;
  transform: rotateY(-10deg) rotateX(2deg);
  transition: transform .18s ease-out;
  filter: drop-shadow(24px 34px 30px rgba(20,51,73,.17));
}

.prism {
  position: absolute;
  inset: 0;
  clip-path: polygon(14% 0, 86% 4%, 100% 93%, 48% 100%, 0 91%);
  background:
    linear-gradient(116deg, rgba(255,255,255,.86) 2%, rgba(255,255,255,.13) 26%, rgba(83,212,239,.18) 48%, rgba(255,255,255,.64) 72%, rgba(18,139,219,.12)),
    repeating-linear-gradient(90deg, transparent 0 68px, rgba(255,255,255,.22) 69px 70px);
  border: 1px solid rgba(255,255,255,.84);
  box-shadow: inset 18px 0 30px rgba(255,255,255,.6), inset -16px 0 22px rgba(18,139,219,.09);
  backdrop-filter: blur(12px);
}

.prism::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(165deg, transparent 19%, rgba(83,212,239,.5) 19.2%, rgba(255,255,255,.68) 19.8%, transparent 20.4%),
    linear-gradient(82deg, transparent 62%, rgba(18,139,219,.2) 63%, rgba(255,255,255,.65) 64%, transparent 65%);
  mix-blend-mode: screen;
}

.prism-edge {
  position: absolute;
  width: 1px;
  height: 94%;
  left: 48%;
  top: 3%;
  background: linear-gradient(transparent, rgba(255,255,255,.95) 24%, rgba(18,139,219,.45) 74%, transparent);
  transform: rotate(-4deg);
  box-shadow: 0 0 16px rgba(83,212,239,.42);
}

.orbit {
  position: absolute;
  width: 490px;
  height: 186px;
  left: 50%;
  top: 46%;
  transform: translate(-50%, -50%) rotate(-14deg);
  border: 1px solid rgba(7,25,45,.35);
  border-radius: 50%;
  box-shadow: 0 0 0 7px rgba(255,255,255,.18), inset 0 0 18px rgba(255,255,255,.4);
}

.orbit::after {
  content: "";
  position: absolute;
  width: 13px;
  height: 13px;
  top: 30px;
  right: 54px;
  border-radius: 50%;
  background: var(--blue);
  box-shadow: 0 0 0 8px rgba(18,139,219,.09), 0 0 22px rgba(18,139,219,.4);
  animation: pulse 3.4s ease-in-out infinite;
}

.halo {
  position: absolute;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.75) 0 28%, rgba(83,212,239,.07) 45%, transparent 70%);
  filter: blur(12px);
}

.serial {
  position: absolute;
  bottom: 36px;
  left: 20px;
  writing-mode: vertical-rl;
  color: rgba(7,25,45,.55);
  font: 300 8px "DM Mono", "Courier New", monospace;
  letter-spacing: .24em;
  transform: rotate(180deg);
}

.module-rail {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(251,250,246,.42);
}

.module-rail .shell {
  padding: 33px 0 38px;
}

.rail-label {
  margin: 0 0 22px;
  color: var(--ink-soft);
  font-size: 10px;
  letter-spacing: .18em;
}

.rail-list {
  border-top: 1px solid var(--line);
}

.rail-row {
  position: relative;
  min-height: 88px;
  display: grid;
  grid-template-columns: minmax(170px, 1fr) minmax(250px, 1.8fr);
  align-items: center;
  gap: 28px;
  border-bottom: 1px solid var(--line);
  transition: transform .34s var(--ease);
}

.rail-row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18px;
  bottom: 18px;
  width: 1px;
  background: var(--cyan);
  transform: scaleY(0);
  transform-origin: center;
  transition: transform .34s var(--ease);
}

.rail-row span {
  font-size: clamp(28px, 2.6vw, 34px);
  line-height: 1;
  letter-spacing: -.035em;
}

.rail-row small {
  justify-self: end;
  color: var(--ink-soft);
  font-family: "DM Mono", "Courier New", monospace;
  font-size: 10px;
  letter-spacing: .13em;
  text-align: right;
}

.rail-row:hover,
.rail-row:focus-visible {
  color: var(--blue);
  transform: translateX(12px);
}

.rail-row:hover::before,
.rail-row:focus-visible::before {
  transform: scaleY(1);
}

.systems {
  min-height: 250px;
  display: grid;
  grid-template-columns: 280px 1fr;
  border-bottom: 1px solid var(--line);
}

.systems-title {
  padding: 55px 50px 50px 0;
  border-right: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-family: "DM Mono", "Courier New", monospace;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.systems-title h2 {
  max-width: 170px;
  margin: 40px 0 0;
  font: 500 28px/1.1 "Manrope", Arial, sans-serif;
  letter-spacing: -.03em;
  text-transform: none;
}

.systems-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}

.system-cell {
  min-height: 250px;
  padding: 54px 24px 42px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-right: 1px solid var(--line);
}

.system-cell:last-child {
  border-right: 0;
}

.system-cell:hover,
.system-cell:focus-within {
  color: white;
  background: var(--navy);
}

.index {
  color: var(--blue);
  font-size: 9px;
  font-weight: 300;
}

.system-cell h3 {
  max-width: 160px;
  margin: auto 0 22px;
  font-size: 17px;
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -.02em;
}

.system-cell p {
  min-height: 30px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 9px;
  line-height: 1.45;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.system-cell:hover p {
  color: rgba(255,255,255,.72);
}

.navy-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--pearl);
  background:
    radial-gradient(circle at 80% 18%, rgba(83,212,239,.14), transparent 34%),
    linear-gradient(124deg, #061326 0%, var(--navy-2) 56%, var(--navy) 100%);
}

.navy-noise {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .15;
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.15'/%3E%3C/svg%3E");
}

.manifesto {
  padding: 94px 0 118px;
}

.orb-field {
  position: absolute;
  width: 390px;
  height: 390px;
  right: 8vw;
  top: 78px;
  border: 1px solid rgba(83,212,239,.22);
  border-radius: 50%;
  animation: breathe 6s ease-in-out infinite;
}

.orb-field::before,
.orb-field::after {
  content: "";
  position: absolute;
  border-radius: 50%;
}

.orb-field::before {
  inset: 38px;
  border: 1px solid rgba(83,212,239,.15);
}

.orb-field::after {
  inset: 89px;
  background: radial-gradient(circle at 60% 38%, rgba(83,212,239,.28), rgba(18,139,219,.05) 45%, transparent 71%);
  box-shadow: 0 0 100px rgba(83,212,239,.12);
}

.scan-filament {
  position: absolute;
  left: 0;
  right: 0;
  top: 56%;
  height: 110px;
  z-index: -1;
  pointer-events: none;
  opacity: .65;
}

.scan-filament i {
  position: absolute;
  height: 1px;
  background: linear-gradient(90deg, transparent 4%, var(--cyan) 25%, rgba(83,212,239,.08) 64%, transparent);
  box-shadow: 0 0 9px rgba(83,212,239,.45);
  transform-origin: left;
}

.scan-filament i:nth-child(1) {
  width: 47%;
  left: 0;
  top: 15px;
  transform: rotate(-3deg);
}

.scan-filament i:nth-child(2) {
  width: 42%;
  right: 0;
  top: 80px;
  transform: rotate(2deg);
}

.scan-filament i:nth-child(3) {
  width: 11%;
  left: 66%;
  top: 43px;
  transform: rotate(70deg);
}

.navy-mark {
  margin-bottom: 72px;
}

.manifesto-grid {
  display: grid;
  grid-template-columns: 38% 62%;
  gap: 30px;
}

.section-label {
  margin: 0;
  color: rgba(251,250,246,.74);
  font-size: 10px;
  font-weight: 300;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.dark-label {
  color: var(--ink-soft);
}

.manifesto-copy {
  max-width: 920px;
  margin: 0;
  font-size: clamp(32px, 3vw, 52px);
  line-height: 1.12;
  letter-spacing: -.045em;
  font-weight: 400;
}

.manifesto-copy em {
  color: var(--cyan);
  font-style: normal;
}

.proof-row {
  margin-top: 68px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line-light);
  border-bottom: 1px solid var(--line-light);
}

.proof-row div {
  min-height: 150px;
  padding: 34px 28px 30px 0;
  border-right: 1px solid var(--line-light);
}

.proof-row div:last-child {
  border-right: 0;
}

.proof-row strong {
  display: block;
  margin-bottom: 24px;
  color: var(--cyan);
  font-size: clamp(30px, 3.1vw, 46px);
  font-weight: 400;
  letter-spacing: -.05em;
  font-variant-numeric: tabular-nums;
}

.proof-row span {
  display: block;
  max-width: 210px;
  color: rgba(251,250,246,.7);
  font-size: 10px;
  line-height: 1.6;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.how-it-works {
  padding: 108px 0 124px;
}

.steps {
  margin-top: 34px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.steps article {
  min-height: 255px;
  padding: 38px 34px 34px 0;
  border-right: 1px solid var(--line);
}

.steps article:last-child {
  border-right: 0;
}

.steps span {
  color: var(--blue);
  font-size: 9px;
  letter-spacing: .16em;
}

.steps h3 {
  margin: 76px 0 14px;
  font-size: clamp(28px, 2.6vw, 36px);
  line-height: 1;
  letter-spacing: -.04em;
  font-weight: 500;
}

.steps p {
  max-width: 300px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.58;
}

.booking {
  padding: 106px 0 116px;
  background: var(--pearl);
  border-top: 1px solid var(--line);
}

.booking-inner {
  display: grid;
  grid-template-columns: minmax(300px, .8fr) minmax(420px, 1.2fr);
  gap: 70px;
  align-items: start;
}

.booking-copy h2 {
  max-width: 620px;
  margin: 0 0 24px;
  font-size: clamp(38px, 4.1vw, 66px);
  line-height: .98;
  letter-spacing: -.055em;
  font-weight: 500;
}

.booking-copy p {
  max-width: 470px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 16px;
  line-height: 1.64;
}

.booking-cta-slot {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.embed-stage {
  min-height: 430px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 28px;
  padding: 36px;
  border: 1px solid var(--line);
  background:
    linear-gradient(90deg, transparent calc(100% - 1px), rgba(7,25,45,.055) 0) 0 0 / calc(100% / 6) 100%,
    rgba(243,241,235,.5);
}

.embed-stage > span {
  color: #75818a;
  font-size: 10px;
  letter-spacing: .2em;
}

.embed-cta {
  min-width: min(310px, 100%);
}

.footer {
  padding: 52px 0;
}

.footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
}

.footer-contact {
  display: flex;
  align-items: center;
  gap: 34px;
  color: rgba(251,250,246,.72);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.footer-contact p {
  margin: 0;
}

.contact-icon {
  display: block;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  color: currentColor;
}

.footer-channels {
  display: flex;
  align-items: center;
  gap: 12px;
}

.footer-channels a {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  color: inherit;
  border: 1px solid rgba(251,250,246,.18);
  border-radius: 50%;
}

.footer-channels .contact-icon {
  width: 16px;
  height: 16px;
  flex-basis: 16px;
}

.footer-channels span {
  margin-left: 2px;
}

.footer small {
  color: rgba(251,250,246,.48);
  font-size: 9px;
  letter-spacing: .12em;
}

.js .section-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}

.js .section-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.js .section-reveal > * {
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}

.js .section-reveal:not(.is-visible) > * {
  opacity: 0;
  transform: translateY(18px);
}

.js .section-reveal.is-visible > * {
  opacity: 1;
  transform: translateY(0);
}

.js .section-reveal.is-visible > *:nth-child(2) {
  transition-delay: 70ms;
}

.js .section-reveal.is-visible > *:nth-child(3) {
  transition-delay: 140ms;
}

@keyframes pulse {
  0%,
  100% {
    transform: scale(.8);
    opacity: .7;
  }
  50% {
    transform: scale(1.18);
    opacity: 1;
  }
}

@keyframes breathe {
  50% {
    transform: scale(1.035);
    opacity: .72;
  }
}

@keyframes entranceResolve {
  to {
    opacity: 1;
    translate: 0 0;
    filter: blur(0);
  }
}

@keyframes heroArtEntrance {
  to {
    opacity: 1;
    translate: 0 0;
    scale: 1;
    filter: blur(0);
  }
}

@keyframes wordBlurIn {
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

@media (max-width: 1050px) {
  .shell {
    width: min(100% - 48px, 900px);
  }

  .nav-center {
    display: none;
  }

  .hero {
    grid-template-columns: 1fr;
    position: relative;
  }

  .hero-copy {
    min-height: 680px;
  }

  .hero-art {
    position: absolute;
    inset: 80px -160px 0 50%;
    opacity: .55;
  }

  .hero-bottom {
    flex-wrap: wrap;
    gap: 30px;
  }

  .systems {
    grid-template-columns: 1fr;
  }

  .systems-title {
    padding-right: 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    flex-direction: row;
    gap: 30px;
  }

  .systems-title h2 {
    margin: 0;
  }

  .systems-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .system-cell {
    border-bottom: 1px solid var(--line);
  }

  .system-cell:nth-child(2n) {
    border-right: 0;
  }

  .manifesto-grid,
  .booking-inner {
    grid-template-columns: 1fr;
  }

  .booking-inner {
    gap: 44px;
  }

  .footer-inner,
  .footer-contact {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 680px) {
  .shell {
    width: calc(100% - 32px);
  }

  .nav {
    min-height: 82px;
  }

  .brand img {
    width: 38px;
    height: 38px;
  }

  .brand span {
    display: none;
  }

  .login::after {
    width: 34px;
    height: 34px;
  }

  .hero {
    min-height: 760px;
  }

  .hero-copy {
    min-height: 745px;
    padding-top: 68px;
    padding-bottom: 46px;
  }

  h1 {
    font-size: clamp(50px, 15vw, 58px);
  }

  .intro {
    max-width: 92%;
  }

  .primary-cta {
    width: 100%;
    min-width: 0;
  }

  .hero-art {
    inset: 185px -260px 0 30%;
    opacity: .34;
  }

  .coordinates {
    right: 26px;
  }

  .rail-row {
    min-height: 106px;
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 22px 0;
  }

  .rail-row small {
    justify-self: start;
    text-align: left;
    line-height: 1.55;
  }

  .systems-grid {
    grid-template-columns: 1fr;
  }

  .system-cell,
  .system-cell:nth-child(2n) {
    min-height: 188px;
    border-right: 0;
  }

  .manifesto {
    padding: 78px 0 88px;
  }

  .navy-mark {
    margin-bottom: 42px;
  }

  .orb-field {
    right: -170px;
    top: 118px;
  }

  .proof-row,
  .steps {
    grid-template-columns: 1fr;
  }

  .proof-row div,
  .steps article {
    min-height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line-light);
  }

  .proof-row div:last-child,
  .steps article:last-child {
    border-bottom: 0;
  }

  .how-it-works,
  .booking {
    padding: 76px 0 86px;
  }

  .steps article {
    padding: 30px 0;
  }

  .steps h3 {
    margin-top: 44px;
  }

  .embed-stage {
    min-height: 360px;
    padding: 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }

  .word-reveal span {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }

  .nav-wrap,
  .hero .eyebrow,
  .hero .intro,
  .hero .primary-cta,
  .hero .hero-media {
    opacity: 1 !important;
    translate: 0 0 !important;
    scale: 1 !important;
    filter: none !important;
  }

  .hero-media video {
    display: none;
  }

  .hero-media::before {
    display: block;
  }
}

/* Final cascade for the refined blog and article media layouts. */
.blog-list {
  gap: 22px;
}

.featured-post {
  display: flex;
  flex-direction: column;
  grid-row: span 5;
  overflow: hidden;
}

.featured-post .post-image {
  display: block;
  flex: 0 0 auto;
  height: auto;
  margin: 0;
  overflow: hidden;
  border-radius: 22px 22px 8px 8px;
}

.featured-post .post-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  transition: transform .8s var(--ease);
}

.featured-post:hover .post-image img {
  transform: scale(1.025);
}

.featured-post .bezel-core {
  flex: 1 1 auto;
  min-height: 330px;
  border-radius: 8px 8px 22px 22px;
}

.blog-list article:not(.featured-post) > a {
  display: grid;
  grid-template-columns: 172px minmax(0, 1fr);
  column-gap: 22px;
  align-items: start;
}

.blog-list article:not(.featured-post) img {
  grid-row: 1 / span 3;
  width: 172px;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: 14px;
  transition: transform .65s var(--ease), opacity .4s var(--ease);
}

@media (max-width: 680px) {
  .blog-list article:not(.featured-post) > a {
    grid-template-columns: 112px minmax(0, 1fr);
    column-gap: 14px;
  }

  .blog-list article:not(.featured-post) img {
    width: 112px;
    border-radius: 10px;
  }

  .blog-list article:not(.featured-post) h2 {
    font-size: 22px;
  }

  .blog-list article:not(.featured-post) p {
    display: none;
  }
}

/* Phase 2 visual-depth refinement: shared inner-page sculpture language. */
.visual-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: clamp(36px, 7vw, 110px);
  align-items: center;
  min-height: 670px;
  overflow: hidden;
}

.page-hero-copy {
  position: relative;
  z-index: 2;
}

.hero-index {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 34px;
}

.hero-index a {
  padding: 10px 13px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  font: 400 9px/1 "DM Mono", "Courier New", monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: color .3s var(--ease), background-color .3s var(--ease), transform .3s var(--ease);
}

.hero-index a:hover {
  color: var(--pearl);
  background: var(--navy);
  transform: translateY(-2px);
}

.kinetic-canvas {
  position: relative;
  z-index: 1;
  min-height: 440px;
  isolation: isolate;
  pointer-events: none;
  will-change: transform;
}

.kinetic-canvas::before,
.kinetic-canvas::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.kinetic-canvas::before {
  inset: 8% 2% 3% 3%;
  border: 1px solid rgba(18,139,219,.21);
  box-shadow: inset 0 0 80px rgba(83,212,239,.08), 0 0 110px rgba(18,139,219,.08);
  transform: rotate(-13deg);
}

.kinetic-canvas::after {
  width: 230px;
  height: 230px;
  right: 14%;
  top: 24%;
  background: radial-gradient(circle, rgba(83,212,239,.22), rgba(18,139,219,.04) 48%, transparent 72%);
  filter: blur(16px);
}

.crystal {
  position: absolute;
  display: block;
  background:
    linear-gradient(145deg, rgba(255,255,255,.82), rgba(83,212,239,.13) 34%, rgba(18,139,219,.46) 62%, rgba(7,25,45,.08)),
    linear-gradient(45deg, transparent 48%, rgba(255,255,255,.72) 49%, transparent 52%);
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: inset 14px -18px 38px rgba(18,139,219,.16), inset -8px 10px 18px rgba(255,255,255,.5), 0 28px 70px rgba(7,25,45,.16);
  clip-path: polygon(50% 0, 91% 22%, 100% 69%, 64% 100%, 17% 86%, 0 39%);
  transform-origin: center;
  animation: crystalDrift 12s var(--ease) infinite alternate;
}

.crystal::before,
.crystal::after {
  content: "";
  position: absolute;
  inset: 18%;
  border: 1px solid rgba(255,255,255,.48);
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}

.crystal::after {
  inset: 34% 12%;
  border-color: rgba(83,212,239,.55);
  transform: rotate(42deg);
}

.crystal-a { width: 240px; height: 300px; left: 14%; top: 14%; }
.crystal-b { width: 112px; height: 136px; right: 6%; top: 4%; animation-delay: -4s; animation-duration: 15s; }
.crystal-c { width: 78px; height: 92px; right: 14%; bottom: 3%; animation-delay: -8s; animation-duration: 10s; }

.orbit-wire {
  position: absolute;
  width: 86%;
  height: 42%;
  left: 5%;
  top: 38%;
  border: 1px solid rgba(18,139,219,.38);
  border-radius: 50%;
  transform: rotate(-18deg);
  box-shadow: 0 0 20px rgba(83,212,239,.08);
}

.signal-dot {
  position: absolute;
  width: 9px;
  height: 9px;
  left: 8%;
  top: 56%;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 22px var(--cyan);
  animation: signalTravel 7s linear infinite;
}

.kinetic-results .crystal-a { clip-path: polygon(50% 0, 100% 74%, 74% 100%, 16% 86%, 0 26%); transform: rotate(10deg); }
.kinetic-results .crystal-b { top: 58%; right: 9%; }
.kinetic-blog .crystal-a { width: 260px; height: 260px; border-radius: 50%; clip-path: polygon(50% 0, 84% 12%, 100% 50%, 82% 88%, 50% 100%, 14% 84%, 0 48%, 18% 12%); }
.kinetic-blog .crystal-b { left: 2%; top: 2%; }
.kinetic-about { position: absolute; width: min(42vw, 620px); right: 5vw; top: 140px; opacity: .72; }
.kinetic-about::before { border-color: rgba(83,212,239,.24); }
.kinetic-about .crystal { background: linear-gradient(145deg, rgba(255,255,255,.48), rgba(83,212,239,.1) 40%, rgba(18,139,219,.28)); border-color: rgba(255,255,255,.34); }
.kinetic-home { position: absolute; width: 230px; min-height: 260px; right: -58px; top: 78px; opacity: .38; }
.kinetic-home .crystal-a { width: 130px; height: 170px; left: 24px; }
.kinetic-home .crystal-b { width: 58px; height: 70px; right: 0; top: 8px; }
.kinetic-home::before { inset: 18% -20% 8% 0; }

.systems-numeral { position: relative; }
.system-row { color: inherit; }
.system-row:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.system-block { scroll-margin-top: 120px; }
.system-copy { position: relative; z-index: 2; }
.system-copy > p + p { margin-top: 12px; }
.system-kicker { margin: 0 0 14px !important; color: var(--blue) !important; font: 400 9px/1.2 "DM Mono", "Courier New", monospace !important; letter-spacing: .16em; }
.system-block.dark .system-kicker { color: var(--cyan) !important; }

.system-visual {
  position: relative;
  min-height: 230px;
  border: 1px solid rgba(18,139,219,.22);
  border-radius: 50%;
  background: radial-gradient(circle at 50% 45%, rgba(83,212,239,.14), transparent 62%);
  transform: perspective(700px) rotateX(58deg) rotateZ(-17deg);
  transform-style: preserve-3d;
  animation: visualOrbit 13s var(--ease) infinite alternate;
}

.system-visual::before,
.system-visual::after {
  content: "";
  position: absolute;
  inset: 16%;
  border: 1px solid rgba(83,212,239,.48);
  border-radius: 50%;
}

.system-visual::after { inset: 32%; border-color: rgba(18,139,219,.35); }
.system-visual i,
.system-visual b,
.system-visual em {
  position: absolute;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(255,255,255,.8);
  background: linear-gradient(145deg, rgba(255,255,255,.72), rgba(83,212,239,.22));
  box-shadow: 0 0 24px rgba(83,212,239,.23);
  clip-path: polygon(50% 0, 100% 40%, 74% 100%, 14% 84%, 0 25%);
}
.system-visual i:nth-child(1) { left: 12%; top: 38%; }
.system-visual i:nth-child(2) { right: 13%; top: 18%; }
.system-visual i:nth-child(3) { right: 23%; bottom: 8%; }
.system-visual b { left: 44%; top: 41%; width: 42px; height: 42px; }
.system-visual em { left: 29%; top: 10%; width: 15px; height: 15px; }
.system-block.dark .system-visual { border-color: rgba(83,212,239,.26); background-color: rgba(255,255,255,.015); }
.visual-agent { border-radius: 42% 58% 55% 45%; }
.visual-loop::before { inset: 8%; border-width: 2px; }
.visual-network b { width: 58px; height: 58px; left: 39%; top: 36%; }
.visual-team i { width: 31px; height: 31px; }

.results-cases,
.contact-split { position: relative; }
.section-crystal { position: absolute; z-index: 0; width: 180px; height: 220px; pointer-events: none; opacity: .22; will-change: transform; }
.section-crystal span { display: block; width: 100%; height: 100%; background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(83,212,239,.2), rgba(18,139,219,.42)); border: 1px solid rgba(255,255,255,.72); clip-path: polygon(50% 0, 100% 68%, 70% 100%, 8% 82%, 0 27%); animation: crystalDrift 14s var(--ease) infinite alternate; }
.section-crystal-right { right: -90px; top: 34%; }
.contact-crystal { left: 38%; top: 72px; width: 110px; height: 140px; opacity: .18; }

.blog-list { gap: 22px; }
.blog-list article { position: relative; overflow: hidden; }
.blog-list article:not(.featured-post) > a { display: grid; grid-template-columns: 172px minmax(0, 1fr); column-gap: 22px; align-items: start; }
.blog-list article:not(.featured-post) img { grid-row: 1 / span 3; width: 172px; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 14px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); transition: transform .65s var(--ease), opacity .4s var(--ease); }
.blog-list article:not(.featured-post) a:hover img { transform: scale(1.035); opacity: .9; }
.featured-post { display: flex; flex-direction: column; }
.featured-post .post-image { display: block; margin: 0; overflow: hidden; border-radius: 22px 22px 8px 8px; }
.featured-post .post-image img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .8s var(--ease); }
.featured-post:hover .post-image img { transform: scale(1.025); }
.featured-post .bezel-core { flex: 1; min-height: 330px; border-radius: 8px 8px 22px 22px; }

.article-hero { padding: 72px 0 90px; }
.back-link { display: inline-block; margin-bottom: 54px; color: var(--blue); font: 400 10px/1 "DM Mono", "Courier New", monospace; letter-spacing: .13em; text-transform: uppercase; }
.article-hero h1 { max-width: 1100px; margin: 28px 0 0; }
.article-hero figure { margin: 64px 0 0; padding: 8px; border: 1px solid var(--line); border-radius: 32px; background: rgba(255,255,255,.38); }
.article-hero figure img { display: block; width: 100%; aspect-ratio: 3 / 2; max-height: 720px; object-fit: cover; border-radius: 24px; }
.article-hero figcaption { padding: 14px 10px 8px; color: var(--ink-soft); font: 400 9px/1 "DM Mono", "Courier New", monospace; letter-spacing: .16em; }
.article-body { max-width: 820px; padding-bottom: 140px; }
.article-body p { color: var(--ink-soft); font-size: 18px; line-height: 1.78; }
.article-body .article-lede { margin-top: 0; color: var(--navy); font-size: clamp(23px, 2.7vw, 34px); line-height: 1.45; letter-spacing: -.025em; }
.article-body h2 { margin: 72px 0 22px; font-size: clamp(34px, 4vw, 56px); line-height: 1; letter-spacing: -.05em; font-weight: 500; }
.article-body aside { margin-top: 66px; padding: 28px 30px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,255,255,.35); }
.article-body aside strong { color: var(--blue); font: 400 10px/1 "DM Mono", "Courier New", monospace; letter-spacing: .14em; text-transform: uppercase; }
.article-body aside p { margin-bottom: 0; font-size: 16px; }
.article-cta { padding: 110px 0 124px; }
.article-cta .shell { display: flex; justify-content: space-between; gap: 40px; align-items: center; }
.article-cta h2 { max-width: 790px; margin: 0; font-size: clamp(38px, 5vw, 76px); line-height: .98; letter-spacing: -.055em; font-weight: 500; }

@keyframes crystalDrift {
  to { transform: translate3d(18px, -22px, 0) rotate(11deg) scale(1.025); opacity: .82; }
}

@keyframes signalTravel {
  0% { transform: translate3d(0, 0, 0); opacity: 0; }
  12%, 82% { opacity: 1; }
  100% { transform: translate3d(390px, -105px, 0); opacity: 0; }
}

@keyframes visualOrbit {
  to { transform: perspective(700px) rotateX(54deg) rotateZ(8deg) scale(1.03); opacity: .86; }
}

@media (max-width: 1050px) {
  .visual-hero { grid-template-columns: 1fr; min-height: 0; }
  .kinetic-canvas { min-height: 330px; width: min(620px, 100%); justify-self: center; }
  .system-visual { grid-column: 1 / -1; min-height: 180px; width: min(420px, 82vw); justify-self: center; }
  .kinetic-about { position: relative; top: auto; right: auto; width: min(620px, 100%); margin: 54px auto -50px; }
}

@media (max-width: 680px) {
  .visual-hero { display: block; min-height: 620px; overflow: clip; }
  .visual-hero .kinetic-canvas { min-height: 280px; margin-top: 22px; opacity: .8; }
  .crystal-a { width: 170px; height: 210px; }
  .crystal-b { width: 76px; height: 94px; }
  .kinetic-home { display: none; }
  .system-visual { min-height: 160px; }
  .section-crystal { display: none; }
  .blog-list article:not(.featured-post) > a { grid-template-columns: 112px minmax(0, 1fr); column-gap: 14px; }
  .blog-list article:not(.featured-post) img { width: 112px; border-radius: 10px; }
  .blog-list article:not(.featured-post) h2 { font-size: 22px; }
  .blog-list article:not(.featured-post) p { display: none; }
  .article-hero { padding-top: 54px; }
  .article-hero figure { margin-top: 42px; border-radius: 22px; }
  .article-hero figure img { border-radius: 16px; }
  .article-body { padding-bottom: 98px; }
  .article-body p { font-size: 16px; }
  .article-cta .shell { display: block; }
  .article-cta .primary-cta { margin-top: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .crystal,
  .signal-dot,
  .system-visual,
  .section-crystal span { animation: none !important; }
}

/* Phase 2 shared chrome and below-fold systems */
.nav-center a.is-active::after {
  transform: scaleX(1);
}

.nav-center a.is-active::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -14px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--cyan);
  transform: translateX(-50%);
}

.nav-on-dark .nav {
  color: var(--pearl);
  border-bottom-color: var(--line-light);
}

.nav-on-dark .nav.shell {
  margin-top: 20px;
  min-height: 72px;
  padding-inline: 22px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  background: rgba(255,255,255,.01);
  background-blend-mode: luminosity;
  backdrop-filter: blur(4px);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.1);
}

.footer-links {
  display: inline-flex;
  align-items: center;
  gap: 22px;
}

.footer-links > a:not(.login) {
  color: rgba(251,250,246,.82);
}

.marquee-section {
  position: relative;
  padding: 34px 0 44px;
  overflow: hidden;
}

.marquee-row {
  width: 100%;
  overflow: hidden;
}

.marquee-row + .marquee-row {
  margin-top: 18px;
}

.marquee-track {
  display: flex;
  width: max-content;
  gap: 16px;
  padding-inline: max(48px, calc((100vw - 1500px) / 2));
  will-change: transform;
}

.glass-chip,
.glass-card,
.logo-chip {
  position: relative;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.01);
  background-blend-mode: luminosity;
  backdrop-filter: blur(4px);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.1);
}

.glass-chip::before,
.glass-card::before,
.logo-chip::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1.4px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,.45), rgba(255,255,255,0) 45%, rgba(255,255,255,.45));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

.glass-chip {
  flex: 0 0 auto;
  min-width: 220px;
  padding: 19px 24px;
  border-radius: 999px;
  color: var(--navy);
  font-family: "DM Mono", "Courier New", monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-align: center;
  text-transform: uppercase;
}

.marquee-b .glass-chip {
  min-width: 285px;
  color: var(--ink-soft);
}

.systems-numeral {
  grid-template-columns: 340px 1fr;
  padding-block: 94px;
  border-bottom: 0;
}

.systems-list {
  border-top: 1px solid var(--line);
}

.system-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(110px, .35fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 80px);
  align-items: center;
  min-height: 190px;
  padding: 26px 0;
  border-bottom: 1px solid var(--line);
  overflow: hidden;
}

.system-row::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--navy);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .55s var(--ease);
}

.system-row:hover::before {
  transform: scaleX(1);
}

.system-row:hover h2,
.system-row:hover h3,
.system-row:hover p,
.system-row:hover .system-num {
  color: var(--pearl);
}

.system-num {
  color: rgba(7,25,45,.17);
  font: 300 clamp(3rem, 10vw, 140px)/.8 "DM Mono", "Courier New", monospace;
  letter-spacing: -.08em;
  font-variant-numeric: tabular-nums;
  transition: color .45s var(--ease);
}

.system-row h3,
.system-row h2 {
  margin: 0 0 12px;
  font-size: clamp(27px, 3.2vw, 46px);
  line-height: 1;
  letter-spacing: -.045em;
  font-weight: 500;
}

.system-row p {
  max-width: 620px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.65;
}

.manifesto-copy .char {
  opacity: var(--char-opacity, .2);
  transition: opacity .12s linear;
}

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

.ambient-orb {
  position: absolute;
  z-index: -1;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  opacity: .18;
  background: radial-gradient(circle at 38% 38%, rgba(83,212,239,.9), rgba(18,139,219,.28) 36%, transparent 70%);
  filter: blur(18px);
  animation: orbDrift 20s var(--ease) infinite alternate;
}

.orb-one {
  right: 8vw;
  top: 12%;
}

.orb-two {
  left: 6vw;
  bottom: -190px;
}

.glass-stats {
  gap: 14px;
  border: 0;
}

.proof-row.glass-stats div {
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  padding: 28px;
}

.proof-stack {
  position: relative;
  z-index: 2;
  padding: 108px 0 122px;
  background: var(--porcelain);
}

.overlap-light {
  margin-top: -48px;
  border-radius: 48px 48px 0 0;
}

.overlap-navy {
  position: relative;
  z-index: 2;
  margin-top: -46px;
  border-radius: 48px 48px 0 0;
}

.case-stack {
  margin-top: 38px;
  padding-bottom: 18vh;
}

.case-card {
  position: sticky;
  top: var(--stack-top, 110px);
  margin-bottom: 34px;
  transform: scale(var(--stack-scale, 1)) translateZ(0);
  opacity: var(--stack-opacity, 1);
  will-change: transform, opacity;
}

.bezel {
  border-radius: 30px;
  padding: 8px;
  border: 1px solid rgba(7,25,45,.13);
  background: rgba(255,255,255,.34);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
  transform-style: preserve-3d;
}

.bezel-core {
  min-height: 360px;
  padding: clamp(28px, 5vw, 62px);
  border-radius: 23px;
  border: 1px solid rgba(7,25,45,.12);
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(251,250,246,.58)),
    var(--pearl);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
  transform: translateZ(0);
}

.case-card .bezel-core {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px 46px;
}

.case-tag {
  grid-column: 1 / -1;
  color: var(--blue);
  font: 400 10px/1.4 "DM Mono", "Courier New", monospace;
  letter-spacing: .16em;
  text-transform: uppercase;
  transform: translateZ(34px);
}

.case-card h3,
.case-card h2 {
  max-width: 780px;
  margin: 0;
  font-size: clamp(30px, 4vw, 58px);
  line-height: .98;
  letter-spacing: -.055em;
  font-weight: 500;
  transform: translateZ(22px);
}

.case-card p {
  max-width: 520px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 16px;
  line-height: 1.68;
}

.case-card a {
  align-self: end;
  color: var(--blue);
  font-family: "DM Mono", "Courier New", monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.case-stats {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  align-self: end;
}

.case-stats span {
  min-width: 180px;
  padding-top: 15px;
  border-top: 1px solid var(--line);
  color: var(--ink-soft);
  font: 400 10px/1.45 "DM Mono", "Courier New", monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.case-stats strong {
  display: block;
  margin-bottom: 8px;
  color: var(--navy);
  font-size: clamp(22px, 2.6vw, 36px);
  font-weight: 400;
  letter-spacing: -.05em;
  text-transform: none;
}

.tilt-card {
  perspective: 1000px;
  transform:
    scale(var(--stack-scale, 1))
    rotateX(var(--tilt-x, 0deg))
    rotateY(var(--tilt-y, 0deg));
  transition: transform .3s var(--ease), opacity .3s var(--ease);
}

.how-it-works {
  position: relative;
}

.parallax-accent {
  position: absolute;
  right: 0;
  top: 52px;
  color: rgba(7,25,45,.28);
  font: 300 10px/1.5 "DM Mono", "Courier New", monospace;
  letter-spacing: .18em;
  will-change: transform;
}

.integrations {
  padding: 96px 0 104px;
}

.logo-strip {
  margin-top: 32px;
  display: grid;
  grid-template-columns: repeat(8, minmax(110px, 1fr));
  gap: 12px;
}

.logo-chip {
  min-height: 106px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 14px;
  border-radius: 18px;
}

.logo-chip img {
  height: 26px;
  width: auto;
  opacity: .6;
  filter: grayscale(1);
  transition: opacity .3s var(--ease), filter .3s var(--ease), transform .3s var(--ease);
}

.logo-chip:hover img {
  opacity: 1;
  filter: grayscale(0);
  transform: translateY(-2px);
}

.logo-chip b {
  color: rgba(251,250,246,.72);
  font: 400 9px/1 "DM Mono", "Courier New", monospace;
  letter-spacing: .13em;
}

.magnetic {
  will-change: transform;
}

.page-hero {
  padding: 96px 0 86px;
}

.page-hero h1,
.contact-split h1,
.about-hero h1 {
  max-width: 1040px;
  margin-top: 30px;
}

.page-intro {
  max-width: 720px;
  margin: 28px 0 0;
  color: var(--ink-soft);
  font-size: 18px;
  line-height: 1.68;
}

.system-deep {
  padding: 40px 0 96px;
}

.system-deep.navy-section {
  padding: 104px 0 118px;
}

.system-deep.navy-section .system-row,
.system-block.dark {
  border-bottom-color: var(--line-light);
}

.system-deep.navy-section .system-row p,
.system-block.dark p,
.system-block.dark li {
  color: rgba(251,250,246,.72);
}

.system-block {
  position: relative;
  display: grid;
  grid-template-columns: minmax(100px, .25fr) minmax(0, .9fr) minmax(180px, .35fr);
  gap: clamp(24px, 5vw, 76px);
  align-items: center;
  min-height: 270px;
  padding: 44px 0;
  border-bottom: 1px solid var(--line);
}

.system-block h2 {
  margin: 0 0 16px;
  font-size: clamp(34px, 4vw, 60px);
  line-height: .98;
  letter-spacing: -.055em;
  font-weight: 500;
}

.system-block p {
  max-width: 620px;
  color: var(--ink-soft);
  line-height: 1.68;
}

.system-block ul,
.reassurance {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0;
  margin: 24px 0 0;
  list-style: none;
}

.system-block li,
.reassurance li {
  padding: 10px 13px;
  border: 1px solid currentColor;
  border-radius: 999px;
  color: var(--ink-soft);
  font: 400 9px/1 "DM Mono", "Courier New", monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.diagram {
  position: relative;
  min-height: 190px;
}

.diagram::before,
.diagram::after {
  content: "";
  position: absolute;
  left: 16%;
  right: 12%;
  top: 50%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cyan), transparent);
  transform: rotate(-16deg);
}

.diagram::after {
  transform: rotate(22deg);
  opacity: .55;
}

.diagram i,
.diagram b {
  position: absolute;
  width: 20px;
  height: 20px;
  border: 1px solid var(--cyan);
  border-radius: 50%;
  background: rgba(83,212,239,.09);
  animation: nodePulse 3.2s var(--ease) infinite;
}

.diagram i:nth-child(1) { left: 10%; top: 25%; }
.diagram i:nth-child(2) { right: 18%; top: 34%; animation-delay: .3s; }
.diagram i:nth-child(3) { left: 34%; bottom: 16%; animation-delay: .6s; }
.diagram b { right: 10%; bottom: 24%; animation-delay: .9s; }

.mid-cta {
  margin-block: 18px 78px;
  padding: 28px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.mid-cta__eyebrow {
  margin: 0 0 10px;
  color: var(--blue);
  font: 400 10px/1 "DM Mono", "Courier New", monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.mid-cta h2 {
  max-width: 720px;
  margin: 0;
  font-size: clamp(20px, 2vw, 24px);
  line-height: 1.2;
  letter-spacing: 0;
  font-weight: 500;
}

.system-deep .mid-cta,
.results-cases .mid-cta {
  grid-column: 1 / -1;
  margin-block: 26px;
}

.blog-list .blog-mid-cta {
  grid-column: 2;
  margin: 0 0 10px;
}

.article-inline-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 28px;
  color: var(--blue);
  font: 400 11px/1.2 "DM Mono", "Courier New", monospace;
  letter-spacing: .13em;
  text-transform: uppercase;
  transition: transform .28s var(--ease);
}

.article-inline-cta:hover,
.article-inline-cta:focus-visible {
  color: var(--navy);
  transform: translateX(8px);
}

.cta-band {
  padding: 94px 0 104px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
}

.cta-band h2 {
  max-width: 760px;
  margin: 0;
  font-size: clamp(36px, 4vw, 64px);
  line-height: 1;
  letter-spacing: -.055em;
  font-weight: 500;
}

.cta-band.navy-section .shell {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
}

.aggregate {
  padding: 86px 0 118px;
}

.results-cases {
  padding: 96px 0 108px;
}

.case-card.wide {
  position: relative;
  top: auto;
}

.case-card.wide + .case-card.wide {
  margin-top: 28px;
}

.blog-list {
  padding: 22px 0 108px;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 16px;
}

.featured-post {
  grid-row: span 5;
}

.featured-post .bezel-core {
  min-height: 100%;
}

.blog-list article:not(.featured-post) {
  border-top: 1px solid var(--line);
  padding: 24px 0;
}

.blog-list span,
.blog-list time,
.contact-block,
.reassurance {
  font-family: "DM Mono", "Courier New", monospace;
}

.blog-list span {
  color: var(--blue);
  font-size: 9px;
  letter-spacing: .14em;
}

.blog-list h2 {
  margin: 12px 0 10px;
  font-size: clamp(24px, 2.3vw, 36px);
  line-height: 1.05;
  letter-spacing: -.04em;
  font-weight: 500;
}

.blog-list p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.58;
}

.contact-split {
  min-height: 680px;
  padding: 88px 0 110px;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1fr);
  gap: 70px;
  align-items: center;
}

.contact-block {
  margin-top: 34px;
  color: var(--ink-soft);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.contact-block p {
  margin: 0 0 12px;
}

.contact-channel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.contact-stage {
  min-height: 540px;
}

.contact-band,
.where-work {
  padding: 104px 0 118px;
}

.contact-band h2,
.where-work h2 {
  max-width: 900px;
  margin: 24px 0 0;
  font-size: clamp(34px, 4.4vw, 70px);
  line-height: .98;
  letter-spacing: -.055em;
  font-weight: 500;
}

.about-page {
  background: var(--navy);
}

.about-hero {
  margin-top: -104px;
  padding: 190px 0 132px;
}

.about-hero .manifesto-copy {
  margin-top: 38px;
}

.principles {
  position: relative;
  z-index: 3;
  padding: 96px 0 110px;
  background: var(--porcelain);
}

.principles .section-label {
  margin-bottom: 34px;
}

.where-work {
  position: relative;
}

.where-work .primary-cta {
  margin-top: 34px;
}

@keyframes orbDrift {
  to {
    transform: translate3d(28px, -18px, 0) scale(1.06);
    opacity: .11;
  }
}

@keyframes nodePulse {
  50% {
    transform: scale(1.2);
    opacity: .62;
  }
}

@media (max-width: 1180px) {
  .logo-strip {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
  }

  .case-card .bezel-core,
  .blog-list,
  .contact-split {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1050px) {
  .systems-numeral {
    grid-template-columns: 1fr;
  }

  .system-block {
    grid-template-columns: minmax(80px, .25fr) 1fr;
  }

  .system-block .diagram {
    grid-column: 1 / -1;
    min-height: 120px;
  }

  .cta-band {
    align-items: flex-start;
    flex-direction: column;
  }

  .cta-band.navy-section .shell,
  .mid-cta {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 680px) {
  .nav-on-dark .nav.shell {
    min-height: 64px;
    margin-top: 10px;
  }

  .marquee-track {
    transform: none !important;
    flex-wrap: wrap;
    width: auto;
    padding-inline: 16px;
  }

  .glass-chip,
  .marquee-b .glass-chip {
    min-width: 0;
    flex: 1 1 145px;
    padding: 15px 14px;
  }

  .systems-numeral,
  .page-hero,
  .proof-stack,
  .integrations,
  .results-cases,
  .contact-split,
  .principles {
    padding-block: 72px;
  }

  .mid-cta {
    margin-block: 10px 56px;
    padding: 24px 0;
  }

  .blog-list .blog-mid-cta {
    grid-column: 1;
  }

  .system-row,
  .system-block {
    grid-template-columns: 1fr;
    min-height: 0;
    gap: 18px;
  }

  .system-num {
    font-size: clamp(56px, 24vw, 96px);
  }

  .case-card {
    position: relative;
    top: auto;
    transform: none !important;
    opacity: 1 !important;
  }

  .bezel {
    border-radius: 22px;
    padding: 6px;
  }

  .bezel-core {
    min-height: 0;
    border-radius: 17px;
    padding: 25px;
  }

  .case-stats,
  .proof-row.glass-stats,
  .logo-strip {
    grid-template-columns: 1fr;
  }

  .case-stats {
    display: grid;
  }

  .proof-row.glass-stats {
    display: grid;
  }

  .logo-strip {
    display: grid;
  }

  .contact-split {
    grid-template-columns: 1fr;
  }

  .footer-links {
    flex-wrap: wrap;
  }
}

@media (prefers-reduced-motion: reduce) {
  .marquee-track,
  .case-card,
  .tilt-card,
  .parallax-accent,
  .magnetic,
  .article-inline-cta {
    transform: none !important;
  }

  .manifesto-copy .char {
    opacity: 1 !important;
  }

  .ambient-orb,
  .diagram i,
  .diagram b {
    animation: none !important;
  }
}

/* Refined media cascade — keep after the original phase-two styles. */
.blog-list { gap: 22px; }
.featured-post { display: flex; flex-direction: column; grid-row: span 6; overflow: hidden; }
.featured-post .post-image { display: block; flex: 0 0 auto; height: auto; margin: 0; overflow: hidden; border-radius: 22px 22px 8px 8px; }
.featured-post .post-image img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .8s var(--ease); }
.featured-post:hover .post-image img { transform: scale(1.025); }
.featured-post .bezel-core { flex: 1 1 auto; min-height: 330px; border-radius: 8px 8px 22px 22px; }
.blog-list article:not(.featured-post) > a { display: grid; grid-template-columns: 172px minmax(0, 1fr); column-gap: 22px; align-items: start; }
.blog-list article:not(.featured-post) img { grid-row: 1 / span 3; width: 172px; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 14px; transition: transform .65s var(--ease), opacity .4s var(--ease); }

@media (max-width: 680px) {
  .blog-list article:not(.featured-post) > a { grid-template-columns: 112px minmax(0, 1fr); column-gap: 14px; }
  .blog-list article:not(.featured-post) img { width: 112px; border-radius: 10px; }
  .blog-list article:not(.featured-post) h2 { font-size: 22px; }
  .blog-list article:not(.featured-post) p { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .crystal,
  .signal-dot,
  .system-visual,
  .section-crystal span { animation: none !important; }
}

/* Content round utilities: calendar, testimonial, article metadata and legal copy. */
.systems-subline {
  max-width: 230px;
  margin: 16px 0 0;
  color: var(--ink-soft);
  font: 400 10px/1.55 "DM Mono", "Courier New", monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.calendar-iframe {
  display: block;
  width: 100%;
  min-height: 700px;
}

.testimonial {
  padding: 28px 0 70px;
}

.testimonial-card {
  max-width: 980px;
  margin-inline: auto;
}

.testimonial-card .bezel-core {
  min-height: 0;
  display: block;
  text-align: center;
}

.testimonial blockquote {
  max-width: 820px;
  margin: 0 auto;
  font-size: clamp(25px, 3vw, 44px);
  line-height: 1.16;
  letter-spacing: -.04em;
}

.testimonial p {
  margin: 28px 0 0;
  color: var(--blue);
  font: 400 10px/1.4 "DM Mono", "Courier New", monospace;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.article-meta,
.faq-block h3,
.legal-copy h2,
.where-subline {
  font-family: "DM Mono", "Courier New", monospace;
}

.article-meta {
  margin: 20px 0 0;
  color: var(--ink-soft);
  font-size: 10px;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.faq-block {
  margin-top: 54px;
  padding-top: 34px;
  border-top: 1px solid var(--line);
}

.faq-block h3 {
  margin: 28px 0 8px;
  color: var(--blue);
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.legal-shell {
  padding: 92px 0 118px;
}

.legal-copy {
  max-width: 820px;
  margin-top: 42px;
}

.legal-copy h2 {
  margin: 38px 0 10px;
  color: var(--blue);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.legal-copy p {
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.75;
}

.legal-copy a,
.contact-block a {
  color: var(--blue);
}

.where-subline {
  margin: 18px 0 0;
  color: rgba(251,250,246,.72);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

@media (max-width: 680px) {
  .calendar-iframe {
    min-height: 640px;
  }

  .testimonial {
    padding-bottom: 52px;
  }
}
