/* ===========================================================================
   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 tf-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget{animation:tf-rise 1s var(--ease) both}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget:nth-child(2){animation-delay:.08s}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget:nth-child(3){animation-delay:.16s}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget:nth-child(4){animation-delay:.26s}
html.js body:not(.elementor-editor-active) .hero .hero-copy .elementor-widget:nth-child(n+5){animation-delay:.36s}
html.js body:not(.elementor-editor-active) .page-hero .page-hero-copy .elementor-widget{animation:tf-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:.16s}

/* the tag on the hero arrives last */
html.js body:not(.elementor-editor-active) .hero-side .elementor-widget-shortcode{animation:tf-rise 1.1s .45s var(--ease) both}

@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 .page-hero .page-hero-copy .elementor-widget,
  html.js body .hero-side .elementor-widget-shortcode{animation:none}
}

/* a fish's rise and settle, shared by the schools and the badge fish */
@keyframes tf-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}