:root { --navy:#0b1f33; --navy-2:#102c46; --teal:#00b8c4; --orange:#ff8a1f; --ice:#f4f8fa; --muted:#9bb0c0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--navy); color:var(--ice); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { position:absolute; z-index:10; top:0; left:0; right:0; height:96px; display:flex; align-items:center; justify-content:space-between; padding:0 6vw; border-bottom:1px solid rgba(255,255,255,.09); }
.brand { display:flex; align-items:center; }
.brand-logo { display:block; width:auto; object-fit:contain; }
.brand-logo--header { height:52px; }
.brand-logo--footer { height:45px; }
.closing strong span { color:var(--orange); }
.header-link { font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.13em; }
.header-link span { color:var(--orange); margin-left:10px; }
.brand-mark { position:relative; display:inline-block; width:92px; height:92px; flex:0 0 auto; }
.brand-mark--small { width:42px; height:42px; }
.brand-mark .hub { position:absolute; left:20%; top:27%; width:46%; height:46%; border:8px solid currentColor; border-right-color:transparent; border-radius:50%; }
.brand-mark .route { position:absolute; left:56%; top:47%; width:36%; height:7px; background:var(--orange); }
.brand-mark .route:after { content:""; position:absolute; right:-2px; top:-7px; width:17px; height:17px; border-top:7px solid var(--orange); border-right:7px solid var(--orange); transform:rotate(45deg); }
.brand-mark .node { position:absolute; left:4%; width:17%; height:17%; border-radius:50%; background:var(--teal); }
.brand-mark .node:after { content:""; position:absolute; width:42px; height:6px; background:var(--teal); left:10px; top:20px; transform-origin:left center; }
.brand-mark .node--top { top:4%; }.brand-mark .node--top:after { transform:rotate(55deg); }
.brand-mark .node--bottom { bottom:4%; }.brand-mark .node--bottom:after { transform:rotate(-55deg); top:-4px; }
.brand-mark--small .hub { border-width:4px; }.brand-mark--small .route { height:4px; }.brand-mark--small .route:after { width:9px;height:9px;border-width:4px;top:-4px; }
.brand-mark--small .node:after { width:20px;height:3px;left:5px;top:9px; }.brand-mark--small .node--bottom:after { top:-2px; }

.hero { position:relative; min-height:100svh; overflow:hidden; display:flex; align-items:center; padding:150px 6vw 85px; background:radial-gradient(circle at 78% 48%, #123d5b 0, var(--navy) 37%); }
.hero-noise { position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:50px 50px; }
.hero-copy { z-index:2; width:58%; }
.eyebrow,.section-number { color:var(--teal); font-size:12px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow span { display:inline-block; width:36px; height:2px; margin:0 12px 3px 0; background:var(--orange); }
.hero h1 { max-width:860px; margin:28px 0 30px; font-size:clamp(55px,6.5vw,104px); line-height:.94; letter-spacing:-.065em; }
.hero h1 em { color:var(--orange); font-style:normal; }
.hero-description { max-width:650px; color:#c5d4df; font-size:clamp(18px,1.6vw,23px); line-height:1.55; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:42px; }
.button { display:inline-flex; align-items:center; justify-content:space-between; min-width:255px; padding:19px 23px; border-radius:4px; font-size:14px; font-weight:800; }
.button--primary { color:var(--navy); background:var(--orange); }.button--primary:hover { background:#ff9f43; transform:translateY(-2px); }
.launch-note { color:var(--muted); text-transform:uppercase; letter-spacing:.2em; font-size:11px; font-weight:700; }
.hero-visual { position:absolute; right:-9vw; top:14%; width:49vw; height:72%; }
.visual-hub { position:absolute; z-index:2; left:45%; top:43%; width:150px; height:150px; border:28px solid var(--ice); border-right-color:transparent; border-radius:50%; }
.visual-hub span { position:absolute; inset:27%; border-radius:50%; background:var(--ice); }
.visual-arrow { position:absolute; z-index:3; left:61%; top:44%; color:var(--orange); font-size:116px; font-weight:300; line-height:1; }
.hero-css-mark { position:absolute; z-index:3; left:37%; top:24%; width:320px; height:320px; }
.hero-node,.hero-arm,.hero-ring,.hero-core,.hero-route { position:absolute; display:block; }
.hero-node { z-index:3; left:18px; width:56px; height:56px; border-radius:50%; background:var(--teal); }
.hero-node--top { top:8px; }.hero-node--bottom { bottom:8px; }
.hero-arm { z-index:1; left:58px; width:128px; height:18px; border-radius:20px; background:var(--teal); transform-origin:left center; }
.hero-arm--top { top:58px; transform:rotate(54deg); }.hero-arm--bottom { bottom:58px; transform:rotate(-54deg); }
.hero-ring { z-index:4; left:98px; top:82px; width:156px; height:156px; border:30px solid var(--ice); border-right-color:transparent; border-radius:50%; }
.hero-core { z-index:5; left:150px; top:134px; width:52px; height:52px; border-radius:50%; background:var(--ice); }
.hero-route { z-index:6; left:218px; top:151px; width:98px; height:18px; border-radius:20px 0 0 20px; background:var(--orange); }
.hero-route:after { content:""; position:absolute; right:0; top:-18px; width:42px; height:42px; border-top:18px solid var(--orange); border-right:18px solid var(--orange); transform:rotate(45deg); border-radius:4px; }
.flow { position:absolute; left:0; width:49%; height:3px; background:var(--teal); transform-origin:right; }
.flow:after { content:""; position:absolute; right:-22px; top:-10px; width:23px; height:23px; border-radius:50%; background:var(--teal); }
.flow i { position:absolute; width:15px; height:15px; top:-6px; border-radius:50%; background:var(--teal); }.flow i:nth-child(1){left:4%}.flow i:nth-child(2){left:40%}.flow i:nth-child(3){left:76%}
.flow--one { top:33%; transform:rotate(12deg); }.flow--two { top:52%; }.flow--three { top:71%; transform:rotate(-12deg); }
.orbit { position:absolute; border:1px solid rgba(0,184,196,.28); border-radius:50%; }.orbit--one{width:560px;height:560px;left:31%;top:5%}.orbit--two{width:720px;height:720px;left:19%;top:-7%}
.scroll-cue { position:absolute; bottom:32px; left:6vw; color:var(--muted); font-size:11px; letter-spacing:.14em; text-transform:uppercase; }.scroll-cue span{display:inline-block;width:1px;height:40px;background:var(--teal);margin-right:15px;vertical-align:middle}

.statement { min-height:760px; padding:120px 8vw; background:var(--ice); color:var(--navy); display:grid; grid-template-columns:1.1fr .75fr; gap:10vw; align-items:center; }
.statement .section-number,.capabilities .section-number { grid-column:1/-1; align-self:end; margin:0; }
.statement h2,.capabilities h2,.manifesto h2,.closing h2 { margin:0; font-size:clamp(44px,5.4vw,82px); line-height:1.02; letter-spacing:-.055em; }
.statement h2 strong { color:var(--teal); }.statement-copy { font-size:20px; line-height:1.7; color:#486276; border-left:3px solid var(--orange); padding-left:30px; }
.capabilities { padding:120px 8vw; display:grid; grid-template-columns:.8fr 1.2fr; gap:9vw; background:#0d243a; }
.capabilities-heading { position:sticky; top:80px; align-self:start; }.capabilities-heading h2 { margin-top:28px; }
.capabilities-list { list-style:none; padding:0; margin:0; }
.capabilities-list li { display:grid; grid-template-columns:55px 1fr 30px; gap:20px; align-items:center; min-height:92px; border-top:1px solid rgba(255,255,255,.13); }
.capabilities-list li:last-child { border-bottom:1px solid rgba(255,255,255,.13); }.capabilities-list span{color:var(--orange);font-size:12px;font-weight:800}.capabilities-list strong{font-size:20px}.capabilities-list i{color:var(--teal);font-style:normal}
.manifesto { position:relative; min-height:760px; display:flex; flex-direction:column; justify-content:center; padding:120px 8vw; overflow:hidden; background:var(--teal); color:var(--navy); }
.manifesto p { font-size:18px; font-weight:700; line-height:1.5; text-transform:uppercase; letter-spacing:.08em; }.manifesto h2{margin-top:36px;max-width:950px}.manifesto h2 em{color:var(--ice);font-style:normal}
.manifesto-route { position:absolute; right:-4vw; bottom:6%; width:43vw; height:220px; border-bottom:8px solid var(--navy); }
.manifesto-route span{position:absolute;bottom:-16px;width:24px;height:24px;border-radius:50%;background:var(--navy)}.manifesto-route span:nth-child(1){left:5%}.manifesto-route span:nth-child(2){left:35%}.manifesto-route span:nth-child(3){left:70%}.manifesto-route i{position:absolute;right:2%;bottom:-49px;font-size:84px;font-style:normal}
.closing { min-height:720px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:100px 7vw; background:var(--ice); color:var(--navy); }.closing-brand-icon{width:120px;height:auto;margin-bottom:35px}.closing h2{max-width:1000px;margin:26px auto 34px}.closing > p:last-child{font-size:24px}.closing strong{font-size:30px}
footer { min-height:120px; padding:28px 6vw; display:flex; align-items:center; justify-content:space-between; gap:30px; color:var(--muted); font-size:12px; border-top:1px solid rgba(255,255,255,.1); }.brand--footer{color:var(--ice);font-size:20px}

@media (max-width:900px){
  .site-header{height:78px;padding:0 22px}.brand-logo--header{height:42px}.header-link{display:none}.hero{padding:120px 22px 80px;align-items:flex-start}.hero-copy{width:100%}.hero h1{font-size:clamp(49px,14vw,76px);margin-top:22px}.hero-description{max-width:92%}.hero-visual{position:relative;right:auto;top:auto;width:125%;height:270px;margin:45px -25% -20px 6%;}.visual-hub{width:92px;height:92px;border-width:18px;left:44%;top:39%}.visual-arrow{left:61%;top:40%;font-size:70px}.orbit--one{width:320px;height:320px}.orbit--two{width:430px;height:430px}.scroll-cue{display:none}
  .statement,.capabilities{grid-template-columns:1fr;padding:90px 24px;gap:60px}.statement{min-height:auto}.statement .section-number{grid-column:auto}.statement-copy{font-size:18px}.capabilities-heading{position:static}.manifesto,.closing{min-height:650px;padding:90px 24px}.manifesto-route{opacity:.25;width:80vw}.manifesto h2,.closing h2{font-size:clamp(43px,12vw,66px)}footer{padding:32px 22px;flex-direction:column;align-items:flex-start}.hero-actions{align-items:flex-start;flex-direction:column;gap:18px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button--primary:hover{transform:none}}