:root {
  --ink: #03182a;
  --ink-2: #07283b;
  --deep: #02111e;
  --sky: #57d9ef;
  --cyan: #14c7df;
  --mint: #4cf2c2;
  --blue: #1689f8;
  --violet: #875dff;
  --paper: #f0ede3;
  --paper-2: #e6e1d4;
  --white: #ffffff;
  --text: #0b2232;
  --muted: #6e7d86;
  --line: rgba(3,24,42,.16);
  --line-dark: rgba(164,224,237,.2);
  --shell: min(1240px, calc(100% - 64px));
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: "DM Sans", sans-serif; color: var(--text); background: var(--paper); overflow-x: hidden; }
a { color: inherit; }
.skip-link { position: fixed; left: 16px; top: -60px; background: white; color: #111; padding: 12px 16px; z-index: 1000; }
.skip-link:focus { top: 16px; }
.cursor-glow { position: fixed; width: 320px; height: 320px; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, rgba(87,217,239,.12), transparent 66%); transform: translate(-50%,-50%); z-index: 2; mix-blend-mode: screen; }
.site-header { position: fixed; inset: 0 0 auto; z-index: 100; background: rgba(2,17,30,.74); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(165,224,235,.12); }
.nav-wrap { width: var(--shell); height: 86px; margin: auto; display: flex; align-items: center; justify-content: space-between; }
.wordmark { display: inline-flex; align-items: center; gap: 13px; text-decoration: none; color: white; }
.wordmark-symbol { width: 38px; height: 38px; border: 1px solid rgba(87,217,239,.4); border-radius: 50%; position: relative; display: block; box-shadow: 0 0 28px rgba(20,199,223,.18); }
.wordmark-symbol i { position: absolute; width: 14px; height: 14px; border: 2px solid var(--sky); border-radius: 50%; top: 10px; }
.wordmark-symbol i:first-child { left: 7px; }
.wordmark-symbol i:last-child { right: 7px; border-color: #fff; }
.wordmark-text { font-family: "Manrope", sans-serif; font-weight: 800; letter-spacing: .09em; font-size: .9rem; }
.wordmark-text span { color: var(--sky); }
.primary-nav { display: flex; align-items: center; gap: 30px; }
.primary-nav a { color: rgba(255,255,255,.78); text-decoration: none; font-size: .9rem; font-weight: 600; }
.primary-nav a:hover { color: white; }
.nav-contact { border: 1px solid rgba(87,217,239,.45); border-radius: 999px; padding: 12px 19px; }
.menu-button { display: none; background: none; border: 0; color: white; align-items: center; gap: 6px; cursor: pointer; }
.menu-button span { width: 4px; height: 4px; border-radius: 50%; background: var(--sky); }
.menu-button b { margin-left: 6px; font-size: .8rem; }
.chapter { position: relative; }
.chapter-shell, .hero-shell { width: var(--shell); margin: auto; position: relative; z-index: 3; }
.hero { min-height: 100svh; background: linear-gradient(135deg, #05283d 0%, #031725 48%, #020d17 100%); color: white; display: grid; align-items: center; overflow: hidden; padding: 135px 0 80px; }
.hero::after { content: attr(data-chapter); position: absolute; right: -2vw; bottom: -12vw; font-family: "Manrope"; font-size: clamp(18rem, 32vw, 36rem); font-weight: 800; line-height: .7; color: rgba(255,255,255,.018); }
.hero-shell { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 40px; }
.hero-copy { max-width: 720px; }
.kicker { color: var(--sky); font-weight: 700; text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; margin-bottom: 28px; }
h1,h2,h3 { font-family: "Manrope", sans-serif; margin-top: 0; }
h1 { font-size: clamp(4.2rem, 7.2vw, 7.8rem); line-height: .91; letter-spacing: -.067em; margin-bottom: 34px; }
h1 em,h2 em { font-style: normal; color: var(--sky); }
.hero-intro { max-width: 670px; color: rgba(255,255,255,.7); font-size: 1.18rem; line-height: 1.7; }
.hero-links { display: flex; align-items: center; gap: 32px; margin-top: 38px; }
.round-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-width: 185px; padding: 8px 8px 8px 22px; border-radius: 999px; border: 1px solid rgba(87,217,239,.45); text-decoration: none; font-weight: 700; }
.round-link b { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--sky); color: var(--ink); font-size: 1.2rem; }
.round-link.dark { border-color: rgba(3,24,42,.3); }
.text-link { text-decoration: none; color: rgba(255,255,255,.8); font-weight: 600; }
.text-link span { color: var(--sky); margin-left: 8px; }
.hero-stage { min-height: 650px; position: relative; display: grid; place-items: center; }
.stage-ring { position: absolute; border: 1px solid rgba(87,217,239,.17); border-radius: 50%; animation: rotate 25s linear infinite; }
.ring-one { width: 500px; height: 500px; }
.ring-two { width: 350px; height: 350px; border-style: dashed; animation-direction: reverse; animation-duration: 18s; }
.stage-ring::before,.stage-ring::after { content: ""; position: absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--sky); box-shadow: 0 0 18px var(--sky); }
.stage-ring::before { left: 5%; top: 30%; }
.stage-ring::after { right: 10%; bottom: 20%; }
.stage-center { width: 225px; height: 225px; border-radius: 50%; border: 1px solid rgba(87,217,239,.45); background: rgba(4,30,47,.78); backdrop-filter: blur(18px); box-shadow: 0 0 90px rgba(20,199,223,.16), inset 0 0 45px rgba(87,217,239,.07); display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 4px; position: relative; z-index: 2; }
.stage-label { color: var(--sky); font-size: .75rem; letter-spacing: .34em; font-weight: 800; margin-bottom: 13px; }
.stage-center strong { font-size: 1rem; }
.signal-card { position: absolute; min-width: 220px; padding: 16px 18px; border: 1px solid rgba(87,217,239,.2); background: rgba(4,31,48,.78); backdrop-filter: blur(14px); border-radius: 7px; box-shadow: 0 18px 45px rgba(0,0,0,.18); animation: float 5s ease-in-out infinite; z-index: 4; }
.signal-card span { display: block; color: var(--sky); text-transform: uppercase; letter-spacing: .1em; font-size: .64rem; margin-bottom: 7px; }
.signal-card b { font-size: .88rem; }
.signal-a { left: -5%; top: 22%; }
.signal-b { right: -4%; top: 32%; animation-delay: -1.5s; }
.signal-c { left: 4%; bottom: 14%; animation-delay: -2.5s; }
.signal-d { right: 7%; bottom: 17%; min-width: 130px; animation-delay: -3.5s; }
.hero-grid-lines { position: absolute; inset: 0; background-image: linear-gradient(rgba(87,217,239,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(87,217,239,.035) 1px, transparent 1px); background-size: 80px 80px; mask-image: linear-gradient(to bottom, black, transparent 88%); }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(4px); }
.orb-one { width: 650px; height: 650px; top: -260px; right: -180px; background: radial-gradient(circle, rgba(40,142,246,.24), transparent 68%); }
.orb-two { width: 500px; height: 500px; bottom: -290px; left: 25%; background: radial-gradient(circle, rgba(135,93,255,.18), transparent 68%); }
.scroll-cue { position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%); color: rgba(255,255,255,.6); text-decoration: none; display: flex; align-items: center; gap: 13px; text-transform: uppercase; letter-spacing: .16em; font-size: .65rem; z-index: 4; }
.scroll-cue i { width: 45px; height: 1px; background: var(--sky); position: relative; }
.scroll-cue i::after { content: ""; width: 7px; height: 7px; border-right: 1px solid var(--sky); border-bottom: 1px solid var(--sky); transform: rotate(-45deg); position: absolute; right: 0; top: -3px; }
.statement { padding: 150px 0 110px; background: var(--paper); overflow: hidden; }
.statement-grid { display: grid; grid-template-columns: .28fr .72fr; gap: 75px; }
.section-marker { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); padding-top: 14px; color: var(--ink); text-transform: uppercase; letter-spacing: .12em; font-size: .7rem; font-weight: 800; }
.section-marker b { color: var(--cyan); }
.section-marker.light { color: white; border-color: var(--line-dark); }
.statement h2,.focus h2,.product-story h2,.values h2,.architecture h2,.founder h2,.ask h2 { font-size: clamp(3.3rem, 6vw, 6.6rem); line-height: .96; letter-spacing: -.06em; margin-bottom: 35px; }
.statement h2 em,.product-story h2 em,.architecture h2 em { color: #0f8ca9; }
.statement-copy p { font-size: 1.18rem; line-height: 1.8; max-width: 810px; color: #4c5d66; }
.moving-words { margin-top: 100px; display: flex; width: max-content; font-family: "Manrope"; font-size: clamp(4rem, 8vw, 9rem); font-weight: 800; letter-spacing: -.05em; color: rgba(3,24,42,.06); white-space: nowrap; animation: marquee 30s linear infinite; }
.moving-words span { padding-right: 30px; }
.focus { background: #082f42; color: white; padding: 145px 0; }
.focus-heading { display: grid; grid-template-columns: .9fr .55fr; gap: 90px; align-items: end; margin: 70px 0 80px; }
.focus-heading p { color: rgba(255,255,255,.66); line-height: 1.8; font-size: 1.08rem; }
.focus-list { border-top: 1px solid var(--line-dark); }
.focus-row { min-height: 170px; display: grid; grid-template-columns: 80px .42fr .58fr 45px; gap: 30px; align-items: center; border-bottom: 1px solid var(--line-dark); position: relative; transition: padding .3s ease, background .3s ease; }
.focus-row:hover { padding-left: 18px; background: rgba(255,255,255,.035); }
.focus-number { color: var(--sky); font-size: .72rem; }
.focus-row h3 { font-size: clamp(2.4rem, 4vw, 4.4rem); letter-spacing: -.06em; margin: 0; }
.focus-row p { color: rgba(255,255,255,.64); line-height: 1.65; }
.focus-icon { color: var(--sky); font-size: 1.7rem; }
.product-story { padding: 150px 0; background: var(--paper); overflow: hidden; }
.product-backdrop { position: absolute; width: 800px; height: 800px; right: -220px; top: 50%; transform: translateY(-50%); background: radial-gradient(circle, rgba(22,137,248,.15), transparent 67%); border-radius: 50%; }
.product-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }
.product-copy p { color: #4f6069; line-height: 1.8; font-size: 1.07rem; }
.product-copy .round-link { margin-top: 25px; }
.product-console { border: 1px solid rgba(3,24,42,.19); background: #061b2c; color: white; border-radius: 7px; padding: 14px; box-shadow: 0 35px 80px rgba(7,35,54,.22); transform: rotate(1deg); }
.console-top { height: 45px; display: flex; align-items: center; gap: 7px; border-bottom: 1px solid rgba(255,255,255,.12); color: var(--sky); font-family: monospace; font-size: .72rem; }
.console-top span { margin-right: auto; }
.console-top i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.28); }
.console-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 12px; }
.console-grid article { background: rgba(255,255,255,.045); border: 1px solid rgba(87,217,239,.16); border-radius: 4px; padding: 22px; }
.console-brief { grid-column: 1/-1; }
.console-brief small,.metric-card span { color: var(--sky); text-transform: uppercase; letter-spacing: .1em; font-size: .65rem; }
.console-brief h3 { font-size: 2rem; margin: 12px 0 20px; }
.console-brief ul { padding: 0; list-style: none; color: rgba(255,255,255,.72); line-height: 1.7; }
.metric-card { min-height: 145px; display: flex; flex-direction: column; justify-content: space-between; }
.metric-card b { font-size: 2rem; }
.metric-card small { color: rgba(255,255,255,.5); }
.metric-card.wide { grid-column: 1/-1; }
.metric-card.wide b { font-size: 1.3rem; line-height: 1.45; }
.values { padding: 145px 0; background: #061e30; color: white; }
.values-layout { display: grid; grid-template-columns: .28fr .72fr; column-gap: 75px; }
.values-intro { grid-column: 2; max-width: 900px; }
.value-stack { grid-column: 2; margin-top: 45px; border-top: 1px solid var(--line-dark); }
.value-stack article { display: grid; grid-template-columns: 80px 1fr; gap: 24px; padding: 31px 0; border-bottom: 1px solid var(--line-dark); }
.value-stack span { color: var(--sky); font-size: .7rem; }
.value-stack h3 { font-size: 1.6rem; margin-bottom: 8px; }
.value-stack p { color: rgba(255,255,255,.62); margin: 0; max-width: 720px; line-height: 1.65; }
.architecture { padding: 145px 0; background: #e8e3d8; }
.architecture-head { display: grid; grid-template-columns: .28fr .72fr; column-gap: 75px; }
.architecture-head h2,.architecture-head p { grid-column: 2; }
.architecture-head p { max-width: 730px; color: #52616a; font-size: 1.1rem; line-height: 1.8; }
.architecture-map { position: relative; margin: 85px 0 0 28%; }
.architecture-spine { position: absolute; left: 28px; top: 40px; bottom: 40px; width: 1px; background: linear-gradient(var(--cyan), rgba(3,24,42,.18)); }
.architecture-map article { display: grid; grid-template-columns: 56px .75fr .25fr; gap: 25px; align-items: start; padding: 30px 0; border-bottom: 1px solid rgba(3,24,42,.16); position: relative; }
.architecture-map article > span { width: 56px; height: 56px; border-radius: 50%; border: 1px solid rgba(3,24,42,.22); display: grid; place-items: center; background: var(--paper); position: relative; z-index: 2; color: #0f8ca9; font-weight: 700; }
.architecture-map h3 { font-size: 1.7rem; margin-bottom: 8px; }
.architecture-map p { color: #56666f; line-height: 1.65; margin: 0; }
.architecture-map article > b { text-align: right; color: #0f8ca9; font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; }
.founder { padding: 145px 0; background: #0a3143; color: white; }
.founder-layout { display: grid; grid-template-columns: .42fr .58fr; gap: 100px; }
.founder-sticky { position: sticky; top: 125px; align-self: start; }
.founder-sticky h2 { margin-top: 70px; }
.founder-sticky > p { color: rgba(255,255,255,.65); font-size: 1.12rem; line-height: 1.8; }
.founder-facts { margin-top: 35px; display: flex; flex-direction: column; gap: 9px; color: var(--sky); font-size: .86rem; }
.interview { border-top: 1px solid var(--line-dark); }
.question { display: grid; grid-template-columns: 50px 1fr; gap: 28px; padding: 35px 0; border-bottom: 1px solid var(--line-dark); }
.question > span { color: var(--sky); font-family: "Manrope"; font-weight: 800; font-size: 1.3rem; }
.question h3 { font-size: 1.6rem; margin-bottom: 14px; }
.question p { color: rgba(255,255,255,.64); line-height: 1.75; margin: 0; }
.ask { padding: 145px 0; background: var(--paper); overflow: hidden; }
.ask-glow { position: absolute; width: 700px; height: 700px; left: -300px; top: -250px; border-radius: 50%; background: radial-gradient(circle, rgba(20,199,223,.16), transparent 66%); }
.ask-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 95px; }
.ask-copy h2 { margin-top: 70px; }
.ask-copy > p { color: #52626b; font-size: 1.1rem; line-height: 1.75; }
.ask-copy > a { color: #0b829d; text-decoration: none; font-weight: 800; }
.ask-form { border-top: 1px solid var(--line); padding-top: 22px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.ask-form label { display: grid; gap: 10px; margin-bottom: 23px; color: #30424d; font-weight: 700; font-size: .83rem; }
.ask-form label small { font-weight: 400; color: #72818a; }
.ask-form input,.ask-form textarea { width: 100%; border: 0; border-bottom: 1px solid rgba(3,24,42,.25); background: transparent; padding: 11px 0; outline: none; color: var(--ink); font: inherit; border-radius: 0; }
.ask-form input:focus,.ask-form textarea:focus { border-color: #0f8ca9; }
.form-submit { display: flex; align-items: center; justify-content: space-between; width: 205px; border-radius: 999px; border: 1px solid rgba(3,24,42,.28); background: none; padding: 7px 7px 7px 22px; font: inherit; font-weight: 800; color: var(--ink); cursor: pointer; }
.form-submit b { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; }
.form-note { color: #7a878e; font-size: .72rem; line-height: 1.55; }
.site-footer { background: #02111e; color: white; padding: 70px 0 25px; }
.footer-shell { width: var(--shell); margin: auto; display: grid; grid-template-columns: .4fr .4fr .2fr; gap: 50px; align-items: center; }
.footer-shell p { color: rgba(255,255,255,.6); }
.footer-links { display: flex; justify-content: flex-end; gap: 22px; }
.footer-links a { color: rgba(255,255,255,.75); text-decoration: none; }
.footer-bottom { width: var(--shell); margin: 50px auto 0; border-top: 1px solid rgba(255,255,255,.12); padding-top: 20px; display: flex; justify-content: space-between; color: rgba(255,255,255,.38); font-size: .73rem; }
.reveal { opacity: 0; transform: translateY(34px); transition: opacity .9s ease, transform .9s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .14s; }
@keyframes rotate { to { transform: rotate(360deg); } }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes marquee { to { transform: translateX(-50%); } }
@media (max-width: 1050px) {
  :root { --shell: min(100% - 38px, 1240px); }
  .menu-button { display: flex; }
  .primary-nav { position: fixed; top: 86px; right: 18px; left: 18px; background: rgba(2,17,30,.97); border: 1px solid rgba(87,217,239,.18); padding: 24px; display: none; flex-direction: column; align-items: stretch; }
  .primary-nav.open { display: flex; }
  .hero-shell,.product-grid,.founder-layout,.ask-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: 850px; }
  .hero-stage { min-height: 590px; }
  .statement-grid,.values-layout,.architecture-head { grid-template-columns: 1fr; gap: 45px; }
  .values-intro,.value-stack,.architecture-head h2,.architecture-head p { grid-column: 1; }
  .focus-heading { grid-template-columns: 1fr; gap: 20px; }
  .architecture-map { margin-left: 0; }
  .founder-sticky { position: static; }
}
@media (max-width: 720px) {
  .cursor-glow { display: none; }
  .nav-wrap { height: 72px; }
  .primary-nav { top: 72px; }
  .hero { padding-top: 110px; }
  h1 { font-size: clamp(3.6rem, 17vw, 5.4rem); }
  .hero-stage { min-height: 500px; transform: scale(.82); margin: -40px -35px; }
  .signal-a { left: -1%; }
  .signal-b { right: -2%; }
  .hero-links { flex-direction: column; align-items: flex-start; }
  .statement,.focus,.product-story,.values,.architecture,.founder,.ask { padding: 95px 0; }
  .statement h2,.focus h2,.product-story h2,.values h2,.architecture h2,.founder h2,.ask h2 { font-size: clamp(2.8rem, 14vw, 4.7rem); }
  .focus-row { grid-template-columns: 45px 1fr 32px; padding: 28px 0; }
  .focus-row p { grid-column: 2/4; margin-top: -14px; }
  .focus-row h3 { font-size: 2.5rem; }
  .console-grid { grid-template-columns: 1fr; }
  .console-brief,.metric-card.wide { grid-column: 1; }
  .architecture-map article { grid-template-columns: 50px 1fr; }
  .architecture-map article > b { grid-column: 2; text-align: left; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .footer-shell { grid-template-columns: 1fr; }
  .footer-links { justify-content: flex-start; }
  .footer-bottom { flex-direction: column; gap: 8px; }
  .wordmark-text { font-size: .76rem; }
}
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
}
