:root {
  --surface-ivory: #F6F1E8;
  --surface-sand: #EFE8DA;
  --surface-cloud: #E6DDC8;
  --surface-graphite: #1F1D1A;
  --surface-midnight: #2C3E55;
  --surface-card: rgba(246, 241, 232, 0.78);
  --text-primary: #1F1D1A;
  --text-secondary: #3A3631;
  --text-muted: #6B645A;
  --text-inverse: #F6F1E8;
  --border-soft: #D8CFB8;
  --border-strong: #948B7C;
  --ixo-blue: #0A3CFF;
  --qi-violet: #A8624A;
  --assurance-teal: #6B6B3F;
  --settlement-amber: #A8624A;
  --risk-coral: #c94a3d;
  --success-green: #287f52;
  --role-clay: #A8624A;
  --role-clay-soft: #C8907A;
  --role-olive: #6B6B3F;
  --role-olive-soft: #8E8E5C;
  --role-navy: #2C3E55;
  --role-navy-soft: #4A6079;
  --gradient-hero: radial-gradient(circle at 82% 18%, rgba(10, 60, 255, 0.08), transparent 31%), radial-gradient(circle at 17% 16%, rgba(168, 98, 74, 0.16), transparent 34%), linear-gradient(135deg, #F6F1E8 0%, #EFE8DA 55%, #E6DDC8 100%);
  --gradient-evidence: linear-gradient(135deg, #0A3CFF 0%, #082CC8 100%);
  --gradient-assurance: radial-gradient(circle at 82% 16%, rgba(74, 96, 121, 0.28), transparent 36%), linear-gradient(145deg, #1F1D1A 0%, #2C3E55 100%);
  --gradient-settlement: linear-gradient(135deg, #EFE8DA, #F6F1E8 52%, #E6DDC8);
  --gradient-card: linear-gradient(145deg, rgba(246, 241, 232, 0.96), rgba(239, 232, 218, 0.82));
  --gradient-cta: radial-gradient(circle at 74% 18%, rgba(168, 98, 74, 0.22), transparent 34%), linear-gradient(135deg, #1F1D1A 0%, #2C3E55 100%);
  --font-display: "Source Serif 4", "Source Serif Pro", "Iowan Old Style", Georgia, serif;
  --font-body: "Inter Tight", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-serif: "Source Serif 4", "Source Serif Pro", "Iowan Old Style", Georgia, serif;
  --font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-8: 48px;
  --space-10: 64px;
  --space-12: 96px;
  --space-16: 120px;
  --space-20: 140px;
  --space-24: 140px;
  --space-32: 140px;
  --radius-control: 4px;
  --radius-card: 4px;
  --radius-panel: 4px;
  --shadow-card: 0 1px 0 rgba(31,29,26,0.04), 0 8px 24px -16px rgba(31,29,26,0.12);
  --shadow-soft: 0 1px 0 rgba(31,29,26,0.04), 0 8px 24px -16px rgba(31,29,26,0.12);
  --shadow-dark: 0 12px 40px -8px rgba(31,29,26,0.35);
  --duration-fast: 180ms;
  --duration-base: 300ms;
  --duration-slow: 800ms;
  --ease: cubic-bezier(.2,.8,.2,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--surface-ivory); overflow-x: hidden; }
body {
  margin: 0;
  background: var(--surface-ivory);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
body::selection { background: rgba(10, 60, 255, 0.18); }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; font-family: var(--font-body); }
h1, h2, h3, h4, p { margin: 0; }
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.02;
  text-wrap: balance;
}
h1 { font-size: clamp(48px, 6vw, 84px); max-width: 11ch; }
h2 { font-size: clamp(34px, 3.6vw, 54px); max-width: 15ch; line-height: 1.06; }
h3 { font-size: clamp(20px, 1.6vw, 24px); line-height: 1.06; }
h4 { font-size: clamp(18px, 1.3vw, 21px); line-height: 1.12; }
em, i { font-family: var(--font-display); font-style: italic; }
p { color: var(--text-secondary); text-wrap: pretty; }

.page-grid {
  width: calc(100% - 48px);
  max-width: 1320px;
  margin-inline: auto;
}
section { padding: var(--space-32) 0; position: relative; }
section[id] { scroll-margin-top: 96px; }
.section-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.52fr) minmax(0, 1fr);
  gap: clamp(40px, 8vw, 112px);
  align-items: start;
}
.section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-5);
  align-items: start;
  justify-items: start;
  text-align: left;
  margin-bottom: var(--space-16);
}
.section-heading h2 {
  margin: 0;
}
.section-heading p:not(.eyebrow), .section-copy > p:not(.eyebrow) {
  font-size: clamp(1.05rem, 1.4vw, 1.25rem);
  line-height: 1.6;
  max-width: 680px;
}
.section-kicker p:not(.eyebrow) {
  max-width: 300px;
  font-size: 0.98rem;
}
.section-kicker .eyebrow,
.section-copy .eyebrow,
.section-heading .eyebrow,
.final-cta-panel .eyebrow {
  margin-bottom: var(--space-5);
}
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: var(--text-muted);
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.eyebrow::before {
  content: "";
  width: 32px;
  height: 1px;
  background: currentColor;
  opacity: 0.7;
}
.eyebrow.light { color: rgba(255, 253, 248, 0.68); }
.hero .eyebrow.light { color: var(--role-clay); }

