.atelier{background:#080909;color:#e6e3dc;overflow-x:hidden}.atelier-header{position:absolute;top:0;left:0;right:0;z-index:10;border:0;height:110px;padding:0 4%}.signature{font:32px/.9 Display;letter-spacing:-.8px}.signature span{display:block;font:8px Body;letter-spacing:1.3px;margin-top:10px}.atelier nav{font-size:11px}.atelier sup{font-size:8px;color:#888;margin-left:4px}.atelier main>section{padding:0;border:0}.identity{height:max(850px,100svh);position:relative;isolation:isolate;overflow:hidden}.identity canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;opacity:.7}.coordinates{position:absolute;left:4%;right:4%;top:140px;display:flex;justify-content:space-between;font:8px Body;letter-spacing:2px;color:#777}.ghost-word{position:absolute;top:22%;width:100%;font:32vw/.8 Display;letter-spacing:-1.8vw;text-align:center;color:transparent;-webkit-text-stroke:1px #ffffff0b;pointer-events:none}.badge-space{position:absolute;inset:10% 12% 17%;perspective:1000px;display:grid;place-items:center}.badge{width:100%;height:100%;position:relative;transform-style:preserve-3d;will-change:transform;filter:drop-shadow(0 30px 35px #000)}.badge video,.badge img{position:absolute;width:100%;height:100%;object-fit:contain;mix-blend-mode:screen}.badge video{opacity:0;transition:opacity .5s}.badge.playing video{opacity:1}.badge.playing img{opacity:0}.side-note{position:absolute;left:4%;top:47%;font:9px/1.9 Body;letter-spacing:1.5px;color:#8b8c88}.motion-control{position:absolute;right:4%;top:48%;writing-mode:vertical-rl;background:none;border:0;font-size:9px;letter-spacing:1px;color:#aaa}.hero-caption{position:absolute;left:4%;right:4%;bottom:75px;display:flex;align-items:end;justify-content:space-between}.hero-caption>p{font:clamp(48px,6vw,100px)/.82 Display;letter-spacing:-2px;margin:0}.hero-caption i{font-family:Georgia,serif;font-weight:400;font-size:.74em;letter-spacing:-3px}.hero-caption>div{width:300px}.hero-caption>div>span{font-size:11px;line-height:1.8;color:#aaa}.reel-link{display:flex;justify-content:space-between;align-items:center;width:100%;background:none;border:0;border-bottom:1px solid #666;padding:20px 0 12px;margin-top:10px;font-size:12px}.reel-link b{font-size:28px;font-weight:400}.scroll-cue{position:absolute;bottom:25px;left:4%;right:4%;font-size:8px;letter-spacing:2px;display:flex;justify-content:space-between;color:#888}.statement{min-height:1100px;padding:130px 10%!important;position:relative;border-top:1px solid #272826!important;overflow:hidden}.statement h1{font:clamp(90px,12vw,200px)/.84 Display;letter-spacing:-5px;margin-top:60px;position:relative;z-index:2}.statement h1 em{font-family:Georgia,serif;font-size:.76em;font-weight:400;letter-spacing:-6px;color:#929590}.statement-aside{position:absolute;right:10%;top:30%;width:230px;z-index:3}.statement-aside p{font-size:14px;line-height:1.9;color:#aaa}.statement-aside a{font-size:10px;border-bottom:1px solid #555;padding-bottom:8px}.tiny-cross{font-size:65px;display:block;margin-bottom:40px;animation:turn 24s linear infinite;width:65px}.work-portal{padding:70px 4% 40px!important;background:#d9d8d1;color:#111;position:relative}.portal-meta,.portal-bottom{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px}.portal-link{display:block;position:relative;padding:70px 0 50px}.portal-link>span{display:block;font:clamp(90px,16.5vw,280px)/.8 Display;letter-spacing:-6px;transition:letter-spacing .6s}.portal-link:hover{color:#111}.portal-link:hover>span{letter-spacing:-1px}.portal-link b{position:absolute;right:3%;top:20%;font:24vw/.8 Body;font-weight:400;transition:transform .5s}.portal-link:hover b{transform:rotate(45deg)}.portal-link small{display:block;font:9px Body;letter-spacing:2px;margin-top:50px}.portal-bottom{border-top:1px solid #888;padding-top:25px}.portal-bottom button{background:none;border:0;color:#111;padding:0;font-size:10px}.atelier-footer{padding:100px 4% 20px}.say-hello{display:flex;justify-content:space-between;font:clamp(65px,11vw,170px)/1 Display;letter-spacing:-3px;margin:50px 0 90px}.say-hello span{font-family:Body;font-size:.7em}.archive-title h1{font-size:clamp(80px,12vw,160px)}@keyframes turn{to{transform:rotate(360deg)}}.paused .tiny-cross,.paused .orbit-floor,.paused .orbit-wave,.paused .orbit-beam,.paused .orbit-pool,.paused .orbit-floor span{animation-play-state:paused}@media(max-width:700px){.atelier-header{height:90px}.signature{font-size:26px}.signature span{font-size:6px}.atelier nav{gap:20px}.atelier nav a:first-child{display:block}.atelier nav a:nth-child(2){display:none}.identity{height:max(740px,100svh)}.coordinates{top:115px;font-size:6px;letter-spacing:1px}.badge-space{inset:15% -18% 26%}.side-note{top:26%;font-size:7px}.ghost-word{top:32%}.hero-caption{bottom:90px;align-items:start;gap:25px}.hero-caption>p{font-size:52px}.hero-caption>div{width:165px}.hero-caption>div>span{font-size:9px}.reel-link{font-size:10px}.statement{padding:80px 6%!important;min-height:940px}.statement h1{font-size:100px;letter-spacing:-3px}.statement h1 em{letter-spacing:-4px}.statement-aside{position:relative;top:auto;right:auto;margin:50px 0 0 35%;width:60%}.tiny-cross{display:none}.portal-meta{font-size:7px;gap:30px}.portal-link>span{font-size:24vw;letter-spacing:-3px}.portal-link b{font-size:25vw;right:0}.portal-bottom{gap:25px;line-height:1.6;font-size:8px}.portal-bottom button{font-size:8px;text-align:left}.say-hello{font-size:16vw;letter-spacing:-1px}.atelier-footer{padding-top:70px}}@media(prefers-reduced-motion:reduce){.badge{transform:none!important}.orbit-floor,.tiny-cross{animation:none}.identity canvas{opacity:.35}}

.atelier main>.home-reel{padding:85px 4% 65px;border-top:1px solid #272826;scroll-margin-top:20px}.reel-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}.reel-heading h2{font-size:clamp(38px,5vw,76px);margin:15px 0 0;letter-spacing:-1px}.reel-heading>span,.reel-foot{font-size:9px;letter-spacing:1px;color:#999}.inline-reel{aspect-ratio:16/9;background:#050505;width:100%}.inline-reel iframe{width:100%;height:100%;display:block;border:0}.reel-foot{display:flex;justify-content:space-between;gap:25px;margin-top:20px}@media(max-width:700px){.atelier main>.home-reel{padding:55px 4% 40px}.reel-heading{display:block}.reel-heading>span{display:block;margin-top:20px;font-size:8px}.reel-foot{font-size:8px}}

#play-inline-reel{display:block;position:relative;width:100%;height:100%;padding:0;border:0;background:#050505}#play-inline-reel img{width:100%;height:100%;object-fit:cover;opacity:.75}#play-inline-reel>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:75px;height:75px;border:1px solid #ddd;border-radius:50%;display:grid;place-items:center;background:#08090944}#play-inline-reel small{position:absolute;top:95px;width:200px;font-size:9px;letter-spacing:2px}

.reel-foot>span>a{display:inline-block;margin-left:20px;color:#e6e3dc;border-bottom:1px solid #666;padding-bottom:4px}.more-work-copy{max-width:500px;font:13px/1.8 Body;letter-spacing:0;margin:25px 0 0;color:#444}.atelier main>.home-highlights{padding:100px 4%;border-top:1px solid #272826}.highlights-heading{display:flex;justify-content:space-between;align-items:start;margin-bottom:75px}.highlights-heading h2{font-size:clamp(55px,7vw,100px);line-height:.95;margin:0;width:58%;letter-spacing:-2px}.highlight{display:grid;grid-template-columns:1.2fr 1fr;gap:7%;align-items:center;padding:55px 0;border-top:1px solid #30322e}.highlight.reverse .highlight-image,.highlight.reverse .highlight-media{order:2}.highlight-image{display:block;overflow:hidden;background:#101110}.highlight-image img{width:100%;height:380px;object-fit:cover;display:block;transition:transform .8s,filter .8s;filter:saturate(.65)}.highlight-image:hover img{transform:scale(1.035);filter:saturate(1)}.highlight-copy h3{font-size:clamp(40px,4.8vw,70px);letter-spacing:-1px;line-height:.95;margin:25px 0}.highlight-copy>p:not(.eyebrow){max-width:420px;font-size:13px;line-height:1.9;color:#a9aba5}.highlight-links{display:flex;flex-wrap:wrap;gap:25px;margin-top:30px;font-size:11px}.highlight-links a{border-bottom:1px solid #666;padding-bottom:8px}.specialization{margin-top:35px;border-top:1px solid #30322e;padding-top:20px;display:flex;flex-direction:column;gap:15px;font-size:11px}.specialization span{font-size:8px;letter-spacing:2px;color:#888}@media(max-width:700px){.reel-foot{align-items:start}.reel-foot>span{max-width:65%;line-height:1.8}.reel-foot>span>a{margin:8px 0 0}.atelier main>.home-highlights{padding:60px 4%}.highlights-heading{display:block;margin-bottom:40px}.highlights-heading h2{width:100%;margin-top:25px}.highlight{grid-template-columns:1fr;gap:30px;padding:35px 0}.highlight.reverse .highlight-image,.highlight.reverse .highlight-media{order:0}.highlight-image img{height:240px}.highlight-copy h3{margin:20px 0}.more-work-copy{font-size:12px;max-width:90%}}

/* Preserve the complete website captures without cropping their interface. */
.highlight-image img{height:auto;aspect-ratio:auto;object-fit:contain;filter:none}.highlight-image:hover img{transform:none}.highlight-image{border:1px solid #292b28}.highlight-image:hover{border-color:#666}
/* Playfair Display (SIL Open Font License 1.1), cut down to just R and L for the spotlight */
@font-face{font-family:'RLL Playfair';src:url(assets/rll-playfair.woff2) format('woff2');font-weight:500;font-display:swap}
/* RLL spotlight: "RLL" stands on a lit floor disc and turns in 3D. Fades live in the colors, not opacity, so browsers keep it 3D. */
.orbit-stamp{--s:clamp(300px,29vw,440px);position:absolute;right:5%;bottom:0;width:var(--s);height:var(--s);perspective:1000px;perspective-origin:50% 30%;pointer-events:none;z-index:1}
.orbit-beam{position:absolute;left:6%;right:6%;top:-12%;bottom:50%;background:linear-gradient(to bottom,#e4e4e400 25%,#e4e4e40f 62%,#e4e4e41f);clip-path:polygon(45% 0,55% 0,100% 100%,0 100%);filter:blur(7px)}
.orbit-floor{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(68deg) rotateZ(-24deg);animation:orbit-spin 30s linear infinite}
.orbit-floor>*{position:absolute}
.orbit-pool{inset:-14%;border-radius:50%;background:radial-gradient(closest-side,#e2e2e247,#e2e2e21c 42%,#e2e2e20a 68%,#e2e2e200)}
.orbit-ring,.orbit-wave{inset:5%;border-radius:50%}
.orbit-ring{border:1.5px dashed #c8c8c873;box-shadow:inset 0 0 26px #e2e2e214}
.orbit-wave{border:1.5px solid #d6d6d6;box-shadow:0 0 10px #d6d6d655,inset 0 0 10px #d6d6d633;opacity:0}
.orbit-dot{left:50%;top:5%;width:9px;height:9px;margin:-4.5px;border-radius:50%;background:#dcdcdc;box-shadow:0 0 8px 2px #dcdcdc55}
.orbit-floor span{inset:0;display:grid;place-items:center;font:500 calc(var(--s)*.27)/1 'RLL Playfair',Georgia,serif;letter-spacing:-.01em;color:#b8b8b88c;text-shadow:0 0 6px #ffffff12}
/* Lights up when the section scrolls into view (flow.js adds .pending, then .lit): beam comes down, pool and RLL fade up, the ring spreads out and repeats every 16s */
.orbit-beam{transform-origin:50% 0}
.orbit-stamp.pending .orbit-beam,.orbit-stamp.pending .orbit-pool,.orbit-stamp.pending .orbit-ring,.orbit-stamp.pending .orbit-dot,.orbit-stamp.pending .orbit-floor span{opacity:0}
.orbit-stamp.lit .orbit-beam{animation:beam-down 1.4s cubic-bezier(.2,.7,.2,1) both}
.orbit-stamp.lit .orbit-pool{animation:light-up 1.6s .5s ease-out both}
.orbit-stamp.lit .orbit-floor span{animation:light-up 1.8s 1.1s ease-out both}
.orbit-stamp.lit .orbit-wave{animation:ring-spread 16s .9s cubic-bezier(.22,.61,.36,1) infinite}
.orbit-stamp.lit .orbit-ring,.orbit-stamp.lit .orbit-dot{animation:light-up 1.2s 4.4s ease-out both}
@keyframes beam-down{from{transform:scaleY(0);opacity:0}to{transform:none;opacity:1}}
@keyframes light-up{from{opacity:0}to{opacity:1}}
@keyframes ring-spread{0%{transform:scale(.1);opacity:0}6%{opacity:1}26%{transform:scale(1);opacity:.9}36%,100%{transform:scale(1.06);opacity:0}}
@keyframes orbit-spin{from{transform:rotateX(68deg) rotateZ(0deg)}to{transform:rotateX(68deg) rotateZ(360deg)}}
/* Phones: spotlight centered under the copy, readable small type, nothing clipped on narrow screens */
@media(max-width:700px){.statement{min-height:0}.statement h1{font-size:min(100px,26.5vw)}.orbit-stamp{--s:min(300px,78vw);position:relative;right:auto;bottom:auto;margin:130px auto -50px}.coordinates{font-size:8px;letter-spacing:1.2px}.side-note{font-size:8px}.reel-foot{flex-direction:column;gap:16px}.reel-foot>span{max-width:none}.portal-bottom{flex-direction:column;gap:14px}}
@media(max-width:380px){.atelier nav{gap:14px}.atelier sup{display:none}.atelier nav a,.signature span{white-space:nowrap}.signature span{letter-spacing:1px}}
/* Highlight labels (01/02/03) above each image: extruded 3D number that rocks slowly, a line that draws in with a light sweep */
.highlight-label{display:flex;align-items:center;gap:20px;margin:0 0 24px;perspective:700px}
.highlight-label b{font:clamp(48px,5vw,76px)/.85 Display;color:#e6e3dc;letter-spacing:-1px;text-shadow:1px 1px 0 #9a9c96,2px 2px 0 #7c7e79,3px 3px 0 #62645f,4px 4px 0 #4b4d48,5px 5px 0 #363834,10px 12px 18px #000c;transform:rotateY(-20deg) rotateX(8deg);transform-origin:0 50%;animation:label-tilt 7s ease-in-out infinite alternate}
.highlight-label span{font-size:13px;letter-spacing:3px;white-space:nowrap}
.highlight-label i{flex:1;min-width:30px;height:1px;position:relative;overflow:hidden;background:linear-gradient(90deg,#e6e3dc99,#e6e3dc14);transform-origin:0 50%;transition:transform 1.3s cubic-bezier(.2,.7,.2,1) .25s}
.highlight-label i::after{content:"";position:absolute;top:-1px;left:0;width:60px;height:3px;background:linear-gradient(90deg,#fff0,#fffc,#fff0);transform:translateX(-80px);animation:label-sweep 6s 1.5s ease-in-out infinite}
.highlight.flow-reveal .highlight-label i{transform:scaleX(0)}
.highlight.flow-visible .highlight-label i{transform:none}
.highlight-copy>h3:first-child{margin-top:0}
@keyframes label-tilt{from{transform:rotateY(-20deg) rotateX(8deg)}to{transform:rotateY(12deg) rotateX(-4deg)}}
@keyframes label-sweep{0%{transform:translateX(-80px)}35%,100%{transform:translateX(900px)}}
.paused .highlight-label b,.paused .highlight-label i::after{animation-play-state:paused}
@media(max-width:700px){.highlight-label{gap:14px;margin-bottom:16px}.highlight-label b{font-size:44px}.highlight-label span{font-size:10px;letter-spacing:2px;white-space:normal;line-height:1.6}}
