@view-transition{navigation:auto}
::view-transition-old(root){animation:page-out .18s ease both}::view-transition-new(root){animation:page-in .45s cubic-bezier(.22,1,.36,1) both}@keyframes page-out{to{opacity:0}}@keyframes page-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.project[data-world=hospitality] .project-image,.case-image[data-case=hospitality]{view-transition-name:project-hospitality}.project[data-world=product] .project-image,.case-image[data-case=product]{view-transition-name:project-product}.project[data-world=property] .project-image,.case-image[data-case=property]{view-transition-name:project-property}
::view-transition-group(project-hospitality),::view-transition-group(project-product),::view-transition-group(project-property){animation-duration:.65s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
.header{position:sticky;top:0;z-index:40}.mobile-menu.open{z-index:39}html{scroll-padding-top:100px}
.motion-hero{min-height:710px}.motion-hero .hero-scene{overflow:hidden}.hero-camera{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%;opacity:0;transition:opacity 1.2s ease}.hero-world{transition:opacity 1.2s ease}.motion-hero.is-live .hero-camera{opacity:1}.motion-hero.is-live .hero-world{opacity:0}.motion-hero .hero-scene{animation:none!important}.motion-hero h1{font-size:clamp(72px,7.8vw,124px);line-height:1.075;max-width:1220px}.hero-line{display:block;overflow:hidden;padding-bottom:.045em;margin-bottom:-.045em}.hero-line>span{display:block;transform:none}.motion-ready .motion-hero.is-directed .hero-line>span{animation:type-arrive 1.2s cubic-bezier(.16,1,.3,1) both}.motion-ready .motion-hero.is-directed .hero-line:nth-child(2)>span{animation-delay:.13s}.motion-ready .motion-hero.is-directed .hero-intro,.motion-ready .motion-hero.is-directed .hero-actions{animation:quiet-arrive 1s cubic-bezier(.22,1,.36,1) .3s both}@keyframes type-arrive{from{transform:translateY(110%)}to{transform:none}}@keyframes quiet-arrive{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
.motion-hero .hero-bottom{align-items:center;bottom:26px}.scroll-invitation{display:flex;align-items:center;gap:17px;font-size:8px;font-weight:700;letter-spacing:.12em;min-height:44px}.scroll-invitation .icon{height:17px;width:17px}.scroll-line{position:relative;height:1px;width:75px;background:#17181455;overflow:hidden}.scroll-line:after{content:'';position:absolute;inset:0;background:var(--ink);transform-origin:left;animation:line-breathe 3s cubic-bezier(.45,0,.2,1) infinite}@keyframes line-breathe{0%{transform:scaleX(0);transform-origin:left}45%{transform:scaleX(1);transform-origin:left}55%{transform:scaleX(1);transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
.hero-film-meta{display:flex;align-items:center;gap:30px}.hero-film-meta>span{font-size:8px;letter-spacing:.08em;line-height:1.7}.hero-film-control{display:inline-flex;align-items:center;gap:12px;background:#f4f2e9c9;border:1px solid #17181455;backdrop-filter:blur(8px);padding:10px 15px;border-radius:30px;font-size:10px;min-height:44px}.hero-film-control>span{font-size:15px}.hero-intro{max-width:350px}
.motion-story{position:relative;background:var(--paper);padding:70px var(--pad);--story-progress:0%}.story-sticky{position:relative}.story-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.story-heading>.eyebrow,.story-count{font-size:9px}.story-count{font-variant-numeric:tabular-nums;letter-spacing:.1em}.story-layout{display:grid;grid-template-columns:.8fr 1.65fr;gap:6vw;align-items:center}.story-copy h2{font-size:clamp(42px,4.4vw,70px);line-height:1.07;margin-bottom:18px}.story-intro{font-size:14px;line-height:1.5;color:var(--muted)}.story-chapters{list-style:none;padding:0;margin:25px 0}.story-chapters li{border-top:1px solid #bfc4b5;padding:12px 0;transition:opacity .55s ease}.story-chapters button{display:flex;align-items:center;text-align:left;gap:15px;background:transparent;min-height:40px;padding:0;width:100%}.story-chapters button>span{font-size:8px;letter-spacing:.08em}.story-chapters strong{font-size:17px;font-weight:500;line-height:1.3;letter-spacing:-.3px}.story-chapters p{font-size:11px;line-height:1.6;max-width:260px;margin:4px 0 0 29px}.story-copy>.text-link{font-size:11px;margin-top:3px}.story-stage{position:relative;aspect-ratio:1.45;background:var(--ink);overflow:hidden;isolation:isolate;--world-reveal:100%;--world-scale:1;--world-x:0%;--world-opacity:1;--reel-opacity:0;--reel-scale:.88;--reel-y:35px;--guide-width:0%;--finish-opacity:0}.story-sketch,.story-world{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.story-sketch{display:none}.story-world{overflow:hidden}.story-world>img{width:100%;height:100%;object-fit:cover}.story-reel{position:absolute;right:8%;top:8%;height:83%;aspect-ratio:9/16;z-index:3;background:var(--yellow);border:4px solid var(--ink);opacity:0;overflow:hidden}.story-reel>video{width:100%;height:100%;object-fit:cover}.story-reel>span{position:absolute;top:9px;left:8px;right:8px;font-size:5px;letter-spacing:.1em;color:var(--paper);background:var(--ink);padding:5px;z-index:1}.reel-caption{position:absolute;inset:auto 12px 15px;color:var(--paper);font:clamp(24px,2.4vw,39px)/1.1 var(--display);text-shadow:0 2px 14px #0008;transition:opacity .35s}.story-reel:has(video[src]) .reel-caption{opacity:0}.story-finish-copy{position:absolute;top:30%;left:9%;color:var(--yellow);z-index:2;opacity:0}.story-finish-copy>span{font-size:7px;letter-spacing:.1em;display:block;margin-bottom:17px}.story-finish-copy strong{font:400 clamp(25px,3.3vw,55px)/1.1 var(--display);letter-spacing:-.01em}.story-guide{position:absolute;inset:0;z-index:2;pointer-events:none}.guide-line{position:absolute;top:65%;left:5%;height:1px;width:0;background:var(--yellow);box-shadow:0 1px 0 #17181455}.guide-corner{position:absolute;left:5%;top:8%;width:29px;height:29px;border-top:1px solid var(--yellow);border-left:1px solid var(--yellow);opacity:0}.story-timeline{display:flex;align-items:center;gap:20px;margin-top:20px;font-size:7px;font-weight:700;letter-spacing:.08em}.story-timeline>div{height:1px;flex:1;background:#aab19c;position:relative}.story-timeline i{display:block;width:var(--story-progress);height:2px;background:var(--ink);position:absolute;left:0;top:-.5px}.story-caption{font-size:9px;line-height:1.6;color:var(--muted);max-width:560px;margin-top:15px}
.has-motion-story .motion-story{height:235svh;padding-top:0;padding-bottom:0}.has-motion-story .story-sticky{position:sticky;top:86px;min-height:calc(100svh - 86px);display:flex;flex-direction:column;justify-content:center;padding:28px 0}.has-motion-story .story-sketch{display:block}.has-motion-story .story-world{clip-path:inset(0 calc(100% - var(--world-reveal)) 0 0);opacity:var(--world-opacity);transform:translateX(var(--world-x)) scale(var(--world-scale));will-change:clip-path,transform,opacity}.has-motion-story .story-reel{opacity:var(--reel-opacity);transform:translateY(var(--reel-y)) scale(var(--reel-scale));will-change:transform,opacity}.has-motion-story .story-finish-copy{opacity:var(--finish-opacity);transform:translateY(calc(15px - var(--finish-opacity)*15px))}.has-motion-story .guide-line{width:var(--guide-width)}.has-motion-story .guide-corner{opacity:var(--reel-opacity)}.has-motion-story .story-chapters li{opacity:.34}.has-motion-story .story-chapters li.is-current{opacity:1;border-color:var(--ink)}.has-motion-story .story-chapters li.is-current button>span{background:var(--yellow);padding:3px 5px;margin-left:-5px}.has-motion-story .story-copy{align-self:center}
.motion-ready [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .9s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms),transform 1.05s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms)}.motion-ready [data-reveal].is-revealed{opacity:1;transform:none}.project-image>img{transition:transform 1.2s cubic-bezier(.22,1,.36,1),filter .8s}.project-image:hover>img{transform:scale(1.055)}.project-open{transition:transform .6s cubic-bezier(.22,1,.36,1),background .3s}.project-image:hover .project-open{transform:rotate(45deg)}.project-image:hover .project-open svg{transform:rotate(-45deg)}.button{transition:background .3s,color .3s,transform .45s cubic-bezier(.22,1,.36,1)}.button:hover{transform:translateY(-2px)}.button:active{transform:translateY(0)}
.reduce-motion .motion-story{height:auto!important;padding:65px var(--pad)!important}.reduce-motion .story-sticky{position:relative;top:auto;min-height:0;padding:0}.reduce-motion .story-chapters li{opacity:1}.reduce-motion .story-world{clip-path:none!important;opacity:1!important;transform:none!important}.reduce-motion .story-sketch,.reduce-motion .story-reel,.reduce-motion .story-finish-copy,.reduce-motion .story-guide{display:none}.reduce-motion .hero-camera{display:none}.reduce-motion .hero-world{opacity:1}.reduce-motion .hero-film-control{display:none}.reduce-motion [data-reveal]{opacity:1;transform:none}.reduce-motion::view-transition-group(*),.reduce-motion::view-transition-old(*),.reduce-motion::view-transition-new(*){animation:none!important}
@media(max-width:1100px){.story-layout{grid-template-columns:.85fr 1.3fr;gap:4vw}.story-stage{aspect-ratio:1.15}.story-copy h2{font-size:4.7vw}.story-chapters strong{font-size:15px}.story-chapters p{font-size:10px}.motion-hero h1{font-size:8vw}.hero-film-meta{gap:17px}}
@media(max-width:800px){.has-motion-story .story-sticky{top:76px;min-height:calc(100svh - 76px)}.motion-hero h1{font-size:9.4vw}.story-layout{gap:30px;grid-template-columns:1fr 1.15fr}.story-heading{margin-bottom:24px}.story-copy h2{font-size:5.6vw}.story-intro{font-size:12px}.story-chapters strong{font-size:14px}.story-chapters p{font-size:10px;margin-left:24px}.story-chapters button{gap:10px}.story-copy>.text-link{font-size:10px}.story-stage{aspect-ratio:.84}.story-finish-copy{left:7%;top:15%;z-index:4}.story-finish-copy strong{font-size:25px}.story-finish-copy>span{font-size:5px;margin-bottom:8px}.story-reel{right:7%;top:31%;height:61%}.story-timeline{gap:10px;font-size:6px}.hero-film-meta>span{font-size:7px}.hero-film-control{font-size:9px;padding:8px 12px}.scroll-invitation{font-size:7px;gap:12px}.scroll-line{width:45px}.hero-film-meta{gap:13px}}
@media(max-width:560px){html{scroll-padding-top:86px}.motion-hero{height:auto;min-height:0;max-height:none;display:flex;flex-direction:column;background:var(--yellow);overflow:hidden}.motion-hero:after{display:none}.motion-hero .hero-content{order:1;padding:24px var(--pad) 30px;position:relative;background:var(--yellow);z-index:1}.motion-hero .hero-scene{order:2;position:relative;inset:auto;z-index:0;width:100%;aspect-ratio:1.2}.motion-hero .hero-scene img,.hero-camera{object-position:center 60%}.motion-hero h1{font-size:13.6vw;line-height:1.06;letter-spacing:-.006em}.motion-hero .hero-kicker{margin-bottom:22px}.motion-hero .hero-intro{font-size:16px;margin-top:20px}.motion-hero .hero-actions{margin-top:22px;gap:18px}.motion-hero .hero-actions .button{font-size:9px;gap:13px;padding:12px 16px}.motion-hero .hero-bottom{position:relative;order:3;inset:auto;padding:15px var(--pad);gap:12px;background:var(--yellow);display:flex;align-items:center}.scroll-invitation{font-size:6px;gap:8px;letter-spacing:.05em;flex:1}.scroll-invitation .icon{width:13px;height:13px}.scroll-line{width:28px;flex-shrink:0}.hero-film-meta>span{display:none}.hero-film-control{font-size:8px;min-height:40px;padding:8px 11px;white-space:nowrap}.hero-film-meta{flex-shrink:0}.motion-story{padding:50px var(--pad)}.has-motion-story .motion-story{height:210svh}.has-motion-story .story-sticky{min-height:calc(100svh - 76px);padding:20px 0;justify-content:center}.story-heading{margin-bottom:18px}.story-heading>.eyebrow,.story-count{font-size:7px}.story-layout{display:flex;flex-direction:column-reverse;gap:22px;align-items:stretch}.story-stage{aspect-ratio:1.38;width:100%}.story-copy h2{font-size:10vw;line-height:1.05;max-width:75%;margin:0 0 12px}.story-intro{display:none}.story-chapters{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin:18px 0}.story-chapters li{padding-top:9px;padding-bottom:0}.story-chapters button{display:block;min-height:50px}.story-chapters button>span{font-size:7px;display:block;width:max-content;margin:0 0 7px}.story-chapters strong{font-size:11px;line-height:1.4;letter-spacing:-.1px;display:block;max-width:90px}.story-chapters p{font-size:9px;line-height:1.5;margin:7px 0 0;max-width:120px}.story-copy>.text-link{font-size:10px;margin-top:4px}.story-caption{font-size:8px;margin-top:12px}.story-timeline{font-size:5px;margin-top:14px}.story-reel{top:8%;right:8%;height:83%;border-width:3px}.story-finish-copy{left:8%;top:30%;z-index:2}.story-finish-copy strong{font-size:24px;line-height:1.1}.story-finish-copy>span{font-size:5px;margin-bottom:10px}.story-reel>span{font-size:4px;padding:3px;top:6px;left:5px;right:5px}.reel-caption{font-size:22px;inset:auto 8px 10px}.guide-corner{width:18px;height:18px}.has-motion-story .story-world{transform:translateX(var(--world-x)) scale(var(--world-scale))}}
@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}.hero-line>span{transform:none!important}[data-reveal]{opacity:1!important;transform:none!important}}

.has-motion-story .story-sketch{opacity:var(--sketch-opacity,1)}
.motion-hero h1 span{font-family:inherit;font-style:normal;font-weight:400;letter-spacing:inherit}.hero-camera,.motion-hero .hero-world{transition-duration:.65s}

.has-motion-story .story-chapters li{opacity:.72}.has-motion-story .story-chapters li.is-current{opacity:1}.story-chapters p{font-size:12px}
@media(max-width:800px){.story-chapters p{font-size:11px}}
@media(max-width:560px){.story-chapters p{font-size:10px;line-height:1.5}}
@media(max-height:700px) and (min-width:561px){.story-sticky{padding-top:15px!important;padding-bottom:15px!important}.story-copy h2{font-size:42px}.story-heading{margin-bottom:16px}.story-chapters{margin:15px 0}.story-chapters li{padding:8px 0}.story-stage{max-height:430px}.story-intro{font-size:12px}}

@media(max-height:740px) and (max-width:560px){.has-motion-story .story-sticky{padding:15px 0}.story-stage{aspect-ratio:1.65}.story-heading{margin-bottom:12px}.story-layout{gap:16px}.story-copy h2{font-size:9vw;margin-bottom:8px}.story-chapters{margin:12px 0}.story-chapters p{font-size:9px}.story-caption{font-size:7px;margin-top:8px}.story-timeline{margin-top:10px}.story-finish-copy strong{font-size:21px}}