.btn {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: var(--radius-card);
  padding: 12px 20px;
  font-weight: 650;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: transform var(--duration-base) var(--ease), border-color var(--duration-base) var(--ease), background var(--duration-base) var(--ease), box-shadow var(--duration-base) var(--ease);
}
.btn:hover { transform: translateY(-2px); }
.btn:focus-visible, .icon-button:focus-visible, input:focus-visible, textarea:focus-visible, button:focus-visible {
  outline: 3px solid rgba(10, 60, 255, 0.26);
  outline-offset: 3px;
}
.btn-primary {
  background: var(--surface-graphite);
  color: var(--surface-ivory);
  box-shadow: var(--shadow-soft);
}
.btn-primary:hover { background: #12110f; box-shadow: var(--shadow-card); }
.btn-light {
  background: var(--surface-graphite);
  color: var(--surface-ivory);
  border-color: var(--surface-graphite);
}
.btn-secondary, .btn-quiet {
  background: rgba(246, 241, 232, 0.78);
  border-color: var(--border-soft);
  color: var(--text-primary);
}
.btn-secondary-dark {
  background: rgba(239, 232, 218, 0.68);
  border-color: var(--border-soft);
  color: var(--text-primary);
  backdrop-filter: blur(12px);
}
.button-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 50;
  transition: background var(--duration-base), border-color var(--duration-base), box-shadow var(--duration-base);
}
.site-header.is-scrolled {
  background: rgba(246, 241, 232, 0.88);
  backdrop-filter: blur(18px) saturate(140%);
  border-bottom: 1px solid var(--border-soft);
}
.nav-shell {
  width: min(100% - 36px, 1400px);
  height: 76px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text-primary);
  font-family: var(--font-body);
  font-weight: 750;
  letter-spacing: 0;
}
.is-scrolled .brand, .footer .brand { color: var(--text-primary); }
.brand-mark {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.18), 0 12px 34px rgba(36, 89, 214, 0.22);
}
.brand-mark img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.brand-sub {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font: 750 0.72rem/1 var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.76;
}
.desktop-nav {
  display: flex;
  gap: clamp(16px, 2.2vw, 30px);
  color: var(--text-secondary);
  font-size: 0.91rem;
}
.is-scrolled .desktop-nav { color: var(--text-secondary); }
.desktop-nav a:hover { color: var(--text-primary); }
.is-scrolled .desktop-nav a:hover { color: var(--text-primary); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.nav-actions .btn-quiet { background: rgba(239, 232, 218, 0.72); color: var(--text-primary); border-color: var(--border-soft); }
.is-scrolled .nav-actions .btn-quiet { background: rgba(239,232,218,0.82); color: var(--text-primary); border-color: var(--border-soft); }
.icon-button {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid var(--border-soft);
  background: rgba(255, 255, 255, 0.82);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
}
.mobile-menu-button { display: none; }
.mobile-panel {
  position: fixed;
  inset: 0;
  background: var(--surface-ivory);
  color: var(--text-primary);
  padding: 28px;
  z-index: 80;
  display: flex;
  flex-direction: column;
  gap: 22px;
  transform: translateY(-100%);
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
  transition: transform var(--duration-slow) var(--ease);
}
.mobile-panel.is-open {
  transform: translateY(0);
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
.mobile-panel a:not(.btn) { font: 650 2rem/1.1 var(--font-body); }
.mobile-panel .brand { margin-bottom: 28px; }
.mobile-close { margin-left: auto; background: var(--surface-sand); color: var(--text-primary); border-color: var(--border-soft); }

.hero {
  min-height: 100svh;
  padding: 144px 0 80px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--gradient-hero);
  color: var(--text-primary);
}
.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 160px;
  background: linear-gradient(180deg, transparent, rgba(216, 207, 184, 0.26));
}
.hero-field {
  position: absolute;
  width: 44vw;
  height: 44vw;
  min-width: 420px;
  min-height: 420px;
  right: -12vw;
  top: 7vh;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(10,60,255,0.08), rgba(168,98,74,0.08) 32%, transparent 68%);
  filter: blur(16px);
  animation: drift 14s var(--ease) infinite alternate;
}
.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(380px, 1fr);
  gap: clamp(40px, 7vw, 96px);
  align-items: center;
  position: relative;
  z-index: 2;
  min-width: 0;
  overflow: hidden;
}
.hero-copy, .hero-visual { min-width: 0; }
.hero h1 {
  color: var(--text-primary);
  margin-top: var(--space-6);
  max-width: 860px;
  font-size: clamp(4rem, 8.8vw, 8.6rem);
  font-weight: 500;
  line-height: 0.91;
}
.hero h1 em {
  color: var(--role-clay);
  font-weight: 500;
}
.hero-sub {
  color: var(--text-secondary);
  font-size: 19px;
  line-height: 1.55;
  max-width: 720px;
  margin: var(--space-6) 0 var(--space-8);
}
.trust-line {
  margin-top: var(--space-8);
  color: var(--text-muted);
  font-size: 14px;
}
.hero-visual { min-height: 560px; display: grid; place-items: stretch; }

