/* ══════════════════════════════════════════════════════════════════════════
   PW MOTION — a restrained site-wide motion layer
   Design direction dial: motion 0.45. Enough to feel considered, never showy.

   Progressive enhancement contract: nothing is hidden unless <html> carries
   .pw-motion, which pw-motion.js only adds when it is safe to animate
   (JS running, not the Elementor editor, no prefers-reduced-motion).
   If any of that fails, every element renders normally.
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  --pw-ease:cubic-bezier(.22,.61,.36,1);   /* decelerate — settles, never bounces */
  --pw-dur:640ms;
  --pw-dur-fast:280ms;
  --pw-rise:14px;
  --pw-stagger:70ms;
}

/* ── 1 · SCROLL REVEAL ──────────────────────────────────────────────────── */
.pw-motion .pw-anim{
  opacity:0;
  transform:translate3d(0,var(--pw-rise),0);
  transition:opacity var(--pw-dur) var(--pw-ease),transform var(--pw-dur) var(--pw-ease);
  transition-delay:calc(var(--pw-d,0) * var(--pw-stagger));
  will-change:opacity,transform;
}
.pw-motion .pw-anim.is-in{opacity:1;transform:none}
/* once it has played, drop the compositor hint */
.pw-motion .pw-anim.is-done{will-change:auto;transition-delay:0ms}

/* media reveals a touch slower and with a whisper of scale — reads as a lens
   settling rather than a box sliding */
.pw-motion .pw-anim-media{
  opacity:0;transform:scale(1.02);
  transition:opacity 820ms var(--pw-ease),transform 820ms var(--pw-ease);
  transition-delay:calc(var(--pw-d,0) * var(--pw-stagger));
}
.pw-motion .pw-anim-media.is-in{opacity:1;transform:none}

/* hero content runs on load, slightly longer throw */
.pw-motion .pw-anim-hero{--pw-rise:22px;--pw-stagger:110ms}

/* ── 2 · IMAGE HOVER ────────────────────────────────────────────────────── */
/* Containers that already clip get the zoom; bare images are left alone so
   nothing spills outside a layout box. */
.pw-img,.pw-yt,.s-other-onestory,.s-other-aoc,.s-other-ruth,.pw-card-photo{overflow:hidden}
.pw-img img,.s-other-onestory img,.s-other-aoc img,.s-other-ruth img,.pw-card-photo img{
  transition:transform 700ms var(--pw-ease);
}
@media(hover:hover){
  .pw-img:hover img,
  .s-other-onestory:hover img,.s-other-aoc:hover img,.s-other-ruth:hover img,
  .pw-card-photo:hover img{transform:scale(1.045)}
}

/* ── 3 · CARD + ROW LIFT ────────────────────────────────────────────────── */
.s-other-onestory,.s-other-aoc,.s-other-ruth,.pw-card,.pw-ev-row,.pw-ev-cta-band{
  transition:transform var(--pw-dur-fast) var(--pw-ease),box-shadow var(--pw-dur-fast) var(--pw-ease);
}
@media(hover:hover){
  .s-other-onestory:hover,.s-other-aoc:hover,.s-other-ruth:hover,.pw-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 40px rgba(23,25,63,.13);
  }
  .pw-ev-row:hover{transform:translateX(3px)}
}

/* ── 4 · BUTTONS ────────────────────────────────────────────────────────── */
.pw-btn{transition:transform var(--pw-dur-fast) var(--pw-ease),box-shadow var(--pw-dur-fast) var(--pw-ease),filter var(--pw-dur-fast) var(--pw-ease),background-color var(--pw-dur-fast) var(--pw-ease),color var(--pw-dur-fast) var(--pw-ease)}
@media(hover:hover){
  .pw-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(23,25,63,.20)}
}
.pw-btn:active{transform:translateY(0);box-shadow:none}

