/* ============================================================
   Ken Burns hero slideshow
   Restores the fourworlds.earth homepage hero's crossfading
   background slideshow + subtle zoom ("Ken Burns") that previously
   depended on Elementor's frontend JS. Pure-CSS animation.

   - Crossfade: gap-free. Per-slide delays of cycle/3 (e.g. 0s,8s,16s
     for the 24s cycle) make each slide's fade-out exactly overlap the
     next slide's fade-in (linear + complementary), so combined opacity
     stays ~1 — no blank frame. A black base guards against sub-pixel flashes.
   - Zoom: slow, gentle, decoupled. A yo-yo (1 -> 1.07 -> 1) on its own
     30s timeline, so it never snaps and its speed is independent of how
     fast the slides change.
   ============================================================ */

/* --- reusable component (no Elementor dependency) --- */
.kb-hero{position:absolute;inset:0;overflow:hidden;z-index:0;background:#000;}
.kb-hero .kb-slide{
  position:absolute;inset:0;
  background-size:cover;background-position:center center;
  opacity:0;will-change:opacity,transform;
  animation:kb-fade 24s linear infinite, kb-zoom 30s ease-in-out infinite;
}
.kb-hero .kb-overlay{position:absolute;inset:0;background:#000;opacity:.8;z-index:1;}

/* Gap-free crossfade. fade-in [0,8.333%], hold to 33.333%, fade-out to
   41.666%. With delays of cycle/3 the fade-out of slide N lines up exactly
   with the fade-in of slide N+1, so the two opacities always sum to ~1. */
@keyframes kb-fade{
  0%{opacity:0}
  8.333%{opacity:1}
  33.333%{opacity:1}
  41.666%{opacity:0}
  100%{opacity:0}
}

/* Slow gentle zoom — yo-yo so there is never a hard reset/snap. */
@keyframes kb-zoom{
  0%{transform:scale(1)}
  50%{transform:scale(1.07)}
  100%{transform:scale(1)}
}

/* Accessibility: under reduced-motion keep the gentle crossfade (a fade is not
   vestibular-triggering) but drop the zoom. Everyone still sees the slideshow. */
@media (prefers-reduced-motion: reduce){
  .kb-hero .kb-slide{animation: kb-fade 24s linear infinite;}
}

/* --- glue for the LEGACY Elementor export only (hero container 2c23f1f) ---
   Keeps hero content above the slideshow, and hides Elementor's JS-built
   slideshow so only this CSS one renders. Not needed in the clean rebuild. */
.elementor-element-2c23f1f{position:relative;}
.elementor-element-2c23f1f>.e-con-inner{position:relative;z-index:2;}
.elementor-element-2c23f1f>.elementor-background-slideshow,
.elementor-element-2c23f1f>.e-con-inner>.elementor-background-slideshow{display:none!important;}
/* homepage hero reads better with a lighter wash than the component default */
.elementor-element-2c23f1f .kb-overlay{opacity:.6;}
/* The homepage owner wants the Ken Burns zoom to play even when the OS has
   reduced-motion enabled. Scoped to the homepage hero only — the reusable
   component above still honors reduced-motion by default. */
@media (prefers-reduced-motion: reduce){
  .elementor-element-2c23f1f .kb-hero .kb-slide{
    animation: kb-fade 24s linear infinite, kb-zoom 30s ease-in-out infinite;
  }
}