.service-room {
  position: relative;
  min-height: clamp(520px, 43vw, 660px);
  width: min(100%, 780px);
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  isolation: isolate;
  border-radius: var(--radius-card);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 18px;
  padding: clamp(24px, 3.1vw, 34px);
  background:
    radial-gradient(circle at 18% 16%, rgba(168, 98, 74, 0.12), transparent 28%),
    radial-gradient(circle at 82% 24%, rgba(44, 62, 85, 0.14), transparent 30%),
    linear-gradient(140deg, rgba(246,241,232,0.94), rgba(239,232,218,0.84));
  border: 1px solid var(--border-soft);
  box-shadow: var(--shadow-card);
}
.service-room::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(31,29,26,0.045) 1px, transparent 1px),
    linear-gradient(rgba(31,29,26,0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.66), transparent 80%);
  opacity: 0.46;
}
.service-room::after {
  content: "";
  position: absolute;
  inset: 18px;
  z-index: 1;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background:
    linear-gradient(90deg, transparent 0 18%, rgba(168,98,74,0.16) 18% 18.15%, transparent 18.15% 81.85%, rgba(44,62,85,0.16) 81.85% 82%, transparent 82%),
    linear-gradient(0deg, transparent 0 22%, rgba(31,29,26,0.08) 22% 22.15%, transparent 22.15% 77.85%, rgba(31,29,26,0.08) 77.85% 78%, transparent 78%);
  pointer-events: none;
}
.service-room-atmosphere {
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    radial-gradient(circle at 24% 58%, rgba(168,98,74,0.14), transparent 14%),
    radial-gradient(circle at 74% 52%, rgba(44,62,85,0.12), transparent 22%);
  filter: blur(4px);
  animation: drift 16s var(--ease) infinite alternate;
  pointer-events: none;
}
.service-room-header {
  position: relative;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: start;
  z-index: 5;
}
.service-room-header span,
.service-rail span,
.client-room-panel .panel-chip,
.credential-seal span,
.blueprint-orbit span {
  display: block;
  color: var(--role-clay);
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.service-room-header strong {
  max-width: 260px;
  color: var(--text-primary);
  font: 650 1rem/1.15 var(--font-body);
  text-align: right;
}
.service-room-core {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(150px, 0.7fr);
  gap: 16px;
  align-items: stretch;
  min-height: 0;
}
.service-side {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto auto;
  gap: 14px;
  min-width: 0;
  min-height: 0;
}
.client-room-panel,
.evidence-stack,
.blueprint-orbit,
.credential-seal,
.service-rail {
  border: 1px solid var(--border-soft);
  background: rgba(246,241,232,0.72);
  backdrop-filter: blur(12px);
  box-shadow: var(--shadow-card);
}
.client-room-panel {
  padding: clamp(22px, 3vw, 34px);
  border-radius: var(--radius-card);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  min-height: 0;
  background:
    radial-gradient(circle at 22% 18%, rgba(167,255,241,0.08), transparent 32%),
    linear-gradient(145deg, rgba(246,241,232,0.82), rgba(230,221,200,0.66));
}
.client-room-panel h3 {
  margin: 20px 0 10px;
  color: var(--text-primary);
  font-size: clamp(1.8rem, 3vw, 2.7rem);
  line-height: 0.95;
}
.client-room-panel p {
  max-width: 380px;
  color: var(--text-secondary);
  font-size: 0.98rem;
  line-height: 1.45;
}
.consultation-row {
  position: relative;
  display: grid;
  grid-template-columns: 1fr minmax(108px, 0.75fr) 1fr;
  gap: 12px;
  align-items: center;
  margin-top: clamp(22px, 4vw, 42px);
}
.consultation-row::before {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  top: 50%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(168,98,74,0.5), transparent);
  animation: evidenceFlow 5s var(--ease) infinite;
}
.avatar-tile,
.live-link {
  position: relative;
  z-index: 2;
  min-height: 86px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background: rgba(246,241,232,0.9);
  display: grid;
  place-items: center;
  color: var(--text-primary);
  text-align: center;
  font-weight: 700;
}
.avatar-tile svg { color: var(--role-clay); margin-bottom: 6px; }
.avatar-tile span { display: block; font-size: 0.82rem; }
.live-link {
  min-height: 52px;
  padding: 10px;
  color: var(--role-olive);
  font: 800 0.62rem/1.15 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.live-link span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--role-olive);
  box-shadow: none;
}
.blueprint-orbit,
.evidence-stack {
  border-radius: var(--radius-card);
  padding: clamp(14px, 1.7vw, 18px);
}
.blueprint-orbit {
  position: relative;
  background: linear-gradient(145deg, rgba(246,241,232,0.95), rgba(220,227,255,0.5));
}
.blueprint-orbit::after {
  content: "";
  position: absolute;
  left: -18px;
  right: 18px;
  bottom: -18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(44,62,85,0.34), transparent);
}
.blueprint-orbit strong {
  display: block;
  margin-top: 12px;
  color: var(--text-primary);
  font-size: clamp(0.94rem, 1.35vw, 1.08rem);
  line-height: 1.25;
}
.evidence-stack {
  display: grid;
  gap: 10px;
}
.evidence-stack div {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--text-secondary);
  font-size: 0.84rem;
}
.evidence-stack svg { color: var(--role-navy); flex: 0 0 auto; }
.service-rails {
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.service-rail {
  padding: clamp(11px, 1.4vw, 14px);
  border-radius: var(--radius-card);
  min-width: 0;
}
.service-rail strong {
  display: block;
  margin-top: 9px;
  color: var(--text-secondary);
  font-size: 0.78rem;
  line-height: 1.12;
}
.credential-seal {
  padding: 14px 15px;
  border-radius: var(--radius-card);
  background:
    radial-gradient(circle at 20% 18%, rgba(168,98,74,0.12), transparent 38%),
    rgba(246,241,232,0.9);
}
.credential-seal svg { color: var(--role-clay); margin-bottom: 8px; }
.credential-seal strong {
  display: block;
  margin-top: 8px;
  color: var(--text-primary);
  font-size: 0.84rem;
  line-height: 1.2;
}

.hero-diagram {
  width: min(100%, 660px);
  min-height: 500px;
  border: 1px solid rgba(255, 253, 248, 0.14);
  border-radius: var(--radius-panel);
  background: linear-gradient(180deg, rgba(255,255,255,0.105), rgba(255,255,255,0.042));
  box-shadow: var(--shadow-dark);
  backdrop-filter: blur(18px);
  position: relative;
  overflow: hidden;
}
.hero-diagram::before {
  content: "";
  position: absolute;
  inset: -1px;
  background: radial-gradient(circle at 16% 14%, rgba(112,85,216,0.24), transparent 28%), radial-gradient(circle at 80% 74%, rgba(21,150,136,0.2), transparent 34%);
  pointer-events: none;
}
.diagram-header {
  position: relative;
  z-index: 1;
  padding: 24px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid rgba(255, 253, 248, 0.12);
}
.diagram-header span, .audit-step span {
  font: 650 0.68rem/1 var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,253,248,0.55);
}
.diagram-header strong { font-size: 0.9rem; color: rgba(255,253,248,0.78); }
.flow-diagram {
  display: flex;
  flex-direction: column;
}
.flow-body {
  position: relative;
  z-index: 1;
  flex: 1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: minmax(128px, auto);
  gap: 22px;
  align-content: center;
  padding: clamp(28px, 5vw, 54px);
}
.flow-line {
  position: absolute;
  left: clamp(46px, 8vw, 76px);
  right: clamp(46px, 8vw, 76px);
  top: 50%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.28), rgba(167,255,241,0.48), transparent);
}
.flow-line::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: 1px;
  height: 108px;
  transform: translateY(-50%);
  background: linear-gradient(180deg, transparent, rgba(255,255,255,0.22), transparent);
}
.flow-line::after {
  content: "";
  position: absolute;
  width: 26%;
  height: 2px;
  background: var(--gradient-evidence);
  filter: blur(0.2px);
  animation: evidenceFlow 5.4s linear infinite;
}
.flow-node {
  position: relative;
  min-width: 0;
  min-height: 124px;
  display: grid;
  gap: 10px;
  align-content: center;
  justify-items: center;
  padding: 16px 12px;
  color: var(--surface-ivory);
  border: 1px solid rgba(255,253,248,0.14);
  border-radius: 16px;
  background: rgba(7, 9, 14, 0.38);
  animation: nodePulse 7s ease-in-out infinite;
  animation-delay: calc(var(--i) * 360ms);
}
.flow-node:nth-of-type(6),
.flow-node:nth-of-type(7),
.flow-node:nth-of-type(8) {
  transform: translateX(58%);
}
.flow-node::after {
  content: "";
  position: absolute;
  width: 22px;
  height: 1px;
  right: -23px;
  top: 50%;
  background: rgba(167,255,241,0.32);
}
.flow-node:nth-of-type(5)::after,
.flow-node:nth-of-type(8)::after {
  display: none;
}
.node-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: #a7fff1;
  background: rgba(21,150,136,0.16);
}
.flow-node span {
  max-width: 112px;
  font-size: 0.78rem;
  text-align: center;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.pod-diagram {
  display: grid;
  align-items: stretch;
  padding: clamp(22px, 4vw, 38px);
}
.pod-diagram-field {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(circle at 50% 48%, #000 0%, #000 54%, transparent 86%);
  opacity: 0.55;
}
.pod-system-label {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: flex-start;
  margin-bottom: 26px;
}
.pod-system-label span {
  color: #a7fff1;
  font: 800 0.72rem/1 var(--font-mono);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.pod-system-label strong {
  max-width: 280px;
  color: rgba(255,253,248,0.82);
  font: 650 1rem/1.25 var(--font-body);
  text-align: right;
}
.pod-core-wrap {
  position: relative;
  z-index: 2;
  min-height: 280px;
  display: grid;
  place-items: center;
  margin: 0 auto 24px;
  width: min(100%, 560px);
}
.pod-core {
  width: min(72%, 300px);
  min-height: 180px;
  border-radius: 28px;
  border: 1px solid rgba(167,255,241,0.28);
  background:
    radial-gradient(circle at 50% 0%, rgba(167,255,241,0.12), transparent 56%),
    linear-gradient(180deg, rgba(255,255,255,0.13), rgba(255,255,255,0.055));
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 12px;
  text-align: center;
  padding: 30px;
  position: relative;
  z-index: 3;
  box-shadow: 0 26px 80px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.16);
}
.pod-core::before {
  content: "";
  position: absolute;
  inset: -16px;
  border: 1px solid rgba(255,253,248,0.08);
  border-radius: 38px;
}
.pod-core span { color: #a7fff1; font: 800 0.68rem/1 var(--font-mono); letter-spacing: 0.12em; text-transform: uppercase; }
.pod-core strong { color: var(--surface-ivory); font: 700 2rem/0.98 var(--font-body); }
.pod-core small { max-width: 220px; color: rgba(255,253,248,0.66); line-height: 1.45; }
.pod-band {
  position: absolute;
  left: 0;
  right: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  z-index: 2;
}
.pod-band-top { top: 0; }
.pod-band-bottom { bottom: 0; }
.pod-band span {
  min-height: 40px;
  display: grid;
  place-items: center;
  padding: 8px 10px;
  border: 1px solid rgba(255,253,248,0.12);
  border-radius: 999px;
  background: rgba(255,255,255,0.055);
  color: rgba(255,253,248,0.68);
  font: 700 0.68rem/1.15 var(--font-mono);
  letter-spacing: 0.07em;
  text-transform: uppercase;
  text-align: center;
}
.pod-kernel-line {
  position: absolute;
  z-index: 1;
  background: linear-gradient(90deg, transparent, rgba(167,255,241,0.34), transparent);
}
.pod-kernel-line.horizontal { left: 8%; right: 8%; top: 50%; height: 1px; }
.pod-kernel-line.vertical {
  width: 1px;
  height: 74%;
  left: 50%;
  top: 13%;
  background: linear-gradient(180deg, transparent, rgba(167,255,241,0.28), transparent);
}
.pod-module-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.pod-module {
  min-width: 0;
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 12px;
  align-items: center;
  padding: 13px;
  border: 1px solid rgba(255,253,248,0.11);
  border-radius: 16px;
  background: rgba(7,9,14,0.22);
  animation: nodePulse 8s ease-in-out infinite;
  animation-delay: calc(var(--i) * 180ms);
}
.pod-module-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: #a7fff1;
  background: rgba(21,150,136,0.14);
}
.pod-module strong {
  display: block;
  color: var(--surface-ivory);
  font-size: 0.88rem;
  line-height: 1.15;
}
.pod-module span {
  display: block;
  margin-top: 4px;
  color: rgba(255,253,248,0.54);
  font-size: 0.72rem;
  line-height: 1.25;
}
.audit-rail {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 14px;
  padding: 46px;
}
.audit-step {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 18px;
  align-items: center;
  min-height: 58px;
  padding: 14px 18px;
  border-radius: 16px;
  border: 1px solid rgba(255,253,248,0.12);
  background: rgba(255,255,255,0.06);
  animation: nodePulse 7s ease-in-out infinite;
  animation-delay: calc(var(--i) * 420ms);
}
.audit-step strong { color: var(--surface-ivory); }

.intro-section { background: var(--surface-ivory); }
.shift-section, .marketplace-section, .faq-section { background: var(--surface-sand); }
.pod-section, .feature-section, .usecase-section, .logo-section { background: var(--surface-ivory); }
.blueprint-section { background: linear-gradient(180deg, var(--surface-ivory), var(--surface-sand)); }

.contrast-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.contrast-panel {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-panel);
  padding: clamp(26px, 4vw, 44px);
  background: rgba(246,241,232,0.58);
}
.contrast-panel.strong {
  background: var(--gradient-card);
  box-shadow: var(--shadow-card);
  border-color: var(--border-strong);
}
.panel-label {
  display: block;
  margin-bottom: var(--space-6);
  color: var(--text-muted);
  font: 650 0.75rem/1 var(--font-mono);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.contrast-panel p {
  padding: 15px 0;
  border-top: 1px solid var(--border-soft);
  font-size: clamp(1.05rem, 1.3vw, 1.22rem);
  color: var(--text-primary);
}
.contrast-panel.muted p { color: var(--text-secondary); }

.structure-card {
  border-radius: var(--radius-panel);
  overflow: hidden;
  background: var(--gradient-assurance);
  min-height: 560px;
}
.structure-card .hero-diagram {
  width: 100%;
  height: 100%;
  min-height: 560px;
  border: 0;
  border-radius: 0;
}
.layer-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin-top: var(--space-16);
}
.layer-card, .feature-card, .usecase-card, .market-card {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--gradient-card);
  padding: 26px;
  box-shadow: var(--shadow-card);
  transition: transform var(--duration-base) var(--ease), box-shadow var(--duration-base) var(--ease), border-color var(--duration-base) var(--ease);
}
.layer-card:hover, .feature-card:hover, .usecase-card:hover, .market-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-card);
  border-color: var(--border-strong);
}
.layer-card span, .feature-card > span, .market-card > span, .usecase-card > span {
  display: block;
  color: var(--role-clay);
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 18px;
}
.layer-card p, .feature-card p, .market-card p, .usecase-card dd { margin-top: 12px; color: var(--text-secondary); }

