:root{--ball:#dfff00;--ink:#090909;--paper:#f4f4ef;--white:#fff;--violet:#7857ff;--orange:#ff5a36}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--white);font-family:'DM Sans',sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
.nav{height:92px;display:flex;align-items:center;gap:42px;padding:18px 4vw;border-bottom:1px solid #2a2a2a;position:relative;z-index:10;background:var(--ink)}
.brand{margin-right:auto}
.wordmark{display:inline-grid;color:var(--white);font-family:'Barlow Condensed',sans-serif;font-weight:900;line-height:.72;text-align:left}
.wordmark b{font-size:34px;letter-spacing:-.035em}
.wordmark-dot{color:var(--ball);margin-left:.02em}
.nav nav{display:flex;gap:28px;font-size:14px}
.nav nav a{opacity:.7}
.nav nav a:hover{opacity:1;color:var(--ball)}
.button{display:inline-flex;justify-content:center;align-items:center;background:var(--ball);color:var(--ink);border-radius:99px;padding:17px 26px;font-weight:700;font-size:14px}
.button-small{padding:13px 21px}
.hero{min-height:calc(100vh - 92px);padding:36px 4vw 80px;position:relative;overflow:hidden}
.hero-kicker,.section-head{display:flex;justify-content:space-between;text-transform:uppercase;font-size:12px;letter-spacing:.12em}
.hero-kicker span:last-child{opacity:.5}
.hero h1,.intro h2,.process h2,.cta h2{font-family:'Archivo Black',sans-serif;font-weight:400;line-height:.86;letter-spacing:-.04em;margin:7vh 0 4vh;font-size:clamp(5.2rem,13vw,12.5rem)}
.hero h1 span,.intro h2 span,.process h2 span{color:var(--ball);-webkit-text-stroke:0}
.hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:30px;max-width:1100px;margin-left:auto}
.hero-bottom p{max-width:500px;font-size:clamp(1.2rem,2vw,1.8rem);line-height:1.25}
.round-link{width:140px;height:140px;border:1px solid var(--ball);border-radius:50%;display:grid;place-items:center;text-align:center;text-transform:uppercase;font-weight:700;font-size:13px;transition:.3s}
.round-link:hover{background:var(--ball);color:var(--ink);transform:rotate(8deg)}
.court-line{position:absolute;width:42vw;height:42vw;border:3px solid rgba(223,255,0,.25);border-radius:50%;right:-22vw;top:9vw}
.ball{position:absolute;left:-65px;bottom:20%;width:130px;height:130px;border-radius:50%;background:var(--ball);color:var(--ink);display:grid;place-items:center;font:400 42px/1 'Archivo Black';transform:rotate(-10deg);box-shadow:0 0 60px rgba(223,255,0,.25)}
.ball:before,.ball:after{content:"";position:absolute;width:110%;height:58%;border:3px solid var(--ink);border-color:transparent transparent var(--ink);border-radius:50%;transform:rotate(45deg)}
.ball:after{transform:rotate(225deg)}
.ball span{font-size:14px;display:block}
.ticker{background:var(--ball);color:var(--ink);overflow:hidden;padding:15px 0;white-space:nowrap;font:400 17px 'Archivo Black';letter-spacing:.02em}
.ticker div{width:max-content;animation:ticker 24s linear infinite}
@keyframes ticker{to{transform:translateX(-50%)}
}
.intro,.process{background:var(--paper);color:var(--ink);padding:100px 4vw}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:700}
.intro h2,.process h2{font-size:clamp(4.5rem,10vw,10rem);margin:60px 0}
.intro h2 span,.process h2 span{color:transparent;-webkit-text-stroke:2px var(--ink)}
.intro-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:15vw;border-top:1px solid #bbb;padding-top:30px}
.intro-grid p{font-size:18px;line-height:1.6}
.intro-grid .lead{font:400 clamp(1.7rem,2.7vw,2.7rem)/1.15 'Archivo Black';text-transform:uppercase;letter-spacing:-.025em}
.services{padding:100px 4vw}
.section-head{padding-bottom:25px;border-bottom:1px solid #3a3a3a}
.service-list article{display:grid;grid-template-columns:60px 1fr 1fr;align-items:center;gap:30px;padding:36px 0;border-bottom:1px solid #3a3a3a}
.service-list article>span{color:var(--ball);font-size:13px}
.service-list h3{font:400 clamp(2.2rem,4.4vw,4.5rem)/.95 'Archivo Black';letter-spacing:-.035em;margin:0}
.service-list p{max-width:420px;line-height:1.6;opacity:.62}
.work{background:var(--ball);color:var(--ink);padding:100px 4vw}
.section-head.dark{border-color:rgba(0,0,0,.35)}
.project-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:22px;margin-top:60px}
.project{min-height:570px;padding:28px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.project p,.project span{font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.project h3{font:400 clamp(3.2rem,6vw,6.5rem)/.9 'Archivo Black';letter-spacing:-.045em;margin:10px 0 20px}
.project-a{grid-column:span 7;background:var(--violet);color:white}
.project-b{grid-column:span 5;background:var(--paper)}
.project-c{grid-column:3/span 8;background:var(--orange);min-height:700px;display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:30px}
.project-orb{width:250px;height:250px;border-radius:50%;background:var(--ball);color:var(--ink);display:grid;place-items:center;font:400 58px 'Archivo Black';align-self:flex-end}
.score-card{border:2px solid var(--ink);display:grid;text-align:center;padding:22px;transform:rotate(4deg)}
.score-card b{font:400 82px 'Archivo Black'}
.phone{background:var(--ink);color:white;border:10px solid var(--ink);border-radius:32px;aspect-ratio:9/16;max-width:300px;padding:18px;box-shadow:0 20px 40px rgba(0,0,0,.25);transform:rotate(-6deg)}
.phone-top{font-size:12px}
.phone-copy{font:400 58px/.92 'Archivo Black';letter-spacing:-.04em;margin-top:80px;color:var(--ball)}
.phone-button{background:var(--ball);color:var(--ink);border-radius:30px;text-align:center;padding:12px;margin-top:50px;font-weight:700}
.fineprint{font-size:12px;opacity:.55;margin-top:18px}
.process ol{list-style:none;margin:0;padding:0;border-top:1px solid #aaa}
.process li{display:grid;grid-template-columns:100px 1fr;padding:30px 0;border-bottom:1px solid #aaa}
.process li>span{font-weight:700}
.process li div{display:grid;grid-template-columns:1fr 1fr;gap:50px}
.process li b{font:400 27px 'Archivo Black';letter-spacing:-.025em}
.process li p{margin:0;line-height:1.5;max-width:430px}
.cta{padding:110px 4vw 90px;min-height:90vh;position:relative;overflow:hidden}
.cta h2{font-size:clamp(5rem,13vw,13rem);margin:70px 0}
.cta h2 span{color:var(--ball)}
.cta-ball{position:absolute;right:5vw;top:70px;width:220px;height:220px;border-radius:50%;background:var(--ball);color:var(--ink);display:grid;place-items:center;text-align:center;font:400 36px/.95 'Archivo Black';transform:rotate(10deg)}
.button-dark{background:var(--white)}
footer{padding:40px 4vw;border-top:1px solid #333;display:flex;align-items:center;gap:40px;font-size:12px;color:#888}
footer p:last-child{margin-left:auto}
@media(max-width:780px){.nav{height:76px}
.brand .wordmark b{font-size:29px}
.nav nav{display:none}
.button-small{font-size:12px;padding:11px 15px}
.hero{min-height:850px}
.hero h1{margin-top:90px}
.hero-bottom{align-items:start}
.hero-bottom p{max-width:230px}
.round-link{width:110px;height:110px}
.court-line{width:85vw;height:85vw;right:-56vw;top:300px}
.ball{width:90px;height:90px;left:-45px;font-size:36px}
.intro,.services,.work,.process{padding-top:75px;padding-bottom:75px}
.intro-grid{grid-template-columns:1fr;gap:10px}
.service-list article{grid-template-columns:35px 1fr}
.service-list p{grid-column:2}
.project-grid{display:flex;flex-direction:column}
.project{min-height:500px}
.project-c{display:flex;min-height:650px}
.phone{width:200px}
.phone-copy{font-size:52px}
.process li{grid-template-columns:50px 1fr}
.process li div{grid-template-columns:1fr;gap:12px}
.cta-ball{width:120px;height:120px;font-size:28px;top:50px}
.cta h2{margin-top:130px}
footer{align-items:flex-start;flex-wrap:wrap}
footer .wordmark{margin-right:10px}
footer p:last-child{margin-left:0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.ticker div{animation:none}
}