@font-face{font-family:Simplex;src:url('assets/simplex.ttf')}@font-face{font-family:Simplex;src:url('assets/simplex-bold.ttf');font-weight:700}
:root{--orange:#ff5a00;--paper:#fffef8;--ink:#111;--pad:20px;--type:clamp(14px,1.15vw,18px);--column:350px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:var(--type)/1.25 Simplex,serif}body>*{animation:appear .45s both}@keyframes appear{from{opacity:0}to{opacity:1}}::selection{background:var(--orange);color:white}a{color:inherit;text-decoration:none;transition:color .22s ease}.site-header{display:grid;grid-template-columns:140px var(--column) 1fr;align-items:start;padding:22px var(--pad) 0;min-height:92px;position:relative;z-index:5}.brand{font-weight:700;white-space:nowrap}.brand:hover,.site-nav a:hover,.site-nav a.active,footer a:hover{color:var(--orange)}.lead{width:var(--column);margin:0;text-indent:5em}.site-nav{display:grid;grid-template-columns:repeat(3,max-content);justify-content:space-between;gap:30px;padding-left:20px}.site-nav a{white-space:nowrap}.mobile-contacts{display:none}.intro-stair{position:relative;height:156px}.intro-stair p{position:absolute;width:var(--column);margin:0;text-align:left;text-indent:5em}.intro-stair .statement{left:410px;top:-24px}.intro-stair .clients{left:720px;top:30px}.project-list{padding-top:8px}.project-card{padding-top:78px}.project-copy{width:540px;margin-left:auto;margin-right:var(--pad);display:grid;grid-template-columns:max-content 300px;align-items:start;gap:0}.project-copy h2{margin:0;align-self:start;font-size:inherit;line-height:1.15;text-align:right;white-space:nowrap}.project-copy p{width:300px;margin:0;text-indent:5em;text-align:left}.project-media{display:block;width:calc(100% - var(--pad)*2);margin:18px var(--pad) 0;background:#f0eee8}.project-media img,.project-media video{display:block;width:100%;aspect-ratio:16/7;object-fit:cover}.project-page{min-height:100vh}.project-page .project-copy{margin-top:76px}.project-page .project-copy time{grid-column:2;justify-self:end;margin-top:36px}.project-page .project-copy .description{width:300px}.project-page .project-copy .description p{width:100%;margin:0}.project-page .project-copy .description p+p{margin-top:.1em}.project-page .project-media{margin-top:22px}.gallery{display:grid;gap:14px;padding:0 var(--pad);margin-top:22px}.gallery img{width:100%;display:block}.floating-header{position:fixed;left:0;top:0;width:100%;z-index:20;display:grid;grid-template-columns:140px 1fr;align-items:center;padding:14px var(--pad);background:var(--ink);color:var(--paper);transform:translateY(-110%);opacity:0;transition:transform .28s ease,opacity .28s ease}.floating-header.visible{transform:translateY(0);opacity:1}.floating-header nav{display:grid;grid-template-columns:repeat(3,max-content);justify-content:space-between;gap:30px;margin-left:20px}.floating-header a:hover{color:var(--orange)}footer{display:grid;grid-template-columns:1fr repeat(3,max-content);gap:32px;align-items:end;padding:72px var(--pad) 20px;font-size:.9em}.contacts-main{min-height:calc(100vh - 160px);padding:clamp(120px,23vh,260px) var(--pad) 30px;display:flex;align-items:flex-end}.contacts-list{width:min(610px,70vw);font-size:clamp(26px,3.2vw,54px);line-height:1.08}.contacts-list a{display:block;width:max-content;max-width:100%;overflow-wrap:anywhere}.contacts-list .messengers{display:flex;gap:.25em;flex-wrap:wrap}.playground-page{overflow:hidden}.playground-page .site-header{position:fixed;width:100%;pointer-events:none}.playground-page .site-header a{pointer-events:auto}.playground-scene{position:fixed;inset:0;overflow:hidden;touch-action:none}.playground-hint{position:fixed;z-index:6;bottom:20px;left:50%;transform:translateX(-50%);font-size:14px;pointer-events:none}.play-item{position:absolute;cursor:pointer}.play-item.landscape{width:520px}.play-item.portrait{width:280px}.play-thumb{display:flex;align-items:center;justify-content:center;overflow:hidden}.play-thumb img,.play-thumb video{display:block;max-width:100%;max-height:100%;width:auto;height:auto}.play-item.landscape .play-thumb{aspect-ratio:16/9}.play-item.portrait .play-thumb{aspect-ratio:3/4}.play-title,.play-meta{opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}.play-title{margin-top:7px}.play-meta{font-size:.82em;opacity:0}.play-item:hover .play-title,.play-item:hover .play-meta,.play-item.active .play-title,.play-item.active .play-meta{opacity:1;transform:none}
@media (max-width:1120px) and (min-width:701px){:root{--pad:16px;--column:300px;--type:clamp(13px,1.55vw,16px)}.site-header{grid-template-columns:110px var(--column) 1fr}.intro-stair{height:135px}.intro-stair .statement{left:36vw;top:-20px}.intro-stair .clients{left:62vw;top:28px}.project-copy{width:470px;grid-template-columns:max-content 265px}.project-copy p,.project-page .project-copy .description{width:265px}.project-card{padding-top:60px}.play-item.landscape{width:410px}.play-item.portrait{width:230px}}
@media (max-width:700px){:root{--pad:14px;--type:16px;--column:min(78vw,350px)}body{line-height:1.22}.site-header{grid-template-columns:1fr max-content max-content;gap:18px;padding:16px var(--pad) 0;min-height:52px}.brand{font-size:14px}.lead,.site-nav a[href*="contacts"]{display:none}.site-nav{display:contents}.site-nav a{font-size:14px}.site-nav a[href*="playground"]{grid-column:2}.site-nav a[href*="drive.google"]{grid-column:3}.mobile-contacts{display:grid;grid-template-columns:repeat(3,max-content);gap:16px;padding:70px var(--pad) 20px;font-size:14px}.intro-stair{display:none}.project-list{padding-top:40px}.project-card{padding-top:50px}.project-copy,.project-page .project-copy{width:100%;margin:0;padding:0 var(--pad);display:block}.project-copy h2{white-space:normal;text-align:left;margin:0}.project-copy p,.project-page .project-copy .description{width:min(84vw,350px);margin-left:auto}.project-page .project-copy{margin-top:62px}.project-page .project-copy time{display:block;margin:24px var(--pad) 0 auto;width:max-content}.project-media{width:calc(100% - var(--pad)*2);margin:14px var(--pad) 0}.project-media img,.project-media video{aspect-ratio:4/3}.gallery{padding:0 var(--pad);gap:8px;margin-top:14px}.floating-header{grid-template-columns:1fr max-content max-content;gap:18px;padding:14px var(--pad)}.floating-header nav{display:contents}.floating-header nav a[href*="contacts"]{display:none}.contacts-main{min-height:calc(100svh - 90px);padding:36px var(--pad) 20px;align-items:flex-end}.contacts-list{width:100%;font-size:clamp(22px,7vw,34px)}footer{display:none}.playground-page .site-header{min-height:0}.playground-hint{font-size:12px;bottom:14px}.play-item.landscape{width:320px}.play-item.portrait{width:175px}}
.project-card.no-preview{padding-bottom:78px}.project-copy-link{display:grid;color:inherit}.project-copy-link:hover h2{color:var(--orange)}
#board{position:absolute;width:9000px;height:7000px}
/* Desktop and tablet navigation stays grouped against the right edge. */
@media (min-width:701px){
  .site-nav,.floating-header nav{justify-content:end;gap:clamp(28px,4vw,80px)}
}

/* Playground media always uses a controlled card size. */
.play-item.square{width:360px}
.play-item.square .play-thumb{aspect-ratio:1}
@media (max-width:1120px) and (min-width:701px){.play-item.square{width:280px}}
@media (max-width:700px){.play-item.square{width:220px}}

/* Book navigation has no panel: white text in difference mode inverts over the image below. */
.floating-header{background:transparent!important;color:#fff!important;mix-blend-mode:difference}
@media (min-width:701px){.contacts-list a:hover{color:var(--orange)}.contacts-list a[href^="mailto:"]{white-space:nowrap}.switch-covers-card .project-media img{object-position:center 22%}}
.project-vimeo iframe{display:block;width:100%;aspect-ratio:16/9;border:0}
.contacts-credit{padding:0 var(--pad) 20px;font-size:.9em}
@media (max-width:700px){.contacts-credit{display:none}}