.blueprint-card {
  padding: clamp(28px, 4vw, 44px);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-panel);
  background: rgba(246,241,232,0.86);
  box-shadow: var(--shadow-card);
}
.blueprint-top { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 26px; }
.status {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-pill, 999px);
  padding: 7px 10px;
  font: 700 0.68rem/1 var(--font-mono);
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.status-reviewed { color: var(--qi-violet); background: rgba(168,98,74,0.09); }
.status-evidence { color: var(--assurance-teal); background: rgba(107,107,63,0.09); }
.status-settlement { color: var(--settlement-amber); background: rgba(168,98,74,0.09); }
.meta-list {
  margin: 26px 0;
  display: grid;
  gap: 0;
}
.meta-list div {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 22px;
  padding: 14px 0;
  border-top: 1px solid var(--border-soft);
}
dt {
  color: var(--text-muted);
  font: 700 0.68rem/1.4 var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
dd { margin: 0; color: var(--text-primary); }
.inline-link, .market-card a {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  color: var(--surface-graphite);
  font-weight: 700;
}

.trail-section {
  overflow: hidden;
  color: var(--surface-ivory);
  background: var(--gradient-assurance);
}
.trail-section h2, .final-cta-section h2 { color: var(--surface-ivory); }
.trail-section .section-heading p:not(.eyebrow), .final-cta-section p { color: rgba(255,253,248,0.74); }
.timeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.trail-step {
  min-height: 210px;
  padding: 24px;
  border: 1px solid rgba(255,253,248,0.14);
  border-radius: var(--radius-card);
  background: rgba(255,255,255,0.06);
  transform: translateY(24px);
  opacity: 0;
  transition: opacity var(--duration-slow) var(--ease), transform var(--duration-slow) var(--ease), border-color var(--duration-slow) var(--ease);
  transition-delay: calc(var(--i) * 70ms);
}
.trail-step.is-visible { opacity: 1; transform: translateY(0); border-color: rgba(120, 222, 208, 0.32); }
.trail-step span {
  color: var(--role-clay-soft);
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.16em;
}
.trail-step strong {
  display: block;
  color: var(--surface-ivory);
  font: 650 1.2rem/1.1 var(--font-body);
  margin: 38px 0 14px;
}
.trail-step p { color: rgba(255,253,248,0.65); font-size: 0.94rem; }
.proof-line {
  margin-top: var(--space-10);
  color: var(--surface-ivory);
  font-size: clamp(1.4rem, 3vw, 2.5rem);
  font-family: var(--font-display);
}

.feature-grid, .usecase-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.feature-card { min-height: 270px; position: relative; overflow: hidden; }
.feature-card small {
  position: absolute;
  left: 26px;
  right: 26px;
  bottom: 24px;
  color: var(--text-muted);
  opacity: 0;
  transform: translateY(8px);
  transition: all var(--duration-base) var(--ease);
}
.feature-card:hover small { opacity: 1; transform: translateY(0); }
.feature-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: var(--role-olive);
  background: rgba(107,107,63,0.09);
  border-radius: var(--radius-card);
  margin-bottom: 28px;
}

