/* VMV V8.0 — Motion & Micro-interaction Polish
   Motion hierarchy: hero = cinematic; navigation = deliberate; content = restrained. */

:root{
  --v80-ease-out:cubic-bezier(.19,1,.22,1);
  --v80-ease-soft:cubic-bezier(.22,.61,.36,1);
  --v80-fast:220ms;
  --v80-medium:460ms;
  --v80-slow:900ms;
}

/* Hero — slow image movement, quieter copy transition. */
.v75-media-layer{
  transition:opacity 1.35s var(--v80-ease-soft)!important;
}
.v75-media-layer.active{
  animation-duration:12.5s!important;
  animation-timing-function:cubic-bezier(.2,.55,.35,1)!important;
}
.v73-kicker,
.v73-hero h1 span,
.v73-hero-en,
.v73-watch,
.v73-scroll,
.v73-quote,
.v73-project{
  transition:
    opacity .42s ease,
    transform .64s var(--v80-ease-out)!important;
}
.v73-hero.v75-changing .v73-kicker,
.v73-hero.v75-changing .v73-hero h1 span,
.v73-hero.v75-changing .v73-hero-en,
.v73-hero.v75-changing .v73-watch,
.v73-hero.v75-changing .v73-scroll,
.v73-hero.v75-changing .v73-quote,
.v73-hero.v75-changing .v73-project{
  opacity:0!important;
  transform:translateY(8px)!important;
}
.v73-hero h1 span:nth-child(1){transition-delay:0ms!important}
.v73-hero h1 span:nth-child(2){transition-delay:35ms!important}
.v73-hero h1 span:nth-child(3){transition-delay:70ms!important}
.v73-dots span{
  transition:
    width .42s var(--v80-ease-out),
    height .42s var(--v80-ease-out),
    opacity .25s ease,
    background .25s ease!important;
}

/* Tiles — no card lift. Image and rule do almost all the work. */
.v73-tile{
  transition:background-color .35s ease!important;
}
.v73-tile-media{
  transform:scale(1.008);
  transition:
    transform .85s var(--v80-ease-out),
    filter .6s ease!important;
}
.v73-tile:hover .v73-tile-media,
.v73-tile:focus-visible .v73-tile-media{
  transform:scale(1.026)!important;
}
.v73-tile .v73-cta{
  transition:color .25s ease,opacity .25s ease!important;
}
.v73-tile .v73-cta:after{
  transition:transform .32s var(--v80-ease-out),opacity .25s ease!important;
}
.v73-tile:hover .v73-cta:after,
.v73-tile:focus-visible .v73-cta:after{
  transform:translateX(5px)!important;
}

/* CTA and small controls — tactile, not animated. */
.v73-play,
.film-proposal-cta,
.v78-crosslink,
.v73-footer-links a{
  transition:
    color .24s ease,
    border-color .28s ease,
    padding .34s var(--v80-ease-out),
    opacity .24s ease!important;
}

/* Menu and detail panels move less distance, removing "drawer" feeling. */
.mega-menu{
  transform:translateX(-18px)!important;
  transition:
    transform .58s var(--v80-ease-out),
    opacity .38s ease,
    visibility .58s!important;
}
body.menu-open .mega-menu{transform:translateX(0)!important}
.detail-page{
  transform:translateX(42px)!important;
  opacity:0;
  transition:
    transform .62s var(--v80-ease-out),
    opacity .38s ease,
    visibility .62s!important;
}
.detail-page.open{
  transform:translateX(0)!important;
  opacity:1;
}
.detail-host{
  transform:translateY(10px)!important;
  transition:
    opacity .38s ease,
    transform .58s var(--v80-ease-out)!important;
}
.detail-host.active{transform:none!important}

/* Scroll reveal — deliberately subtle. JS adds .v80-reveal and .is-visible. */
.v80-reveal{
  opacity:0;
  transform:translateY(12px);
  transition:
    opacity .62s ease,
    transform .78s var(--v80-ease-out);
  transition-delay:var(--v80-delay,0ms);
}
.v80-reveal.is-visible{
  opacity:1;
  transform:none;
}
.v73-tile.v80-reveal{
  transform:none;
}
.v73-tile.v80-reveal:not(.is-visible){
  opacity:0;
}
.v73-tile.v80-reveal.is-visible{
  opacity:1;
}

