:root { --ink:#151515; --paper:#f1efe8; --acid:#c6ff3d; --blue:#2358ff; --line:rgba(21,21,21,.18); --font-sans:Arial,Helvetica,sans-serif; --font-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-sans); }
a { color:inherit; text-decoration:none; }
.site-header { height:84px; padding:0 4.4vw; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); position:relative; z-index:20; background:rgba(241,239,232,.9); }
.brand { display:inline-flex; align-items:center; gap:12px; font:700 12px/1 var(--font-mono); letter-spacing:.15em; }
.brand-mark { width:31px; height:31px; display:grid; place-items:center; border-radius:50%; background:var(--ink); color:var(--acid); font:800 10px/1 var(--font-sans); letter-spacing:-.06em; }
nav { display:flex; gap:36px; font-size:13px; }
nav a,.header-cta { transition:opacity .2s ease; }
nav a:hover,.header-cta:hover { opacity:.55; }
.header-cta { display:flex; gap:12px; align-items:center; font:650 13px/1 var(--font-sans); border-bottom:1px solid; padding-bottom:5px; }
.hero { min-height:calc(100vh - 84px); position:relative; padding:8vh 4.4vw 5vh; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; }
.eyebrow,.section-label { text-transform:uppercase; letter-spacing:.15em; font:600 10px/1.4 var(--font-mono); }
.eyebrow { display:flex; align-items:center; gap:10px; }
.eyebrow span { width:8px; height:8px; border-radius:50%; background:var(--blue); }
h1,h2 { margin:0; letter-spacing:-.075em; font-weight:720; line-height:.83; text-transform:uppercase; }
h1 { font-size:clamp(76px,13vw,190px); position:relative; z-index:2; }
h1 em,h2 em { font-family:Georgia,serif; font-weight:400; text-transform:none; }
h1 em { color:var(--blue); }
.hero-bottom { display:flex; align-items:end; justify-content:space-between; position:relative; z-index:2; }
.hero-bottom p { max-width:510px; margin:0 0 6px 38%; font-size:clamp(16px,1.5vw,22px); line-height:1.45; letter-spacing:-.02em; }
.circle-link { width:72px; height:72px; display:grid; place-items:center; border:1px solid var(--ink); border-radius:50%; font-size:27px; transition:.25s ease; }
.circle-link:hover { background:var(--ink); color:var(--acid); transform:rotate(45deg); }
.orbit { position:absolute; border:1px solid rgba(35,88,255,.25); border-radius:50%; pointer-events:none; }
.orbit-one { width:39vw; height:39vw; right:-17vw; top:7vh; }
.orbit-two { width:27vw; height:27vw; right:-11vw; top:17vh; }
.statement { padding:12vw 8vw; display:grid; grid-template-columns:25% 1fr; border-top:1px solid var(--line); }
.section-label { margin:5px 0 0; }
.statement-lead { max-width:900px; margin:0; font-size:clamp(40px,6vw,86px); line-height:1; letter-spacing:-.06em; font-weight:650; }
.statement-lead span { color:var(--blue); font-family:Georgia,serif; font-style:italic; font-weight:400; }
.statement-copy { max-width:600px; margin:44px 0 30px 28%; font-size:18px; line-height:1.6; color:#50504c; }
.text-link { margin-left:28%; display:inline-flex; gap:18px; align-items:center; border-bottom:1px solid; padding-bottom:7px; font-size:13px; font-weight:650; }
.services { background:#fff; padding:9vw 4.4vw; }
.section-heading { display:grid; grid-template-columns:25% 1fr; margin-bottom:7vw; }
.section-heading h2,.approach h2 { font-size:clamp(62px,9vw,132px); }
.section-heading h2 em { color:var(--blue); }
.service-list { border-top:1px solid var(--line); }
.service-card { display:grid; grid-template-columns:9% 29% 1fr 32px; gap:4%; align-items:center; padding:42px 0; border-bottom:1px solid var(--line); transition:padding .25s ease,background .25s ease; }
.service-card:hover { padding-left:18px; padding-right:18px; background:var(--paper); }
.service-number { font:600 11px/1 var(--font-mono); color:#73736e; }
.service-card h3 { margin:0 0 10px; font-size:clamp(28px,3vw,46px); letter-spacing:-.05em; }
.service-card p { margin:0; max-width:440px; line-height:1.5; color:#5f5e59; }
.tags { display:flex; gap:8px; flex-wrap:wrap; }
.tags span { border:1px solid #c9c8c2; border-radius:99px; padding:8px 12px; font:500 10px/1 var(--font-mono); text-transform:uppercase; letter-spacing:.06em; }
.service-card>span:last-child { font-size:24px; }
.outcomes { padding:6vw 4.4vw 7vw; background:var(--blue); color:#fff; }
.light { color:rgba(255,255,255,.65); }
.outcome-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:6vw; border-top:1px solid rgba(255,255,255,.28); }
.outcome { padding:42px 30px 0 0; display:flex; flex-direction:column; border-right:1px solid rgba(255,255,255,.28); }
.outcome:not(:first-child) { padding-left:30px; }
.outcome:last-child { border:0; }
.outcome strong { font-size:clamp(65px,10vw,150px); letter-spacing:-.08em; line-height:.9; font-weight:650; }
.outcome span { margin-top:20px; font-size:14px; color:rgba(255,255,255,.8); }
.approach { padding:11vw 8vw; display:grid; grid-template-columns:1fr 1fr; gap:10vw; }
.approach h2 { margin:35px 0 50px; }
.approach h2 em { color:var(--blue); }
.approach-intro>p:last-child { max-width:430px; color:#5d5d58; line-height:1.6; font-size:17px; }
.steps { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.steps li { display:grid; grid-template-columns:70px 1fr; padding:36px 0; border-bottom:1px solid var(--line); }
.steps li>span { font:600 10px/1.5 var(--font-mono); color:var(--blue); }
.steps h3 { margin:0 0 12px; font-size:30px; letter-spacing:-.04em; }
.steps p { margin:0; color:#5d5d58; line-height:1.55; max-width:400px; }
.final-cta { background:var(--ink); color:#fff; padding:8vw 4.4vw; position:relative; overflow:hidden; min-height:620px; display:flex; flex-direction:column; justify-content:space-between; }
.final-cta h2 { font-size:clamp(70px,11vw,164px); position:relative; z-index:2; }
.final-cta h2 em { color:var(--acid); }
.final-cta>a { align-self:flex-end; display:flex; gap:24px; align-items:center; padding:22px 28px; background:var(--acid); color:var(--ink); border-radius:99px; font-weight:650; position:relative; z-index:3; transition:transform .2s ease; }
.final-cta>a:hover { transform:translateY(-4px); }
.cta-shape { position:absolute; width:310px; height:310px; border:1px solid rgba(198,255,61,.35); border-radius:50%; right:-70px; bottom:-100px; }
.shape-two { width:220px; height:220px; right:-25px; bottom:-55px; }
footer { padding:70px 4.4vw 28px; background:var(--ink); color:#fff; border-top:1px solid #3b3b3b; display:grid; grid-template-columns:1fr 1fr; gap:50px; }
.footer-brand .brand-mark { background:var(--acid); color:var(--ink); }
footer>p { margin:0; color:#979791; max-width:350px; }
.email { grid-column:1/-1; font-size:clamp(32px,5.5vw,80px); letter-spacing:-.05em; border-bottom:1px solid #4b4b4b; padding-bottom:30px; }
.footer-bottom { grid-column:1/-1; display:flex; justify-content:space-between; color:#777; font:500 10px/1 var(--font-mono); text-transform:uppercase; letter-spacing:.08em; }
@media (max-width:760px) {
  .site-header { height:70px; padding:0 20px; } nav { display:none; } .header-cta { font-size:11px; }
  .hero { min-height:calc(100svh - 70px); padding:55px 20px 26px; } h1 { font-size:clamp(58px,20vw,100px); }
  .hero-bottom { align-items:flex-end; } .hero-bottom p { margin:0; max-width:75%; font-size:15px; } .circle-link { width:50px; height:50px; }
  .statement,.section-heading,.approach { grid-template-columns:1fr; } .statement { padding:90px 20px; gap:50px; } .statement-copy,.text-link { margin-left:0; }
  .services { padding:85px 20px; } .section-heading { gap:40px; margin-bottom:70px; } .section-heading h2,.approach h2 { font-size:clamp(50px,17vw,80px); }
  .service-card { grid-template-columns:42px 1fr 24px; gap:8px; } .service-card .tags { grid-column:2/4; margin-top:20px; }
  .outcomes { padding:75px 20px; } .outcome-grid { grid-template-columns:1fr; margin-top:55px; } .outcome { border-right:0; border-bottom:1px solid rgba(255,255,255,.28); padding:32px 0; } .outcome:not(:first-child) { padding-left:0; }
  .approach { padding:90px 20px; gap:70px; } .final-cta { padding:80px 20px 40px; min-height:580px; } .final-cta h2 { font-size:clamp(56px,18vw,92px); }
  footer { padding:60px 20px 25px; grid-template-columns:1fr; gap:30px; } .email,.footer-bottom { grid-column:auto; } .email { margin-top:30px; font-size:9vw; overflow-wrap:anywhere; } .footer-bottom { gap:20px; line-height:1.5; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms!important; } }