.boundary-section { background: var(--surface-ivory); }
.boundary-model {
  display: grid;
  grid-template-columns: 1fr 260px 1fr;
  gap: 24px;
  align-items: stretch;
}
.boundary-col, .rules-core {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-panel);
  padding: clamp(24px, 4vw, 42px);
  background: var(--surface-card);
}
.boundary-col h3 { margin-bottom: 24px; }
.boundary-col p {
  padding: 13px 0;
  border-top: 1px solid var(--border-soft);
  color: var(--text-primary);
}
.boundary-col.expert { background: linear-gradient(145deg, rgba(246,241,232,0.95), rgba(239,232,218,0.72)); }
.rules-core {
  display: grid;
  place-items: center;
  text-align: center;
  align-content: center;
  gap: 14px;
  color: var(--surface-ivory);
  background: var(--gradient-cta);
}
.rules-core span { color: rgba(255,253,248,0.7); font-size: 0.92rem; }

.marketplace-shell {
  border-radius: var(--radius-panel);
  padding: clamp(24px, 4vw, 40px);
  border: 1px solid var(--border-soft);
  background: rgba(246,241,232,0.68);
  box-shadow: var(--shadow-soft);
}
.search-box {
  min-height: 68px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 22px;
  border-radius: var(--radius-card);
  background: var(--surface-ivory);
  border: 1px solid var(--border-soft);
  color: var(--text-muted);
  font-size: clamp(1rem, 1.6vw, 1.2rem);
}
.category-row { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 28px; }
.category-row button {
  border: 1px solid var(--border-soft);
  background: rgba(246,241,232,0.74);
  border-radius: 999px;
  padding: 9px 12px;
  color: var(--text-secondary);
  cursor: pointer;
}
.category-row button:hover { color: var(--text-primary); border-color: var(--border-strong); }
.market-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.market-card { min-height: 300px; display: flex; flex-direction: column; }
.market-meta { margin: auto 0 18px; display: grid; gap: 8px; color: var(--text-muted); }

