@font-face{font-family:"Space Grotesk";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/space-grotesk-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/space-grotesk-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/space-grotesk-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2")}

:root{
  --ground:#0C0C0E;--surface:#17171B;--line:#2A2A30;--text:#F2F2EE;--muted:#A3A3A8;
  --orange:#FF5B1F;--lilac:#B8A6FF;--lime:#CBFF3B;--offwhite:#F2F2EE;--blue:#3355FF;
  --dark:#0C0C0E;
  --sans:"Space Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--ground);color:var(--text);font-family:var(--sans);-webkit-text-size-adjust:100%}
body{min-height:100vh;display:flex;flex-direction:column;line-height:1.4}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--mono);font-weight:500;font-size:.8125rem;letter-spacing:.04em}
:focus-visible{outline:2px solid var(--lime);outline-offset:3px}

/* Top split */
.hero{display:grid;grid-template-columns:1fr 1fr;min-height:min(86vh,820px)}
.brand{background:var(--orange);color:var(--dark);padding:clamp(20px,3vw,40px);display:flex;flex-direction:column;justify-content:space-between;min-width:0;overflow:hidden}
.brand-top{display:flex;justify-content:space-between;gap:16px}
.wordmark{font-weight:700;font-size:clamp(4rem,15.5vw,15rem);line-height:.8;letter-spacing:-.06em;white-space:nowrap;margin-left:-.04em}
.links{padding:clamp(20px,3vw,40px);display:flex;flex-direction:column;justify-content:center;gap:clamp(24px,4vh,44px)}
.group h2{font-family:var(--mono);font-weight:400;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.group ul{list-style:none;border-top:1px solid var(--line)}
.group li{border-bottom:1px solid var(--line)}
.link{display:flex;align-items:center;gap:16px;padding:16px 0;font-size:clamp(1.25rem,2.2vw,1.75rem);font-weight:500;transition:padding .2s,color .2s}
.link i{width:12px;height:12px;flex:none;background:var(--c)}
.link span{flex:1}
.link b{font-weight:400;color:var(--muted);transition:transform .2s,color .2s}
.link:hover,.link:focus-visible{padding-left:8px}
.link:hover b,.link:focus-visible b{color:var(--text);transform:translate(3px,-3px)}

/* Artwork */
.art{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border-block:1px solid var(--line)}
.slot{aspect-ratio:4/5;background:var(--surface);display:flex;align-items:flex-end;justify-content:space-between;padding:16px;color:var(--muted);overflow:hidden}
.slot img{width:100%;height:100%;object-fit:cover}

/* Contact */
.contact{display:grid;grid-template-columns:1fr 1fr}
.write{background:var(--lime);color:var(--dark);padding:clamp(20px,3vw,40px);display:flex;align-items:flex-end;min-height:260px}
.write h2{font-weight:700;font-size:clamp(3rem,9vw,8rem);line-height:.88;letter-spacing:-.05em}
.form-wrap{background:var(--surface);padding:clamp(20px,3vw,40px)}
form{display:grid;gap:22px;max-width:560px}
label{display:grid;gap:6px}
label span{font-family:var(--mono);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
input,select,textarea{font:inherit;font-size:1.0625rem;color:var(--text);background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:8px 0;width:100%;transition:border-color .2s}
input:focus,select:focus,textarea:focus{outline:0;border-bottom-color:var(--lime)}
select{appearance:none;cursor:pointer;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23A3A3A8' stroke-width='1.5'/%3E%3C/svg%3E") right 2px center no-repeat}
select option{background:var(--surface);color:var(--text)}
textarea{resize:vertical;min-height:110px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
button{justify-self:start;font:inherit;font-weight:500;font-size:1rem;background:var(--offwhite);color:var(--dark);border:0;padding:14px 26px;cursor:pointer;transition:background .2s}
button:hover{background:var(--lime)}
button:disabled{opacity:.6;cursor:wait}
.status{font-family:var(--mono);font-size:.875rem;min-height:1.4em}
.status.ok{color:var(--lime)}
.status.err{color:var(--orange)}

footer{display:flex;justify-content:space-between;padding:20px clamp(20px,3vw,40px);color:var(--muted);border-top:1px solid var(--line);margin-top:auto}

@media (max-width:800px){
  .hero,.contact{grid-template-columns:1fr}
  .hero{min-height:0}
  .brand{min-height:62vh}
  .wordmark{font-size:27vw}
  .write{min-height:200px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Legal pages */
.legal{max-width:760px;padding:clamp(20px,3vw,40px);padding-bottom:80px}
.legal .back{display:inline-block;color:var(--muted);margin-bottom:48px}
.legal .back:hover{color:var(--lime)}
.legal h1{font-weight:700;font-size:clamp(2.5rem,7vw,5rem);line-height:.95;letter-spacing:-.04em;margin-bottom:40px}
.legal h2{font-family:var(--mono);font-weight:500;font-size:.8125rem;letter-spacing:.1em;text-transform:uppercase;color:var(--lime);margin:36px 0 10px}
.legal p,.legal li{color:var(--text);margin-bottom:10px;font-size:1.0625rem}
.legal ul{padding-left:1.2em}
.legal a{text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.legal a:hover{text-decoration-color:var(--lime)}
.todo{background:var(--orange);color:var(--dark);padding:0 4px}
footer nav{display:flex;gap:20px}
footer a:hover{color:var(--lime)}
.legal h3{font-weight:500;font-size:1.25rem;margin:24px 0 8px}