/* ===========================================================================
   Motion. Everything here fails OPEN: content is hidden for a reveal only
   under `html.js`, which assets/js/main.js sets on its first line — the same
   file that reveals it again. No script, no class, nothing hidden. The
   Elementor editor runs no site script and shows everything regardless.
   =========================================================================== */

.reveal{opacity:1;transform:none}
html.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
html.js .reveal.in{opacity:1;transform:none}
body.elementor-editor-active .reveal,
body.elementor-editor-active .reveal.in{opacity:1 !important;transform:none !important}

/* columns side by side arrive one after the other */
html.js .elementor-column.reveal + .elementor-column.reveal{transition-delay:.12s}
html.js .elementor-column.reveal + .elementor-column.reveal + .elementor-column.reveal{transition-delay:.24s}
html.js .elementor-column.reveal + .elementor-column.reveal + .elementor-column.reveal + .elementor-column.reveal{transition-delay:.36s}

/* the hero builds in on first paint (no observer needed: it is on screen) */
@keyframes bp-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes bp-settle{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:none}}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget{animation:bp-rise 1s var(--ease) both}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget:nth-child(2){animation-delay:.1s}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget:nth-child(3){animation-delay:.2s}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget:nth-child(4){animation-delay:.34s}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget:nth-child(n+5){animation-delay:.46s}
html.js body:not(.elementor-editor-active) .hero-tonight-band .tonight{animation:bp-rise 1s .6s var(--ease) both}
html.js body:not(.elementor-editor-active) .page-hero .page-hero-copy .elementor-widget{animation:bp-rise .9s var(--ease) both}
html.js body:not(.elementor-editor-active) .page-hero .page-hero-copy .elementor-widget:nth-child(2){animation-delay:.08s}
html.js body:not(.elementor-editor-active) .page-hero .page-hero-copy .elementor-widget:nth-child(n+3){animation-delay:.18s}

/* the certificate leans toward the pointer in the builder (main.js sets the angles) */
.bp .cb-preview .cert{transform:perspective(1400px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg))}

@media (prefers-reduced-motion:reduce){
  html.js .reveal{opacity:1;transform:none;transition:none}
  html.js body .hero .hero-copy .elementor-widget,html.js body .hero-tonight-band .tonight,
  html.js body .page-hero .page-hero-copy .elementor-widget{animation:none}
  .bp .cb-preview .cert{transform:none}
  *{scroll-behavior:auto}
}