.usecase-card { min-height: 360px; }
.usecase-card h3 {
  min-height: 84px;
  color: var(--text-primary);
}
.usecase-card dl { display: grid; gap: 18px; margin: 26px 0 0; }
.usecase-card dt { margin-bottom: 6px; }

.ecosystem-section { background: var(--gradient-settlement); }
.ecosystem-map {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.ecosystem-map div {
  min-height: 96px;
  border: 1px solid rgba(17,21,28,0.12);
  border-radius: var(--radius-card);
  background: rgba(246,241,232,0.58);
  display: flex;
  align-items: center;
  padding: 22px;
  color: var(--text-primary);
  font-weight: 700;
}
.testimonial-section { background: var(--surface-graphite); color: var(--surface-ivory); }
.testimonial-shell {
  border-radius: var(--radius-panel);
  padding: clamp(30px, 6vw, 72px);
  background: radial-gradient(circle at 80% 20%, rgba(112,85,216,0.23), transparent 32%), rgba(255,255,255,0.06);
  border: 1px solid rgba(255,253,248,0.13);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
}
blockquote {
  margin: 28px 0;
  max-width: 900px;
  font: 600 clamp(1.8rem, 4.2vw, 4.3rem)/1.04 var(--font-serif);
  letter-spacing: -0.012em;
}

.hero-diagram {
  border-color: var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--gradient-card);
  box-shadow: var(--shadow-card);
}
.hero-diagram::before {
  background: radial-gradient(circle at 16% 14%, rgba(168,98,74,0.12), transparent 28%), radial-gradient(circle at 80% 74%, rgba(44,62,85,0.1), transparent 34%);
}
.diagram-header {
  border-bottom-color: var(--border-soft);
}
.diagram-header span,
.audit-step span {
  color: var(--text-muted);
}
.diagram-header strong,
.audit-step strong,
.flow-node span,
.pod-core strong {
  color: var(--text-primary);
}
.flow-line {
  background: linear-gradient(90deg, transparent, rgba(168,98,74,0.32), rgba(44,62,85,0.32), transparent);
}
.flow-node,
.audit-step,
.pod-module,
.pod-band span {
  border-color: var(--border-soft);
  background: rgba(246,241,232,0.76);
  color: var(--text-primary);
  border-radius: var(--radius-card);
}
.node-icon,
.pod-module-icon {
  color: var(--role-olive);
  background: rgba(107,107,63,0.1);
  border-radius: var(--radius-card);
}
.pod-diagram {
  color: var(--text-primary);
  background: var(--gradient-card);
}
.pod-diagram-field {
  opacity: 0.25;
}
.pod-core {
  border-color: var(--border-soft);
  border-radius: var(--radius-card);
  background: rgba(246,241,232,0.82);
}
.pod-core span {
  color: var(--role-clay);
}
.pod-core small,
.pod-module span,
.audit-step strong {
  color: var(--text-secondary);
}
.person strong { display: block; color: var(--surface-ivory); }
.person span, .person small { display: block; color: rgba(255,253,248,0.64); }
.testimonial-controls { display: grid; align-content: end; gap: 10px; }
.testimonial-controls button {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-card);
  border: 1px solid rgba(255,253,248,0.18);
  background: transparent;
  color: rgba(255,253,248,0.64);
  cursor: pointer;
}
.testimonial-controls button.active {
  color: var(--surface-ivory);
  background: rgba(255,255,255,0.12);
}
.logo-wall {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-panel);
  overflow: hidden;
  margin-top: 24px;
}
.logo-wall span {
  min-height: 110px;
  display: grid;
  place-items: center;
  border-right: 1px solid var(--border-soft);
  border-bottom: 1px solid var(--border-soft);
  color: var(--text-muted);
  font: 700 0.84rem/1 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  filter: grayscale(1);
}

