/* The client presentation has its own coordinated scroll choreography. */
.video-home .hero .hero__eyebrow, .video-home .hero .hero__title, .video-home .hero .hero__dek, .video-home .hero .hero__inner .hero__actions { display:none!important; }
/* A quieter rhythm gives each scene room to settle. */
#story, #experience { padding-block:clamp(88px, 10vw, 152px); }
.split { gap:clamp(40px, 7vw, 112px); }
.split__body { max-width:540px; }
.split__body .lead { line-height:1.85; }
.split__media, .o-card, .teaser-grid figure, .cta-strip { border-radius:20px; }
.o-card__media { aspect-ratio:4 / 3; flex-shrink:0; }
.o-card__media img, .split__media img, .teaser-grid img { object-position:center; }
.o-card__body { padding:32px 28px; }
.teaser-grid { gap:clamp(14px, 2vw, 26px); }
.js .hero__media video { opacity:0; transition:opacity 1.1s ease; }
.js .hero__media video.film-ready { opacity:1; }
.hero__media .hero__video--mobile { display:none; }
@media (max-width:760px) {
  .hero__media .hero__video--desktop { display:none; }
  .hero__media .hero__video--mobile { display:block; }
}
#intro { transition:opacity .8s ease, visibility .8s ease; }
@media(max-width:760px) {
  #story, #experience { padding-block:76px; }
  .split { gap:36px; }
  .split__body { max-width:none; }
  .o-card__body { padding:26px 22px; }
  .teaser-grid { grid-auto-rows:clamp(150px, 34vw, 220px); }
}
body.cinematic main .scroll-entry { opacity:1; translate:none; transition:none; }
body.cinematic main .motion-piece {
  opacity:0; translate:calc(var(--entrance-x, 0px) * .85) 28px;
  transition:opacity 1.15s ease var(--entrance-delay, 0ms), translate 2s cubic-bezier(.25,.46,.45,.94) var(--entrance-delay, 0ms), scale 2s cubic-bezier(.25,.46,.45,.94);
}
body.cinematic main .motion-piece.is-visible { opacity:1; translate:0 0; }
body.cinematic main .motion-image { --entrance-delay:0ms!important; }
body.cinematic main .motion-image img { scale:1.075; transition:scale 2.2s cubic-bezier(.25,.46,.45,.94); }
body.cinematic main .motion-image.is-visible img { scale:1; }
.cinematic .motion-word-mask { display:inline-block; overflow:clip; vertical-align:bottom; padding-bottom:.13em; margin-bottom:-.13em; }
.cinematic .motion-word { display:inline-block; transform:translateY(115%) rotate(3deg); opacity:0; transition:transform 1.5s cubic-bezier(.25,.46,.45,.94), opacity .9s ease; transition-delay:calc(var(--word-index) * 55ms + 100ms); }
.cinematic .is-visible .motion-word { transform:none; opacity:1; }
body.cinematic main .motion-piece:focus-within { opacity:1; translate:0 0; clip-path:none; }
/* Each page has a distinct rhythm, using inexpensive opacity and transforms. */
body.cinematic[data-motion-page="gallery"] main .motion-piece { translate:0 0; scale:.96; --entrance-delay:0ms; }
body.cinematic[data-motion-page="menu"] main .motion-piece { translate:0 38px; transition-duration:1.1s,1.7s,1.7s; }
body.cinematic[data-motion-page="celebrate"] main .motion-piece { translate:calc(var(--entrance-x, 0px) * .5) 38px; transition-duration:1.2s,2.1s,2s; }
body.cinematic[data-motion-page="contact"] main .motion-piece { translate:none; --entrance-delay:0ms!important; transition:opacity 1.5s ease; }
body.cinematic[data-motion-page] main .motion-piece.is-visible { translate:0 0; scale:1; }
@media(max-width:760px) {
  /* Give phone-sized content enough travel and time to read as an entrance. */
  body.cinematic[data-motion-page] main .motion-piece {
    translate:calc(var(--entrance-x, 0px) * .6) 10px;
    transition-property:opacity,translate,scale;
    transition-duration:1.05s,1.4s,1.4s;
    transition-delay:var(--entrance-delay, 0ms);
  }
  body.cinematic main .motion-image img { transition-duration:1.4s; }
  body.cinematic main .motion-piece.is-visible { translate:0 0; }
  .cinematic .motion-word { transition-delay:calc(var(--word-index) * 35ms); }
}
@media(prefers-reduced-motion:reduce) {
  .js .hero__media video, #intro { transition:none; }
  body.cinematic[data-motion-page] main .motion-piece { opacity:1; translate:none; scale:1; clip-path:none; transition:none; }
  body.cinematic main .motion-image img { scale:1; transition:none; }
  .cinematic .motion-word { opacity:1; transform:none; transition:none; }
}
@media print {
  body.cinematic[data-motion-page] main .motion-piece { opacity:1; translate:none; scale:1; clip-path:none; }
  .cinematic .motion-word { opacity:1; transform:none; }
}