:root { --ink:#07161b; --navy:#09272d; --aqua:#56f4ce; --ice:#e9fffa; --paper:#f3f6f1; --line:rgba(7,22,27,.16); --font-geist-sans:Arial,Helvetica,sans-serif; --font-geist-mono:"Courier New",monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-geist-sans), Arial, sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { height:82px; padding:0 5vw; display:flex; align-items:center; justify-content:space-between; position:absolute; inset:0 0 auto; z-index:10; color:white; border-bottom:1px solid rgba(255,255,255,.15); }
.brand { display:flex; align-items:center; gap:12px; font-size:14px; font-weight:760; letter-spacing:.12em; line-height:1; }
.brand small { display:block; color:var(--aqua); font-family:var(--font-geist-mono); font-size:8px; font-weight:500; letter-spacing:.31em; margin-top:5px; }
.brand-mark { width:36px; height:36px; display:grid; grid-template-columns:1fr 1fr; gap:2px; transform:skew(-8deg); }
.brand-mark i { background:var(--aqua); color:var(--navy); display:grid; place-items:center; font-size:11px; font-style:normal; font-weight:900; }
.brand-mark i:last-child { background:transparent; color:var(--aqua); border:1px solid var(--aqua); }
nav { display:flex; align-items:center; gap:34px; font-size:12px; }
nav a { opacity:.78; transition:.2s; }
nav a:hover { opacity:1; color:var(--aqua); }
.nav-cta { border-left:1px solid rgba(255,255,255,.2); padding-left:34px; opacity:1; font-weight:650; }
.nav-cta span { color:var(--aqua); margin-left:8px; }
.hero { min-height:780px; height:100vh; position:relative; overflow:hidden; display:grid; grid-template-columns:1.2fr .8fr; align-items:center; padding:120px 7vw 70px; color:white; background:radial-gradient(circle at 78% 40%, #17515a 0, #0a3037 22%, var(--navy) 50%, #05171c 100%); }
.hero-grid { position:absolute; inset:0; opacity:.12; background-image:linear-gradient(rgba(255,255,255,.32) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.32) 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(90deg, transparent, #000 55%, #000); }
.hero:after { content:""; position:absolute; width:520px; height:520px; right:-160px; bottom:-300px; background:var(--aqua); filter:blur(160px); opacity:.17; border-radius:50%; }
.hero-orbit { position:absolute; border:1px solid rgba(86,244,206,.17); border-radius:50%; right:9%; top:17%; }
.orbit-one { width:520px; height:520px; }
.orbit-two { width:370px; height:370px; right:14%; top:26%; border-style:dashed; animation:spin 32s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.hero-copy { max-width:760px; position:relative; z-index:2; }
.eyebrow,.section-kicker { font-family:var(--font-geist-mono); letter-spacing:.22em; font-size:11px; font-weight:600; }
.eyebrow { display:flex; align-items:center; gap:12px; color:#b9d8d4; }
.eyebrow span { width:24px; height:2px; background:var(--aqua); }
h1 { font-size:clamp(58px,7.2vw,112px); line-height:.91; letter-spacing:-.072em; margin:34px 0; font-weight:660; }
h1 em { color:var(--aqua); font-style:normal; font-weight:380; }
.hero-intro { color:#b8cac9; font-size:17px; line-height:1.72; max-width:610px; }
.hero-actions { display:flex; align-items:center; gap:26px; margin-top:40px; }
.button { min-height:50px; padding:0 22px; display:inline-flex; align-items:center; gap:34px; font-size:12px; font-weight:700; letter-spacing:.03em; }
.button-primary { background:var(--aqua); color:var(--ink); }
.button-primary:hover { background:#8affdf; }
.button-quiet { border-bottom:1px solid rgba(255,255,255,.35); padding-left:0; padding-right:0; color:#dcebea; }
.hero-panel { position:relative; z-index:2; width:min(100%,430px); justify-self:end; margin-top:60px; }
.signal-card { height:310px; padding:30px; border:1px solid rgba(255,255,255,.19); background:rgba(5,26,31,.46); backdrop-filter:blur(7px); position:relative; }
.signal-card:before,.signal-card:after { content:""; position:absolute; width:10px; height:10px; border-color:var(--aqua); }
.signal-card:before { top:-1px; left:-1px; border-top:2px solid; border-left:2px solid; }
.signal-card:after { bottom:-1px; right:-1px; border-right:2px solid; border-bottom:2px solid; }
.signal-card p,.signal-card strong { font-family:var(--font-geist-mono); font-size:9px; letter-spacing:.16em; color:#98b9b6; }
.signal-bars { height:175px; display:flex; gap:7px; align-items:end; margin:28px 0 20px; border-bottom:1px solid rgba(255,255,255,.16); }
.signal-bars i { flex:1; min-height:10%; display:block; background:linear-gradient(180deg,var(--aqua),rgba(86,244,206,.12)); }
.signal-card strong { color:var(--aqua); font-weight:500; }
.panel-caption { display:flex; justify-content:space-between; margin-top:18px; align-items:flex-start; }
.panel-caption span { font-family:var(--font-geist-mono); color:var(--aqua); font-size:10px; }
.panel-caption p { margin:0; text-align:right; color:#adc6c3; line-height:1.5; font-size:11px; }
.scroll-cue { position:absolute; bottom:38px; left:5vw; display:flex; align-items:center; gap:18px; z-index:3; }
.scroll-cue span { font-family:var(--font-geist-mono); font-size:8px; letter-spacing:.3em; transform:rotate(-90deg); }
.scroll-cue i { width:34px; height:34px; border:1px solid rgba(255,255,255,.25); border-radius:50%; display:grid; place-items:center; color:var(--aqua); font-style:normal; }
.manifesto { padding:140px 7vw; display:grid; grid-template-columns:1fr 3fr; gap:5vw; border-bottom:1px solid var(--line); }
.section-kicker { color:#347b72; padding-top:12px; }
.manifesto-copy { max-width:1000px; }
.lead { color:#60716e; margin:0 0 28px; font-size:15px; }
.manifesto h2,.section-heading h2,.community h2,.vision h2 { font-size:clamp(44px,5.4vw,82px); line-height:1.02; letter-spacing:-.055em; margin:0; font-weight:620; }
.manifesto h2 span,.vision h2 span { color:#4d6b67; font-weight:350; }
.story-columns { margin-top:64px; display:grid; grid-template-columns:1fr 1fr; gap:8vw; color:#4d615e; line-height:1.8; font-size:15px; }
.expertise { padding:130px 7vw; background:#e8ede7; }
.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:72px; }
.section-heading h2 { margin-top:22px; }
.section-heading>p { max-width:300px; line-height:1.7; color:#60716e; }
.capability-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.capability { min-height:390px; padding:24px 34px 36px; border-right:1px solid var(--line); position:relative; transition:.3s; }
.capability:last-child { border:0; }
.capability:hover { background:#f4f7f2; transform:translateY(-6px); box-shadow:0 15px 30px rgba(7,22,27,.06); }
.cap-index { font-family:var(--font-geist-mono); font-size:10px; color:#718480; }
.cap-glyph { width:92px; height:92px; margin:62px 0 44px; position:relative; display:grid; place-items:center; }
.cap-glyph:before { content:""; width:100%; height:100%; border:1px solid #8cb2aa; border-radius:50%; position:absolute; }
.cap-glyph i { position:absolute; display:block; background:#2a8f7f; width:36px; height:2px; }
.cap-glyph i:nth-child(2) { transform:rotate(60deg); }
.cap-glyph i:nth-child(3) { transform:rotate(-60deg); }
.capability h3 { font-size:22px; margin:0 0 16px; }
.capability p { color:#5c6c69; line-height:1.7; font-size:14px; max-width:290px; }
.community { min-height:720px; display:grid; grid-template-columns:1fr 1fr; background:var(--navy); color:white; }
.community-visual { position:relative; overflow:hidden; display:grid; place-items:center; background:radial-gradient(circle,#154d54 0,#0a2d33 42%,#071e23 72%); }
.community-visual:before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(86,244,206,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(86,244,206,.07) 1px,transparent 1px); background-size:48px 48px; }
.community-ring { position:absolute; border:1px solid rgba(86,244,206,.35); border-radius:50%; }
.ring-a { width:390px; height:390px; }
.ring-b { width:550px; height:550px; border-style:dashed; animation:spin 45s linear infinite reverse; }
.community-core { width:126px; height:126px; border-radius:50%; display:grid; place-items:center; color:var(--aqua); font-size:42px; font-weight:760; border:1px solid var(--aqua); background:#0b333a; box-shadow:0 0 70px rgba(86,244,206,.2); z-index:2; }
.node { width:10px; height:10px; border:2px solid var(--aqua); border-radius:50%; position:absolute; box-shadow:0 0 15px var(--aqua); }
.n1 { top:25%; left:34%; }.n2 { top:38%; right:19%; }.n3 { bottom:25%; left:25%; }.n4 { bottom:18%; right:34%; }
.community-copy { padding:120px 8vw 100px 7vw; }
.community-copy .section-kicker { color:var(--aqua); }
.community h2 { margin-top:26px; }
.community-lead { color:#afc8c5; font-size:17px; line-height:1.75; margin:38px 0 42px; max-width:560px; }
.principles { border-top:1px solid rgba(255,255,255,.16); }
.principle { display:grid; grid-template-columns:50px 1fr; padding:22px 0; border-bottom:1px solid rgba(255,255,255,.16); }
.principle>span { font-family:var(--font-geist-mono); font-size:9px; color:var(--aqua); padding-top:5px; }
.principle h3 { font-size:15px; margin:0 0 7px; }.principle p { color:#8eaaa6; font-size:13px; margin:0; }
.vision { padding:140px 7vw; text-align:center; background:var(--aqua); }
.vision .section-kicker { color:#1d645a; }
.vision h2 { margin:24px 0 34px; font-size:clamp(58px,7vw,110px); }
.vision h2 span { color:#246d63; }
.vision>p:not(.section-kicker) { max-width:610px; margin:0 auto 42px; color:#20554d; line-height:1.75; }
.button-light { background:var(--ink); color:white; }
footer { background:#05171c; color:white; padding:60px 7vw 30px; display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:start; }
.footer-brand { width:max-content; }.footer-brand .brand-mark { width:42px; height:42px; }
footer>p { color:#829e9a; text-align:right; font-size:13px; }
.footer-meta { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.12); padding-top:24px; display:flex; justify-content:space-between; font-family:var(--font-geist-mono); color:#607a76; font-size:8px; letter-spacing:.14em; }
@media (max-width:900px) {
  nav a:not(.nav-cta) { display:none; }.nav-cta { border:0;padding:0; }
  .hero { height:auto; min-height:900px; grid-template-columns:1fr; padding-top:140px; }.hero-panel { display:none; }
  .manifesto { grid-template-columns:1fr; }.story-columns { gap:30px; }
  .capability-grid { grid-template-columns:1fr; }.capability { min-height:280px; border-right:0; border-bottom:1px solid var(--line); }.capability:last-child { border-bottom:0; }.cap-glyph { margin:35px 0 28px; }
  .community { grid-template-columns:1fr; }.community-visual { min-height:500px; }.community-copy { padding:90px 7vw; }
}
@media (max-width:600px) {
  .site-header { height:70px; }.nav-cta { font-size:10px; }.brand { font-size:12px; }.brand-mark { width:31px;height:31px; }
  .hero { min-height:760px; padding:120px 7vw 80px; }.eyebrow { font-size:8px; }.hero-intro { font-size:15px; }.hero-actions { flex-direction:column; align-items:flex-start; }
  .manifesto,.expertise,.vision { padding-top:90px;padding-bottom:90px; }.story-columns { grid-template-columns:1fr; margin-top:42px; }
  .section-heading { display:block; }.section-heading>p { margin-top:28px; }.capability { padding-left:22px; }
  .community-visual { min-height:390px; }.ring-a { width:250px;height:250px; }.ring-b { width:360px;height:360px; }.community-core { width:90px;height:90px;font-size:30px; }
  footer { grid-template-columns:1fr; }.footer-meta { flex-direction:column; gap:14px; }.footer-meta,footer>p { text-align:left; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.orbit-two,.ring-b { animation:none; } }
