@font-face{font-family:Inter;src:url('assets/inter-200.ttf');font-weight:200;font-display:swap}@font-face{font-family:Inter;src:url('assets/inter-300.ttf');font-weight:300;font-display:swap}@font-face{font-family:Inter;src:url('assets/inter-400.ttf');font-weight:400;font-display:swap}
:root{color-scheme:dark;background:#080808;color:white;font-family:Inter,Arial,sans-serif;font-weight:300;--top:calc(88px + env(safe-area-inset-top));--bottom:calc(100px + env(safe-area-inset-bottom))}*{box-sizing:border-box}body{margin:0}html{scrollbar-width:none}html::-webkit-scrollbar{display:none}button,a{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}button{border:0;background:none;cursor:pointer}a{text-decoration:none}button:focus-visible,a:focus-visible{outline:1px solid white;outline-offset:4px}p,h1,h2{margin:0}header{position:fixed;inset:0 0 auto;height:var(--top);padding:env(safe-area-inset-top) 5% 0;display:flex;align-items:center;justify-content:space-between;background:#080808;z-index:20}.brand{font-size:27px;font-weight:200;letter-spacing:.2em;padding:10px 0}header nav{display:flex;align-items:center;gap:30px;font-size:14px}header nav button,header nav a{padding:12px 0}header nav a{border-bottom:1px solid #777}#viewport{position:fixed;inset:var(--top) 0 var(--bottom);overflow:hidden}#world{position:absolute;transform-origin:0 0;will-change:transform}.chapter{position:absolute;padding:28px 6%;background:#080808;overflow:hidden}.chapter:not(.active){pointer-events:none}.chapter.active{pointer-events:auto}.eyebrow{font-size:12px;letter-spacing:.14em;line-height:1.65;color:#aaa;font-weight:400}h1,h2{font-weight:200;letter-spacing:-.045em;line-height:1.1}.opening{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:7%}.intro h1{font-size:clamp(40px,5.6vw,84px);margin-top:28px}.intro-note{font-size:16px;line-height:1.8;color:#aaa;margin-top:26px}.underlined{display:inline-flex;gap:35px;font-size:14px;line-height:1.5;border-bottom:1px solid #777;padding:14px 0;margin-top:30px}.intro-art{height:100%;min-height:0;width:100%;padding:0}.intro-art img{display:block;object-fit:contain;width:100%;height:100%}.campaign{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,30%);grid-template-rows:auto minmax(0,1fr);column-gap:6%;row-gap:40px;align-items:start}.hero-media{grid-column:1;grid-row:1/3;width:100%;height:100%;min-height:0;position:relative;isolation:isolate}.campaign-heading{grid-column:2;grid-row:1;padding-top:6vh}.campaign-heading h2{font-size:clamp(29px,3.3vw,49px);margin-top:22px;overflow-wrap:anywhere}.category{font-size:14px;color:#bbb;line-height:1.8;margin-top:20px}.campaign-selection{grid-column:2;grid-row:2;align-self:end;padding-bottom:3vh;min-width:0}.selection-label{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#aaa;letter-spacing:.05em;margin-bottom:15px}.thumbnails{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.thumbnail{padding:3px;opacity:.55;border:1px solid transparent;transition:opacity .3s,border-color .3s;position:relative;min-width:0}.thumbnail[aria-pressed=true]{opacity:1;border-color:#ddd}.thumbnail:hover{opacity:1}.thumbnail img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}.thumbnail span{display:block;font-size:10px;line-height:1.6;padding-top:4px;white-space:nowrap}.campaign-credit{font-size:12px;color:#999;line-height:1.8;margin-top:24px}.media-surface{position:absolute;inset:0;width:100%;height:100%;padding:0;overflow:hidden}.media-surface img,.media-surface video{width:100%;height:100%;object-fit:contain;display:block;transition:transform .8s ease}.media-surface:hover img{transform:scale(1.025)}.media-surface .open-label{position:absolute;bottom:14px;right:14px;padding:10px 12px;font-size:12px;background:#080808b8;border:1px solid #ffffff55;opacity:0;transition:opacity .3s}.media-surface:hover .open-label,.media-surface:focus-visible .open-label{opacity:1}.hero-media.reveal .media-surface{animation:curtain .75s cubic-bezier(.2,.7,.1,1)}@keyframes curtain{from{clip-path:inset(0 50%);transform:scale(1.025)}to{clip-path:inset(0);transform:scale(1)}}.video-actions{position:absolute;bottom:15px;right:15px;display:flex;gap:8px}.video-actions button{background:#080808cc;border:1px solid #ffffff66;font-size:12px;padding:12px}.about{overflow-y:auto}.about-inner{max-width:940px;margin:4vh auto}.about h2{font-size:clamp(40px,5.5vw,78px);margin-top:26px}.about-text{display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:760px;margin-top:30px;color:#bbb;font-size:16px;line-height:1.8}.disclaimer{font-size:12px;line-height:1.8;color:#999;margin-top:28px}footer{position:fixed;inset:auto 0 0;height:var(--bottom);padding:10px 5% calc(16px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:24px;background:#080808;z-index:20}.project-info{display:flex;flex-direction:column;gap:8px;font-size:12px;letter-spacing:.08em;min-width:0}.credit{font-size:10px;color:#999;letter-spacing:.04em}.index{display:flex;gap:14px;align-items:center}.index button{font-size:11px;letter-spacing:.02em;white-space:nowrap;color:#888;padding:14px 0}.index button[aria-current=true]{color:white;border-bottom:1px solid white}.directions{display:flex;gap:8px}.directions button{width:42px;height:42px;border:1px solid #444;font-size:22px}.directions button:disabled{opacity:.25}.progress{position:absolute;bottom:calc(5px + env(safe-area-inset-bottom));left:5%;right:5%;height:1px;background:#252525}.progress i{display:block;height:1px;width:0;background:#fff}.skip{position:fixed;top:-100px;padding:15px;background:white;color:black;z-index:50}.skip:focus{top:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}dialog{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);border:0;background:#080808;color:white}dialog[open]{display:flex;flex-direction:column}dialog::backdrop{background:#080808}.viewer-bar{display:flex;justify-content:space-between;align-items:center;padding:14px 5%;gap:20px;font-size:12px}.viewer-bar button{min-height:44px;padding:12px 0}#viewer-content{flex:1;min-height:0;padding:10px}#viewer-content img,#viewer-content video{width:100%;height:100%;object-fit:contain}.noscript{position:fixed;top:100px;background:#080808;z-index:40;padding:30px}
@media(max-width:1050px){.index{gap:10px}.index button{font-size:10px}.credit{display:none}.campaign{column-gap:4%;grid-template-columns:minmax(0,1fr) 260px}.chapter{padding:20px 5%}.campaign-heading{padding-top:3vh}}
@media(max-width:700px){:root{--top:calc(72px + env(safe-area-inset-top));--bottom:calc(110px + env(safe-area-inset-bottom))}header{padding-left:6%;padding-right:6%}.brand{font-size:22px;letter-spacing:.13em}header nav{gap:18px;font-size:12px}.chapter{padding:12px 6%}.opening{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:22px}.intro{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}.intro .eyebrow{grid-column:1/-1;font-size:10px}.intro h1{font-size:37px;margin:0}.intro-note{display:none}.intro .underlined{font-size:10px;gap:8px;margin:0;max-width:118px}.intro-art{min-height:0}.campaign{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) 77px;gap:16px;align-items:stretch}.campaign-heading{grid-row:1;grid-column:1;padding:0;display:grid;grid-template-columns:1fr auto;gap:5px 12px;align-items:baseline}.campaign-heading .eyebrow{grid-column:1/-1;font-size:10px;letter-spacing:.1em}.campaign-heading h2{font-size:26px;margin:0}.category{font-size:11px;line-height:1.5;margin:0;max-width:125px;text-align:right}.hero-media{grid-row:2;grid-column:1;min-height:0}.campaign-selection{grid-row:3;grid-column:1;padding:0;align-self:stretch;min-height:0}.selection-label,.campaign-credit{display:none}.thumbnails{display:flex;gap:8px;overflow-x:auto;height:77px;scrollbar-width:none;overscroll-behavior-x:contain}.thumbnail{width:54px;flex:0 0 54px;padding:2px}.thumbnail img{height:56px;aspect-ratio:auto;object-fit:cover}.thumbnail span{font-size:9px;line-height:1.3;padding-top:3px}.media-surface .open-label{opacity:1;font-size:10px;padding:8px;bottom:8px;right:8px}.video-actions{bottom:8px;right:8px}.video-actions button{font-size:10px;padding:10px}.about-inner{margin:12px 0 30px}.about h2{font-size:43px}.about-text{grid-template-columns:1fr;gap:16px;margin-top:23px}.about .underlined{font-size:14px}.disclaimer{font-size:12px}footer{padding:10px 6% calc(16px + env(safe-area-inset-bottom));display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 15px}.project-info{grid-column:1/-1;font-size:12px}.index{overflow-x:auto;scrollbar-width:none;min-width:0;gap:18px}.index button{font-size:11px;min-height:40px;flex-shrink:0}.directions button{width:36px;height:38px}.directions{gap:5px}.viewer-bar{font-size:11px}.viewer-bar p{max-width:68%;line-height:1.5}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}.media-surface:hover img{transform:none}}

