:root{--ink:#111;--ink-mid:#565656;--ink-faint:#969696;--ground:#fff;--ground-alt:#f5f5f3;--line:#e2e2df;--accent:#e05a2b;--page:1180px;--gutter:clamp(1.25rem,4vw,2.5rem);--sans:"DM Sans",system-ui,sans-serif;--mono:"DM Mono",ui-monospace,monospace}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--ground);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased}body.menu-open{overflow:hidden}::selection{color:#fff;background:var(--ink)}img{display:block;width:100%}a{color:inherit}.page{width:min(100%,var(--page));margin-inline:auto;padding-inline:var(--gutter)}.skip-link{position:fixed;z-index:100;top:.5rem;left:.5rem;padding:.7rem 1rem;background:var(--ink);color:#fff;transform:translateY(-150%)}.skip-link:focus{transform:none}
.site-header{position:fixed;z-index:20;inset:0 0 auto;height:4rem;background:rgb(255 255 255/.72);border-bottom:1px solid rgb(17 17 17/.08);backdrop-filter:blur(var(--header-blur,14px)) saturate(.8);-webkit-backdrop-filter:blur(var(--header-blur,14px)) saturate(.8)}.site-header::after{content:"";position:absolute;z-index:-1;inset:100% 0 auto;height:1.65rem;pointer-events:none;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);mask-image:linear-gradient(to bottom,#000,transparent);-webkit-mask-image:linear-gradient(to bottom,#000,transparent);opacity:.75}.header-inner{max-width:var(--page);height:100%;margin:auto;padding-inline:var(--gutter);display:flex;align-items:center;justify-content:space-between}.brand{position:relative;text-decoration:none;font-family:var(--mono);font-size:.82rem;font-weight:500;letter-spacing:.13em}.brand-text{position:relative}.brand-ghost{position:absolute;inset:0;color:var(--accent);opacity:.22;filter:blur(5px);transform:translate(var(--drift-x,0),var(--drift-y,0));transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .25s}.brand:hover .brand-ghost{opacity:.42}.primary-nav{display:flex;align-items:center;gap:2.2rem}.primary-nav a{color:var(--ink-mid);font-size:.82rem;text-decoration:none;transition:color .15s}.primary-nav a:hover,.primary-nav a:focus-visible{color:var(--ink)}.menu-button{display:none;border:0;padding:.4rem 0;background:none;font:400 .75rem var(--mono)}.menu-close{display:none}
.hero{padding-top:4rem;border-bottom:1px solid var(--line)}.hero-grid{min-height:min(720px,86vh);padding-block:clamp(7rem,14vw,11rem) clamp(5rem,10vw,8rem);display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem;align-items:end}.hero-heading{grid-column:span 8}.hero-intro{grid-column:9/span 4;max-width:22rem;justify-self:end}.eyebrow{margin:0 0 1.7rem;color:var(--ink-faint);font:400 .66rem/1.4 var(--mono);letter-spacing:.15em;text-transform:uppercase}h1{margin:0;font-size:clamp(3.25rem,7.15vw,6.4rem);font-weight:300;line-height:.98;letter-spacing:-.055em}h1 span{color:var(--accent);font-style:normal;font-weight:300}.hero-intro>p{margin:0;color:var(--ink-mid);font-size:.98rem;line-height:1.65}.text-links{display:flex;gap:1.2rem;margin-top:1.8rem}.text-links a,.project-link{font:400 .68rem var(--mono);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:.2rem}
.project{padding-block:clamp(4rem,8vw,7rem);border-top:1px solid var(--line)}.project-copy{display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem;margin-bottom:clamp(3rem,5vw,4.5rem)}.project-copy>div:first-child{grid-column:span 5}.project-description{grid-column:7/span 5}h2,h3,p{text-wrap:pretty}.project h2{margin:0;font-size:clamp(2.3rem,4vw,3.7rem);font-weight:300;line-height:1;letter-spacing:-.045em}.meta{margin:.85rem 0 0;color:var(--ink-faint);font:300 .66rem/1.5 var(--mono);text-transform:uppercase;letter-spacing:.08em}.project-description p{margin:0;color:var(--ink-mid);font-size:.96rem;line-height:1.65}.project-description .project-detail{margin-top:1.1rem}.project-link{display:inline-block;margin-top:1.6rem}.project-link:hover{color:var(--accent)}.media{margin:0;overflow:hidden;background:var(--ground-alt)}.media img{height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}a:hover .media img{transform:scale(1.015)}.funputs-film{width:100%;aspect-ratio:16/9;background:#111}.funputs-film video{display:block;width:100%;height:100%;object-fit:cover}.funputs-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}.funputs-gallery .media{aspect-ratio:1440/996}
.roli-project{background:var(--ground-alt)}.roli-collage{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(3,minmax(0,1fr));gap:1rem;aspect-ratio:12/10}.roli-tile{margin:0;min-width:0;min-height:0}.roli-tile.media,.roli-tile .media{width:100%;height:100%}a.roli-tile{text-decoration:none}.roli-tile .media img{width:100%;height:100%;object-fit:cover}.roli-ai{grid-column:1/9;grid-row:1/3}.roli-airwave{grid-column:9/13;grid-row:1/2}.roli-learn{grid-column:9/13;grid-row:2/3}.roli-games{grid-column:1/5;grid-row:3/4}.roli-gestures{grid-column:5/13;grid-row:3/4}.roli-ai img{object-position:center}.roli-airwave img{object-position:center 53%}.roli-learn img{object-position:center 49%}.roli-games img{object-position:center}.roli-gestures img{object-position:center 48%}.blokdust-gallery{display:grid;grid-template-columns:7fr 5fr;gap:1rem;align-items:start}.blokdust-primary img,.blokdust-secondary img{height:auto;object-fit:contain}.blokdust-secondary{display:grid;gap:1rem}.archive-media{background:var(--ground)}.archive-media img{height:auto;object-fit:contain}
.about{padding-block:clamp(6rem,11vw,10rem);border-top:1px solid var(--line);background:var(--ground-alt)}.about-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem}.about-title{grid-column:span 3;margin:0;font-size:.95rem}.about-grid>div{grid-column:4/span 7}.about-copy p{max-width:37rem;margin:0;color:var(--ink-mid);font-size:1rem;line-height:1.7}.about-copy p+p{margin-top:1.3rem}.footer{border-top:1px solid var(--line)}.footer-inner{min-height:5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;color:var(--ink-faint);font:300 .62rem var(--mono);text-transform:uppercase;letter-spacing:.07em}.footer-links{display:flex;align-items:center;gap:1rem}.footer-links a{display:grid;width:1.5rem;height:1.5rem;place-items:center;opacity:.55;transition:opacity .15s}.footer-links a:hover{opacity:1}.footer-links svg{width:1.15rem;height:1.15rem}
@media(max-width:760px){.site-header{background:rgb(255 255 255/.84)}.menu-button{display:block}.menu-button[aria-expanded=true] .menu-open{display:none}.menu-button[aria-expanded=true] .menu-close{display:inline}.primary-nav{position:fixed;inset:4rem 0 auto;display:none;padding:2rem var(--gutter) 2.5rem;background:rgb(255 255 255/.96);border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:1.25rem;backdrop-filter:blur(18px)}.primary-nav.is-open{display:flex}.hero-grid{min-height:640px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:3.5rem;padding-block:7.5rem 4.5rem}.hero-intro{max-width:26rem;align-self:flex-end}h1{font-size:clamp(3rem,14vw,5rem)}.project-copy{display:block}.project-description{margin-top:2rem}.funputs-gallery{grid-template-columns:1fr}.roli-collage{aspect-ratio:auto;grid-template-columns:1fr 1fr;grid-template-rows:auto}.roli-ai,.roli-airwave,.roli-learn,.roli-games,.roli-gestures{grid-column:auto;grid-row:auto}.roli-ai,.roli-airwave,.roli-gestures{grid-column:1/-1}.roli-tile .media{aspect-ratio:4/3}.roli-gestures .media{aspect-ratio:2/1}.blokdust-gallery{grid-template-columns:1fr}.archive-media{aspect-ratio:auto}.about-grid{display:block}.about-grid>div{margin-top:2rem}.footer-inner{align-items:center;flex-direction:row;justify-content:space-between}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}.brand-ghost{display:none}}