.partner-program-section { background: var(--surface-ivory); }
.partner-program-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(420px, 1fr);
  gap: clamp(36px, 6vw, 84px);
  align-items: start;
}
.program-steps { margin-top: 36px; display: grid; gap: 12px; }
.program-steps p { color: var(--text-primary); }
.program-steps span { margin-right: 12px; color: var(--ixo-blue); font-family: var(--font-mono); }
.design-pod-card {
  margin-top: 30px;
  padding: 24px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background: linear-gradient(145deg, rgba(246,241,232,0.82), rgba(220,227,255,0.58));
  box-shadow: var(--shadow-card);
}
.design-pod-card span {
  display: inline-flex;
  margin-bottom: 18px;
  color: var(--role-olive);
  font: 700 0.68rem/1 var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.design-pod-card h3 {
  max-width: 420px;
  margin-bottom: 12px;
}
.design-pod-card p {
  max-width: 520px;
  color: var(--text-secondary);
}
.partner-form {
  border-radius: var(--radius-panel);
  border: 1px solid var(--border-soft);
  background: var(--surface-ivory);
  padding: clamp(24px, 4vw, 42px);
  box-shadow: var(--shadow-card);
}
.form-progress { height: 6px; border-radius: 999px; background: var(--surface-sand); overflow: hidden; margin-bottom: 18px; }
.form-progress span { display: block; height: 100%; background: var(--gradient-evidence); transition: width var(--duration-base) var(--ease); }
.form-note { font-size: 0.9rem; margin-bottom: 24px; }
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.form-grid.single { grid-template-columns: 1fr; }
label {
  display: grid;
  gap: 8px;
  color: var(--text-secondary);
  font-weight: 700;
  font-size: 0.86rem;
}
input, textarea {
  width: 100%;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-control);
  background: rgba(246,241,232,0.76);
  color: var(--text-primary);
  padding: 12px 13px;
  resize: vertical;
}
input:invalid:not(:placeholder-shown), textarea:invalid:not(:placeholder-shown) { border-color: var(--risk-coral); }
.form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.confirmation { min-height: 360px; display: grid; place-items: center; align-content: center; text-align: center; gap: 16px; }
.confirmation svg { color: var(--success-green); }

.faq-list { border-top: 1px solid var(--border-soft); }
.faq-item { border-bottom: 1px solid var(--border-soft); }
.faq-item button {
  width: 100%;
  border: 0;
  background: transparent;
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: left;
  color: var(--text-primary);
  font: 650 clamp(1.05rem, 1.5vw, 1.35rem)/1.2 var(--font-body);
  cursor: pointer;
}
.faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--duration-base) var(--ease);
}
.faq-answer p { overflow: hidden; max-width: 720px; padding-right: 32px; }
.faq-answer.is-open { grid-template-rows: 1fr; padding-bottom: 24px; }

.final-cta-section { background: var(--surface-ivory); }
.final-cta-panel {
  min-height: 560px;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 28px;
  border-radius: var(--radius-panel);
  padding: clamp(32px, 7vw, 88px);
  color: var(--surface-ivory);
  background: var(--gradient-cta);
  box-shadow: var(--shadow-dark);
  overflow: hidden;
  position: relative;
}
.final-cta-panel::after {
  content: "";
  position: absolute;
  width: 460px;
  height: 460px;
  border-radius: 50%;
  right: -140px;
  top: -110px;
  background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 68%);
}
.final-cta-panel > * { position: relative; z-index: 1; }
.final-cta-panel p:not(.eyebrow) { max-width: 720px; font-size: 1.2rem; }

.footer {
  padding: 80px 0 32px;
  background: var(--surface-graphite);
  color: var(--surface-ivory);
}
.footer .brand { color: var(--surface-ivory); }
.footer-grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.6fr) 1fr;
  gap: 60px;
}
.footer-brand p { color: rgba(255,253,248,0.66); margin: 22px 0 30px; }
.newsletter { display: grid; gap: 10px; max-width: 360px; }
.newsletter label { color: rgba(255,253,248,0.62); }
.newsletter div { display: flex; gap: 8px; }
.newsletter input { background: rgba(255,255,255,0.08); color: var(--surface-ivory); border-color: rgba(255,255,255,0.15); }
.newsletter button {
  width: 48px;
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: var(--radius-control);
  background: rgba(255,255,255,0.12);
  color: var(--surface-ivory);
}
.footer-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 26px;
}
.footer-links h3 {
  color: var(--surface-ivory);
  font-size: 0.82rem;
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 16px;
}
.footer-links a {
  display: block;
  color: rgba(255,253,248,0.62);
  margin: 10px 0;
  font-size: 0.92rem;
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 60px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,253,248,0.48);
  font-size: 0.86rem;
}

.sticky-cta {
  position: fixed;
  left: 50%;
  bottom: 18px;
  z-index: 60;
  transform: translate(-50%, 120px);
  opacity: 0;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 10px 10px 10px 20px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: rgba(246,241,232,0.9);
  box-shadow: var(--shadow-card);
  backdrop-filter: blur(18px);
  transition: opacity var(--duration-base) var(--ease), transform var(--duration-base) var(--ease);
}
.sticky-cta.is-visible { transform: translate(-50%, 0); opacity: 1; }
.sticky-cta span { color: var(--text-primary); font-weight: 700; white-space: nowrap; }

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--duration-slow) var(--ease), transform var(--duration-slow) var(--ease);
  transition-delay: calc(var(--i, 0) * 70ms);
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: 120ms; }
.delay-2 { transition-delay: 220ms; }

@keyframes drift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(-8vw, 5vh, 0) scale(1.08); }
}
@keyframes evidenceFlow {
  from { transform: translateX(-30%); opacity: 0; }
  20%, 80% { opacity: 1; }
  to { transform: translateX(360%); opacity: 0; }
}
@keyframes nodePulse {
  0%, 100% { border-color: rgba(255,253,248,0.14); box-shadow: 0 0 0 rgba(120,222,208,0); }
  50% { border-color: rgba(120,222,208,0.38); box-shadow: 0 0 32px rgba(21,150,136,0.08); }
}

