:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #F5F5F1;
  color: #0B0B0C;
  --void: #080808;
  --paper: #F5F5F1;
  --ink: #0B0B0C;
  --muted: #6D6D69;
  --quiet: #9A9A94;
  --line: rgba(11,11,12,.18);
  --violet: var(--ink);
  --violet-light: var(--paper);
  --night: var(--void);
  --ease-out: cubic-bezier(.23,1,.32,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  background: var(--paper);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-underline-offset: 4px; }
button, summary { font: inherit; }
.wrap { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 100; top: 12px; left: 12px; padding: 10px 14px; background: var(--ink); color: white; transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }
a:focus-visible, summary:focus-visible { outline: 2px solid var(--violet); outline-offset: 4px; }

.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 84px;
  border-bottom: 1px solid var(--line);
}
.wordmark { color: var(--ink); text-decoration: none; }
.brand-lockup { display: inline-flex; align-items: center; gap: 11px; }
.brand-lockup img { width: 34px; height: 34px; flex: none; }
.brand-name { display: inline-flex; align-items: baseline; gap: 8px; line-height: 1; }
.brand-name b { font-size: 14px; letter-spacing: .14em; }
.brand-name small { color: var(--quiet); font-size: 9px; font-weight: 700; letter-spacing: .28em; }
.site-header nav, .site-footer nav { display: flex; align-items: center; gap: 30px; font-size: 13px; }
.site-header nav a, .site-footer nav a { text-decoration: none; }
.nav-channel { padding: 10px 14px; border: 1px solid var(--line); border-radius: 999px; }
.nav-channel--cabinet { background: var(--ink); color: #fff; border-color: var(--ink); font-weight: 700; }
.nav-channel--cabinet:hover { background: var(--ink); color: #fff; opacity: .92; }
.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(330px, .75fr);
  min-height: 760px;
  padding-top: clamp(82px, 11vw, 140px);
}
.hero-copy { position: relative; z-index: 1; align-self: start; }
.eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 24px;
  color: var(--violet);
  font-size: 11px;
  font-weight: 780;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.eyebrow > span { width: 22px; height: 1px; background: currentColor; }
.hero h1 {
  max-width: 840px;
  margin: 0;
  font-size: clamp(61px, 8.2vw, 112px);
  font-weight: 760;
  line-height: .88;
  letter-spacing: -.075em;
}
.lead {
  max-width: 650px;
  margin: 38px 0 34px;
  color: var(--muted);
  font-size: clamp(17px, 1.8vw, 21px);
  line-height: 1.55;
}
.actions { display: flex; flex-wrap: wrap; gap: 22px 28px; align-items: center; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
  gap: 28px;
  padding: 0 20px;
  border-radius: 3px;
  font-size: 14px;
  font-weight: 760;
  text-decoration: none;
  transition: transform 150ms var(--ease-out), background-color 150ms ease, color 150ms ease;
}
.button span { font-size: 18px; font-weight: 400; }
.button--primary { background: var(--ink); color: white; box-shadow: 12px 12px 0 rgba(11,11,12,.12); }
.button--light { background: var(--paper); color: var(--night); }
.button:active { transform: scale(.975); }
.text-link { display: inline-flex; gap: 10px; align-items: center; color: #45454c; font-size: 13px; font-weight: 680; text-decoration: none; }
.text-link span { color: var(--violet); font-size: 17px; }

.gateway-stage { align-self: start; width: 360px; height: 360px; margin: 10px 0 0 auto; overflow: hidden; border-radius: 50%; background: var(--void); }
.gateway-stage svg { display: block; width: 100%; height: 100%; fill: var(--paper); }
.gateway-half, .gateway-axis, .gateway-word { transform-box: fill-box; transform-origin: center; animation-duration: 36.4s; animation-timing-function: cubic-bezier(.23,1,.32,1); animation-iteration-count: infinite; }
.gateway-half--left { animation-name: gateway-left; }
.gateway-half--right { animation-name: gateway-right; }
.gateway-axis { animation-name: gateway-axis; }
.gateway-word { animation-name: gateway-word; }
.gateway-word text { fill: var(--paper); font-size: 72px; font-weight: 850; letter-spacing: .13em; }
.gateway-word tspan { fill: var(--quiet); font-size: 46px; font-weight: 650; letter-spacing: .25em; }
@keyframes gateway-left {
  0%, 1.2% { opacity: 0; transform: translateX(-42%); }
  1.8% { opacity: 1; }
  6.2%, 92% { opacity: 1; transform: translateX(0); }
  100% { opacity: 0; transform: translateX(-3%); }
}
@keyframes gateway-right {
  0%, 1.2% { opacity: 0; transform: translateX(42%); }
  1.8% { opacity: 1; }
  6.2%, 92% { opacity: 1; transform: translateX(0); }
  100% { opacity: 0; transform: translateX(3%); }
}
@keyframes gateway-axis {
  0%, 8.3% { opacity: 0; transform: scaleY(0); }
  10.6%, 92% { opacity: 1; transform: scaleY(1); }
  100% { opacity: 0; transform: scaleY(.85); }
}
@keyframes gateway-word {
  0%, 10% { opacity: 0; transform: translateY(8px); }
  13.3%, 92% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(3px); }
}
.launch-note {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 110px minmax(0, 640px);
  gap: 24px;
  align-self: end;
  padding: 26px 0;
  border-top: 1px solid var(--line);
}
.note-index { color: var(--violet); font: 700 11px/1 ui-monospace, monospace; }
.launch-note strong { display: block; margin-bottom: 7px; font-size: 15px; }
.launch-note p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }

