@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Space+Grotesk:wght@500;600;700&display=swap";:root{--hue:250;--bg-a:hsl(var(--hue) 45% 8%);--bg-b:hsl(calc(var(--hue) + 40) 55% 14%);--fg:#f4f5fb;--fg-dim:#f4f5fba6;--accent:#7c5cff;--panel-bg:#0f101c8c;--border:#ffffff14;--font-display:"Space Grotesk", "Inter", sans-serif;--font-body:"Inter", sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}body{font-family:var(--font-body);color:var(--fg);background:linear-gradient(160deg, var(--bg-a), var(--bg-b));transition:background .6s;overflow-x:hidden}#webgl{z-index:0;display:block;position:fixed;inset:0}main{z-index:1;position:relative}h1,h2,h3{font-family:var(--font-display);margin:0 0 .5em;line-height:1.05}a{color:inherit}#progress{z-index:50;background:#ffffff0f;width:100%;height:3px;position:fixed;top:0;left:0}#progress-bar{transform-origin:0;background:linear-gradient(90deg,#7c5cff,#00e0ff);width:100%;height:100%;transform:scaleX(0)}.site-header{z-index:40;mix-blend-mode:difference;justify-content:space-between;align-items:center;padding:1.5rem clamp(1.5rem,5vw,4rem);display:flex;position:fixed;top:0;left:0;right:0}.logo{font-family:var(--font-display);letter-spacing:.05em;color:var(--fg);font-size:1.1rem;font-weight:700;text-decoration:none}.logo span{color:#00e0ff}.site-nav{gap:clamp(1rem,3vw,2.5rem);display:flex}.site-nav a{color:var(--fg);opacity:.85;font-size:.9rem;text-decoration:none;transition:opacity .2s}.site-nav a:hover{opacity:1}.panel{flex-direction:column;justify-content:center;min-height:100vh;padding:clamp(7rem,14vw,9rem) clamp(2rem,8vw,6rem) clamp(3rem,8vw,6rem);display:flex}#hero{align-items:flex-start;position:relative}.eyebrow{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.15em;color:var(--fg-dim);margin-bottom:1rem;font-size:.8rem}.hero-copy h1{max-width:12ch;font-size:clamp(2.4rem,7vw,5.2rem);font-weight:600}.accent{background:linear-gradient(90deg,#7c5cff,#00e0ff);color:#0000;-webkit-background-clip:text;background-clip:text}.hero-sub{color:var(--fg-dim);max-width:40ch;font-size:clamp(1rem,1.5vw,1.2rem)}.scroll-cue{border:2px solid var(--fg-dim);cursor:pointer;background:0 0;border-radius:20px;width:28px;height:44px;padding:0;position:absolute;bottom:clamp(1.5rem,5vw,3rem);left:clamp(2rem,8vw,6rem)}.scroll-cue span{background:var(--fg);border-radius:2px;width:4px;height:8px;margin:6px auto 0;animation:1.6s infinite scroll-cue-move;display:block}@keyframes scroll-cue-move{0%{opacity:1;transform:translateY(0)}70%{opacity:0;transform:translateY(14px)}to{opacity:0;transform:translateY(0)}}.panel-text{max-width:46rem}.panel-text h2{font-size:clamp(1.8rem,4vw,2.6rem)}.panel-text p{color:var(--fg-dim);font-size:clamp(1rem,1.4vw,1.15rem);line-height:1.6}.section-title{margin-bottom:2.5rem;font-size:clamp(1.8rem,4vw,2.6rem)}.work-track{flex-direction:column;gap:1.5rem;display:flex}.work-card{--accent:#7c5cff;border:1px solid var(--border);background:var(--panel-bg);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:1.25rem;grid-template-columns:auto 1fr;align-items:center;gap:clamp(1.5rem,4vw,3rem);padding:clamp(1.5rem,3vw,2.5rem);transition:border-color .3s,transform .3s;display:grid;position:relative}.work-card:hover{border-color:var(--accent);transform:translateY(-4px)}.work-index{font-family:var(--font-display);color:var(--accent);writing-mode:vertical-rl;font-size:.85rem}.work-visual{display:none}.work-category{text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin:0 0 .4rem;font-size:.75rem}.work-info h3{font-size:clamp(1.4rem,3vw,2rem)}.work-desc{color:var(--fg-dim);max-width:60ch;line-height:1.6}.work-tags{flex-wrap:wrap;gap:.5rem;margin:.75rem 0 1rem;padding:0;list-style:none;display:flex}.work-tags li{border:1px solid var(--border);color:var(--fg-dim);border-radius:999px;padding:.3rem .7rem;font-size:.75rem}.work-link{color:var(--accent);font-weight:500;text-decoration:none;display:inline-block}@media (width<=640px){.work-card{grid-template-columns:1fr}.work-index{writing-mode:horizontal-tb}}.panel-contact{max-width:40rem}.contact-form{flex-direction:column;gap:1.1rem;margin-top:1.5rem;display:flex}.hp-field{opacity:0;width:1px;height:1px;position:absolute;left:-9999px}.field{flex-direction:column;gap:.4rem;display:flex}.field label{color:var(--fg-dim);font-size:.85rem}.field input,.field textarea{font-family:var(--font-body);border:1px solid var(--border);color:var(--fg);resize:vertical;background:#ffffff0a;border-radius:.6rem;padding:.75rem 1rem;font-size:1rem}.field input:focus,.field textarea:focus{border-color:var(--accent);outline:none}.contact-form button{color:#08080f;cursor:pointer;background:linear-gradient(90deg,#7c5cff,#00e0ff);border:none;border-radius:999px;align-self:flex-start;padding:.8rem 1.8rem;font-weight:600;transition:transform .2s}.contact-form button:hover{transform:translateY(-2px)}.form-status{min-height:1.2em;font-size:.9rem}.form-status[data-state=success]{color:#5cffb0}.form-status[data-state=error]{color:#ff5c8a}.site-footer{color:var(--fg-dim);border-top:1px solid var(--border);justify-content:space-between;align-items:center;padding:2rem clamp(1.5rem,5vw,4rem);font-size:.85rem;display:flex}.socials{gap:1.2rem;display:flex}.socials a{color:var(--fg-dim);text-decoration:none}.socials a:hover{color:var(--fg)}