/* "LEARN MORE →" — the arrow leans in on hover */
.s-oo-lm,.s-aoc-lm,.s-ruth-lm,.pw-lm{transition:color var(--pw-dur-fast) var(--pw-ease)}
.s-oo-lm::after,.s-aoc-lm::after,.s-ruth-lm::after,.pw-lm::after{
  content:'';display:inline-block;width:0;transition:width var(--pw-dur-fast) var(--pw-ease);
}
@media(hover:hover){
  .s-other-onestory:hover .s-oo-lm::after,
  .s-other-aoc:hover .s-aoc-lm::after,
  .s-other-ruth:hover .s-ruth-lm::after,
  a:hover>.pw-lm::after{width:8px}
}

/* ── 5 · VIDEO POSTER ───────────────────────────────────────────────────── */
.pw-play{transition:transform var(--pw-dur-fast) var(--pw-ease),box-shadow var(--pw-dur-fast) var(--pw-ease)}
@media(hover:hover){
  .pw-yt:hover .pw-play{transform:scale(1.09);box-shadow:0 12px 34px rgba(0,0,0,.34)}
}
/* a single slow pulse ring — one gentle cue that this is playable, not a strobe */
.pw-play::before{
  content:'';position:absolute;inset:-10px;border-radius:50%;
  border:1.5px solid currentColor;opacity:0;
}
.pw-motion .pw-yt.is-in .pw-play::before{animation:pw-ring 2600ms var(--pw-ease) 700ms 2}
@keyframes pw-ring{
  0%{opacity:.42;transform:scale(.86)}
  70%{opacity:0;transform:scale(1.16)}
  100%{opacity:0;transform:scale(1.16)}
}

/* ── 6 · TEXT LINKS ─────────────────────────────────────────────────────── */
.pw-ev-copy a,.pw-ev-sub a,.pw-ev-det-n a{
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0% 1.5px;background-position:0 100%;background-repeat:no-repeat;
  transition:background-size var(--pw-dur-fast) var(--pw-ease);
  text-decoration:none;
}
.pw-ev-copy a:hover,.pw-ev-sub a:hover,.pw-ev-det-n a:hover{background-size:100% 1.5px}

/* ── 7 · FILTER CHIPS + STRIP DOTS ──────────────────────────────────────── */
.pw-ev-chip{transition:background-color var(--pw-dur-fast) var(--pw-ease),border-color var(--pw-dur-fast) var(--pw-ease),color var(--pw-dur-fast) var(--pw-ease),transform var(--pw-dur-fast) var(--pw-ease)}
@media(hover:hover){.pw-ev-chip:hover{transform:translateY(-1px)}}

/* ── 8 · DIVIDER ────────────────────────────────────────────────────────── */
.pw-motion .pw-divider.pw-anim .pw-dia{transition:transform 520ms var(--pw-ease) 220ms;transform:scale(0) rotate(-45deg)}
.pw-motion .pw-divider.pw-anim.is-in .pw-dia{transform:scale(1) rotate(45deg)}
.pw-motion .pw-divider.pw-anim .pw-ln{transition:transform 640ms var(--pw-ease);transform:scaleX(0)}
.pw-motion .pw-divider.pw-anim.is-in .pw-ln{transform:scaleX(1)}

/* ── 9 · FOCUS ──────────────────────────────────────────────────────────── */
/* Keyboard users get a visible, on-brand ring — motion never replaces this. */
a:focus-visible,button:focus-visible,.pw-btn:focus-visible,.pw-ev-chip:focus-visible{
  outline:2.5px solid var(--pw-coral,#F0603F);outline-offset:3px;border-radius:2px;
}

/* ── 10 · OPT OUT ───────────────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  .pw-motion .pw-anim,.pw-motion .pw-anim-media,
  .pw-motion .pw-divider.pw-anim .pw-dia,.pw-motion .pw-divider.pw-anim .pw-ln{
    opacity:1!important;transform:none!important;transition:none!important;
  }
  .pw-motion .pw-yt.is-in .pw-play::before{animation:none}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}