:root{--bg:#f3f3ef;--ink:#0a0a0b;--muted:#666762;--line:#d3d4ce;--acid:#d8ff3e;--card:#0d0e10;--card-text:#f7f7f2}
*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Manrope,system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}a{color:inherit;text-decoration:none}
header,main,footer{width:min(1180px,calc(100% - 48px));margin-inline:auto}
header{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.wordmark{display:flex;align-items:center;gap:8px;font-weight:800;font-size:1rem}.wordmark>span:first-child{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--acid);font:500 .9rem "DM Mono",monospace}.wordmark .dot{color:#84a800;margin-left:-7px}.domain{font:400 .75rem "DM Mono",monospace;color:var(--muted)}
main{flex:1}.intro{padding:clamp(74px,11vw,150px) 0 clamp(72px,10vw,126px);position:relative}.eyebrow{font:500 .75rem "DM Mono",monospace;text-transform:uppercase;letter-spacing:.12em;margin:0 0 28px;display:flex;align-items:center;gap:10px}.eyebrow:before{content:"";width:8px;height:8px;background:var(--acid);border-radius:50%;border:1px solid var(--ink)}h1{font-size:clamp(3.4rem,8.7vw,7.7rem);line-height:.92;letter-spacing:-.07em;margin:0;max-width:1050px}h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--ink)}.lede{font-size:1.05rem;color:var(--muted);margin:34px 0 0;max-width:460px}
.projects{padding-bottom:120px}.section-heading{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:22px}.section-heading h2{font-size:.8rem;text-transform:uppercase;letter-spacing:.14em;margin:0}.section-heading span{font:400 .7rem "DM Mono",monospace;color:var(--muted)}
.project-card{display:grid;grid-template-columns:55px 110px 1fr 70px;gap:22px;align-items:center;background:var(--card);color:var(--card-text);padding:34px;border-radius:18px;transition:transform .25s ease,box-shadow .25s ease;position:relative;overflow:hidden}.project-card:before{content:"";position:absolute;right:-150px;top:-220px;width:460px;height:460px;border:1px solid #2d3031;border-radius:50%;box-shadow:0 0 0 60px rgba(255,255,255,.018),0 0 0 120px rgba(255,255,255,.012)}.project-card:hover{transform:translateY(-4px);box-shadow:0 24px 60px rgba(10,10,11,.18)}.project-number{align-self:start;font:400 .7rem "DM Mono",monospace;color:#7f827c}.project-icon{width:86px;height:86px;border-radius:17px;background:var(--acid);color:var(--ink);display:grid;place-items:center;font:500 2.3rem "DM Mono",monospace;position:relative}.project-copy{position:relative;z-index:1}.project-label{font:500 .68rem "DM Mono",monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--acid);margin-bottom:8px}.project-copy h3{font-size:clamp(2rem,4vw,3.35rem);letter-spacing:-.055em;line-height:1;margin:0}.project-copy p{color:#aeb1aa;margin:14px 0 20px;max-width:580px;line-height:1.55}.tags{display:flex;flex-wrap:wrap;gap:7px}.tags span{font:400 .67rem "DM Mono",monospace;border:1px solid #35383a;color:#c8cac4;border-radius:100px;padding:5px 10px}.open-arrow{width:52px;height:52px;border:1px solid #3e4142;border-radius:50%;display:grid;place-items:center;font-size:1.35rem;position:relative;z-index:1;transition:background .2s,color .2s,border-color .2s}.project-card:hover .open-arrow{background:var(--acid);border-color:var(--acid);color:var(--ink)}
footer{height:92px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;color:var(--muted);font:400 .72rem "DM Mono",monospace}
@media(max-width:700px){header,main,footer{width:min(100% - 30px,1180px)}header{height:72px}.intro{padding:70px 0 80px}h1{font-size:clamp(3.1rem,16vw,5.2rem)}.lede{font-size:1rem}.projects{padding-bottom:70px}.project-card{grid-template-columns:72px 1fr 44px;padding:24px 20px;gap:16px}.project-number{display:none}.project-icon{width:70px;height:70px}.open-arrow{width:42px;height:42px}.project-copy{grid-column:1/-1}.project-copy h3{font-size:2.35rem}.project-copy p{font-size:.94rem}footer{height:90px}}
@media(prefers-reduced-motion:reduce){.project-card,.open-arrow{transition:none}}