/* Revision: navigation, project presentation and consistent responsive details. */

html{scrollbar-gutter:stable}

.scene-partnership .part-you{color:#151b1d}

.scene-partnership .partnership-copy p,.scene-next .next-content>p{color:#fff}

.experience-page .header-cta{border:1px solid currentColor;border-radius:100px;padding:12px 22px;gap:27px;transition:background .3s,color .3s}

.experience-page .header-cta:hover{background:var(--story-ink,#f1f0e9);color:var(--story-bg,#111214)}

.story-enhanced .cinema-viewport{top:var(--gallery-top,42%)}

.story-enhanced .cinema-cover{height:min(42vh,calc(var(--screen-h,100svh) - var(--gallery-top,42vh) - 175px));min-height:0}

.work-heading{margin-bottom:55px}

.cinema-cover .cinema-demo,.project-art .demo-badge{position:relative;top:auto;left:auto;right:auto;align-self:flex-start;flex-shrink:0;max-width:100%;margin:0 0 16px;padding:7px 10px;line-height:1.45;letter-spacing:0;overflow-wrap:anywhere;z-index:4}

.cinema-cover:has(.cinema-demo) .cinema-category,.project-art:has(.demo-badge) .art-top{padding-top:0}

.cinema-cover>strong,.project-art .art-title{overflow-wrap:anywhere}

.project-art .demo-badge{margin-bottom:24px}

.about-symbol{flex-direction:row-reverse}

.about-symbol span{transform:rotate(180deg)}

html.menu-lock{overflow:hidden}

body .mobile-nav,body.experience-page .mobile-nav{position:fixed;inset:0;z-index:200;width:100%;height:100dvh;background:#10191e;color:#f1f0e9;padding:112px max(24px,var(--pad)) 28px;border:0;overflow-y:auto;overflow-x:clip;clip-path:inset(0 0 100% 0 round 0 0 45% 0);transition:clip-path .55s cubic-bezier(.76,0,.24,1);isolation:isolate}

body .mobile-nav:not([hidden]){display:flex;flex-direction:column;gap:0}

body .mobile-nav.is-open{clip-path:inset(0 0 0 0 round 0)}

.mobile-nav .menu-watermark{position:absolute;z-index:-1;width:85vw;max-width:none;right:-35%;top:30%;opacity:.08;transform:rotate(-35deg) scale(.7);transition:transform 1.2s cubic-bezier(.2,.7,.2,1);pointer-events:none}

.mobile-nav.is-open .menu-watermark{transform:rotate(15deg) scale(1)}

.menu-eyebrow{font:11px/1.5 monospace;letter-spacing:.12em;color:#67bdf0;margin-bottom:22px}

.menu-links{display:flex;flex-direction:column}

.menu-links a{display:flex;align-items:center;gap:20px;border-bottom:1px solid #ffffff20;padding:13px 0;transform:translateY(35px);opacity:0;transition:transform .65s cubic-bezier(.2,.7,.2,1),opacity .45s;transition-delay:calc(var(--menu-order)*45ms)}

.is-open .menu-links a{transform:none;opacity:1}

.menu-links small{font:11px monospace;color:#6b8b9c;align-self:center}

.menu-links a>span{font-size:clamp(28px,8.4vw,54px);letter-spacing:-.055em;line-height:1.05}

.menu-links b{font-size:22px;font-weight:400;margin-left:auto;color:#58bafa}

.menu-links a:hover>span{color:#58bafa}

.menu-bottom{margin-top:auto;padding-top:28px;display:flex;flex-direction:column;gap:13px;font-size:14px}

.menu-bottom p{font-family:InstrumentSerif,Georgia,serif;font-style:italic;font-size:29px;color:#7fc7f4}

.menu-bottom>span{font:11px monospace;color:#9daeb5}

body.menu-open .header{position:fixed;inset:0 var(--pad) auto;margin:0;z-index:210;color:#f1f0e9;background:transparent;border-color:transparent}

body.menu-open .header .brand img{filter:brightness(0) invert(1)}

body.menu-open .header .menu-toggle{position:relative;z-index:211}

body.menu-open .header .menu-toggle span{background:#fff}

.menu-toggle span{transition:transform .45s cubic-bezier(.22,.7,.2,1)}

.design-cursor{position:fixed;top:0;left:0;z-index:9999;pointer-events:none;opacity:0;transition:opacity .2s;will-change:transform}

.design-cursor:before{content:'';position:absolute;left:0;top:0;transform:translate(-50%,-50%);width:24px;height:24px;border:1px solid #53bcf2;border-radius:50%;transition:width .25s,height .25s,background .25s,border-radius .3s;box-shadow:0 0 0 1px #07141a25}

.design-cursor:after{content:'+';position:absolute;left:0;top:0;transform:translate(-50%,-50%);font:13px monospace;color:#53bcf2}

.design-cursor.visible{opacity:1}

.design-cursor.is-link:before{width:48px;height:48px;background:#53bcf2d9}

.design-cursor.is-link:after{content:'↗';font:24px Arial,sans-serif;color:#10191e}

.design-cursor.is-project:before{width:64px;height:64px;border-radius:20px}

@media(hover:hover) and (pointer:fine){.cursor-enabled,.cursor-enabled a,.cursor-enabled button,.cursor-enabled summary{cursor:none}.cursor-enabled input,.cursor-enabled textarea,.cursor-enabled select{cursor:auto}}

@media(max-width:980px){.experience-page .header-cta{display:none}}

@media(max-width:680px){

 .about-symbol{flex-direction:row;justify-content:flex-start}.about-symbol span{transform:none;writing-mode:horizontal-tb}

 .story-enhanced .cinema-cover>strong,.story-simple .cinema-cover>strong{font-size:clamp(29px,9vw,41px);line-height:1.04;max-width:92%;letter-spacing:-.055em}

 .story-enhanced .cinema-caption h3{font-size:16px}

 .cinema-cover .cinema-demo{font-size:10px;padding:5px 8px;margin-bottom:10px}

 .cinema-cover .cinema-category,.cinema-cover .cinema-tech{font-size:10px;line-height:1.4}

 .story-enhanced .cinema-cover{padding:20px;height:min(34vh,calc(var(--screen-h,100svh) - var(--gallery-top,42vh) - 175px))}

 .story-enhanced .cinema-open{width:36px;height:36px;font-size:21px;right:18px;bottom:18px}

 .scene-partnership .partnership-copy p,.scene-next .next-content>p{color:#fff}

 .project-art .demo-badge{font-size:11px;margin-bottom:20px}

 .project-art:has(.demo-badge){aspect-ratio:auto;min-height:360px;gap:12px}

}

@media(max-height:700px){body .mobile-nav,body.experience-page .mobile-nav{padding-top:94px;padding-bottom:20px}.menu-eyebrow{margin-bottom:12px}.menu-links a{padding:10px 0}.menu-links a>span{font-size:clamp(26px,7vw,40px)}.menu-bottom{padding-top:20px;gap:8px}.menu-bottom p{font-size:24px}}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.design-cursor{display:none}.mobile-nav,.menu-links a,.menu-watermark,.menu-toggle span{transition:none!important}}



.cinema-cover,.project-art{color:var(--project-ink,#151b1d)}

.cinema-rule{background:color-mix(in srgb,var(--project-ink,#151b1d) 16%,transparent);box-shadow:30px 0 0 color-mix(in srgb,var(--project-ink,#151b1d) 16%,transparent),60px 0 0 color-mix(in srgb,var(--project-ink,#151b1d) 16%,transparent),90px 0 0 color-mix(in srgb,var(--project-ink,#151b1d) 16%,transparent),120px 0 0 color-mix(in srgb,var(--project-ink,#151b1d) 16%,transparent)}

.art-orbit{border-color:color-mix(in srgb,var(--project-ink,#151b1d) 25%,transparent)}



.project-card,.project-caption>div{min-width:0}

.project-card .project-art,.project-card:first-child .project-art{width:100%;min-width:0}

@media(max-width:680px){.project-card .project-art:has(.demo-badge),.project-card:first-child .project-art:has(.demo-badge){aspect-ratio:auto;min-height:360px}.project-caption p{overflow-wrap:anywhere}}



/* Content-sized cards: no title clipping, including unbroken names. */

.project-grid{align-items:stretch}.project-card{display:flex;flex-direction:column;min-width:0}.project-card[hidden]{display:none}

.project-card .project-art,.project-card:first-child .project-art{aspect-ratio:auto;height:auto;min-height:340px;flex:1;gap:28px;overflow:hidden}

.project-card .art-title,.project-card:first-child .art-title{font-size:clamp(28px,4.2vw,68px);overflow-wrap:anywhere;line-height:1.08;flex-shrink:0}

.project-card .art-bottom{margin-top:24px}.project-card .project-caption{flex-shrink:0}

.cinema-cover,.story-enhanced .cinema-cover{height:auto;min-height:260px;gap:16px;overflow:hidden}

.cinema-cover strong{font-size:clamp(25px,3.5vw,55px);line-height:1.05;overflow-wrap:anywhere;flex-shrink:0;margin-bottom:24px}

.cinema-cover>span:last-of-type{margin-top:12px}.cinema-track{align-items:stretch}.cinema-project{display:flex;flex-direction:column}.cinema-cover{flex:1}

.about-symbol{flex-direction:row!important}.about-symbol span{writing-mode:horizontal-tb!important;transform:none!important;text-align:left}

.header .brand img{transition:filter .25s}.brand-on-blue .header .brand img{filter:brightness(0) invert(1)}

.mobile-nav{transition:none!important}

@media(max-width:680px){.project-card .project-art,.project-card:first-child .project-art{min-height:300px;padding:25px}.project-card .art-title,.project-card:first-child .art-title{font-size:32px}.cinema-cover strong{font-size:27px}.cinema-cover{padding:24px!important}.about-symbol{gap:20px}.about-symbol span{max-width:145px}}


.cinema-cover>strong,.story-enhanced .cinema-cover>strong,.story-simple .cinema-cover>strong{font-size:clamp(25px,3.5vw,55px);line-height:1.08;margin-bottom:28px;overflow-wrap:anywhere}.cinema-cover .cinema-tech{position:relative;margin-top:12px;flex-shrink:0}.cinema-cover .cinema-rule{flex-shrink:0}.project-card .project-art{min-height:var(--cover-min,340px)}
@media(max-width:680px){.cinema-cover>strong,.story-enhanced .cinema-cover>strong,.story-simple .cinema-cover>strong{font-size:27px}}

.project-caption,.project-caption h3,.project-caption a,.project-card>div,.cinema-caption,.cinema-caption h3,.cinema-caption a{min-width:0;overflow-wrap:anywhere;white-space:normal}.project-caption h3{max-width:100%}

.project-card .project-art,.project-card:first-child .project-art{flex:1 0 auto;min-height:var(--cover-min,340px)}.cinema-cover,.story-enhanced .cinema-cover{flex:1 0 auto}

.cinema-cover,.story-enhanced .cinema-cover{aspect-ratio:auto}.story-enhanced .cinema-track{height:auto;align-items:stretch}.story-simple .cinema-track{align-items:stretch}

.project-card .project-art{display:block}.project-art .art-top{display:flex;margin-bottom:28px}.project-art .art-title{display:block;margin-bottom:40px}.project-art .art-bottom{display:block;margin-top:0;padding-right:45px}.project-art .demo-badge{display:table;margin-bottom:24px}
.cinema-cover,.story-enhanced .cinema-cover{flex:0 0 auto}

.design-cursor[popover]{inset:auto;top:0;left:0;margin:0;padding:0;border:0;width:0;height:0;overflow:visible;background:transparent;color:inherit;pointer-events:none}
.design-cursor[popover]::backdrop{background:transparent;pointer-events:none}
.native-dialog-cursor .cookie-dialog,.native-dialog-cursor .cookie-dialog *{cursor:auto!important}
.story-enhanced .cinema-viewport{overflow:visible}
@media(max-height:650px){.story-enhanced .work-heading h2{font-size:clamp(30px,7vh,62px)}.story-enhanced .work-heading .scene-kicker{margin-bottom:8px}.story-enhanced .work-heading{gap:8px}.story-enhanced .cinema-viewport{bottom:100px}}

@media(min-width:681px){.cinema-cover>strong,.story-enhanced .cinema-cover>strong,.story-simple .cinema-cover>strong{font-size:clamp(42px,6vw,96px)}}
/* Keep all covers equal and content-sized, with a purely horizontal gallery journey. */
.story-enhanced .cinema-cover{flex:1 0 auto}
.story-enhanced .cinema-track{transform:translate3d(calc(var(--track-x,0px) * var(--gallery-scale,1)),0,0) scale(var(--gallery-scale,1))}
.story-enhanced .cinema-project{transform:perspective(1300px) rotateY(var(--card-y,0deg)) rotateZ(var(--card-z,0deg))}
.project-gallery.full-width-gallery{width:100%;max-width:none;display:grid;grid-template-columns:minmax(0,1fr);gap:48px;padding:0 0 55px;margin:0}.full-width-gallery figure{min-width:0}.full-width-gallery img{width:100%;height:auto;object-fit:contain}.full-width-gallery figcaption{padding:14px var(--pad) 0}