@font-face{font-family:Manrope;src:url('/assets/manrope-variable.ttf') format('truetype');font-weight:200 800;font-display:swap}
@font-face{font-family:Instrument;src:url('/assets/instrument-serif-italic.ttf') format('truetype');font-style:italic;font-weight:400;font-display:swap}
@font-face{font-family:ArchivoBlack;src:url('/assets/archivo-black.ttf') format('truetype');font-weight:900;font-display:swap}
:root{--ink:#191917;--paper:#f4f2e9;--silver:#e6e2d8;--muted:#696960;--line:#19191730;--gutter:clamp(22px,4vw,70px);--ease:cubic-bezier(.22,1,.36,1);font-family:Manrope,Arial,sans-serif;font-synthesis:none;color:var(--ink);background:var(--paper);color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer;border:0;background:none;touch-action:manipulation}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}p,h1,h2,h3{margin:0}h1,h2,h3{font-weight:500}em{font-family:Instrument,Georgia,serif;font-weight:400;letter-spacing:-.035em}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #191917;outline-offset:6px}[hidden]{display:none!important}.icon{width:20px;height:20px;display:inline-block;vertical-align:middle;flex-shrink:0;pointer-events:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link{position:fixed;top:-100px;left:20px;z-index:1000;padding:16px 22px;background:var(--silver);color:var(--ink)}.skip-link:focus{top:15px}
/* A contact sheet of moving images. Native formats determine the rhythm. */
.loop-gallery{padding:42px var(--gutter) 80px;--mosaic-gap:16px}.loop-gallery-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;gap:25px}.loop-gallery-top h2{font-size:11px;font-weight:500;letter-spacing:.01em}.loop-motion{display:grid;place-items:center;width:34px;height:34px;border:1px solid #19191735;border-radius:50%;font-size:11px;line-height:1;color:#5e5e55}.loop-motion:hover{background:#e6e2d8;color:var(--ink)}.mosaic-opening{display:grid;grid-template-columns:2.1fr 1fr;gap:var(--mosaic-gap);align-items:start}.mosaic-lead,.mosaic-side{min-width:0}.mosaic-side{display:grid;gap:var(--mosaic-gap)}.loop-work{margin:0;min-width:0;position:relative}.loop-media{position:relative;display:block;width:100%;aspect-ratio:var(--media-ratio);overflow:hidden;background:#191917;isolation:isolate}.loop-media>img,.loop-media>video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.loop-media>img{z-index:0}.loop-media>video{z-index:1;opacity:0;transition:opacity .4s ease}.loop-media>video.is-playing{opacity:1}.loop-caption{position:absolute;inset:auto 0 0;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:18px;padding:28px 15px 13px;background:linear-gradient(0deg,#000a,transparent);color:#fff;font-size:10px;line-height:1.4;opacity:0;transition:opacity .25s ease;pointer-events:none}.loop-caption>span:first-child{font-weight:500}.loop-caption>span:last-child{font-size:9px;white-space:nowrap;color:#fffd}.loop-media:hover .loop-caption{opacity:1}.mosaic-cinema{display:grid;grid-template-columns:1fr 1fr;gap:var(--mosaic-gap);align-items:start;margin-top:var(--mosaic-gap)}.mosaic-studies{display:grid;grid-template-columns:3fr 1fr;gap:var(--mosaic-gap);align-items:start;margin-top:var(--mosaic-gap)}.still-sheet{margin:0;min-width:0;display:grid;gap:var(--mosaic-gap)}.still-row{display:flex;gap:var(--mosaic-gap);align-items:stretch}.still-cell{position:relative;display:block;min-width:0;flex:var(--still-ratio) 1 0%;aspect-ratio:var(--still-ratio);padding:0;overflow:hidden;background:#ddd9ce}.still-cell>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
/* Curated work shares a baseline while retaining each original composition. */
.curated-cinema{display:flex;gap:var(--mosaic-gap);align-items:flex-start;margin-top:var(--mosaic-gap)}.curated-cinema>.loop-work{min-width:0}.curated-cinema>.loop-work:first-child{flex:2.335766 1 0%}.curated-cinema>.loop-work:last-child{flex:2.38806 1 0%}.curated-series{display:flex;gap:var(--mosaic-gap);align-items:stretch;margin:var(--mosaic-gap) 0 0}
@media(max-width:760px){.curated-cinema,.curated-series{display:grid;grid-template-columns:1fr}.curated-cinema>.still-cell{margin-bottom:0}.curated-series>.still-cell{margin-bottom:0}}
.picture-set{margin:var(--mosaic-gap) 0 0;display:grid;gap:var(--mosaic-gap)}.picture-row{display:flex;gap:var(--mosaic-gap);align-items:stretch}.loop-gallery-top{justify-content:flex-end}.picture-feature{display:grid;grid-template-columns:.86fr 1fr;gap:var(--mosaic-gap);align-items:start}.picture-column{display:grid;gap:var(--mosaic-gap)}
@media(max-width:760px){.picture-feature{grid-template-columns:1fr}.picture-column>.still-cell{margin-bottom:0}.picture-row{display:grid;grid-template-columns:1fr}.picture-row>.still-cell{margin-bottom:0}.artist-contact{width:100%}}
/* A split studio poster, composed around the actual Milo characters. */
.poster-cover{position:relative;min-height:clamp(590px,60vw,740px);margin:0 var(--gutter);border-bottom:1px solid var(--line);isolation:isolate;overflow:clip}
.poster-copy{position:relative;z-index:2;width:42%;padding-top:clamp(55px,7vw,110px);padding-bottom:66px}
.poster-wordmark{font-family:ArchivoBlack,Manrope,Arial,sans-serif;font-size:clamp(80px,12vw,184px);font-weight:900;letter-spacing:-.065em;line-height:.83;margin-left:0}
.poster-wordmark>span{display:block}
.poster-services{font-size:clamp(14px,1.35vw,20px);line-height:1.45;letter-spacing:-.035em;margin-top:30px}
.poster-contact{display:flex;align-items:center;justify-content:space-between;gap:34px;width:max-content;max-width:100%;min-height:52px;padding:14px 22px;margin-top:25px;font-size:12px;border-radius:100px;border:1px solid #fff;background:linear-gradient(145deg,#ffffffab,#ffffff20);box-shadow:inset 0 0 0 1px #ffffff40,0 8px 20px #19191708;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:box-shadow .3s,background .3s}
.poster-contact>span{font-size:22px;line-height:1;transition:transform .3s var(--ease)}.poster-contact:hover{background:#ffffffa0;box-shadow:inset 0 0 0 1px #fff,0 10px 22px #1919170d}.poster-contact:hover>span{transform:translate(2px,-2px)}
.poster-art{position:absolute;z-index:1;width:110%;left:15%;bottom:56px;margin:0;pointer-events:none}.poster-art>img{width:100%;height:auto;max-width:none;filter:drop-shadow(0 20px 18px #1919170a)}
.poster-down{position:absolute;bottom:20px;right:0;display:grid;place-items:center;width:36px;height:36px;font-size:26px;line-height:1}.poster-down:hover>span{transform:translateY(3px)}.poster-down>span{transition:transform .3s var(--ease)}
.intro-motion .poster-art{animation:poster-enter .9s var(--ease) backwards}.intro-motion .poster-copy{animation:poster-enter .7s var(--ease) .1s backwards}@keyframes poster-enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
/* Display-only work: no links, buttons, hover actions or media controls. */
.loop-media,.still-cell{cursor:default}.loop-media>img,.loop-media>video,.still-cell>img{pointer-events:none}.loop-caption{user-select:none}.loop-gallery{padding-top:32px}
/* One compact contact line, then a short, heavy signature. */
.artist-line{margin:0 var(--gutter);padding:30px 0 32px;border-top:1px solid #19191730;display:flex;justify-content:flex-end;align-items:center}.artist-line h2{font-size:42px;font-weight:600;letter-spacing:-.065em;line-height:1}.artist-line>p{font-size:13px;line-height:1.65;color:#626259}.collab-link{display:flex;align-items:center;justify-content:space-between;gap:45px;width:max-content;max-width:100%;padding:16px 20px;background:var(--ink);color:var(--paper);font-size:12px;transition:background .25s,transform .35s var(--ease)}.collab-link>span{font-size:23px;line-height:1}.collab-link:hover{background:#3e3e36;transform:translateY(-2px)}.collab-handle{display:block;font-size:9px;line-height:1.5;color:#626259;margin-top:9px}.site-footer{padding:24px var(--gutter) 30px;border-top:1px solid #19191730;background:var(--paper);overflow:hidden}.footer-wordmark{display:block;width:max-content;font-family:ArchivoBlack,Manrope,Arial,sans-serif;font-size:clamp(48px,14vw,220px);font-weight:900;font-style:normal;letter-spacing:-.065em;line-height:1.04;white-space:nowrap}
@media(max-width:1100px){.loop-gallery{--mosaic-gap:13px;padding-bottom:65px}.loop-caption{font-size:10px;padding:23px 11px 10px;gap:12px}.mosaic-side .loop-caption{font-size:9px}}
@media(max-width:760px){:root{--gutter:24px}.poster-cover{min-height:0;display:flex;flex-direction:column;padding:28px 0 58px}.poster-copy{display:contents}.poster-wordmark{order:0;font-size:14.4vw;line-height:1;letter-spacing:-.065em;margin:0 0 12px;white-space:nowrap}.poster-wordmark>span{display:inline}.poster-art{order:1;position:relative;left:0;bottom:auto;width:100%;aspect-ratio:1.45;overflow:visible}.poster-art>img{position:absolute;width:180%;left:-40%;bottom:0}.poster-services{order:2;margin-top:20px;font-size:15px;line-height:1.4}.poster-services br{display:none}.poster-services br:after{content:' '}.poster-contact{order:3;margin-top:16px;min-height:48px;font-size:12px;gap:40px;padding:12px 20px}.poster-down{bottom:19px}.loop-gallery{--mosaic-gap:13px;padding-top:18px;padding-bottom:40px}.loop-gallery-top{margin-bottom:16px}.loop-gallery-top h2{font-size:10px}.loop-motion{width:36px;height:36px}.mosaic-opening{grid-template-columns:1fr}.mosaic-side{gap:var(--mosaic-gap)}.mosaic-cinema{grid-template-columns:1fr}.mosaic-studies{grid-template-columns:1fr}.loop-caption,.mosaic-side .loop-caption{opacity:1;font-size:10px;padding:24px 12px 10px;gap:14px}.still-sheet{display:block;columns:2;column-gap:var(--mosaic-gap)}.still-row{display:contents}.still-cell{display:block;width:100%;margin-bottom:var(--mosaic-gap);break-inside:avoid;flex:none}.loop-portrait{width:65%;justify-self:end}.artist-line{grid-template-columns:1fr;gap:18px;padding:24px 0}.artist-line>p{font-size:12px}.collab-link{width:100%;font-size:13px;padding:16px 20px}.collab-handle{font-size:10px}.site-footer{padding-top:22px;padding-bottom:25px}.footer-wordmark{font-size:14vw}}
@media(max-width:390px){:root{--gutter:20px}}
@media(max-width:350px){.poster-services{font-size:13px}.loop-gallery{--mosaic-gap:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
