/* Valduc homepage intro, loaded with valduc-intro.js on the homepage only. Black from the first frame, then the
   full logo on its own curtain. If the script stops before the logo is drawn, the cover lifts and the header logo
   returns on their own. */
[data-theme="affiche"][data-producer-id="valduc"] {
  &.v-intro:not(.v-intro-ready)::before { content: ''; position: fixed; inset: 0; z-index: 100; background: #000; animation: v-intro-lift 0s 3s forwards; }
  &.v-intro .header .brand-logo { opacity: 0; }
  &.v-intro:not(.v-intro-ready) .header .brand-logo { animation: v-intro-show 0s 3s forwards; }
  &.v-intro:not(.v-intro-lifting) :is(.a-film-poster, .a-hero.a-filmed .hero-content > *) { animation-play-state: paused; }
  .v-intro-curtain { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: #000; pointer-events: none; }
  /* The two lines traced from the original logo sit under the wordmark in their original proportions. The lockup
     is raised by the wordmark's transparent top margin so the visible logo is centred. */
  .v-intro-lockup { --width: min(80vw, 640px); display: grid; justify-items: center; width: var(--width); margin-top: calc(var(--width) * -.055); }
  /* The wordmark starts behind a soft angled edge; the gleam is the wordmark's own shape, lit by a narrow amber band. */
  .v-intro-lockup img, .v-intro-gleam { grid-area: 1 / 1; width: 100%; }
  .v-intro-lockup img { height: auto; will-change: translate, scale; mask: linear-gradient(100deg, #000 45%, transparent 55%) 92% 0 / 250% 100% no-repeat; }
  .v-intro-gleam {
    align-self: stretch; mask: var(--mark) 0 0 / 100% 100% no-repeat;
    background: linear-gradient(100deg, transparent 46.5%, rgb(255 214 150 / .75) 50%, transparent 53%) 92% 0 / 250% 100% no-repeat;
  }
  .v-intro-tagline { display: grid; width: 65.1%; margin-top: 4.5%; translate: -.7% 0; }
  .v-intro-tagline > span { aspect-ratio: 2692 / 298; background: #fff; mask: url('/theme/valduc-tagline-df0f8e94031d127c5c435901.svg') 0 0 / 100% 200% no-repeat; }
  .v-intro-tagline > span + span { mask-position: 0 100%; }
}
@keyframes v-intro-lift { to { visibility: hidden; } }
@keyframes v-intro-show { to { opacity: 1; } }