:root { --ink:#07101f; --paper:#f2f0ea; --lime:#d9ff39; --line:rgba(7,16,31,.18); --mono:"DM Mono",monospace; --sans:"Manrope",sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); } a { color:inherit; text-decoration:none; } .noise { position:fixed; inset:0; z-index:5; pointer-events:none; opacity:.055; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); }
.site-header { height:82px; position:absolute; top:0; z-index:3; width:100%; padding:0 4.5vw; display:flex; align-items:center; justify-content:space-between; color:#fff; }.brand { display:flex; align-items:center; font-size:14px; font-weight:800; letter-spacing:.08em; white-space:nowrap; }.brand em { font-family:var(--mono); font-style:normal; font-size:9px; letter-spacing:.12em; color:var(--lime); }.brand-mark { width:31px; height:20px; margin-right:8px; fill:var(--lime); }.nav { display:flex; align-items:center; gap:28px; font-family:var(--mono); font-size:11px; }.nav a { opacity:.75; transition:opacity .2s; }.nav a:hover { opacity:1; }.nav .nav-cta { padding:10px 14px; border:1px solid rgba(255,255,255,.5); opacity:1; }.nav-cta span { color:var(--lime); margin-left:8px; }.menu-button { display:none; }
.hero { min-height:760px; height:100vh; position:relative; overflow:hidden; color:#fff; padding:140px 7.5vw 40px; background:radial-gradient(circle at 78% 48%,#254078 0,transparent 26%),linear-gradient(125deg,#07101f 14%,#0b1830 63%,#102c48); }.hero-grid { position:absolute; inset:0; opacity:.27; background-image:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px); background-size:9vw 9vw; mask-image:linear-gradient(to bottom,transparent,black 30%,black 75%,transparent); }.eyebrow,.section-label { position:relative; z-index:1; font:10px var(--mono); letter-spacing:.08em; text-transform:uppercase; }.eyebrow span { display:inline-block; width:7px; height:7px; margin-right:9px; border-radius:50%; background:var(--lime); }.hero-copy { position:relative; z-index:1; margin-top:13vh; }.hero h1,.statement h2,.connect h2 { font-size:clamp(55px,9.2vw,144px); font-weight:700; letter-spacing:-.085em; line-height:.82; margin:0; }.hero h1 i,h2 i { font-family:Georgia,serif; font-weight:400; letter-spacing:-.1em; }.hero-bottom { display:flex; align-items:end; justify-content:space-between; margin:45px 0 0 43%; max-width:640px; }.hero-bottom p { width:255px; margin:0; font-size:13px; line-height:1.7; color:rgba(255,255,255,.76); }.circle-link { width:56px; height:56px; border:1px solid rgba(255,255,255,.45); display:grid; place-items:center; border-radius:50%; font-size:24px; transition:background .25s,color .25s; }.circle-link:hover { background:var(--lime); color:var(--ink); }.hero-orbit { position:absolute; width:min(41vw,600px); aspect-ratio:1; right:-5vw; top:17%; border:1px solid rgba(217,255,57,.75); border-radius:50%; }.hero-orbit:before,.hero-orbit:after,.orbit-ring { content:""; position:absolute; border:1px solid rgba(217,255,57,.42); border-radius:50%; }.hero-orbit:before { inset:13%; }.hero-orbit:after { inset:28%; }.orbit-ring { inset:42%; }.orbit-blip { position:absolute; width:11px; height:11px; background:var(--lime); border-radius:50%; top:10%; left:19%; box-shadow:0 0 25px 7px rgba(217,255,57,.4); }.hero-index { position:absolute; bottom:39px; right:4.5vw; z-index:1; font:9px var(--mono); opacity:.75; }
.statement { padding:130px 7.5vw 105px; }.section-label { display:flex; justify-content:space-between; color:#59606b; border-bottom:1px solid var(--line); padding-bottom:16px; }.statement-grid { display:grid; grid-template-columns:1.45fr .55fr; gap:60px; padding:62px 0 76px; }.statement h2 { font-size:clamp(45px,6.3vw,96px); color:#101a2d; }.statement-copy { align-self:end; max-width:290px; font-size:15px; line-height:1.8; }.services { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }.services article { min-height:285px; position:relative; padding:21px 26px 20px 0; border-right:1px solid var(--line); }.services article+article { padding-left:26px; }.services article:last-child { border-right:0; }.services span,.principle>span { font:10px var(--mono); color:#6b727b; }.services h3 { font-size:29px; letter-spacing:-.07em; line-height:.95; margin:36px 0 23px; }.services p { max-width:205px; margin:0; font-size:12px; line-height:1.65; color:#5e6671; }.services b { position:absolute; bottom:17px; right:25px; font-size:24px; font-weight:400; }
.principles { padding:115px 7.5vw 100px; }.principles .section-label { margin-bottom:48px; }.principle { display:grid; grid-template-columns:16% 46% 38%; border-bottom:1px solid var(--line); padding:28px 0 36px; }.principle h3 { font-size:clamp(36px,5vw,76px); letter-spacing:-.08em; line-height:.82; margin:0; }.principle p { max-width:270px; align-self:end; margin:0; color:#5e6671; font-size:13px; line-height:1.7; }.connect { padding:128px 7.5vw 45px; min-height:650px; position:relative; overflow:hidden; color:#fff; background:var(--lime); color:var(--ink); }.connect:after { content:""; position:absolute; width:min(88vw,1280px); height:50%; right:0; bottom:2%; background:url("../assets/exocet-am39-mesh.webp") right center/contain no-repeat; opacity:.2; }.connect h2 { position:relative; z-index:1; font-size:clamp(68px,11vw,170px); margin:75px 0 60px; }.project-link { position:relative; z-index:1; display:inline-flex; gap:25px; align-items:center; padding-bottom:8px; border-bottom:2px solid currentColor; font-size:clamp(19px,2vw,30px); font-weight:700; letter-spacing:-.05em; }.project-link span { font-size:1.3em; }.connect-note { position:absolute; z-index:1; bottom:28px; right:7.5vw; font:10px var(--mono); }footer { min-height:86px; padding:0 4.5vw; display:flex; align-items:center; justify-content:space-between; font:10px var(--mono); }footer .brand { font-family:var(--sans); }footer .brand-mark { fill:var(--ink); }footer .brand em { color:var(--ink); }footer p { color:#6b727b; }
@media (max-width:700px) { .site-header { height:68px; padding:0 6vw; }.nav { display:none; position:absolute; right:6vw; top:58px; width:210px; padding:18px; background:#101c31; flex-direction:column; align-items:stretch; gap:18px; }.nav.open { display:flex; }.menu-button { display:grid; gap:5px; padding:8px 0 8px 8px; border:0; background:none; }.menu-button span { width:23px; height:1px; background:#fff; }.hero { min-height:680px; padding:118px 7vw 30px; }.hero-grid { background-size:22vw 22vw; }.hero-copy { margin-top:18vh; }.hero h1 { font-size:clamp(60px,19vw,100px); }.hero-bottom { margin:36px 0 0; }.hero-bottom p { font-size:12px; }.hero-orbit { width:95vw; right:-41vw; top:29%; }.hero-index { right:7vw; bottom:30px; }.statement,.principles { padding:80px 7vw; }.statement-grid { display:block; padding:43px 0 52px; }.statement-copy { margin-top:31px; }.services { display:block; }.services article,.services article+article { min-height:204px; padding:19px 0; border-right:0; border-bottom:1px solid var(--line); }.services h3 { margin:24px 0 13px; }.principle { grid-template-columns:18% 82%; padding:24px 0 30px; }.principle p { grid-column:2; margin-top:22px; }.connect { min-height:530px; padding:80px 7vw 30px; }.connect h2 { margin:62px 0 49px; }.connect-note { left:7vw; right:auto; bottom:25px; }footer { padding:0 7vw; } footer p { display:none; } }