/*
  Alterra VR / Birthday / Motion v1
  Isolated animation layer for the approved desktop + fluid mobile layout.
  No layout, sizing, typography, copy or media overrides.
  v1 scope: hero entrance + interactive buttons only.
*/

@keyframes bp-v1-hero-rise {
  from { opacity: 0; transform: translate3d(0, 16px, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* The existing reveal observer decides when the hero enters; no new observer. */
html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-back,
html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-kicker,
html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > h1,
html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-hero-lead,
html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-hero-actions,
html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-hero-facts {
  animation: bp-v1-hero-rise 680ms cubic-bezier(.2,.73,.25,1) both;
}
html.bp-motion-v1 .bp-hero-content.is-in > .bp-back        { animation-delay:  20ms; }
html.bp-motion-v1 .bp-hero-content.is-in > .bp-kicker      { animation-delay: 100ms; }
html.bp-motion-v1 .bp-hero-content.is-in > h1              { animation-delay: 180ms; }
html.bp-motion-v1 .bp-hero-content.is-in > .bp-hero-lead   { animation-delay: 300ms; }
html.bp-motion-v1 .bp-hero-content.is-in > .bp-hero-actions{ animation-delay: 420ms; }
html.bp-motion-v1 .bp-hero-content.is-in > .bp-hero-facts  { animation-delay: 520ms; }

/* All action treatments use transform/opacity/filter; none reflow text or cards. */
html.bp-motion-v1 :is(.bp-btn, .bp-format-action, .bp-head-cta) {
  transition:
    transform 220ms cubic-bezier(.2,.72,.25,1),
    filter 220ms ease,
    box-shadow 220ms ease,
    border-color 220ms ease,
    background-color 220ms ease;
}
html.bp-motion-v1 :is(.bp-btn, .bp-format-action, .bp-head-cta) > span {
  transition: transform 220ms cubic-bezier(.2,.72,.25,1);
}

@media (hover: hover) and (pointer: fine) {
  html.bp-motion-v1 :is(.bp-btn, .bp-format-action, .bp-head-cta):hover {
    transform: translate3d(0, -2px, 0);
    filter: brightness(1.055);
    box-shadow: 0 8px 25px rgba(19, 211, 235, .14);
  }
  html.bp-motion-v1 :is(.bp-btn, .bp-format-action, .bp-head-cta):hover > span {
    transform: translateX(4px);
  }
}

/* Keyboard navigation remains clear without permanent animated glow. */
html.bp-motion-v1 :is(.bp-btn, .bp-format-action, .bp-head-cta):focus-visible {
  outline: 2px solid #8cf4ff;
  outline-offset: 4px;
}

/* Touch devices do not get stuck in :hover; minimal press feedback. */
@media (hover: none), (pointer: coarse) {
  html.bp-motion-v1 :is(.bp-btn, .bp-format-action, .bp-head-cta):active {
    transform: scale(.988);
    filter: brightness(1.035);
  }
}

/* The same sequence, shorter, is reused for mobile/tablet. */
@media (max-width: 1100px) {
  html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-back,
  html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-kicker,
  html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > h1,
  html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-hero-lead,
  html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-hero-actions,
  html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > .bp-hero-facts {
    animation-duration: 440ms;
  }
  html.bp-motion-v1 .bp-hero-content.is-in > .bp-hero-actions { animation-delay: 270ms; }
  html.bp-motion-v1 .bp-hero-content.is-in > .bp-hero-facts { animation-delay: 340ms; }
}

@media (prefers-reduced-motion: reduce) {
  html.bp-motion-v1 .bp-hero-content.bp-reveal.is-in > *,
  html.bp-motion-v1 :is(.bp-btn, .bp-format-action, .bp-head-cta),
  html.bp-motion-v1 :is(.bp-btn, .bp-format-action, .bp-head-cta) > span {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}