:root { --ink:#10232e; --muted:#55707b; --paper:#f5f8f6; --line:#d7e0dc; --mint:#c9f4d8; --lime:#ddff70; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; overflow-x:hidden; }
.grid { position:fixed; inset:0; pointer-events:none; opacity:.47; background-image:linear-gradient(#d9e4df 1px,transparent 1px),linear-gradient(90deg,#d9e4df 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(to bottom,black 0%,transparent 76%); z-index:-1; }
.site-header, main, footer { max-width:1280px; margin:auto; padding-left:44px; padding-right:44px; }
.site-header { min-height:92px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { color:var(--ink); text-decoration:none; font-size:19px; font-weight:800; letter-spacing:-1px; display:flex; align-items:center; gap:8px; }
.brand-mark { display:grid; place-items:center; width:25px; height:25px; background:var(--ink); color:var(--lime); font-family:Georgia,serif; font-size:19px; line-height:1; border-radius:50% 50% 50% 7%; }
nav { display:flex; gap:31px; margin-left:auto; margin-right:34px; } nav a, footer a { color:var(--muted); text-decoration:none; font-size:13px; font-weight:700; } nav a:hover, footer a:hover { color:var(--ink); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:20px; background:var(--ink); color:white; font-size:13px; font-weight:800; text-decoration:none; padding:17px 22px; border-radius:2px; transition:transform .2s,background .2s; }.button:hover { transform:translateY(-2px); background:#1c3946; }.button span { color:var(--lime); font-size:18px; line-height:10px; }.button-small { padding:12px 16px; gap:13px; }
.hero { position:relative; min-height:650px; padding-top:116px; overflow:hidden; }.eyebrow { color:var(--muted); font-family:"DM Mono",monospace; font-size:11px; letter-spacing:1.1px; font-weight:500; display:flex; align-items:center; gap:10px; }.eyebrow span { display:inline-block; width:7px; height:7px; background:#74c997; border-radius:50%; }
h1,h2,h3,p { margin-top:0; } h1 { position:relative; z-index:1; margin:27px 0 22px; font-size:clamp(56px,7vw,103px); line-height:.96; letter-spacing:-6px; max-width:830px; font-weight:800; } h1 em { font-family:Georgia,serif; font-weight:400; color:#589b77; letter-spacing:-5px; }
.hero-copy { font-size:17px; line-height:1.6; max-width:465px; color:var(--muted); }.hero-actions { display:flex; align-items:center; gap:28px; margin-top:34px; }.text-link { font-size:13px; color:var(--ink); text-decoration:none; font-weight:800; }.text-link span { margin-left:7px; color:#579b76; font-size:18px; }
.orbit { position:absolute; width:650px; height:650px; right:-107px; top:9px; border-radius:50%; border:1px solid #bdd1c9; transform:rotate(-18deg); }.orbit-line { position:absolute; border-radius:50%; border:1px solid #c6d6d0; inset:90px -51px; }.orbit-two { inset:-56px 149px; }.glow { position:absolute; left:220px; top:246px; width:206px; height:206px; border-radius:50%; background:radial-gradient(circle at 40% 35%,var(--lime),#9ee6a8 47%,#54a98a); box-shadow:0 0 50px 18px #b9eec2; }.orbit-dot { position:absolute; width:13px; height:13px; background:var(--ink); border-radius:50%; }.dot-one{top:89px;left:142px}.dot-two{right:71px;bottom:142px;background:#77c997}
.focus { display:grid; grid-template-columns:38% 62%; padding-top:118px; padding-bottom:130px; border-top:1px solid var(--line); }.section-intro h2,.contact h2 { font-size:clamp(37px,4vw,59px); line-height:1; letter-spacing:-3.5px; margin:23px 0; }.focus-list { border-top:1px solid var(--ink); }.focus-list article { position:relative; padding:23px 32% 24px 67px; min-height:128px; border-bottom:1px solid var(--line); }.number { position:absolute; left:0; top:28px; font-family:"DM Mono"; color:#66a884; font-size:11px; }.focus-list h3 { font-size:22px; letter-spacing:-1px; margin-bottom:7px; }.focus-list article>p:last-child { color:var(--muted); font-size:14px; line-height:1.55; margin:0; }
.contact { background:var(--ink); color:white; max-width:none; padding:110px max(44px,calc((100% - 1192px)/2)) 115px; }.contact .eyebrow { color:#a9c5bb; }.contact .eyebrow span { background:var(--lime); }.contact h2 { font-size:clamp(49px,6vw,83px); margin-top:26px; }.contact>p:not(.eyebrow) { max-width:440px; line-height:1.65; color:#b7c9c4; font-size:16px; }.contact-email { display:inline-block; color:var(--lime); font-size:clamp(25px,3vw,42px); letter-spacing:-1.8px; font-weight:700; text-decoration:none; border-bottom:1px solid #67817b; padding-bottom:11px; margin-top:25px; }.contact-email span { font-size:.8em; margin-left:20px; }.contact address { margin-top:31px; color:#a9c5bb; font-size:13px; line-height:1.65; font-style:normal; }
footer { min-height:114px; display:flex; justify-content:space-between; align-items:center; } footer p { color:var(--muted); font-size:12px; margin:0; }
@media(max-width:720px) { .site-header,main,footer { padding-left:22px; padding-right:22px; }.site-header { min-height:74px; }.site-header nav { display:none; }.button-small { font-size:11px; padding:10px; }.hero { min-height:610px; padding-top:80px; }.orbit { width:440px;height:440px;right:-202px;top:207px;opacity:.65; }.glow { transform:scale(.65); transform-origin:top left; left:176px;top:153px; }.hero-copy { font-size:15px; }.focus { display:block; padding-top:77px; padding-bottom:85px; }.section-intro h2 { margin-bottom:50px; }.focus-list article { padding-right:2px; }.contact { padding:78px 22px 84px; } footer { min-height:150px; flex-wrap:wrap; gap:10px; align-content:center; } footer p { width:100%; order:3; } }
