:root{--bg: #000;--surface: #141414;--surface-2: #1c1c1c;--border: #262626;--text: #f2f2f2;--muted: #8a8a8a;--ease: cubic-bezier(.22, 1, .36, 1);--gutter: clamp(16px, 4vw, 32px);--max: 1280px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,sans-serif;font-weight:300;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}.muted{color:var(--muted)}.eyebrow{color:var(--muted);font-size:14px;margin-bottom:32px}section{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}.nav{position:fixed;inset:0 0 auto 0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:20px var(--gutter);font-size:15px;transition:background .3s,backdrop-filter .3s}.nav.scrolled{background:#0009;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.nav nav{display:flex;gap:24px;font-size:13px;color:var(--muted)}.nav nav a,.nav-name{transition:color .2s}.nav nav a:hover{color:var(--text)}.hero{padding-top:clamp(140px,22vh,220px);padding-bottom:64px}h1{font-size:clamp(40px,6vw,72px);font-weight:300;line-height:1.1;letter-spacing:-.03em}h1 .line{display:block}.word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em}.word>span{display:inline-block;transform:translateY(105%);transition:transform .9s var(--ease);transition-delay:var(--d)}.loaded .word>span{transform:none}.hero-sub{margin-top:24px;font-size:18px;color:var(--muted)}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}.btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border:1px solid var(--border);border-radius:999px;background:var(--surface);font-size:14px;font-weight:400;transition:transform .3s var(--ease),background .2s,border-color .2s}.btn svg{width:16px;height:16px;flex-shrink:0}.btn:hover{transform:translateY(-2px);background:var(--surface-2);border-color:#3a3a3a}.btn:active{transform:translateY(0) scale(.97)}.btn-primary{background:var(--text);color:var(--bg);border-color:var(--text)}.btn-primary:hover{background:#fff;border-color:#fff}.actions.large .btn{height:52px;padding:0 24px;font-size:16px}.actions.large .btn svg{width:18px;height:18px}.projects{max-width:none;padding:0;margin-bottom:160px}.track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter);padding:0 max(var(--gutter),calc((100vw - var(--max)) / 2 + var(--gutter)));scrollbar-width:none;cursor:grab}.track::-webkit-scrollbar{display:none}.track.dragging{cursor:grabbing;scroll-snap-type:none;-webkit-user-select:none;user-select:none}.card{flex:0 0 min(560px,86vw);scroll-snap-align:start;background:var(--surface);border-radius:16px;overflow:hidden;transition:transform .5s var(--ease)}.card:hover{transform:translateY(-4px)}.card-media{position:relative;aspect-ratio:4 / 3;background:radial-gradient(circle at var(--mx, 50%) var(--my, 40%),hsl(var(--h) 60% 45% / .55),transparent 60%),linear-gradient(160deg,hsl(var(--h) 30% 16%),#0c0c0c);display:grid;place-items:center;transition:background-position .3s}.placeholder-label{font-size:12px;color:#fff6;letter-spacing:.04em;text-transform:uppercase}.card-body{padding:24px}.card-head{display:flex;justify-content:space-between;gap:16px}.card h3{font-size:20px;font-weight:400;margin-bottom:4px}.card-arrow svg{width:20px;height:20px;color:var(--muted);transition:transform .4s var(--ease),color .2s}.card:hover .card-arrow svg{transform:translate(3px,-3px);color:var(--text)}.tags{display:flex;gap:6px;list-style:none;margin:16px 0 24px}.tags li{font-size:12px;padding:4px 10px;border-radius:999px;background:var(--surface-2);color:var(--muted)}blockquote{border-top:1px solid var(--border);padding-top:20px;font-size:15px}cite{display:block;margin-top:10px;font-style:normal;font-size:13px;color:var(--muted)}.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(32px,6vw,96px);align-items:center;margin-bottom:160px}.portrait{aspect-ratio:4 / 5;border-radius:16px;background:linear-gradient(160deg,#262626,#0e0e0e);display:grid;place-items:center}h2{font-size:clamp(28px,3.6vw,44px);font-weight:300;line-height:1.15;letter-spacing:-.02em;margin-bottom:24px}.about p.muted{font-size:17px;margin-bottom:16px;max-width:560px}.approach{margin-bottom:160px}.approach ol{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.approach li{padding:24px;border-top:1px solid var(--border);transition:border-color .4s}.approach li:hover{border-color:var(--text)}.step-num{display:block;font-size:13px;color:var(--muted);margin-bottom:40px;font-variant-numeric:tabular-nums}.approach h3{font-size:18px;font-weight:400;margin-bottom:8px}.approach p{font-size:15px}.work{margin-bottom:160px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.tile{aspect-ratio:1;border-radius:12px;background:linear-gradient(160deg,hsl(var(--h) 25% 18%),#0e0e0e);display:grid;place-items:center;transition:transform .5s var(--ease),filter .3s}.tile:hover{transform:scale(1.02);filter:brightness(1.25)}.contact{padding-bottom:120px}.contact h2{font-size:clamp(36px,5vw,64px)}.footer{max-width:var(--max);margin:0 auto;padding:32px var(--gutter);border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted)}.footer-icons{display:flex;gap:18px}.footer-icons svg{width:18px;height:18px;transition:color .2s,transform .3s var(--ease)}.footer-icons a:hover svg{color:var(--text);transform:translateY(-2px)}.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i, 0) * 90ms)}.reveal.in{opacity:1;transform:none}.hero .reveal{transition-delay:.45s}.hero .reveal+.reveal{transition-delay:.6s}.card.reveal.in:hover{transform:translateY(-4px)}@media(max-width:860px){.about{grid-template-columns:1fr}.portrait{max-width:360px}.approach ol,.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:480px){.nav nav{gap:16px}.approach ol{grid-template-columns:1fr}.actions .btn{flex:1 1 auto;justify-content:center}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;transition-delay:0ms!important}}
