:root {
  --ink: #07111f;
  --ink-2: #102137;
  --paper: #f7f9f7;
  --paper-2: #f0f3f0;
  --white: #ffffff;
  --mint: #b9f7d4;
  --mint-strong: #57d99a;
  --brand-green: #0eae66;
  --cyan: #9fe8f4;
  --blue: #5088ff;
  --amber: #f5b94b;
  --red: #e96767;
  --muted: #617083;
  --line: #d8e0da;
  --radius: 20px;
  --shadow: 0 24px 72px rgba(7, 17, 31, .12);
  --max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: auto; scroll-padding-top: 78px; }
body {
  margin: 0;
  overflow-x: clip;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
main { overflow: clip; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }

.skip-link {
  position: fixed;
  z-index: 100;
  left: 1rem;
  top: -5rem;
  background: var(--mint);
  padding: .75rem 1rem;
  border-radius: 8px;
}
.skip-link:focus { top: 1rem; }

.site-header {
  width: min(calc(100% - 40px), var(--max));
  height: 78px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  position: sticky;
  z-index: 40;
  top: 0;
}
.site-header::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 calc(50% - 50vw);
  background: rgba(247, 249, 247, .88);
  border-bottom: 1px solid rgba(216, 224, 218, .72);
  backdrop-filter: blur(18px) saturate(1.3);
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  text-decoration: none;
  font-size: 1.06rem;
  font-weight: 800;
  letter-spacing: -.03em;
}
.brand-logo {
  width: 78px;
  height: auto;
  object-fit: contain;
}
.site-header nav { margin-left: auto; display: flex; gap: 1.65rem; }
.site-header nav a {
  color: #405166;
  text-decoration: none;
  font-size: .78rem;
  font-weight: 700;
}
.site-header nav a:hover { color: #1f704e; }
.header-cta { margin-left: .4rem; }

.preview-bar {
  position: fixed;
  z-index: 50;
  right: 16px;
  bottom: 16px;
  padding: .65rem .8rem;
  color: white;
  background: rgba(7, 17, 31, .94);
  border: 1px solid #33465e;
  border-radius: 10px;
  box-shadow: var(--shadow);
  font-size: .75rem;
}
.preview-bar a { margin-left: .6rem; color: var(--mint); }

.button {
  min-height: 48px;
  padding: .85rem 1.2rem;
  border: 1px solid transparent;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  cursor: pointer;
  text-decoration: none;
  font-size: .86rem;
  font-weight: 750;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary {
  color: #071b13;
  background: #79e6ac;
  border-color: #4dcb87;
  box-shadow: 0 12px 30px rgba(25, 132, 85, .22);
}
.button-primary span:last-child { color: #0b5135; }
.button-primary:hover {
  background: #91edba;
  border-color: #39b977;
  box-shadow: 0 16px 36px rgba(25, 132, 85, .28);
}
.button-secondary {
  border-color: #c4cec7;
  background: rgba(255,255,255,.72);
  box-shadow: 0 1px 2px rgba(7,17,31,.04);
}
.button-secondary:hover { border-color: #9aaca0; background: white; }
.button-small { min-height: 44px; padding: .55rem .9rem; font-size: .78rem; }

.hero {
  width: min(calc(100% - 40px), var(--max));
  min-height: calc(100svh - 78px);
  margin: 0 auto;
  padding: 28px 0 36px;
  display: grid;
  grid-template-columns: minmax(0, .97fr) minmax(0, 1.03fr);
  gap: 40px;
  align-items: center;
  position: relative;
  isolation: isolate;
}
.hero::before {
  content: "";
  position: absolute;
  z-index: -2;
  top: 0;
  left: 50%;
  width: 100vw;
  height: 100%;
  transform: translateX(-50%);
  background:
    radial-gradient(circle at 76% 38%, rgba(159, 232, 244, .18), transparent 29%),
    radial-gradient(circle at 28% 18%, rgba(185, 247, 212, .23), transparent 31%),
    linear-gradient(rgba(7, 17, 31, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7, 17, 31, .025) 1px, transparent 1px);
  background-size: auto, auto, 36px 36px, 36px 36px;
  mask-image: linear-gradient(to bottom, black 0%, black 78%, transparent 100%);
}
.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -7%;
  bottom: 12%;
  width: 360px;
  height: 360px;
  background: rgba(87, 217, 154, .13);
  border-radius: 50%;
  filter: blur(90px);
}
.hero-copy, .hero-demo { min-width: 0; }
.hero-copy { position: relative; }
h1, h2, h3, p { margin-top: 0; }
h1 {
  max-width: 650px;
  margin-bottom: 1.05rem;
  font-size: clamp(2.8rem, 4.1vw, 4rem);
  line-height: .96;
  letter-spacing: -.062em;
}
.hero-subhead {
  max-width: 610px;
  color: #495b6f;
  font-size: .94rem;
  line-height: 1.58;
}
.hero-actions { margin: 1.25rem 0 .9rem; display: flex; align-items: center; gap: 1.35rem; }
.text-link { color: #33465e; font-size: .82rem; font-weight: 750; text-decoration: none; }
.support-line { margin-bottom: 0; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.hero-proof {
  margin: .9rem 0 0;
  padding: .85rem 0 0;
  border-top: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: .55rem 1rem;
  list-style: none;
  color: #44566b;
  font-size: .68rem;
  font-weight: 650;
}
.hero-proof span { color: #168a56; }

.hero-demo {
  position: relative;
  color: #eaf1f7;
  background: var(--ink);
  border: 1px solid #273b54;
  border-radius: 18px;
  box-shadow:
    0 32px 80px rgba(7, 17, 31, .22),
    0 0 0 5px rgba(255, 255, 255, .72),
    0 0 0 6px rgba(94, 122, 142, .18);
  overflow: hidden;
  transform: none;
  transition: transform .25s ease, box-shadow .25s ease;
}
.hero-demo:hover {
  transform: translateY(-4px);
  box-shadow:
    0 38px 90px rgba(7, 17, 31, .25),
    0 0 0 5px rgba(255, 255, 255, .82),
    0 0 0 6px rgba(87, 217, 154, .25);
}
.mockup-label {
  position: absolute;
  z-index: 3;
  right: 16px;
  top: 51px;
  padding: .25rem .45rem;
  color: #b9c8d8;
  background: #14253a;
  border: 1px solid #2f455d;
  border-radius: 4px;
  font-size: .54rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.window-bar {
  height: 40px;
  padding: 0 14px;
  border-bottom: 1px solid #26394f;
  display: flex;
  align-items: center;
  gap: 6px;
}
.window-bar > span { width: 7px; height: 7px; border-radius: 50%; background: #3b5169; }
.window-bar p { margin: 0 auto; transform: translateX(-18px); color: #8fa1b5; font-size: .63rem; }
.demo-grid { min-height: 455px; display: grid; grid-template-columns: 36% 64%; }
.demo-context { padding: 49px 14px 16px; background: #0b1727; border-right: 1px solid #26394f; }
.demo-kicker, .form-eyebrow {
  color: #7f93aa;
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .14em;
}
.context-row {
  position: relative;
  margin: 10px 0;
  padding: 11px 9px;
  border: 1px solid #24394f;
  border-radius: 8px;
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 8px;
  align-items: center;
  background: #102035;
}
.context-row strong, .context-row small { display: block; }
.context-row strong { font-size: .65rem; }
.context-row small { color: #8498ad; font-size: .54rem; }
.context-row.muted { opacity: .67; }
.app-icon {
  width: 28px; height: 28px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  color: #07111f;
  font-size: .62rem;
  font-weight: 900;
}
.jira { background: #91b5ff; }
.slack { background: #ecc3ef; }
.file { background: #b5c1cc; }
.allowed, .blocked {
  position: absolute;
  right: 8px;
  top: 8px;
  font-size: .45rem;
  font-weight: 750;
}
.allowed { color: var(--mint-strong); }
.blocked { color: #ff8d8d; }
.device-boundary {
  margin-top: 17px;
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 7px;
  color: #9cb1c4;
  background: rgba(80,136,255,.07);
  border: 1px dashed #385270;
  border-radius: 7px;
  font-size: .52rem;
}
.demo-flow { padding: 53px 20px 18px; }
.person-row { display: grid; grid-template-columns: 38px 1fr auto; gap: 10px; align-items: center; }
.person-row strong, .person-row small { display: block; }
.person-row strong { font-size: .68rem; }
.person-row small { margin-top: 2px; color: #8296aa; font-size: .52rem; }
.avatar {
  width: 36px; height: 36px;
  border-radius: 10px;
  display: grid; place-items: center;
  color: var(--ink);
  font-size: .57rem;
  font-weight: 900;
}
.maya { background: var(--cyan); }
.jordan { background: #f4c79f; }
.live-pill, .received-pill {
  padding: .25rem .4rem;
  color: var(--mint);
  background: #112f29;
  border: 1px solid #1c5642;
  border-radius: 4px;
  font-size: .48rem;
  font-weight: 750;
}
.proposal-card {
  margin: 22px 0 14px 48px;
  padding: 14px;
  background: #13243a;
  border: 1px solid #2b4059;
  border-radius: 9px;
}
.card-heading { display: flex; gap: 9px; align-items: center; }
.card-heading .spark { color: var(--cyan); }
.card-heading small, .card-heading strong { display: block; }
.card-heading small { color: #71869d; font-size: .48rem; letter-spacing: .1em; }
.card-heading strong { font-size: .68rem; }
.proposal-card dl { margin: 13px 0 0; padding-top: 10px; border-top: 1px solid #293c53; }
.proposal-card dl div { display: flex; justify-content: space-between; margin: 5px 0; font-size: .54rem; }
.proposal-card dt { color: #8295a9; }
.proposal-card dd { margin: 0; color: #d6e0e9; }
.policy-gate {
  margin: 0 0 14px 48px;
  padding: 10px;
  display: grid;
  grid-template-columns: 29px 1fr auto;
  gap: 8px;
  align-items: center;
  background: rgba(87,217,154,.08);
  border: 1px solid #245b48;
  border-radius: 8px;
}
.shield { width: 28px; height: 28px; display: grid; place-items: center; color: var(--mint); background: #163b30; border-radius: 8px; }
.policy-gate small, .policy-gate strong { display: block; }
.policy-gate small { color: #67ad8f; font-size: .44rem; letter-spacing: .1em; }
.policy-gate strong { margin-top: 2px; font-size: .56rem; }
.policy-gate > span { padding: .25rem .4rem; color: #f6cf84; background: #392d19; border-radius: 4px; font-size: .45rem; }
.handoff-line { height: 35px; margin-left: 14px; display: grid; grid-template-columns: 1fr auto 1fr; gap: 7px; align-items: center; }
.handoff-line span { height: 1px; background: linear-gradient(90deg, transparent, #477390); }
.handoff-line span:last-child { background: linear-gradient(90deg, #477390, transparent); }
.handoff-line p { margin: 0; color: #80b8d0; font-size: .45rem; }
.receiving { opacity: .85; }

.section {
  min-height: calc(100svh - 78px);
  padding: 110px max(20px, calc((100% - var(--max)) / 2));
  scroll-margin-top: 0;
}
.problem-section,
.offer-section,
.value-section,
.architecture-section,
.how-section,
.comparison-section,
.economics-section {
  display: grid;
  align-content: center;
}
.section-heading { max-width: 700px; margin-bottom: 3.2rem; }
.section-heading.compact { max-width: 650px; }
.section-heading.centered { margin-left: auto; margin-right: auto; text-align: center; }
.section-kicker {
  margin-bottom: .9rem;
  color: #356d57;
  font-size: .65rem;
  font-weight: 850;
  letter-spacing: .14em;
}
.section-kicker.light { color: var(--mint); }
h2 {
  margin-bottom: 1.2rem;
  font-size: clamp(2.3rem, 4vw, 4rem);
  line-height: 1.02;
  letter-spacing: -.055em;
}
.section-heading > p:last-child {
  max-width: 620px;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.7;
}

.offer-section {
  grid-template-columns: minmax(0, .78fr) minmax(520px, 1.22fr);
  gap: clamp(48px, 7vw, 100px);
  align-items: center;
  background:
    radial-gradient(circle at 9% 12%, rgba(185, 247, 212, .22), transparent 24%),
    radial-gradient(circle at 90% 86%, rgba(159, 232, 244, .16), transparent 25%),
    #f1f4f1;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.offer-intro > p:not(.section-kicker) {
  max-width: 510px;
  color: #586960;
  font-size: .95rem;
  line-height: 1.7;
}
.offer-fit-card {
  max-width: 520px;
  margin-top: 36px;
  padding: 22px 24px;
  background: rgba(255,255,255,.72);
  border: 1px solid #cbd8cf;
  border-left: 4px solid var(--brand-green);
  border-radius: 12px;
  box-shadow: 0 12px 34px rgba(7,17,31,.055);
}
.offer-fit-card span,
.offer-package-header span {
  display: block;
  margin-bottom: 7px;
  color: #4d7462;
  font-size: .56rem;
  font-weight: 850;
  letter-spacing: .13em;
}
.offer-fit-card strong {
  display: block;
  font-size: .87rem;
  line-height: 1.5;
}
.offer-fit-card p {
  margin: 8px 0 0;
  color: #708078;
  font-size: .69rem;
  line-height: 1.55;
}
.offer-package {
  overflow: hidden;
  background: rgba(255,255,255,.94);
  border: 1px solid #cbd8cf;
  border-radius: var(--radius);
  box-shadow: 0 28px 76px rgba(7,17,31,.11);
}
.offer-package-header {
  padding: 23px 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: #0d2030;
  border-bottom: 1px solid #2d4558;
}
.offer-package-header span { color: #7fa992; }
.offer-package-header strong { color: white; font-size: 1.02rem; }
.offer-package-header b {
  flex: 0 0 auto;
  padding: 7px 9px;
  color: #b9f7d4;
  background: #17382f;
  border: 1px solid #2e6953;
  border-radius: 6px;
  font-size: .57rem;
}
.offer-stack {
  margin: 0;
  padding: 0 26px;
  list-style: none;
}
.offer-stack li {
  min-height: 82px;
  padding: 15px 0;
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 14px;
  align-items: center;
  border-top: 1px solid #e1e7e3;
}
.offer-stack li:first-child { border-top: 0; }
.offer-stack li > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  color: #2d6e52;
  background: #e7f5ed;
  border: 1px solid #c1dfcd;
  border-radius: 50%;
  font-size: .53rem;
  font-weight: 850;
}
.offer-stack strong,
.offer-stack p { display: block; }
.offer-stack strong { font-size: .76rem; }
.offer-stack p { margin: 3px 0 0; color: #718079; font-size: .62rem; line-height: 1.45; }
.offer-promise {
  margin: 0 26px;
  padding: 18px;
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 13px;
  color: #16452f;
  background: #eaf8f0;
  border: 1px solid #b9dfc8;
  border-radius: 10px;
}
.offer-promise > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  color: white;
  background: #218559;
  border-radius: 8px;
  font-size: .75rem;
  font-weight: 900;
}
.offer-promise strong { display: block; font-size: .76rem; }
.offer-promise p { margin: 4px 0 0; color: #4d6a5b; font-size: .62rem; line-height: 1.55; }
.offer-capacity {
  margin: 0;
  padding: 18px 26px 22px;
  color: #718079;
  font-size: .61rem;
  line-height: 1.55;
}
.offer-capacity strong { color: #42534a; }

.problem-section { background: var(--paper-2); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.problem-section {
  background:
    radial-gradient(circle at 90% 15%, rgba(159, 232, 244, .15), transparent 25%),
    var(--paper-2);
}
.pain-timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr auto) 1.15fr;
  align-items: stretch;
}
.pain-step {
  min-height: 150px;
  padding: 18px;
  background: rgba(255,255,255,.78);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(7,17,31,.045);
  transition: transform .2s ease, box-shadow .2s ease;
}
.pain-step:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(7,17,31,.075); }
.pain-step span { display: block; margin-bottom: 45px; color: #9aa6a0; font-size: .6rem; font-weight: 800; }
.pain-step strong, .pain-step small { display: block; }
.pain-step strong { font-size: .82rem; }
.pain-step small { margin-top: 4px; color: #77857d; font-size: .67rem; }
.pain-timeline > i { padding: 0 8px; align-self: center; color: #a0aaa5; font-style: normal; }
.pain-result { color: white; background: var(--ink-2); border-color: var(--ink-2); }
.pain-result span, .pain-result small { color: #a9b8c6; }
.assumption-note { margin: 1rem 0 0; color: #78847e; font-size: .66rem; }

.value-section {
  background:
    radial-gradient(circle at 12% 85%, rgba(185, 247, 212, .15), transparent 24%),
    var(--paper);
}
.principles-panel {
  overflow: hidden;
  background: rgba(255,255,255,.76);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 16px 42px rgba(7,17,31,.055);
}
.principle-row {
  min-height: 118px;
  padding: 30px 34px;
  display: grid;
  grid-template-columns: 44px minmax(280px, 1fr) auto;
  gap: 30px;
  align-items: center;
  border-top: 1px solid var(--line);
}
.principle-row:first-child { border-top: 0; }
.principle-number {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  color: #6f7f77;
  background: #f1f4f1;
  border: 1px solid #dce3de;
  border-radius: 50%;
  font-size: .57rem;
  font-weight: 850;
}
.principle-label {
  margin: 0 0 7px;
  color: #6f8078;
  font-size: .56rem;
  font-weight: 850;
  letter-spacing: .13em;
}
.principle-row h3 { font-size: 1rem; letter-spacing: -.02em; }
.principle-outcome {
  min-width: 142px;
  padding: 10px 13px;
  color: #315d49;
  background: #eef7f2;
  border: 1px solid #b9d8c7;
  border-radius: 6px;
  text-align: center;
  white-space: nowrap;
  font-size: .58rem;
  font-weight: 800;
}

.architecture-section { background: #eef3ef; }
.architecture-frame {
  padding: 34px;
  background:
    linear-gradient(#eef3ef, #eef3ef) padding-box,
    linear-gradient(120deg, rgba(87,217,154,.72), rgba(80,136,255,.35), rgba(255,255,255,.7)) border-box;
  border: 1px solid transparent;
  border-radius: var(--radius);
  box-shadow: 0 18px 54px rgba(7,17,31,.07);
}
.frame-header { margin-bottom: 25px; display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; }
.frame-header h2 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.7rem); }
.architecture-status { padding: .45rem .65rem; color: #365d4c; background: #f5faf7; border: 1px solid #b9cec1; border-radius: 6px; font-size: .57rem; text-transform: uppercase; letter-spacing: .08em; }
.architecture-frame picture { display: block; }
.architecture-frame img {
  width: 100%;
  border: 1px solid #d6dfd9;
  border-radius: 13px;
  box-shadow: 0 14px 34px rgba(7,17,31,.09);
}

.how-section {
  color: white;
  background: var(--ink);
}
.how-section .section-kicker { color: var(--mint); }
.workflow-board {
  padding: 18px;
  display: grid;
  grid-template-columns: minmax(310px,1.5fr) 18px minmax(155px,.7fr) minmax(170px,.75fr) minmax(310px,1.5fr);
  gap: 12px;
  align-items: center;
  background: #091625;
  border: 1px solid #2a3d51;
  border-radius: 18px;
}
.workflow-boundary {
  position: relative;
  min-height: 270px;
  padding: 48px 14px 50px;
  display: grid;
  grid-template-columns: minmax(0,1fr) 18px minmax(0,1fr);
  gap: 8px;
  align-items: center;
  border: 1px dashed #496075;
  border-radius: 13px;
}
.workflow-boundary > span:first-child {
  position: absolute;
  top: 16px;
  left: 16px;
  color: #8096a9;
  font-size: .51rem;
  font-weight: 850;
  letter-spacing: .13em;
}
.workflow-node {
  position: relative;
  min-width: 0;
  min-height: 166px;
  padding: 17px 14px;
  background: #102239;
  border: 1px solid #324a61;
  border-radius: 10px;
}
.workflow-node small,
.workflow-node strong,
.workflow-node p { display: block; }
.node-step {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 21px;
  height: 21px;
  display: grid;
  place-items: center;
  color: #bdd0e0;
  background: #223b53;
  border-radius: 50%;
  font-size: .51rem;
  font-weight: 850;
}
.workflow-node small {
  padding-right: 24px;
  color: #7890a5;
  font-size: .48rem;
  font-weight: 850;
  letter-spacing: .1em;
}
.workflow-node strong { margin-top: 35px; font-size: .73rem; line-height: 1.35; }
.workflow-node p { margin: 8px 0 0; color: #90a4b8; font-size: .59rem; line-height: 1.5; }
.workflow-arrow {
  color: #7390a7;
  text-align: center;
  font-size: 1rem;
}
.stays-local-note {
  position: absolute;
  right: 14px;
  bottom: 16px;
  color: #f1bd83;
  font-size: .53rem;
  font-weight: 750;
}
.stays-local-note span { margin-right: 5px; }
.node-policy {
  min-height: 238px;
  background: #102c27;
  border-color: #37705d;
}
.node-policy .node-step { color: #d8f7e6; background: #215543; }
.node-policy small { color: #73b496; }
.node-policy strong { margin-top: 28px; }
.node-policy ul { margin: 15px 0 12px; padding: 0; display: grid; gap: 7px; list-style: none; }
.node-policy li { color: #b6cbbf; font-size: .57rem; }
.node-policy li span { margin-right: 5px; color: var(--mint); }
.node-policy b {
  display: block;
  padding-top: 10px;
  color: #f4ca91;
  border-top: 1px solid #2d594b;
  font-size: .52rem;
  line-height: 1.4;
}
.approved-message {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: center;
  color: #7ea0b8;
}
.approved-message p {
  margin: 0;
  padding: 12px 10px;
  color: #aabccc;
  background: #102239;
  border: 1px solid #31495f;
  border-radius: 8px;
  text-align: center;
  font-size: .51rem;
  line-height: 1.55;
}
.approved-message strong { color: var(--mint); font-size: .56rem; }
.node-result { border-color: #3e765f; }
.node-result .node-step { color: #153c2e; background: var(--mint); }
.workflow-caption {
  margin: 16px 0 0;
  color: #8195a8;
  text-align: center;
  font-size: .63rem;
}

.comparison-section {
  background: var(--paper);
}
.path-comparison {
  display: grid;
  grid-template-columns: minmax(0,1fr) 52px minmax(0,1fr);
  align-items: stretch;
}
.path-card {
  overflow: hidden;
  background: rgba(255,255,255,.86);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 14px 36px rgba(7,17,31,.055);
}
.path-card header { min-height: 126px; padding: 25px 27px; border-bottom: 1px solid; }
.path-card header span { display: block; margin-bottom: 12px; font-size: .56rem; font-weight: 850; letter-spacing: .13em; }
.path-card header strong { display: block; max-width: 400px; font-size: 1.22rem; line-height: 1.3; letter-spacing: -.025em; }
.path-today header { background: #fff7f5; border-color: #eddbd7; }
.path-today header span { color: #a45252; }
.path-3a header { background: #f1f9f4; border-color: #cee4d6; }
.path-3a header span { color: #287154; }
.path-card ol { margin: 0; padding: 12px 27px; list-style: none; }
.path-card li {
  position: relative;
  min-height: 88px;
  padding: 16px 0;
  display: grid;
  grid-template-columns: 30px minmax(0,1fr) auto;
  gap: 13px;
  align-items: start;
  border-top: 1px solid #e4e9e5;
}
.path-card li:first-child { border-top: 0; }
.path-index {
  position: relative;
  z-index: 1;
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  background: #f0f3f1;
  border: 1px solid #d9e0db;
  border-radius: 50%;
  font-size: .53rem;
  font-weight: 850;
}
.path-card li div strong,
.path-card li div small { display: block; }
.path-card li div strong { padding-top: 2px; font-size: .73rem; line-height: 1.4; }
.path-card li div small { margin-top: 5px; color: #74837b; font-size: .61rem; line-height: 1.45; }
.path-card li > b {
  margin-top: 2px;
  padding: 5px 7px;
  color: #738078;
  background: #f4f6f4;
  border-radius: 5px;
  white-space: nowrap;
  font-size: .5rem;
}
.path-3a .path-index { color: #205f47; background: #e5f5eb; border-color: #b9dcc7; }
.path-3a li > b { color: #27694f; background: #eaf7ef; }
.path-tags { padding: 18px 27px 23px; display: flex; flex-wrap: wrap; gap: 7px; border-top: 1px solid var(--line); }
.path-tags span { padding: 6px 8px; color: #65746c; background: #eff2f0; border-radius: 5px; font-size: .52rem; font-weight: 750; }
.path-3a .path-tags span { color: #256147; background: #e5f5eb; }
.comparison-divider { position: relative; display: grid; place-items: center; }
.comparison-divider::before { content: ""; position: absolute; top: 0; bottom: 0; width: 1px; background: #ccd5cf; }
.comparison-divider span {
  position: relative;
  z-index: 1;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  color: #6d7d74;
  background: var(--paper);
  border: 1px solid #cbd5cf;
  border-radius: 50%;
  font-size: .53rem;
  font-weight: 850;
}

.security-section {
  position: relative;
  padding-top: 82px;
  padding-bottom: 58px;
  color: white;
  background:
    radial-gradient(circle at 70% 42%, rgba(58, 130, 157, .18), transparent 30%),
    radial-gradient(circle at 18% 80%, rgba(87,217,154,.08), transparent 26%),
    #0b1a2c;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}
.security-lede { max-width: 540px; color: #b3c2d2; font-size: 1rem; line-height: 1.7; }
.security-list { margin: 45px 0 0; padding: 0; list-style: none; }
.security-list li { padding: 18px 0; border-top: 1px solid #2b3d52; display: grid; grid-template-columns: 36px 1fr; gap: 18px; }
.security-list li > span { color: #5f758c; font-size: .6rem; font-weight: 800; }
.security-list strong { display: block; margin-bottom: 5px; font-size: .84rem; }
.security-list p { margin: 0; color: #91a5b9; font-size: .75rem; line-height: 1.6; }
.security-art {
  display: flex;
  align-items: center;
  padding: 8px;
  background: rgba(18,39,59,.58);
  border: 1px solid #2d475d;
  border-radius: 22px;
  box-shadow: 0 28px 70px rgba(0,0,0,.2);
}
.security-art img { width: 100%; max-height: 560px; border-radius: 16px; }
.security-disclosure {
  grid-column: 1 / -1;
  margin-top: 0;
  padding: 18px 0 0;
  border-top: 1px solid #2a3d53;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 2rem;
}
.security-disclosure strong { color: var(--amber); font-size: .74rem; }
.security-disclosure p { margin: 0; color: #8599ad; font-size: .7rem; }

.economics-section {
  background:
    radial-gradient(circle at 10% 15%, rgba(159,232,244,.16), transparent 24%),
    #edf1ec;
}
.economics-card {
  padding: 36px;
  background: rgba(255,255,255,.88);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 16px 46px rgba(7,17,31,.07);
}
.economics-label { margin-bottom: 30px; padding-bottom: 20px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; color: var(--muted); font-size: .7rem; }
.economics-label strong { color: var(--ink); }
.cost-row { margin: 24px 0; display: grid; grid-template-columns: 260px 1fr 100px; gap: 20px; align-items: center; }
.cost-row > div:first-child { display: flex; align-items: center; gap: 10px; font-size: .75rem; }
.cost-row b { text-align: right; font-size: .9rem; }
.cost-dot { width: 9px; height: 9px; border-radius: 50%; }
.cost-dot.local { background: var(--mint-strong); }
.cost-dot.cloud { background: #8798ab; }
.bar-track { height: 12px; background: #edf1ee; border-radius: 20px; overflow: hidden; }
.bar { display: block; height: 100%; border-radius: inherit; }
.local-bar { width: 8%; background: var(--mint-strong); }
.cloud-bar { width: 100%; background: linear-gradient(90deg, #9bacc0, #475c73); }
.economics-card > p { margin: 30px 0 0; padding-top: 18px; border-top: 1px solid var(--line); color: #7b8982; font-size: .66rem; }

.ecosystem-section {
  display: grid;
  grid-template-columns: 1fr;
  gap: 42px;
  align-content: center;
  background: #f7f8f6;
  border-bottom: 1px solid var(--line);
}
.ecosystem-heading { max-width: 780px; text-align: center; justify-self: center; }
.ecosystem-heading h2 { margin-bottom: 0; font-size: clamp(2rem,3.4vw,3.3rem); }
.ecosystem-flow {
  display: grid;
  grid-template-columns: 1fr 90px 1.08fr 90px 1fr;
  gap: 12px;
  align-items: center;
}
.ecosystem-stage, .relay-hub {
  min-height: 310px;
  padding: 25px;
  background: white;
  border: 1px solid #ccd7d0;
  border-radius: 16px;
}
.flow-stage-label {
  display: block;
  margin-bottom: 22px;
  color: #718279;
  font-size: .55rem;
  font-weight: 850;
  letter-spacing: .13em;
}
.flow-tools { display: grid; gap: 10px; }
.flow-tools > div {
  min-height: 63px;
  padding: 10px;
  display: grid;
  grid-template-columns: 35px 1fr;
  grid-template-rows: auto auto;
  gap: 1px 10px;
  align-items: center;
  color: #35443c;
  background: #f7f9f7;
  border: 1px solid #dbe2dd;
  border-radius: 8px;
}
.system-mark {
  width: 35px;
  height: 35px;
  grid-row: 1 / -1;
  display: grid;
  place-items: center;
  color: #315d49;
  background: #e7f5ed;
  border-radius: 7px;
  font-size: .45rem;
  font-weight: 900;
}
.flow-tools strong { align-self: end; font-size: .71rem; }
.flow-tools small { align-self: start; color: #7a8981; font-size: .54rem; }
.ecosystem-arrow { text-align: center; color: #668078; }
.ecosystem-arrow span { display: block; white-space: nowrap; font-size: .5rem; font-weight: 750; }
.ecosystem-arrow b { display: block; margin-top: 5px; font-size: 1.4rem; font-weight: 500; }
.relay-hub {
  color: white;
  background: #0c1c2d;
  border-color: #284159;
  text-align: center;
}
.relay-hub > img {
  width: 72px;
  height: auto;
  margin: 0 auto 12px;
  padding: 7px 8px;
  background: var(--paper);
  border-radius: 8px;
}
.relay-hub > small { display: block; color: #7f96aa; font-size: .52rem; font-weight: 850; letter-spacing: .13em; }
.relay-hub > strong { display: block; margin: 8px 0 20px; font-size: 1.05rem; }
.relay-hub ol { margin: 0; padding: 0; display: grid; gap: 8px; list-style: none; text-align: left; }
.relay-hub li { padding: 8px 10px; color: #c3d0dc; background: #132940; border-radius: 7px; font-size: .62rem; }
.relay-hub li span { width: 20px; height: 20px; margin-right: 8px; display: inline-grid; place-items: center; color: #163d2e; background: var(--mint); border-radius: 50%; font-size: .5rem; font-weight: 850; }
.relay-hub > div { margin-top: 15px; display: flex; justify-content: center; gap: 7px; }
.relay-hub > div span { padding: 5px 8px; color: #9fb4c5; border: 1px solid #3a5269; border-radius: 5px; font-size: .5rem; font-weight: 750; }

.faq-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; align-items: center; }
.faq-list { display: grid; gap: 10px; }
.faq-list details {
  background: rgba(255,255,255,.72);
  border: 1px solid var(--line);
  border-radius: 12px;
  transition: background .18s ease, border-color .18s ease;
}
.faq-list details[open] { background: white; border-color: #b9c9bf; }
.faq-list summary {
  min-height: 58px;
  padding: 16px 18px;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  cursor: pointer;
  font-size: .92rem;
  font-weight: 750;
  list-style: none;
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { color: #73827b; font-size: 1.2rem; transition: transform .2s; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { max-width: 720px; padding: 0 42px 17px 18px; color: var(--muted); font-size: .74rem; line-height: 1.6; }

.pilot-section {
  color: white;
  background:
    radial-gradient(circle at 78% 18%, rgba(87,217,154,.12), transparent 26%),
    radial-gradient(circle at 8% 80%, rgba(80,136,255,.11), transparent 25%),
    #0d2030;
  display: grid;
  grid-template-columns: 1fr .86fr;
  gap: 90px;
}
.pilot-intro > p:not(.section-kicker) { max-width: 530px; color: #a9bac8; }
.pilot-expectations { margin-top: 50px; }
.pilot-expectations > div { padding: 16px 0; border-top: 1px solid #2b4053; display: grid; grid-template-columns: 36px 1fr; gap: 15px; }
.pilot-expectations span { color: #688096; font-size: .6rem; font-weight: 800; }
.pilot-expectations p { margin: 0; color: #93a8b9; font-size: .72rem; line-height: 1.6; }
.pilot-expectations strong { color: white; font-size: .78rem; }
.form-card {
  min-height: 590px;
  padding: 38px;
  color: var(--ink);
  background: rgba(255,255,255,.97);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: var(--radius);
  box-shadow: 0 30px 80px rgba(0,0,0,.22), 0 0 0 1px rgba(87,217,154,.08);
}
#pilotForm { scroll-margin-top: 110px; }
.form-card .form-eyebrow { color: #47725e; }
.form-card h3 { margin-bottom: 28px; font-size: 1.65rem; letter-spacing: -.04em; }
.form-card label:not(.consent-row) { display: block; margin: 16px 0 7px; color: #405064; font-size: .68rem; font-weight: 750; }
.form-card input:not([type="checkbox"]), .form-card select {
  width: 100%;
  min-height: 49px;
  padding: 0 13px;
  color: var(--ink);
  background: #f8faf8;
  border: 1px solid #cbd5ce;
  border-radius: 7px;
  outline: none;
  font-size: .8rem;
}
.form-card input:focus, .form-card select:focus { border-color: #449a72; box-shadow: 0 0 0 3px rgba(87,217,154,.16); }
.consent-row { min-height: 44px; margin-top: 18px; display: grid; grid-template-columns: 17px 1fr; gap: 9px; align-items: center; color: #64736b; font-size: .66rem; cursor: pointer; }
.consent-row input { margin: 2px 0 0; accent-color: #1f8b5a; }
.form-submit { width: 100%; margin-top: 18px; justify-content: space-between; border: 0; }
.form-submit:disabled { cursor: wait; opacity: .65; transform: none; }
.form-privacy { margin: 14px 0 0; color: #849089; font-size: .6rem; line-height: 1.5; }
.form-privacy a { color: #3d6753; font-weight: 750; }
.form-error { margin: 12px 0 0; padding: 9px; color: #861f1f; background: #fff0f0; border-radius: 6px; font-size: .68rem; }
.honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; }
.success-panel { padding-top: 35px; }
.success-icon { width: 50px; height: 50px; margin-bottom: 28px; display: grid; place-items: center; color: #125d3b; background: #d8f5e5; border-radius: 50%; font-weight: 900; }
.success-panel p { color: #5e6d66; font-size: .79rem; line-height: 1.7; }
.success-panel .button { width: 100%; margin-top: 15px; }
.text-button { width: 100%; margin-top: 14px; color: #596b62; background: none; border: 0; cursor: pointer; text-decoration: underline; font-size: .68rem; }

.site-footer {
  min-height: 168px;
  padding: 36px max(20px, calc((100% - var(--max)) / 2));
  color: #75837c;
  background: #07111f;
  border-top: 1px solid #1f3247;
  font-size: .62rem;
}
.footer-brand {
  padding: 5px 9px;
  background: var(--paper);
  border-radius: 8px;
}
.footer-brand .brand-logo { width: 64px; }
.footer-main, .footer-meta { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.footer-links { display: flex; flex-wrap: wrap; gap: .65rem 1.1rem; }
.footer-links a { color: #9eb0c0; text-underline-offset: 3px; }
.footer-links a:hover { color: white; }
.footer-meta { margin-top: 25px; padding-top: 18px; border-top: 1px solid #22354a; }
.footer-meta p { margin: 0; color: #718497; }

.mobile-pilot-cta { display: none; }

.legal-page { background: #eef3ef; }
.legal-header {
  min-height: 72px;
  padding: 0 max(20px, calc((100% - 900px) / 2));
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(247,249,247,.95);
  border-bottom: 1px solid var(--line);
}
.legal-header > a:last-child { color: #315a48; font-size: .78rem; font-weight: 750; }
.legal-main {
  width: min(calc(100% - 40px), 900px);
  margin: 0 auto;
  padding: 70px 0 90px;
}
.legal-main h1 { font-size: clamp(2.6rem, 7vw, 4.8rem); }
.legal-meta { color: var(--muted); font-size: .74rem; }
.legal-card {
  margin-top: 35px;
  padding: clamp(24px, 5vw, 54px);
  background: white;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 18px 50px rgba(7,17,31,.07);
}
.legal-card h2 { margin: 2.5rem 0 .7rem; font-size: 1.35rem; letter-spacing: -.025em; }
.legal-card h2:first-child { margin-top: 0; }
.legal-card p, .legal-card li { color: #53645b; font-size: .86rem; line-height: 1.75; }
.legal-card li + li { margin-top: .55rem; }
.legal-note { padding: 16px 18px; color: #5b4b23; background: #fff8e8; border: 1px solid #ead8aa; border-radius: 10px; }
@media (max-width: 1000px) {
  .hero { min-height: auto; grid-template-columns: 1fr; padding: 60px 0 80px; }
  .section { min-height: auto; padding: 80px max(24px, calc((100% - 720px) / 2)); }
  .hero-copy { max-width: 760px; }
  .hero-demo { max-width: 720px; }
  .offer-section { grid-template-columns: 1fr; }
  .offer-intro, .offer-fit-card, .offer-package { max-width: 720px; }
  .offer-package { width: 100%; }
  .pain-timeline { grid-template-columns: 1fr; gap: 8px; }
  .pain-timeline > i { padding: 0; transform: rotate(90deg); justify-self: center; }
  .workflow-board { max-width: 720px; margin: 0 auto; grid-template-columns: 1fr; }
  .workflow-board > .workflow-arrow { transform: rotate(90deg); }
  .node-policy { width: 100%; min-height: 0; }
  .approved-message { grid-template-columns: 1fr; justify-items: center; }
  .approved-message > span { transform: rotate(90deg); }
  .approved-message p { width: min(100%, 420px); }
  .path-comparison { grid-template-columns: 1fr 44px 1fr; }
  .ecosystem-flow { grid-template-columns: 1fr 55px 1.08fr 55px 1fr; }
  .faq-section, .pilot-section, .security-section { grid-template-columns: 1fr; gap: 45px; }
  .security-disclosure { grid-column: auto; }
}

@media (max-width: 840px) {
  .site-header nav { display: none; }
  .path-comparison { grid-template-columns: 1fr; gap: 14px; }
  .comparison-divider { min-height: 40px; }
  .comparison-divider::before { top: 50%; right: 0; bottom: auto; left: 0; width: auto; height: 1px; }
  .ecosystem-flow { grid-template-columns: 1fr; gap: 12px; }
  .ecosystem-stage, .relay-hub { min-height: 0; }
  .flow-tools { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ecosystem-arrow { min-height: 38px; }
  .ecosystem-arrow span { display: none; }
  .ecosystem-arrow b { margin: 0; transform: rotate(90deg); }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 64px; }
  body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  body.legal-page { padding-bottom: 0; }
  .site-header { height: 56px; width: min(calc(100% - 28px), var(--max)); }
  .site-header nav { display: none; }
  .site-header .header-cta { display: none; }
  .hero {
    width: min(calc(100% - 28px), var(--max));
    min-height: calc(100svh - 56px);
    padding: 18px 0 26px;
    gap: 18px;
    align-content: center;
  }
  .hero-copy { width: 100%; }
  h1 { margin-bottom: .65rem; font-size: clamp(2.05rem, 9.6vw, 2.6rem); line-height: .96; overflow-wrap: normal; }
  .hero-subhead { font-size: .78rem; line-height: 1.42; }
  .hero-actions { width: 100%; margin: .8rem 0 0; align-items: flex-start; flex-direction: column; gap: 1rem; }
  .hero-actions .button { width: 100%; justify-content: space-between; }
  .support-line, .hero-proof { display: none; }
  .hero-demo, .demo-grid, .demo-flow { width: 100%; max-width: 100%; }
  .demo-grid { min-height: 0; grid-template-columns: minmax(0, 1fr); }
  .demo-context { display: none; }
  .mockup-label { display: none; }
  .window-bar { height: 31px; }
  .window-bar p { font-size: .53rem; }
  .demo-flow { min-width: 0; padding: 12px; overflow: hidden; }
  .person-row { min-width: 0; grid-template-columns: 38px minmax(0, 1fr) auto; }
  .person-row > div:nth-child(2) { min-width: 0; }
  .person-row strong, .person-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .person-row small { display: none; }
  .proposal-card { margin: 10px 0 8px; padding: 9px 11px; }
  .proposal-card dl { display: none; }
  .policy-gate { margin: 0 0 7px; padding: 7px 9px; }
  .handoff-line { height: 22px; }
  .section { padding: 64px 20px; scroll-margin-top: 0; }
  .section-heading { margin-bottom: 2.4rem; }
  h2 { font-size: 2.55rem; }
  .offer-section { gap: 32px; }
  .offer-fit-card { margin-top: 24px; padding: 18px; }
  .offer-package-header { padding: 20px; }
  .offer-package-header strong { font-size: .9rem; }
  .offer-stack { padding: 0 20px; }
  .offer-stack li { min-height: 88px; }
  .offer-promise { margin: 0 20px; padding: 16px; }
  .offer-capacity { padding: 16px 20px 20px; }
  .principle-row {
    min-height: 116px;
    padding: 22px;
    grid-template-columns: 34px 1fr;
    gap: 14px;
  }
  .principle-outcome { grid-column: 2; }
  .principle-outcome { width: max-content; }
  .architecture-frame { padding: 18px; }
  .architecture-section { min-height: 0; padding-top: 60px; padding-bottom: 60px; }
  .frame-header { flex-direction: column; }
  .workflow-board { padding: 12px; }
  .workflow-boundary {
    padding: 48px 14px 42px;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .workflow-boundary > .workflow-arrow { transform: rotate(90deg); }
  .workflow-node { min-height: 145px; }
  .stays-local-note { position: static; text-align: center; }
  .path-comparison { grid-template-columns: 1fr; gap: 14px; }
  .comparison-divider { min-height: 40px; }
  .comparison-divider::before { top: 50%; right: 0; bottom: auto; left: 0; width: auto; height: 1px; }
  .path-card li { grid-template-columns: 30px minmax(0,1fr); }
  .path-card li > b { grid-column: 2; width: max-content; margin-top: -4px; }
  .ecosystem-section { gap: 28px; }
  .ecosystem-heading { text-align: left; }
  .ecosystem-flow { grid-template-columns: 1fr; gap: 10px; }
  .ecosystem-stage, .relay-hub { min-height: 0; }
  .ecosystem-stage, .relay-hub { padding: 20px; }
  .flow-stage-label { margin-bottom: 14px; }
  .flow-tools { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .flow-tools > div {
    min-height: 90px;
    padding: 9px 4px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    text-align: center;
  }
  .system-mark { flex: 0 0 auto; }
  .flow-tools strong { font-size: .58rem; }
  .flow-tools strong, .flow-tools small { align-self: center; }
  .flow-tools small { font-size: .46rem; }
  .relay-hub > img { width: 64px; height: auto; margin-bottom: 8px; }
  .relay-hub > strong { margin: 6px 0 14px; }
  .relay-hub ol { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .relay-hub li { padding: 8px 4px; text-align: center; font-size: .5rem; }
  .relay-hub li span { margin: 0 auto 6px; display: grid; }
  .relay-hub > div { margin-top: 11px; }
  .ecosystem-arrow { min-height: 38px; }
  .ecosystem-arrow span { display: none; }
  .ecosystem-arrow b { margin: 0; transform: rotate(90deg); }
  .security-section { padding-top: 85px; }
  .security-disclosure { grid-template-columns: 1fr; gap: .5rem; }
  .cost-row { grid-template-columns: 1fr auto; }
  .cost-row .bar-track { grid-column: 1 / -1; grid-row: 2; }
  .faq-section { gap: 10px; }
  .pilot-section { padding-top: 85px; }
  .form-card { min-height: 0; padding: 25px; }
  #pilotForm { scroll-margin-top: 0; }
  .site-footer { min-height: 0; padding-top: 30px; padding-bottom: 30px; }
  .footer-main, .footer-meta { align-items: flex-start; flex-direction: column; gap: 14px; }
  .footer-meta { margin-top: 20px; padding-top: 15px; }
  .mobile-pilot-cta {
    position: fixed;
    z-index: 80;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 76px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: white;
    background: rgba(7,17,31,.96);
    border-top: 1px solid #31475c;
    box-shadow: 0 -12px 36px rgba(7,17,31,.22);
    backdrop-filter: blur(14px);
    transition: transform .2s ease, opacity .2s ease;
  }
  .mobile-pilot-cta.is-form-visible { pointer-events: none; opacity: 0; transform: translateY(100%); }
  .mobile-pilot-cta div { min-width: 0; }
  .mobile-pilot-cta strong, .mobile-pilot-cta div span { display: block; }
  .mobile-pilot-cta strong { font-size: .7rem; }
  .mobile-pilot-cta div span { margin-top: 2px; color: #93a8ba; font-size: .55rem; }
  .mobile-pilot-cta .button { min-height: 48px; flex: 0 0 auto; padding: .72rem .9rem; font-size: .72rem; }
  .legal-header { min-height: 62px; }
  .legal-main { padding: 48px 0 70px; }
  .legal-card { margin-top: 25px; }
}

@media (max-width: 480px) {
  .section { padding-right: 16px; padding-left: 16px; }
  h2 { font-size: 2.2rem; }
  .offer-package-header { align-items: flex-start; flex-direction: column; gap: 10px; }
  .offer-package-header b { align-self: flex-start; }
  .offer-stack li { grid-template-columns: 30px 1fr; gap: 10px; }
  .offer-promise { grid-template-columns: 30px 1fr; gap: 10px; }
  .path-card header, .path-card ol, .path-tags { padding-right: 18px; padding-left: 18px; }
  .faq-list summary { font-size: .8rem; }
  .mobile-pilot-cta div span { display: none; }
}

@media (min-width: 1001px) and (max-height: 1000px) {
  html { scroll-padding-top: 64px; }
  .site-header { height: 64px; }
  .hero { min-height: calc(100svh - 64px); padding: 18px 0 24px; }
  h1 { margin-bottom: .75rem; font-size: clamp(2.55rem, 3.5vw, 3.4rem); }
  .hero-subhead { font-size: .88rem; line-height: 1.5; }
  .hero-actions { margin: .9rem 0 .65rem; }
  .button { min-height: 44px; padding-block: .7rem; }
  .hero-proof { margin-top: .65rem; padding-top: .65rem; }
  .demo-grid { min-height: 400px; }
  .demo-context { padding-top: 44px; }
  .demo-flow { padding-top: 46px; }

  .section {
    min-height: calc(100svh - 64px);
    padding-top: clamp(32px, 5.2vh, 48px);
    padding-bottom: clamp(32px, 5.2vh, 48px);
  }
  .section-heading { margin-bottom: 20px; }
  .section-kicker { margin-bottom: .55rem; }
  h2 { margin-bottom: .75rem; font-size: clamp(2.2rem, 3.25vw, 3.3rem); }
  .section-heading > p:last-child { font-size: .88rem; line-height: 1.5; }

  .offer-section { gap: clamp(36px, 5vw, 68px); }
  .offer-intro > p:not(.section-kicker) { font-size: .84rem; line-height: 1.5; }
  .offer-fit-card { margin-top: 18px; padding: 15px 18px; }
  .offer-fit-card strong { font-size: .78rem; }
  .offer-fit-card p { margin-top: 5px; font-size: .62rem; }
  .offer-package-header { padding: 15px 20px; }
  .offer-package-header strong { font-size: .9rem; }
  .offer-stack { padding: 0 20px; }
  .offer-stack li { min-height: 60px; padding: 8px 0; }
  .offer-stack strong { font-size: .69rem; }
  .offer-stack p { font-size: .56rem; }
  .offer-promise { margin: 0 20px; padding: 12px 14px; }
  .offer-promise p { font-size: .56rem; line-height: 1.45; }
  .offer-capacity { padding: 11px 20px 14px; font-size: .55rem; }

  .principle-row { min-height: 78px; padding: 16px 26px; }
  .principle-label { margin-bottom: 3px; }
  .principle-row h3 { font-size: .9rem; }

  .architecture-frame { padding: 20px; }
  .frame-header { margin-bottom: 14px; }
  .architecture-frame img { max-height: calc(100svh - 180px); object-fit: contain; }

  .how-section .section-heading { margin-bottom: 18px; }
  .workflow-board { padding: 12px; }
  .workflow-boundary { min-height: 220px; padding-top: 42px; padding-bottom: 40px; }
  .workflow-node { min-height: 138px; padding: 14px 11px; }
  .workflow-node strong { margin-top: 29px; }
  .node-policy { min-height: 205px; }
  .node-policy ul { margin: 10px 0 8px; gap: 5px; }
  .workflow-caption { margin-top: 10px; }

  .path-card header { min-height: 72px; padding: 14px 20px; }
  .path-card header span { margin-bottom: 6px; }
  .path-card header strong { font-size: 1rem; }
  .path-card ol { padding: 4px 20px; }
  .path-card li { min-height: 58px; padding: 8px 0; }
  .path-card li div strong { font-size: .66rem; }
  .path-card li div small { margin-top: 2px; font-size: .55rem; }
  .path-tags { padding: 9px 20px 11px; }
  .assumption-note { margin-top: .6rem; }

  .security-section { padding-top: clamp(30px, 4.8vh, 44px); padding-bottom: clamp(28px, 4.4vh, 40px); gap: 18px 40px; }
  .security-lede { font-size: .86rem; line-height: 1.5; }
  .security-list { margin-top: 18px; }
  .security-list li { padding: 10px 0; gap: 12px; }
  .security-list strong { margin-bottom: 3px; font-size: .75rem; }
  .security-list p { font-size: .65rem; line-height: 1.45; }
  .security-art img { max-height: 445px; }
  .security-disclosure { padding-top: 10px; grid-template-columns: 210px 1fr; gap: 1.25rem; }
  .security-disclosure p { font-size: .62rem; }

  .economics-card { padding: 24px; }
  .economics-label { margin-bottom: 18px; padding-bottom: 14px; }
  .cost-row { margin: 16px 0; }
  .economics-card > p { margin-top: 18px; padding-top: 13px; }

  .ecosystem-section { gap: 22px; }
  .ecosystem-stage, .relay-hub { min-height: 250px; padding: 18px; }
  .flow-stage-label { margin-bottom: 14px; }
  .flow-tools { gap: 7px; }
  .flow-tools > div { min-height: 54px; padding: 7px; }
  .relay-hub > img { width: 60px; margin-bottom: 7px; }
  .relay-hub > strong { margin: 5px 0 12px; }
  .relay-hub ol { gap: 5px; }
  .relay-hub li { padding: 6px 8px; }
  .relay-hub > div { margin-top: 9px; }

  .faq-section { gap: 40px; }
  .faq-section .section-heading { margin-bottom: 0; }
  .faq-list { gap: 6px; }
  .faq-list summary { min-height: 44px; padding: 10px 14px; font-size: .78rem; }
  .faq-list details p { padding: 0 36px 10px 14px; font-size: .65rem; line-height: 1.45; }

  .pilot-section { gap: 52px; }
  .pilot-expectations { margin-top: 24px; }
  .pilot-expectations > div { padding: 11px 0; }
  .form-card { min-height: 0; padding: 26px; }
  .form-card h3 { margin-bottom: 18px; font-size: 1.45rem; }
  .form-card label:not(.consent-row) { margin-top: 11px; }
  .form-card input:not([type="checkbox"]), .form-card select { min-height: 45px; }
  .consent-row { margin-top: 12px; }
  .form-submit { margin-top: 12px; }
  .form-privacy { margin-top: 9px; }
}

@media (min-width: 1001px) and (max-width: 1100px) {
  .workflow-board {
    grid-template-columns: minmax(270px, 1.5fr) 14px minmax(140px, .7fr) minmax(150px, .75fr) minmax(270px, 1.5fr);
    gap: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}