/* Film/editorial content gets only the faintest reveal. */
.detail-page .story-block.v80-reveal,
.detail-page .film-meta-grid.v80-reveal,
.detail-page .film-logline.v80-reveal,
.detail-page .wp-quote.v80-reveal,
.detail-page .metric-band.v80-reveal,
.detail-page .people-grid.v80-reveal,
.detail-page .advisor-list.v80-reveal{
  transform:translateY(9px);
}
.detail-page .story-block.v80-reveal.is-visible,
.detail-page .film-meta-grid.v80-reveal.is-visible,
.detail-page .film-logline.v80-reveal.is-visible,
.detail-page .wp-quote.v80-reveal.is-visible,
.detail-page .metric-band.v80-reveal.is-visible,
.detail-page .people-grid.v80-reveal.is-visible,
.detail-page .advisor-list.v80-reveal.is-visible{
  transform:none;
}

/* Pointer precision: hover motion belongs only to devices that actually hover. */
@media(hover:none),(pointer:coarse){
  .v73-tile-media{transform:none!important}
  .v73-tile:hover .v73-tile-media{transform:none!important}
  .v73-play:hover i,
  .film-proposal-cta:hover,
  .mega-item:hover,
  .mega-submenu button:hover,
  .detail-close:hover b,
  .detail-nav button:hover{
    transform:none!important;
  }
}



/* J.3 — Cinematic depth: restrained, pointer-led, never essential. */
.v75-media-stack{
  position:absolute;
  inset:-7px;
  z-index:-3;
  transform:translate3d(var(--v80-depth-x,0px),var(--v80-depth-y,0px),0);
  transition:transform .32s var(--v80-ease-soft);
  will-change:transform;
  pointer-events:none;
}
.v75-media-stack .v75-media-layer{
  position:absolute;
  inset:0;
}
.v80-film-grain{
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.045;
  mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.52'/%3E%3C/svg%3E");
  background-size:180px 180px;
  animation:v80-grain-shift 7s steps(7,end) infinite;
}
@keyframes v80-grain-shift{
  0%{background-position:0 0}
  20%{background-position:17px -11px}
  40%{background-position:-13px 21px}
  60%{background-position:23px 8px}
  80%{background-position:-19px -15px}
  100%{background-position:0 0}
}
@media(max-width:760px){
  .v80-film-grain{opacity:.026;animation:none}
  .v75-media-stack{inset:-3px;transform:none!important}
}

/* Accessibility: motion becomes effectively static, including JS reveal classes. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,
  *::before,
  *::after{
    scroll-behavior:auto!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    transition-delay:0ms!important;
  }
  .v75-media-layer{animation:none!important;transform:none!important}
  .v75-media-stack{transform:none!important;transition:none!important}
  .v80-film-grain{display:none!important}
  .v80-reveal,
  .v80-reveal.is-visible{
    opacity:1!important;
    transform:none!important;
  }
  .mega-menu,
  body.menu-open .mega-menu,
  .detail-page,
  .detail-page.open,
  .detail-host,
  .detail-host.active{
    transform:none!important;
  }
}


/* J.3A — Scene bloom: a brief optical lift on chapter changes. */
.v80-scene-flare{
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:0;
  background:
    radial-gradient(circle at 72% 34%,rgba(239,205,137,.18),transparent 18%),
    radial-gradient(circle at 62% 54%,rgba(128,159,181,.08),transparent 30%);
  mix-blend-mode:screen;
}
.v80-scene-flare.is-pulse{animation:v80-scene-bloom 1.35s var(--v80-ease-soft) both}
@keyframes v80-scene-bloom{
  0%{opacity:0}
  22%{opacity:.72}
  100%{opacity:0}
}
@media(max-width:760px){
  .v80-scene-flare{background:radial-gradient(circle at 72% 30%,rgba(239,205,137,.12),transparent 24%)}
}
@media(prefers-reduced-motion:reduce){
  .v80-scene-flare{display:none!important}
}