@media (max-width: 1100px) {
  .desktop-nav, .nav-actions .btn { display: none; }
  .mobile-menu-button { display: inline-grid; }
  .hero-grid, .section-grid, .section-heading, .partner-program-grid, .footer-grid { grid-template-columns: 1fr; }
  .hero-grid { gap: 44px; }
  .hero-visual { min-height: auto; }
  .service-room { min-height: auto; width: 100%; }
  .service-room-core { grid-template-columns: minmax(0, 1.1fr) minmax(190px, 0.6fr); }
  .service-rails { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero-diagram { min-height: 420px; }
  .flow-body { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; padding: 32px; }
  .flow-node { min-height: 118px; }
  .flow-node:nth-of-type(6),
  .flow-node:nth-of-type(7),
  .flow-node:nth-of-type(8) { transform: translateX(56%); }
  .pod-module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .timeline, .layer-grid, .feature-grid, .usecase-grid, .market-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .boundary-model { grid-template-columns: 1fr; }
  .rules-core { min-height: 220px; }
  .sticky-cta {
    width: calc(100% - 36px);
    justify-content: space-between;
    border-radius: 18px;
  }
  .sticky-cta span { white-space: normal; font-size: 0.9rem; line-height: 1.2; }
  .sticky-cta .btn { min-width: 180px; border-radius: var(--radius-card); }
}

@media (max-width: 720px) {
  .page-grid {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
  }
  section { padding: 72px 0; }
  h1 { font-size: clamp(2.4rem, 11vw, 3.25rem); max-width: 9ch; }
  h2 { font-size: clamp(2rem, 9vw, 2.75rem); }
  .hero { padding: 116px 0 56px; }
  .hero-grid { grid-template-columns: minmax(0, 1fr); }
  .hero-copy { width: min(100%, 350px); max-width: calc(100vw - 48px); }
  .hero-sub, .trust-line { max-width: 100%; overflow-wrap: anywhere; }
  .hero .button-row { display: grid; grid-template-columns: 1fr; align-items: stretch; }
  .hero .btn { width: 100%; min-width: 0; white-space: normal; text-align: center; }
  .hero-visual { min-height: auto; }
  .service-room {
    min-height: auto;
    width: min(100%, 350px);
    max-width: 100%;
    border-radius: var(--radius-card);
    padding: 20px;
    gap: 14px;
  }
  .service-room-header { display: grid; gap: 8px; }
  .service-room-header strong { text-align: left; max-width: none; }
  .service-room-core {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .service-side { grid-template-rows: auto auto auto; gap: 12px; }
  .client-room-panel { grid-row: auto; padding: 20px; }
  .client-room-panel h3 { margin-top: 16px; font-size: 2rem; }
  .client-room-panel p { max-width: 100%; font-size: 0.94rem; }
  .consultation-row { grid-template-columns: 1fr; margin-top: 18px; }
  .consultation-row::before { display: none; }
  .avatar-tile { min-height: 62px; }
  .live-link { min-height: 44px; }
  .credential-seal {
    display: grid;
    grid-template-columns: 24px 1fr;
    column-gap: 10px;
    align-items: center;
  }
  .credential-seal svg { margin-bottom: 0; grid-row: span 2; }
  .credential-seal strong { margin-top: 2px; }
  .service-rails {
    left: 20px;
    right: 20px;
    bottom: 20px;
    grid-template-columns: 1fr;
  }
  .service-rail { padding: 11px 13px; }
  .hero-diagram { min-height: auto; }
  .flow-body {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: 12px;
    padding: 22px;
  }
  .flow-node {
    min-height: 78px;
    grid-template-columns: 42px 1fr;
    justify-items: start;
    text-align: left;
    padding: 14px;
  }
  .flow-node:nth-of-type(6),
  .flow-node:nth-of-type(7),
  .flow-node:nth-of-type(8) { transform: none; }
  .flow-node::after {
    width: 1px;
    height: 12px;
    left: 35px;
    right: auto;
    top: auto;
    bottom: -13px;
  }
  .flow-node:nth-of-type(5)::after { display: block; }
  .flow-line { top: 92px; bottom: 42px; left: 43px; right: auto; width: 1px; height: auto; }
  .flow-line::before { display: none; }
  .flow-line::after { width: 2px; height: 23%; animation: evidenceFlowY 5.4s linear infinite; }
  .flow-node span { max-width: none; text-align: left; }
  .pod-diagram { padding: 18px; }
  .pod-system-label { display: grid; gap: 10px; margin-bottom: 18px; }
  .pod-system-label strong { text-align: left; }
  .pod-core-wrap {
    width: 100%;
    min-height: 360px;
    margin-bottom: 18px;
  }
  .pod-core { width: min(86%, 280px); min-height: 174px; padding: 24px; }
  .pod-core strong { font-size: 1.65rem; }
  .pod-band {
    grid-template-columns: 1fr;
    max-width: 150px;
  }
  .pod-band-top { left: 0; right: auto; top: 0; }
  .pod-band-bottom { left: auto; right: 0; bottom: 0; }
  .pod-band span { min-height: 34px; font-size: 0.6rem; }
  .pod-module-grid { grid-template-columns: 1fr; }
  .pod-module { grid-template-columns: 36px 1fr; }
  .timeline, .layer-grid, .feature-grid, .usecase-grid, .market-card-grid, .ecosystem-map, .logo-wall, .footer-links, .form-grid { grid-template-columns: 1fr; }
  .contrast-grid { grid-template-columns: 1fr; }
  .meta-list div { grid-template-columns: 1fr; gap: 7px; }
  .testimonial-shell { grid-template-columns: 1fr; }
  .testimonial-controls { display: flex; }
  .partner-program-grid { grid-template-columns: 1fr; }
  .sticky-cta { width: calc(100% - 28px); justify-content: space-between; border-radius: var(--radius-card); }
  .sticky-cta span { white-space: normal; font-size: 0.88rem; }
  .sticky-cta .btn { padding: 12px 14px; }
  .footer-bottom { flex-direction: column; }
}

@keyframes evidenceFlowY {
  from { transform: translateY(-20%); opacity: 0; }
  20%, 80% { opacity: 1; }
  to { transform: translateY(360%); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
}