/* The supplied identity stays intact; CSS windows isolate its mark and wordmark. */
.brand-wordmark{display:block;position:relative;width:150px;height:27px;overflow:hidden;background:#000}
.brand-wordmark img{position:absolute;width:214px;max-width:none;left:-31px;top:-147px}
#brand-intro{--logo-size:min(86vw,680px);position:fixed;inset:0;z-index:100;isolation:isolate;touch-action:none}
#brand-intro[hidden]{display:none}
.intro-panel{position:absolute;top:0;bottom:0;width:50%;background:#000;overflow:hidden;will-change:transform;transition:transform 2.6s cubic-bezier(.76,0,.24,1)}
.intro-panel-left{left:0}.intro-panel-right{right:0}
.intro-monogram{position:absolute;top:46%;width:var(--logo-size);height:calc(var(--logo-size)*.49);transform:translateY(-50%);overflow:hidden}
.intro-panel-left .intro-monogram{right:calc(var(--logo-size)*-.5)}
.intro-panel-right .intro-monogram{left:calc(var(--logo-size)*-.5)}
.intro-monogram img{position:absolute;top:calc(var(--logo-size)*-.155);left:0;width:100%;max-width:none}
.intro-signature{position:absolute;left:50%;top:calc(46% + var(--logo-size)*.30);transform:translateX(-50%);width:calc(var(--logo-size)*.76);height:calc(var(--logo-size)*.18);overflow:hidden;transition:opacity .4s}
.intro-signature img{position:absolute;width:var(--logo-size);max-width:none;left:calc(var(--logo-size)*-.12);top:calc(var(--logo-size)*-.68)}
#skip-intro{position:absolute;bottom:calc(30px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);padding:15px 22px;font-size:12px;letter-spacing:.16em;color:#bbb;transition:opacity .3s}
#brand-intro.is-opening .intro-panel-left{transform:translateX(-100%)}
#brand-intro.is-opening .intro-panel-right{transform:translateX(100%)}
#brand-intro.is-opening .intro-signature,#brand-intro.is-opening #skip-intro{opacity:0;pointer-events:none}
body.intro-running{overflow:hidden}
body.intro-running header,body.intro-running footer{opacity:0}
body.intro-revealing header,body.intro-revealing footer{opacity:1;transition:opacity 1s .6s}
body.intro-revealing .opening .intro-art{animation:entrance-image 2.7s cubic-bezier(.2,.7,.2,1) both}
body.intro-revealing .opening .intro{animation:entrance-copy 1.2s .35s both}
@keyframes entrance-image{from{opacity:0;transform:translate3d(45px,0,0) scale(1.07);clip-path:inset(0 20%)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes entrance-copy{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
@media(max-width:700px){.brand-wordmark{width:120px;height:23px}.brand-wordmark img{width:172px;left:-25px;top:-118px}}
@media(prefers-reduced-motion:reduce){#brand-intro{display:none!important}}

.brand{display:flex;align-items:center;gap:13px}
.brand-monogram{display:block;position:relative;width:31px;height:30px;overflow:hidden;flex-shrink:0}
.brand-monogram img{position:absolute;width:64px;max-width:none;left:-15.5px;top:-10.3px;mix-blend-mode:screen}
.brand-wordmark{background:transparent}.brand-wordmark img{mix-blend-mode:screen}
.intro-scroll-hint{position:absolute;left:0;right:0;text-align:center;bottom:calc(96px + env(safe-area-inset-bottom));font-size:12px;letter-spacing:.18em;color:#bbb;transition:opacity .4s}
#brand-intro.is-opening .intro-scroll-hint{opacity:0}
@media(max-width:700px){.brand{gap:8px}.brand-monogram{width:25px;height:25px}.brand-monogram img{width:52px;left:-12.5px;top:-8.4px}.brand-wordmark{width:105px;height:20px}.brand-wordmark img{width:150px;left:-22px;top:-103px}header nav{gap:12px}}

/* Keep every frame reachable as campaigns grow. */
@media(min-width:701px){.campaign-selection .thumbnails{max-height:32vh;overflow-y:auto;overscroll-behavior:contain}.index{min-width:0;overflow-x:auto;scrollbar-width:none}.index button{flex-shrink:0}.directions{flex-shrink:0}}

.contact-link{border-bottom:1px solid #777}.direct-email{display:block;font-size:14px;margin-top:18px;color:#bbb;overflow-wrap:anywhere}.services{margin-top:40px}.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:20px}.service-card{text-align:left;padding:0}.service-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;filter:saturate(.75);transition:filter .4s}.service-card:hover img{filter:saturate(1)}.service-card span{display:block;font-size:16px;margin-top:14px}.service-card small{display:block;font-size:13px;color:#aaa;line-height:1.65;margin-top:8px}#contact-dialog{overflow-y:auto;overscroll-behavior:contain}#contact-dialog[open]{display:block}.contact-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 6%;font-size:12px;letter-spacing:.08em;border-bottom:1px solid #333}.contact-top button{min-height:44px}.contact-inner{max-width:850px;padding:40px 28px 70px;margin:auto}.contact-inner h2{font-size:clamp(42px,6vw,72px);margin-top:14px}.contact-intro{font-size:16px;line-height:1.7;color:#bbb;margin-top:20px}#project-form{margin-top:35px}#project-form fieldset{border:0;padding:0;margin:0 0 30px;min-width:0}#project-form legend{font-size:16px;margin-bottom:10px}.field-note{font-size:13px;line-height:1.7;color:#aaa;margin:8px 0 16px}.service-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.service-option{display:flex;align-items:center;gap:12px;padding:15px;border:1px solid #444;font-size:14px;cursor:pointer}.service-option:has(input:checked){border-color:#fff;background:#202020}#project-form input[type=checkbox]{accent-color:#fff;width:18px;height:18px;flex-shrink:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:32px}.form-grid label,.project-message{display:flex;flex-direction:column;gap:12px;font-size:14px}#project-form input:not([type=checkbox]),#project-form select,#project-form textarea{width:100%;border:0;border-bottom:1px solid #666;background:#111;color:#fff;border-radius:0;padding:14px 10px;font:inherit;font-size:16px}#project-form textarea{resize:vertical;min-height:120px}#project-form :focus-visible{outline:1px solid white;outline-offset:4px}.usage-options{display:flex;flex-wrap:wrap;gap:20px}.usage-options label{display:flex;align-items:center;gap:9px;font-size:14px}.project-message{margin-bottom:25px}.contact-actions{display:flex;flex-wrap:wrap;gap:18px;align-items:center}.contact-actions button{padding:16px 22px;font-size:13px;letter-spacing:.06em;border:1px solid #666}.contact-actions .brief-submit{background:#fff;color:#080808;border-color:#fff}#brief-status{font-size:14px;line-height:1.7;margin-top:18px;color:#ddd}
@media(max-width:700px){.service-grid{grid-template-columns:1fr 1fr;gap:24px 14px}.contact-inner{padding:28px 6% 50px}.form-grid{grid-template-columns:1fr}.service-options{grid-template-columns:1fr}.contact-top{font-size:10px}.service-card span{font-size:14px}}

/* Campaigns are grouped by the creative brief, with an editorial work index. */
#work-dialog{overflow-y:auto;overscroll-behavior:contain}#work-dialog[open]{display:block}.work-inner{max-width:1200px;margin:auto;padding:48px 6% 72px}.work-inner h2{font-size:clamp(36px,5vw,66px)}.work-groups{display:grid;grid-template-columns:1fr 1fr;gap:48px 60px;margin-top:50px}.work-group h3{font-size:26px;font-weight:200;margin:14px 0 24px;letter-spacing:-.02em}.work-project{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;padding:18px 0;border-top:1px solid #333;font-size:13px;letter-spacing:.06em}.work-project:hover{color:#bbb}.work-project span{font-size:18px}.index button{text-transform:uppercase;font-size:10px}.campaign-heading .eyebrow{line-height:1.8}
@media(max-width:700px){.work-groups{grid-template-columns:1fr;gap:35px;margin-top:32px}.work-inner{padding-top:28px}header nav{gap:10px;font-size:11px}.index{gap:20px}.campaign-heading .eyebrow{font-size:9px}.brand-wordmark{width:90px;height:18px}.brand-wordmark img{width:130px;left:-19px;top:-89px}}

/* Scroll-led editorial chapters: drifting frames, a held title, then a hero reveal. */
.campaign{display:block;padding:0;--hero-progress:0;--story-opacity:1;--gallery-opacity:0}
.scroll-composition{position:absolute;inset:0;opacity:var(--story-opacity);overflow:hidden}
.story-image{position:absolute;width:22%;height:37%;padding:0;will-change:transform;overflow:hidden}
.story-image img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.story-image:hover img,.story-image:focus-visible img{transform:scale(1.055)}
.story-image-0{left:7%;top:4%}.story-image-1{right:7%;top:-5%}.story-image-2{left:3%;top:73%}.story-image-3{right:3%;top:68%}.story-image-4{left:39%;top:-39%}.story-image-5{left:39%;top:112%}
.campaign-heading{position:absolute;left:24%;right:24%;top:50%;transform:translateY(-50%);padding:0;text-align:center;z-index:2;opacity:var(--story-opacity);pointer-events:none;display:block}
.campaign-heading h2{font-size:clamp(36px,6.5vw,96px);font-weight:200;line-height:1.05;margin:18px 0;text-wrap:balance;overflow-wrap:normal}
.campaign-heading .eyebrow{font-size:10px;letter-spacing:.14em}.campaign-heading .category{font-size:14px;text-align:center;max-width:none;margin:0}
.campaign .hero-media{position:absolute;inset:42px 8% 110px;width:auto;height:auto;z-index:3;opacity:clamp(0,calc(var(--hero-progress)*3),1);transform:scale(calc(.22 + var(--hero-progress)*.78));transform-origin:50% 50%;will-change:transform,opacity}
.campaign .hero-media[inert]{pointer-events:none}.campaign .hero-media .media-surface img,.campaign .hero-media .media-surface video{object-fit:contain}
.campaign-selection{position:absolute;left:12%;right:12%;bottom:19px;padding:0;z-index:4;opacity:var(--gallery-opacity)}
.campaign-selection[inert]{pointer-events:none}.campaign-selection .selection-label,.campaign-selection .campaign-credit{display:none}
.campaign-selection .thumbnails{display:flex;justify-content:flex-start;gap:10px;max-height:none;height:72px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
.campaign-selection .thumbnail{flex:0 0 48px;width:48px;padding:2px}.campaign-selection .thumbnail img{height:49px;width:100%;object-fit:cover;aspect-ratio:auto}.campaign-selection .thumbnail span{font-size:9px}
.story-toolbar{position:absolute;left:5%;right:5%;bottom:20px;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:10px;letter-spacing:.12em}
.story-toolbar button{padding:12px 0;border-bottom:1px solid #777;letter-spacing:.08em;font-size:11px;background:#080808b0}
.gallery-ready .story-toolbar{bottom:auto;top:4px;left:auto}.gallery-ready .story-hint{display:none}
.hero-caption{position:absolute;left:5%;top:16px;max-width:60%;font-size:10px;line-height:1.6;letter-spacing:.08em;opacity:var(--gallery-opacity);pointer-events:none}
@media(max-width:700px){
 .story-image{width:35%;height:33%}.story-image-0{left:0;top:2%}.story-image-1{right:0;top:4%}.story-image-2{left:0;top:78%}.story-image-3{right:0;top:81%}.story-image-4,.story-image-5{display:none}
 .campaign-heading{left:8%;right:8%;top:50%}.campaign-heading h2{font-size:clamp(32px,10vw,54px);margin:14px 0}.campaign-heading .eyebrow{font-size:9px}.campaign-heading .category{font-size:12px}
 .campaign .hero-media{inset:60px 5% 100px}.campaign-selection{left:5%;right:5%;bottom:14px}.campaign-selection .thumbnails{height:70px;gap:8px}.story-toolbar{font-size:8px;bottom:14px}.story-toolbar button{font-size:9px}.hero-caption{font-size:9px;max-width:51%;top:12px}.gallery-ready .story-toolbar{top:3px}
}
@media(prefers-reduced-motion:reduce){.scroll-composition,.campaign-heading{display:none}.campaign .hero-media{opacity:1;transform:none}.campaign-selection,.hero-caption{opacity:1}}

/* An unobstructed editorial photograph revealed by the existing curtain. */
.opening.editorial-opening{display:flex;flex-direction:column;align-items:center;gap:16px;padding:12px 5% 18px}
.editorial-opening .intro-art{flex:1;min-height:0;width:100%;max-width:1100px;height:auto;overflow:hidden}
.editorial-opening .intro-art img{width:100%;height:100%;object-fit:contain}
.opening-explore{flex-shrink:0;padding:10px 0;font-size:10px;letter-spacing:.16em;display:flex;gap:28px;align-items:center;border-bottom:1px solid #555}
@media(max-width:700px){.opening.editorial-opening{padding:10px 5% 14px;gap:14px}.opening-explore{font-size:9px;letter-spacing:.12em}}

/* Full-screen, reversible scroll interlude before About. */
body.in-interlude #viewport{overflow:visible}
body.in-interlude header,body.in-interlude footer{opacity:0;pointer-events:none;visibility:hidden}
.interlude{padding:0;background:#080808;isolation:isolate;--reveal:0;--invitation:0}
.interlude-reveal{position:absolute;inset:0;background:#e4ded4;clip-path:inset(0 calc((1 - var(--reveal))*50%));will-change:clip-path}
.interlude-reveal img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(calc(1.08 - var(--reveal)*.08));will-change:transform}
.interlude-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:rgba(8,8,8,.65);opacity:var(--invitation);padding:8%;color:white}
.interlude-copy h2{font-size:clamp(38px,6.5vw,94px);font-weight:200;line-height:1.08;letter-spacing:-.04em}
.interlude-copy[inert]{pointer-events:none}
.interlude-hint{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;font-size:10px;letter-spacing:.16em;color:#fff;text-shadow:0 1px 8px #000;opacity:calc(1 - var(--invitation))}
@media(min-aspect-ratio:1/1){.interlude-reveal img{object-fit:contain}}
@media(prefers-reduced-motion:reduce){.interlude-reveal{clip-path:none}.interlude-reveal img{transform:none}}

/* Give the original wordmark breathing room, including its final serif. */
.brand-wordmark{width:158px;flex-shrink:0}
@media(max-width:700px){.brand-wordmark{width:96px}}
.editorial-opening picture,.interlude-reveal picture{display:block;width:100%;height:100%}
@media(min-width:701px){
 #viewport{inset:0}
 header{background:linear-gradient(#08080899,transparent);text-shadow:0 1px 8px #000}
 footer{background:linear-gradient(transparent,#080808c9);text-shadow:0 1px 8px #000}
 .chapter.about{padding-top:var(--top);padding-bottom:var(--bottom)}
 .campaign .hero-media{inset:0}
 .campaign .hero-media .media-surface img,.campaign .hero-media .media-surface video{object-fit:cover;object-position:50% 38%}
 .campaign.browsing-frames .hero-media{inset:calc(var(--top) + 35px) 5% calc(var(--bottom) + 100px)}
 .campaign.browsing-frames .hero-media .media-surface img,.campaign.browsing-frames .hero-media .media-surface video{object-fit:contain}
 .campaign-selection{bottom:calc(var(--bottom) + 8px);left:5%;right:5%}
 .campaign-selection .thumbnail{background:#080808b0}
 .hero-caption{top:calc(var(--top) + 16px);z-index:5;text-shadow:0 1px 8px #000}
 .gallery-ready .story-toolbar{top:calc(var(--top) + 4px)}
 .story-toolbar{bottom:calc(var(--bottom) + 20px)}
 .video-actions,.media-surface .open-label{bottom:calc(var(--bottom) + 100px);right:5%}
 .browsing-frames .video-actions,.browsing-frames .media-surface .open-label{bottom:15px;right:15px}
 .opening.editorial-opening{padding:0;display:block;background:#dedbd7}
 .editorial-opening .intro-art{position:absolute;inset:0;max-width:none;width:100%;height:100%}
 .editorial-opening .intro-art img{object-fit:cover}
 .opening-explore{position:absolute;bottom:calc(var(--bottom) + 20px);left:50%;transform:translateX(-50%);padding:12px 18px;background:#080808b8;border-color:#fff8;color:white;white-space:nowrap}
 body.in-opening header{background:transparent;color:#111;text-shadow:none}
 body.in-opening .brand{filter:invert(1);mix-blend-mode:multiply}
 body.in-opening footer{background:transparent;color:#111;text-shadow:none}
 body.in-opening .index button,body.in-opening .credit{color:#333}
 body.in-opening .directions button{border-color:#555}
}
@media(min-width:701px) and (min-aspect-ratio:1/1){
 .interlude-reveal img{object-fit:cover;transform:none}
 .interlude-copy{background:rgba(8,8,8,.3)}
}
/* Transparent artwork using the original logo's luminance. */
.brand-wordmark,.brand-monogram{background:currentColor;mask-image:url('assets/melania-logo.png');mask-mode:luminance;mask-repeat:no-repeat}
.brand-wordmark{mask-size:214px;mask-position:-31px -147px}
.brand-monogram{mask-size:64px;mask-position:-15.5px -10.3px}
.brand-wordmark img,.brand-monogram img{visibility:hidden}
@media(min-width:701px){body.in-opening .brand{filter:none;mix-blend-mode:normal}}
@media(max-width:700px){.brand-wordmark{mask-size:130px;mask-position:-19px -89px}.brand-monogram{mask-size:52px;mask-position:-12.5px -8.4px}}
/* Client collections share one project and the existing visual language. */
.case-tabs{position:absolute;top:calc(var(--top) + 48px);left:5%;right:5%;z-index:8;display:flex;gap:6px;pointer-events:auto}
.case-tabs button{font-size:12px;padding:10px 16px;background:#080808bb;border:1px solid #ffffff55;color:white}
.case-tabs button[aria-selected=true]{background:#fff;color:#111;border-color:#fff}
.case-tabs button:focus-visible{outline:2px solid white;outline-offset:3px}
.work-groups{grid-template-columns:repeat(3,minmax(0,1fr))}
.about-text{display:block;max-width:760px}.about-text p+p{margin-top:20px}
.proof-line{font-size:12px;color:#aaa;margin-top:26px}.launch-invitation{font-size:22px;margin-top:40px}
.social-link{display:block;margin-top:16px}
@media(max-width:700px){.case-tabs{top:38px;left:6%;right:6%;gap:4px}.case-tabs button{font-size:11px;padding:8px 12px}.work-groups{grid-template-columns:1fr}.campaign[data-campaign="0"] .hero-caption{max-width:95%}}

/* Keep About reading gestures inside its own scrolling surface. */
.chapter.about{overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}

/* Display the supplied artwork directly; no browser-dependent CSS luminance masks. */
.brand-wordmark,.brand-monogram{background:transparent;-webkit-mask:none;mask:none;overflow:visible}
.brand-wordmark{width:158px;height:auto;aspect-ratio:920/165}
.brand-monogram{width:31px;height:auto;aspect-ratio:650/610}
.brand-wordmark img,.brand-monogram img{position:static;display:block;visibility:visible;width:100%;height:100%;max-width:100%;mix-blend-mode:normal;object-fit:contain}
body.in-opening .brand{mix-blend-mode:normal;filter:none}
@media(min-width:701px){body.in-opening .brand img{filter:invert(1)}}
@media(max-width:700px){.brand-wordmark{width:96px}.brand-monogram{width:25px}}
/* Reserve a separate lower zone for the introduction controls, even on short laptops. */
#brand-intro{--logo-size:min(86vw,680px,65vh)}
.intro-monogram{top:40%}
.intro-signature{top:calc(40% + var(--logo-size)*.30)}
.intro-scroll-hint{bottom:calc(88px + env(safe-area-inset-bottom));line-height:1.5;margin:0;padding:0 20px}
#skip-intro{bottom:calc(22px + env(safe-area-inset-bottom));white-space:nowrap}
@media(max-height:450px){#brand-intro{--logo-size:min(65vw,48vh)}.intro-monogram{top:34%}.intro-signature{top:calc(34% + var(--logo-size)*.30)}.intro-scroll-hint{bottom:70px}#skip-intro{bottom:10px}}
