html {scroll-behavior:smooth}
.brand-window {display:block;position:relative;width:30px;height:30px;overflow:hidden;background:var(--bg);transition:width .45s cubic-bezier(.2,.7,.2,1);}
.sidebar .brand {align-self:flex-start;margin-left:calc((var(--rail) - 30px)/2);z-index:2}
.brand .brand-window img {width:267px!important;max-width:none;height:30px!important;display:block}
.brand:hover .brand-window,.brand:focus-visible .brand-window {width:267px}
.sahne-layers .intro-lockup .brand-reveal {display:block;overflow:hidden;animation:anthe-unfold 1.15s cubic-bezier(.16,1,.3,1) both}
.sahne-layers .intro-lockup h1 {animation:anthe-caption .7s .45s both}
.entry-skipped .intro-lockup .brand-reveal,.entry-skipped .intro-lockup h1 {animation:none}
@keyframes anthe-unfold {0%{clip-path:inset(0 88.78% 0 0);opacity:0;transform:translateY(12px)}20%{clip-path:inset(0 88.78% 0 0);opacity:1}100%{clip-path:inset(0);opacity:1;transform:none}}
@keyframes anthe-caption {from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.reveal-word {display:inline-block;white-space:nowrap}
.reveal-letter {display:inline-block}
.letter-heading:not(.letters-visible) .reveal-letter {opacity:0;transform:translateY(.7em)}
.letters-visible .reveal-letter {animation:anthe-letter .55s var(--letter-delay) cubic-bezier(.2,.7,.2,1) both}
@keyframes anthe-letter {from{opacity:0;transform:translateY(.7em)}to{opacity:1;transform:none}}
/* Preserve the heading's existing color hierarchy after adding letter spans. */
.sahne-layers .studio-body h2 .reveal-word,.sahne-layers .studio-body h2 .reveal-letter {color:inherit}
.material-heading,.studio-body,.production-body,.case-copy,.case-next {position:relative}
.material-heading:after,.studio-body:after,.production-body:after,.case-copy:after,.case-next:after {
  content:'';position:absolute;left:0;right:0;top:-30px;height:1px;pointer-events:none;
  transform:scaleX(var(--line-progress,0));transform-origin:left;
  background:linear-gradient(90deg,var(--amber),var(--line) 55%,transparent);
}
.sahne-layers .cinema,.sahne-layers .project,.sahne-layers .project-caption,.sahne-layers .cinema-bottom {transition-duration:.25s}
@media(max-width:700px){
  .sidebar .brand {margin-left:0;align-self:auto}
  .brand-window {width:25px;height:25px}
  .brand .brand-window img {width:223px!important;height:25px!important}
  .brand:hover .brand-window,.brand:focus-visible .brand-window {width:223px}
  .sahne-layers .ambient-tonal-field {filter:none;background:radial-gradient(ellipse at 20% 30%,#35465335,transparent 65%),radial-gradient(ellipse at 80% 75%,#35465330,transparent 60%)}
}
.paused .reveal-letter {animation:none;opacity:1!important;transform:none!important}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .brand-window,.sahne-layers .intro-lockup .brand-reveal,.sahne-layers .intro-lockup h1,.reveal-letter{animation:none!important;transition:none!important;opacity:1!important;transform:none!important}
  .letter-heading:not(.letters-visible) .reveal-letter{opacity:1;transform:none}
}