.manifesto { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.manifesto-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.manifesto p { position: relative; margin: 0; padding: 25px 24px 25px 0; font-size: 13px; font-weight: 680; }
.manifesto p + p { padding-left: 24px; border-left: 1px solid var(--line); }
.manifesto p::before { content: "•"; margin-right: 10px; color: var(--violet); }

.process { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(50px, 9vw, 130px); padding-top: 130px; padding-bottom: 140px; }
.section-heading h2, .devices h2, .principle h2, .answers h2, .final-cta h2, .legal h1 {
  margin: 0;
  font-size: clamp(46px, 6.4vw, 82px);
  line-height: .96;
  letter-spacing: -.065em;
}
.section-heading > p:last-child { max-width: 440px; margin: 26px 0 0; color: var(--muted); line-height: 1.65; }
.process-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.process-list li {
  display: grid;
  grid-template-columns: 46px 1fr auto;
  gap: 18px;
  align-items: start;
  padding: 30px 0;
  border-bottom: 1px solid var(--line);
}
.step-number { padding-top: 5px; color: var(--violet); font: 700 11px/1 ui-monospace, monospace; }
.process-list h3 { margin: 0 0 8px; font-size: 22px; letter-spacing: -.035em; }
.process-list p { max-width: 480px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.step-mark { color: var(--violet); font-size: 20px; }

.devices { position: relative; overflow: hidden; padding: 120px 0; background: var(--night); color: #f5f5fa; }
.devices::before { content: ""; position: absolute; top: -200px; right: -160px; width: 520px; height: 520px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: inset 0 0 0 80px rgba(255,255,255,.018), inset 0 0 0 160px rgba(255,255,255,.018); }
.devices-inner { position: relative; display: grid; grid-template-columns: 1fr .9fr; gap: 70px 110px; }
.eyebrow--light { color: var(--violet-light); }
.devices ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.16); }
.devices li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.16); font-size: 20px; letter-spacing: -.025em; }
.devices li span { padding-top: 5px; color: var(--violet-light); font: 700 10px/1 ui-monospace, monospace; }
.devices-note { grid-column: 2; margin: -36px 0 0; color: #9e9eaa; font-size: 13px; line-height: 1.65; }

.principle { display: grid; grid-template-columns: .55fr 1.45fr; gap: 50px; padding-top: 150px; padding-bottom: 150px; }
.principle-kicker { margin: 10px 0 0; color: var(--violet); font-size: 12px; font-weight: 760; text-transform: uppercase; letter-spacing: .13em; }
.principle h2 { max-width: 830px; }
.principle-copy { grid-column: 2; display: grid; grid-template-columns: 1fr auto; gap: 36px; align-items: end; padding-top: 38px; border-top: 1px solid var(--line); }
.principle-copy p { max-width: 570px; margin: 0; color: var(--muted); line-height: 1.7; }

.answers, .tariffs { display: grid; grid-template-columns: .55fr 1.45fr; gap: 50px; padding-top: 40px; padding-bottom: 140px; }
.section-heading--compact h2 { font-size: clamp(38px, 5vw, 62px); }
.answer-list { border-top: 1px solid var(--line); }
details { border-bottom: 1px solid var(--line); }
summary { position: relative; display: flex; justify-content: space-between; gap: 30px; padding: 24px 0; list-style: none; font-size: 18px; font-weight: 690; letter-spacing: -.02em; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
summary span { position: relative; flex: 0 0 22px; width: 22px; height: 22px; }
summary span::before, summary span::after { content: ""; position: absolute; top: 10px; left: 3px; width: 16px; height: 1px; background: var(--violet); transition: transform 180ms var(--ease-out); }
summary span::after { transform: rotate(90deg); }
details[open] summary span::after { transform: rotate(0); }
details > p { max-width: 680px; margin: -5px 0 26px; color: var(--muted); font-size: 14px; line-height: 1.65; }

.tariffs > div > p { margin: 0 0 18px; color: var(--muted); line-height: 1.65; }
.tariff-list { margin: 0; border-top: 1px solid var(--line); }
.tariff-list > div { padding: 18px 0; border-bottom: 1px solid var(--line); }
.tariff-list dt { margin-bottom: 7px; font-size: 18px; font-weight: 690; letter-spacing: -.02em; }
.tariff-list dd { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }

.final-cta { position: relative; overflow: hidden; padding: 128px 0; background: var(--ink); color: white; }
.final-cta::after { content: "H"; position: absolute; right: -4vw; bottom: -16vw; color: rgba(255,255,255,.07); font-size: min(62vw, 720px); font-weight: 850; line-height: .8; letter-spacing: -.1em; }
.final-inner { position: relative; z-index: 1; }
.final-cta h2 { max-width: 820px; font-size: clamp(58px, 8vw, 104px); }
.final-cta p:not(.eyebrow) { max-width: 590px; margin: 34px 0; color: rgba(255,255,255,.72); font-size: 17px; line-height: 1.6; }
.final-cta .eyebrow { color: #ded8ff; }

.site-footer { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; min-height: 112px; }
.site-footer p { color: var(--muted); font-size: 12px; }
.site-footer nav { justify-self: end; }

.legal { max-width: 820px; padding-top: 90px; padding-bottom: 110px; }
.legal h1 { margin-bottom: 38px; font-size: clamp(44px, 7vw, 76px); }
.legal h2 { margin: 44px 0 12px; font-size: 24px; letter-spacing: -.035em; }
.legal p { color: var(--muted); line-height: 1.72; }
.legal strong { color: var(--ink); }
.legal + .site-footer { border-top: 1px solid var(--line); }
body > footer:not(.site-footer) { display: flex; justify-content: space-between; gap: 24px; padding-top: 28px; padding-bottom: 34px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
body > footer:not(.site-footer) nav { display: flex; gap: 24px; }

@media (hover: hover) and (pointer: fine) {
  .button:hover { transform: translateY(-3px); }
  .button--primary:hover { background: var(--violet); }
  .site-header a:hover, .site-footer a:hover, .text-link:hover { color: var(--violet); }
  summary:hover { color: var(--violet); }
}

@media (max-width: 880px) {
  .hero { grid-template-columns: 1fr; min-height: auto; padding-bottom: 40px; }
  .gateway-stage { width: min(310px, 78vw); height: min(310px, 78vw); margin: 82px auto; }
  .launch-note { grid-template-columns: 70px 1fr; }
  .process, .principle, .answers, .tariffs { grid-template-columns: 1fr; }
  .process { gap: 55px; padding-top: 100px; padding-bottom: 100px; }
  .devices-inner { grid-template-columns: 1fr 1fr; gap: 60px; }
  .principle-copy { grid-column: 1; }
  .principle { gap: 26px; padding-top: 110px; padding-bottom: 110px; }
  .principle-copy { grid-template-columns: 1fr; }
  .answers, .tariffs { gap: 40px; }
  .site-footer { grid-template-columns: 1fr auto; }
  .site-footer p { display: none; }
}

@media (max-width: 640px) {
  .wrap { width: min(100% - 30px, 1180px); }
  .site-header { min-height: 72px; }
  .site-header nav a:not(.nav-channel) { display: none; }
  .nav-channel { padding: 9px 12px; }
  .hero { padding-top: 70px; }
  .hero h1 { font-size: clamp(46px, 13vw, 58px); }
  .lead { margin-top: 28px; }
  .actions { align-items: stretch; }
  .button--primary { width: 100%; }
  .text-link { padding: 10px 0; }
  .gateway-stage { margin-top: 72px; margin-bottom: 72px; }
  .launch-note { grid-template-columns: 1fr; gap: 10px; }
  .manifesto-grid { grid-template-columns: 1fr; }
  .manifesto p, .manifesto p + p { padding: 16px 0; border-left: 0; border-bottom: 1px solid var(--line); }
  .manifesto p:last-child { border-bottom: 0; }
  .process { padding-top: 82px; padding-bottom: 90px; }
  .section-heading h2, .devices h2, .principle h2, .final-cta h2 { font-size: clamp(46px, 14vw, 66px); }
  .process-list li { grid-template-columns: 34px 1fr; padding: 24px 0; }
  .step-mark { display: none; }
  .devices { padding: 84px 0; }
  .devices-inner { grid-template-columns: 1fr; gap: 48px; }
  .devices-note { grid-column: 1; margin: -18px 0 0; }
  .principle { padding-top: 88px; padding-bottom: 92px; }
  .answers, .tariffs { padding-bottom: 96px; }
  summary { font-size: 16px; }
  .final-cta { padding: 90px 0; }
  .site-footer { grid-template-columns: 1fr; padding: 34px 0; }
  .site-footer nav { justify-self: start; flex-wrap: wrap; gap: 14px 22px; }
  body > footer:not(.site-footer) { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .button, summary span::before, summary span::after { transition: color 150ms ease, background-color 150ms ease; }
  .button:active, .button:hover { transform: none; }
  .gateway-half, .gateway-axis, .gateway-word { animation: none; opacity: 1; transform: none; }
}