/* Wildomi's existing palette and editorial layout, with scroll-linked depth. */
.motion-toggle{position:absolute;top:25px;right:28px;z-index:5;color:#fffdf7;background:#123f3c80;border:1px solid #ffffff70;border-radius:24px;padding:11px 17px;min-height:44px;font:11px var(--sans);letter-spacing:.03em;backdrop-filter:blur(8px);cursor:pointer}
.motion-toggle:hover{background:#123f3c}
.motion-toggle[hidden]{display:none}
.hero-scroll-cue{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.hero-scroll-cue span{font-size:20px}
.motion-home .hero{isolation:isolate}
.hero-image{object-position:center!important}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;opacity:0;transition:opacity .18s ease}
.hero-video.is-playing{opacity:1}
.hero:has(.hero-video.is-playing) .hero-shade{background:linear-gradient(90deg,rgba(5,34,35,.7),rgba(5,34,35,.28) 58%,rgba(5,34,35,.08))}
.motion-home .animal-visual{isolation:isolate}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    html:not([data-motion-paused="true"]) .motion-home :is(.hero-image,.hero-video){height:132%;top:-16%;width:100%;object-fit:cover}
    html:not([data-motion-paused="true"]) .motion-home :is(.animal-visual > :is(img,.animal-motion-video),.quiz-entry-picture img,.gift-photo){height:112%;max-height:none;position:absolute;inset:-6% 0 auto;width:100%;object-fit:cover}
    html:not([data-motion-paused="true"]) .motion-home .hero{view-timeline-name:--wildomi-hero;view-timeline-axis:block}
    html:not([data-motion-paused="true"]) .motion-home .hero-image,
    html:not([data-motion-paused="true"]) .motion-home .hero-video{
      animation:wildomi-hero-depth 1ms linear both;animation-timeline:--wildomi-hero;animation-range:exit 0% exit 100%;
    }
    html:not([data-motion-paused="true"]) .motion-home .hero-content{
      animation:wildomi-hero-copy 1ms linear both;animation-timeline:--wildomi-hero;animation-range:exit 0% exit 85%;
    }
    html:not([data-motion-paused="true"]) .motion-home :is(.animal-visual,.quiz-entry-picture,.gift-art){view-timeline-name:--wildomi-photo;view-timeline-axis:block}
    html:not([data-motion-paused="true"]) .motion-home :is(.animal-visual > :is(img,.animal-motion-video),.quiz-entry-picture img,.gift-photo){
      animation:wildomi-photo-depth 1ms linear both;animation-timeline:--wildomi-photo;animation-range:entry 0% exit 100%;
    }
    html:not([data-motion-paused="true"]) .motion-home .journey-section{view-timeline-name:--wildomi-journey;view-timeline-axis:block}
    html:not([data-motion-paused="true"]) .motion-home .journey-preview{
      animation:wildomi-journey-depth 1ms linear both;animation-timeline:--wildomi-journey;animation-range:entry 0% exit 100%;
    }
    html:not([data-motion-paused="true"]) .motion-home .intro{view-timeline-name:--wildomi-intro;view-timeline-axis:block}
    html:not([data-motion-paused="true"]) .motion-home .small-orbit{
      animation:wildomi-orbit-turn 1ms linear both;animation-timeline:--wildomi-intro;animation-range:entry 0% exit 100%;
    }
  }
}
@keyframes wildomi-hero-depth{from{transform:translate3d(0,0,0) scale(1.03)}to{transform:translate3d(0,16%,0) scale(1.12)}}
@keyframes wildomi-hero-copy{from{transform:translate3d(0,0,0);opacity:1}to{transform:translate3d(0,90px,0);opacity:.3}}
@keyframes wildomi-photo-depth{from{transform:translate3d(0,-4%,0) scale(1.04)}to{transform:translate3d(0,4%,0) scale(1.04)}}
@keyframes wildomi-journey-depth{from{transform:translate3d(0,35px,0) rotate(4deg)}to{transform:translate3d(0,-35px,0) rotate(-2deg)}}
@keyframes wildomi-orbit-turn{from{transform:rotate(-35deg)}to{transform:rotate(35deg)}}
@media(max-width:700px){
  .motion-toggle{position:relative;grid-row:2;justify-self:end;inset:auto;margin:0 20px 12px;padding:10px 15px;min-height:44px;font-size:12px;background:#123f3cb3}
  .hero-scroll-cue{font-size:8px}
  @keyframes wildomi-hero-depth{from{transform:translate3d(0,0,0) scale(1.02)}to{transform:translate3d(0,7%,0) scale(1.05)}}
  @keyframes wildomi-hero-copy{from{transform:translate3d(0,0,0);opacity:1}to{transform:translate3d(0,28px,0);opacity:.7}}
  @keyframes wildomi-photo-depth{from{transform:translate3d(0,-1.5%,0) scale(1.02)}to{transform:translate3d(0,1.5%,0) scale(1.02)}}
  @keyframes wildomi-journey-depth{from{transform:translate3d(0,12px,0) rotate(1deg)}to{transform:translate3d(0,-12px,0) rotate(-1deg)}}
}
html[data-motion-paused="true"] .motion-home :is(.hero-image,.hero-video,.hero-content,.animal-visual > :is(img,.animal-motion-video),.quiz-entry-picture img,.gift-photo,.journey-preview,.small-orbit,.journey-path,.map-pulse){animation:none!important}
html[data-motion-paused="true"] .motion-home :is(.animal-visual > :is(img,.animal-motion-video),.quiz-entry-picture img){transform:none!important;transition:none!important}
.motion-home[data-motion-suspended="true"] :is(.journey-path,.map-pulse),.motion-home .journey-preview[data-motion-visible="false"] :is(.journey-path,.map-pulse){animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){
  .motion-home :is(.hero-image,.hero-video,.hero-content,.animal-visual > :is(img,.animal-motion-video),.quiz-entry-picture img,.gift-photo,.journey-preview,.small-orbit){animation:none!important}
  .hero-video{transition:none}
}
