/* A restrained, slow camera move gives the chocolate imagery depth. */
@media (prefers-reduced-motion: no-preference) {
  .motion-hero-ready .hero-slide { overflow: hidden; }
  .motion-hero-ready .hero-slide.is-active picture {
    animation: chocolate-hero-drift 7.2s cubic-bezier(.2,.6,.3,1) both;
    transform-origin: center;
  }
  .motion-hero-ready.motion-hero-paused .hero-slide.is-active picture {
    animation-play-state: paused;
  }
  .motion-hero-ready .hero-slide .hero-copy > * {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .48s ease, transform .65s cubic-bezier(.16,1,.3,1);
  }
  .motion-hero-ready .hero-slide.is-active .hero-copy > * {
    opacity: 1;
    transform: translateY(0);
  }
  .motion-hero-ready .hero-slide.is-active .hero-copy p { transition-delay: .08s; }
  .motion-hero-ready .hero-slide.is-active .hero-copy .hero-button { transition-delay: .16s; }

  /* One authored reveal, for the journey from cacao origin to chocolate. */
  .motion-cacao-ready .editorial-image {
    clip-path: inset(0 8% 0 0);
    transition: clip-path 1.05s cubic-bezier(.16,1,.3,1);
  }
  .motion-cacao-ready .editorial-image img {
    transform: scale(1.035);
    transition: transform 1.25s cubic-bezier(.16,1,.3,1);
  }
  .motion-cacao-ready .editorial-copy > * {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .6s ease, transform .8s cubic-bezier(.16,1,.3,1);
  }
  .motion-cacao-ready .editorial-copy > h2 { transition-delay: .08s; }
  .motion-cacao-ready .editorial-copy > p:not(.eyebrow) { transition-delay: .16s; }
  .motion-cacao-ready .editorial-copy > a { transition-delay: .24s; }
  .motion-cacao-ready.motion-cacao-seen .editorial-image { clip-path: inset(0); }
  .motion-cacao-ready.motion-cacao-seen .editorial-image img { transform: scale(1); }
  .motion-cacao-ready.motion-cacao-seen .editorial-copy > * { opacity: 1; transform: none; }
  @keyframes chocolate-hero-drift {
    from { transform: scale(1); }
    to { transform: scale(1.025); }
  }
  @media (max-width: 760px) {
    .motion-hero-ready .hero-slide.is-active picture { animation: none; }
    .motion-hero-ready .hero-slide .hero-copy > * { transform: translateY(6px); }
    .motion-hero-ready .hero-slide.is-active .hero-copy > * { transform: none; }
    .motion-cacao-ready .editorial-image { clip-path: inset(0 4% 0 0); }
    .motion-cacao-ready .editorial-image img { transform: scale(1.015); }
    .motion-cacao-ready .editorial-copy > * { transform: translateY(8px); }
    .motion-cacao-ready.motion-cacao-seen .editorial-copy > * { transform: none; }
  }
}
