/* Floating brand showroom — independent from case and gallery styles. */
.hero.showroom{--room:#ECEEED;--room-ink:#242729;background:var(--room);color:var(--room-ink);height:calc(100svh - 77px);min-height:650px;max-height:1100px;isolation:isolate;display:block;perspective:1400px;touch-action:pan-y}
.showroom::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 28%,#fff9,transparent 65%);pointer-events:none}
.showroom .room-intro{position:absolute;left:var(--pad);top:30px;font-size:12px;line-height:1.6;z-index:4}
.showroom .room-location{position:absolute;right:var(--pad);top:30px;font-size:12px;z-index:4}
.showroom .room-wordmark{position:absolute;left:5%;right:5%;top:29%;margin:0;text-align:center;font-family:var(--serif);font-weight:500;font-size:clamp(76px,12.4vw,210px);line-height:1;letter-spacing:-.065em;color:var(--room-ink)!important;pointer-events:none;z-index:1;transform:translate3d(calc(var(--mx,0)*-9px),calc(var(--my,0)*-5px),0)}
.showroom .room-objects{position:absolute;inset:0;perspective:1400px;z-index:2;pointer-events:none}
.showroom .room-object{position:absolute;display:block;left:var(--x);top:var(--y);width:var(--w);transform:translate(-50%,-50%) translate3d(calc(var(--mx,0)*var(--depth)),calc(var(--my,0)*var(--depth)),0);pointer-events:auto;-webkit-tap-highlight-color:transparent;outline-offset:8px;border-radius:20px}
.room-object--bag{--x:18%;--y:45%;--w:26%;--depth:24px;--angle:-14deg;--lift:0px}
.room-object--jar{--x:79%;--y:26%;--w:20%;--depth:40px;--angle:12deg;--lift:0px}
.room-object--cup{--x:63%;--y:67%;--w:19%;--depth:32px;--angle:-13deg;--lift:0px}
.showroom .room-object img{width:100%;height:auto;user-select:none;transform:perspective(900px) translateY(var(--lift)) rotate(var(--angle)) rotateX(calc(var(--my,0)*-7deg)) rotateY(calc(var(--mx,0)*10deg));filter:drop-shadow(10px 26px 15px #24272924);transition:transform .65s cubic-bezier(.16,1,.3,1),filter .65s;will-change:transform}
.showroom .room-object:hover,.showroom .room-object:focus-visible{--lift:-16px;z-index:5}
.showroom .room-object:hover img,.showroom .room-object:focus-visible img{filter:drop-shadow(16px 40px 24px #24272935)}
.showroom .room-object:focus-visible{outline:2px solid #242729}
.showroom .room-label{position:absolute;left:50%;bottom:-24px;transform:translate(-50%,8px);white-space:nowrap;background:#fff;color:#242729;border-radius:30px;padding:9px 15px;font-size:11px;opacity:0;transition:opacity .25s,transform .25s;box-shadow:0 5px 24px #24272912}
.showroom .room-object:hover .room-label,.showroom .room-object:focus-visible .room-label{opacity:1;transform:translate(-50%,0)}
.showroom .room-copy{position:absolute;left:var(--pad);bottom:58px;z-index:4;max-width:430px}
.showroom .room-copy p{font-size:clamp(18px,1.6vw,25px);line-height:1.7;letter-spacing:-.045em;max-width:21em}
.showroom .room-copy a{display:inline-flex;margin-top:23px;align-items:center;gap:25px;font-size:13px;border-bottom:1px solid currentColor;padding-bottom:7px}
.showroom .room-copy a:focus-visible,.showroom .room-motion:focus-visible{outline:2px solid #242729;outline-offset:5px}
.showroom .room-bottom{position:absolute;right:var(--pad);bottom:36px;display:flex;align-items:center;gap:17px;z-index:5}
.showroom .room-hint{font-size:11px;color:#525957}
.showroom .room-motion{border:1px solid #24272945;border-radius:50%;width:38px;height:38px;display:grid;place-items:center;background:transparent;color:#242729;cursor:pointer}
.room-motion svg{width:13px;height:13px;fill:currentColor}
.room-motion .room-play{display:none}.room-motion[aria-pressed="true"] .room-play{display:block}.room-motion[aria-pressed="true"] .room-pause{display:none}
.showroom .room-floor{position:absolute;width:55%;height:12%;left:28%;bottom:4%;border-radius:50%;background:#343a3512;filter:blur(35px);pointer-events:none}
@media(min-width:941px){.showroom .room-object{animation:room-arrive 1s both}.showroom .room-object--jar{animation-delay:.1s}.showroom .room-object--cup{animation-delay:.2s}}
@keyframes room-arrive{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
@media(max-width:940px){.hero.showroom{min-height:700px}.showroom .room-wordmark{top:32%;font-size:12.6vw}.room-object--bag{--x:20%;--y:39%;--w:32%}.room-object--jar{--x:77%;--y:22%;--w:26%}.room-object--cup{--x:69%;--y:63%;--w:26%}.showroom .room-copy{max-width:340px}}
@media(max-width:600px){.hero.showroom{height:calc(100svh - 62px);min-height:690px;max-height:900px}.showroom .room-intro,.showroom .room-location{top:24px;font-size:10px}.showroom .room-location{max-width:76px;text-align:right}.showroom .room-wordmark{top:29%;left:4%;right:4%;font-size:12.8vw}.room-object--bag{--x:23%;--y:43%;--w:44%;--angle:-13deg}.room-object--jar{--x:76%;--y:21%;--w:33%}.room-object--cup{--x:74%;--y:50%;--w:33%;--angle:-10deg}.showroom .room-copy{bottom:100px;max-width:calc(100% - 44px)}.showroom .room-copy p{font-size:20px;max-width:17em}.showroom .room-copy a{margin-top:15px}.showroom .room-bottom{left:var(--pad);right:var(--pad);bottom:25px;justify-content:space-between}.showroom .room-label{display:none}.showroom .room-floor{bottom:35%;width:75%;left:15%}}
@media(prefers-reduced-motion:reduce){.showroom .room-object{animation:none!important}.showroom .room-object img,.showroom .room-label{transition:none!important}.showroom .room-object img{will-change:auto}}
.showroom[data-motion="off"] .room-object img{will-change:auto}
.showroom[data-motion="off"] .room-object{animation:none!important}
.showroom[data-motion="off"] .room-object img{transform:rotate(var(--angle));transition:none}

/* Scroll chapters. Ordinary vertical layout is the no-JS/reduced-motion fallback. */
.brand-story{--nav-h:77px;--scene-h:calc(100svh - var(--nav-h));position:relative}
.brand-story .showroom{height:var(--scene-h);min-height:0;max-height:none}
.brand-scene{height:var(--scene-h);min-height:560px;position:relative;overflow:hidden;background:var(--scene-color);color:#fff}
.scene-snooze{--scene-color:#9963D1}.scene-salty{--scene-color:#EFCE3C}.scene-unusual{--scene-color:#393D39}
.scene-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%}
.scene-snooze .scene-photo{object-position:center 60%}
.brand-scene::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0000 20%,#0002 45%,#000a 100%);pointer-events:none}
.scene-product{display:none}
.scene-caption{position:absolute;left:var(--pad);right:var(--pad);bottom:10%;z-index:2}
.scene-caption>span{font-size:12px}.scene-caption h2{font:500 clamp(60px,9vw,150px)/1.05 var(--serif);letter-spacing:-.05em;margin:16px 0}
.scene-caption p{font-size:clamp(16px,1.8vw,25px);line-height:1.5}
.scene-caption a{display:inline-flex;gap:40px;padding:10px 0;border-bottom:1px solid #fffa;margin-top:22px;font-size:14px}
.scene-caption a:focus-visible{outline:2px solid #fff;outline-offset:6px}
.brand-story.story-ready{height:calc(var(--scene-h)*var(--story-length,6.95))}
.story-ready .story-stage{position:sticky;top:var(--nav-h);height:var(--scene-h);overflow:hidden;isolation:isolate}
.story-ready .showroom,.story-ready .brand-scene{position:absolute;inset:0;min-height:0;transform:translateY(calc(var(--enter,0)*6%));opacity:var(--alpha,0);pointer-events:none;will-change:opacity,transform}
.story-ready .showroom{--alpha:1;z-index:0}
.story-ready .brand-scene{z-index:1}
.story-ready .scene-salty{z-index:2}.story-ready .scene-unusual{z-index:3}
.story-ready [data-current="true"]{pointer-events:auto}
.story-ready .scene-photo{opacity:1;transform:scale(calc(1.1 - var(--photo,1)*.1))}
.story-ready .scene-product{display:block;position:absolute;width:clamp(180px,32vw,480px);height:72%;object-fit:contain;left:50%;top:45%;transform:translate(-50%,-50%) scale(calc(.7 + var(--photo,1)*.6)) rotate(calc(var(--photo,1)*-9deg));opacity:calc(1 - var(--photo,1));filter:drop-shadow(10px 28px 25px #0003)}
.story-ready .scene-caption{opacity:var(--copy,1);transform:translateY(calc((1 - var(--copy,1))*28px))}
.story-ready .showroom .room-wordmark{opacity:var(--hero-fade,1)}
.story-ready .showroom .room-objects{scale:var(--hero-scale,1);transform-origin:79% 26%}
.story-progress{display:none}.story-ready .story-progress{position:absolute;right:var(--pad);bottom:25px;display:flex;gap:6px;z-index:8;pointer-events:none;mix-blend-mode:difference}
.story-progress i{display:block;width:24px;height:2px;background:#fff5}.story-progress i.active{background:#fff}
.story-end{padding:100px var(--pad)!important;background:#ECEEED!important;color:#242729;text-align:center}
.story-end>p{font-size:16px}.story-end h2{font:500 clamp(45px,7vw,110px)/1.05 var(--serif);letter-spacing:-.04em;margin:30px 0 42px}
.story-end>div{display:flex;justify-content:center;gap:32px;flex-wrap:wrap}.story-end a{font-size:14px;padding-bottom:8px;border-bottom:1px solid currentColor}
.story-end a:focus-visible{outline:2px solid #242729;outline-offset:5px}
@media(max-width:600px){.brand-story{--nav-h:62px}.brand-story .showroom{min-height:650px}.brand-story.story-ready .showroom{min-height:0}.scene-caption{bottom:12%}.scene-caption h2{font-size:clamp(45px,13vw,80px)}.scene-caption>span{font-size:10px}.scene-caption a{margin-top:16px}.story-ready .scene-product{width:60vw}.story-end{padding:75px 22px!important}.scene-salty .scene-photo{object-position:40% 50%}}
@media(prefers-reduced-motion:reduce){.story-ready .showroom,.story-ready .brand-scene{will-change:auto}}

/* Logo-only prologue and perspective project panels. */
.hero.logo-opening{--room:#202323;--room-ink:#EFEDE6;background:#202323}
.logo-opening::before{background:radial-gradient(ellipse at calc(50% + var(--mx,0)*18%) calc(45% + var(--my,0)*18%),#4d5555 0%,#202323 70%)}
.showroom.logo-opening .room-wordmark{top:42%;left:6%;right:6%;transform:perspective(1200px) translateY(-50%) rotateX(calc(var(--my,0)*-5deg)) rotateY(calc(var(--mx,0)*5deg)) scale(var(--hero-scale,1));transform-origin:center;filter:drop-shadow(0 2px 0 #848b88) drop-shadow(0 4px 0 #4c5350) drop-shadow(0 20px 22px #0009)}
.logo-opening .room-wordmark img{width:100%;height:auto}
.showroom.logo-opening .room-intro,.showroom.logo-opening .room-location{color:#d3d8d5}
.showroom.logo-opening .room-copy{bottom:48px}
.showroom.logo-opening .room-copy a{color:#e8edeb;margin-top:0}
.showroom.logo-opening .room-hint{color:#c6ccc9}
.showroom.logo-opening .room-motion{color:#e8edeb;border-color:#afb8b580}
.showroom.logo-opening .room-motion:focus-visible,.showroom.logo-opening .room-copy a:focus-visible{outline-color:#fff}
.story-ready .story-stage{perspective:1400px;background:#202323}
.story-ready .brand-scene{transform-origin:50% 50%;transform:translate3d(0,calc(var(--enter,0)*5%),calc(var(--enter,0)*-240px + var(--exit,0)*-90px)) rotateY(calc(var(--enter,0)*var(--direction,1)*20deg - var(--exit,0)*var(--direction,1)*6deg)) rotateX(calc(var(--enter,0)*8deg)) scale(calc(1 - var(--enter,0)*.1));border-radius:calc(var(--enter,0)*22px);box-shadow:0 40px 80px #0005}
.story-ready .scene-photo{transform:scale(calc(1.14 - var(--photo,1)*.14 + var(--exit,0)*.04))}
.scene-nobiggie{--scene-color:#C82F31}.scene-dough{--scene-color:#E7ABB5}.scene-matcha{--scene-color:#537655}
.story-ready .story-progress{bottom:12px}
@media(max-width:600px){.showroom.logo-opening .room-wordmark{top:43%;left:5%;right:5%}.showroom.logo-opening .room-copy{bottom:103px}.story-ready .brand-scene{transform:translate3d(0,calc(var(--enter,0)*4%),calc(var(--enter,0)*-120px)) rotateY(calc(var(--enter,0)*var(--direction,1)*12deg)) rotateX(calc(var(--enter,0)*5deg))}.story-progress i{width:18px}}
.logo-opening[data-motion="off"] .room-wordmark{transform:translateY(-50%)}
.hero.logo-opening{background:transparent}
.logo-opening .scatter-logo{display:block;width:100%;height:auto;overflow:visible}
.logo-opening .logo-glyph{will-change:transform,opacity}
.story-ready .logo-opening::before{opacity:calc(1 - var(--scatter,0))}
.story-ready .logo-opening .room-intro,.story-ready .logo-opening .room-location,.story-ready .logo-opening .room-copy,.story-ready .logo-opening .room-bottom{opacity:calc(1 - var(--scatter,0)*3)}
.logo-opening[data-motion="off"] .logo-glyph{will-change:auto}
.brand-story:not(.story-ready) .logo-opening{background:#202323}

/* Directional light and soft architectural shade. */
.logo-opening::after{content:"";position:absolute;inset:-25%;pointer-events:none;z-index:2;background:repeating-linear-gradient(118deg,transparent 0 12%,#0008 16% 22%,transparent 27% 38%);filter:blur(16px);transform:translate(calc(var(--mx,0)*-3%),calc(var(--my,0)*-3%));opacity:calc(.7*(1 - var(--scatter,0)));animation:shade-drift 16s ease-in-out infinite alternate}
@keyframes shade-drift{from{translate:-3% -2%}to{translate:3% 2%}}
.logo-opening[data-motion="off"]::after{animation:none;transform:none;opacity:.55}

@media(prefers-reduced-motion:reduce){.logo-opening::after{animation:none}}

/* ITYY origin reveal — one orchestrated brand moment replaces the scattered logo. */
.showroom.logo-opening .room-wordmark{display:none}
.hero.showroom h1.hero-identity{position:absolute;inset:0;margin:0;padding:0 var(--pad);z-index:3;display:grid;place-items:center;
  color:#EFEDE6!important;text-align:center;pointer-events:none;
  transform:perspective(1200px) rotateX(calc(var(--my,0)*-2.4deg)) rotateY(calc(var(--mx,0)*3deg));
  transform-origin:center;opacity:calc(1 - var(--hero-exit,0));will-change:transform,opacity}
.hero-origin,.hero-lockup{grid-area:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center}
.hero-origin{font-family:var(--disp);font-size:clamp(4rem,10vw,10.5rem);font-weight:500;
  --origin-bloom:3;line-height:.79;letter-spacing:-.065em;filter:blur(0);transform:scale(1);
  text-shadow:0 0 0 #EFEDE600;mix-blend-mode:screen;
  transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform 1.2s cubic-bezier(.16,.78,.18,1),
    filter 1.1s cubic-bezier(.16,.78,.18,1),letter-spacing 1.1s cubic-bezier(.16,.78,.18,1),
    text-shadow 1s ease;will-change:transform,filter,opacity,letter-spacing}
.hero-origin span,.hero-origin em{display:block;font-style:normal;animation:ity-origin-in .9s var(--ease) both}
.hero-origin em{margin-left:.22em;color:#F47FA6;font-style:italic;animation-delay:.12s}
.hero-lockup{width:min(78vw,1000px);opacity:0;filter:blur(14px);transform:scale(.88) translateY(12px);
  transition:opacity .9s .18s var(--ease),transform 1s .18s var(--ease),filter .9s .18s var(--ease)}
.hero-lockup img{display:block;width:100%;height:auto;filter:drop-shadow(0 18px 28px #0008)}
.hero-lockup small{display:block;margin-top:clamp(18px,3vh,34px);font:500 clamp(.7rem,1.1vw,.9rem)/1 var(--sans);
  letter-spacing:.24em;text-transform:uppercase;color:#D3D8D5}
.logo-opening.identity-final .hero-origin{opacity:0;filter:blur(34px);letter-spacing:.075em;
  text-shadow:0 0 38px #EFEDE6CC,0 0 96px #F47FA666;
  transform:scale(var(--origin-bloom)) translateY(-.015em)}
.logo-opening.identity-final .hero-lockup{opacity:1;filter:none;transform:none}
.story-ready .logo-opening::before{opacity:calc(1 - var(--hero-exit,0))}
.story-ready .logo-opening .room-intro,.story-ready .logo-opening .room-location,
.story-ready .logo-opening .room-copy,.story-ready .logo-opening .room-bottom{opacity:calc(1 - var(--hero-exit,0)*3)}
.logo-opening::after{opacity:calc(.7*(1 - var(--hero-exit,0)))}
@keyframes ity-origin-in{from{opacity:0;transform:translateY(.32em) rotate(1.5deg)}to{opacity:1;transform:none}}
@media(max-width:600px){
  .hero-identity{padding-inline:20px}
  .hero-origin{--origin-bloom:3.4;font-size:clamp(3.25rem,17.5vw,6rem);line-height:.84}
  .hero-origin em{margin-left:0}
  .hero-lockup{width:82vw}
  .hero-lockup small{font-size:.62rem;letter-spacing:.18em;margin-top:18px}
}
@media(prefers-reduced-motion:reduce){
  .hero-identity{transform:none;opacity:1}
  .hero-origin{display:none}
  .hero-lockup{opacity:1;filter:none;transform:none;transition:none}
  .hero-origin span,.hero-origin em{animation:none}
  .logo-opening.identity-final .hero-origin{transform:none;filter:none;text-shadow:none;letter-spacing:-.065em}
}
/* Image-led editorial cards, inspired by the selected Blog Section layout. */
.work.editorial-work .work-intro,.work.editorial-work .wghost{display:none}
.work.editorial-work{max-width:1440px;margin-inline:auto}
.work.editorial-work .head{margin-bottom:30px}
.work.editorial-work .casegrid.editorial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto;gap:38px 24px;margin:0 0 60px;opacity:1;transform:none}
.work .editorial-grid .ctile{display:flex;flex-direction:column;grid-column:auto;grid-row:auto;min-height:0;background:transparent;overflow:visible;opacity:1;transform:none;transition:none}
.work .editorial-grid .ctile[hidden]{display:none}
.work .editorial-grid .ctile::after{display:none}
.work .editorial-grid .ctile img{position:relative;inset:auto;display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:10px;opacity:1;transform:none;transition:filter .3s}
.work .editorial-grid .ctile:hover img{filter:brightness(1.06)}
.work .editorial-grid .ct-in{position:relative;inset:auto;display:flex;align-items:flex-start;justify-content:flex-start;text-align:left;gap:8px;padding:12px 4px 0;opacity:1;transform:none}
.work .editorial-grid .ct-no{display:none}
.work .editorial-grid .ct-meta{order:-1;margin:0;font:10px/1.5 var(--mono);letter-spacing:.02em;color:var(--mut);display:block}
.work .editorial-grid .ct-meta>*:not(:first-child){display:none}
.work .editorial-grid .ct-br{font-family:var(--sans, sans-serif);font-style:normal;font-weight:600;font-size:20px;line-height:1.3;letter-spacing:-.025em;max-width:none;color:var(--ivory)}
.work .editorial-grid .ct-desc{font:14px/1.65 var(--sans, sans-serif);color:var(--mut);max-width:none}
.work .editorial-grid .ctile:focus-visible{outline:2px solid var(--coral);outline-offset:6px;border-radius:10px}
@media(max-width:1000px){.work.editorial-work .casegrid.editorial-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 18px}}
@media(max-width:600px){.work.editorial-work .casegrid.editorial-grid{grid-template-columns:1fr;gap:32px}.work .editorial-grid .ct-br{font-size:21px}}
@media(prefers-reduced-motion:reduce){.work .editorial-grid .ctile img{transition:none}}

.work .editorial-grid .card-film{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:10px}
.work .editorial-grid .card-film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none}
.work .editorial-grid .card-film.film-playing video{opacity:1}
.card-film-badge{position:absolute;right:12px;bottom:12px;padding:5px 8px;background:#0009;color:#fff;font:10px/1 var(--mono);letter-spacing:.08em;border:1px solid #ffffff45;border-radius:4px;pointer-events:none}
.wfilter .card-film-toggle{margin-left:auto;padding:9px 12px;border:1px solid var(--line);background:transparent;color:var(--ivory);font-family:inherit;font-size:12px;line-height:1.3;cursor:pointer;border-radius:4px}
.card-film-toggle:focus-visible{outline:2px solid var(--coral);outline-offset:3px}