@media (prefers-reduced-motion: no-preference) {
  .animations-ready [data-animate] {
    opacity: 0;
    will-change: opacity, transform;
  }

  .animations-ready [data-animate="inherit"] { opacity: 0; }

  .animations-ready [data-animate="shine"] { opacity: 1; will-change: auto; }
}

[data-animate].animated {
  opacity: 1;
  will-change: auto;
}

[data-animate="none"] { opacity: 1; will-change: auto; }



@keyframes fade-in {
  from { opacity: 0; }
}

@keyframes fade-up {
  from { opacity: 0; translate: 0 30px; }
}

@keyframes zoom-in {
  from { opacity: 0; scale: 0.9; }
}

@keyframes wipe-in {
  from { opacity: 0; clip-path: inset(0 100% 0 0); }
  to { clip-path: inset(0); }
}


@media (prefers-reduced-motion: no-preference) {
  [data-animate="fade"].animating { animation: fade-in var(--animate-duration) var(--ease-out); }
  [data-animate="fade-up"].animating { animation: fade-up var(--animate-duration) var(--ease-out); }
  [data-animate="zoom-in"].animating { animation: zoom-in var(--animate-duration) var(--ease-out); }
  [data-animate="wipe"].animating { animation: wipe-in calc(var(--animate-duration) * 4 / 3) var(--ease-out); }
}


@keyframes opening-fade-in {
  from { opacity: 0; }
}

@keyframes opening-fade-up {
  from { opacity: 0; translate: 0 30px; }
}

@keyframes opening-zoom-in {
  from { opacity: 0; scale: 0.9; }
}

@keyframes opening-wipe-in {
  from { opacity: 0; clip-path: inset(0 100% 0 0); }
  to { clip-path: inset(0); }
}

[data-opening] { --opening-delay: 0ms; }
[data-opening] > :nth-child(2 of :is([data-animate], :has([data-animate]))) { --opening-delay: 100ms; }
[data-opening] > :nth-child(3 of :is([data-animate], :has([data-animate]))) { --opening-delay: 200ms; }
[data-opening] > :nth-child(n + 4 of :is([data-animate], :has([data-animate]))) { --opening-delay: 300ms; }

@media (prefers-reduced-motion: no-preference) {
  :root:not([data-opening-played]) :is([data-opening] [data-animate="fade"], [data-opening="fade"] [data-animate="inherit"]):not(.animating) {
    animation: opening-fade-in var(--animate-duration) var(--ease-out) var(--opening-delay) backwards;
  }

  :root:not([data-opening-played]) :is([data-opening] [data-animate="fade-up"], [data-opening="fade-up"] [data-animate="inherit"]):not(.animating) {
    animation: opening-fade-up var(--animate-duration) var(--ease-out) var(--opening-delay) backwards;
  }

  :root:not([data-opening-played]) :is([data-opening] [data-animate="zoom-in"], [data-opening="zoom-in"] [data-animate="inherit"]):not(.animating) {
    animation: opening-zoom-in var(--animate-duration) var(--ease-out) var(--opening-delay) backwards;
  }

  :root:not([data-opening-played]) :is([data-opening] [data-animate="wipe"], [data-opening="wipe"] [data-animate="inherit"]):not(.animating) {
    animation: opening-wipe-in calc(var(--animate-duration) * 4 / 3) var(--ease-out) var(--opening-delay) backwards;
  }
}


@keyframes photo-settle {
  from { transform: scale(1.12); }
}

@keyframes photo-parallax {
  from { translate: 0 -7%; }
  to { translate: 0 7%; }
}

@media (prefers-reduced-motion: no-preference) {
  [data-animate].animating :is(.image-wrapper__img, .product-card-gallery__img) {
    animation: photo-settle calc(var(--animate-duration) * 2) var(--ease-out);
  }

  @supports (animation-timeline: view()) {
    :root[data-parallax-photos] :is(.banner__media:not(.banner--expand-media > *), .iwt-media .image-wrapper) {
      view-timeline: --photo-frame block;
    }

    :root[data-parallax-photos] :is(.banner__media:not(.banner--expand-media > *) :is(.banner__img, .banner__video), .iwt-media .image-wrapper__img) {
      scale: 1.16;
      animation: photo-parallax linear both;
      animation-timeline: --photo-frame;
    }

    :root[data-parallax-photos] .iwt-media [data-animate].animating .image-wrapper__img {
      animation: photo-settle calc(var(--animate-duration) * 2) var(--ease-out), photo-parallax linear both;
      animation-timeline: auto, --photo-frame;
    }
  }
}




@keyframes text-word-reveal {
  from { opacity: 0; translate: 0 100%; }
}

@keyframes text-word-light {
  from { opacity: 0.18; }
}

@media (prefers-reduced-motion: no-preference) {
  .animations-ready [data-animate="text-words"] .word { overflow: hidden; display: inline-block; }
  .animations-ready [data-animate="text-words"] .word-inner { display: inline-block; }
  .animations-ready [data-animate="text-words"]:not(.animated) .word-inner {
    opacity: 0;
    translate: 0 100%;
  }
  [data-animate="text-words"].animating .word-inner {
    animation: text-word-reveal 0.5s var(--ease-out) calc(var(--word-index) * var(--word-step)) backwards;
  }

  .animations-ready [data-animate="text-lit"] { opacity: 1; will-change: auto; }

  @supports (animation-timeline: view()) {
    [data-animate="text-lit"] { view-timeline: --text-lit block; }

    [data-animate="text-lit"] .word-inner {
      animation: text-word-light linear both;
      animation-timeline: --text-lit;
      animation-range:
        cover calc(20% + var(--word-index) * 30% / var(--word-count))
        cover calc(20% + (var(--word-index) + 1) * 30% / var(--word-count));
    }
  }


  [data-parallax] {
    will-change: transform;
  }
}


[data-visual-preview-mode][data-animate],
shopify-visual-preview-block-list [data-animate] {
  opacity: 1;
  animation: none;
  will-change: auto;
  transform: none;
}


@media (prefers-reduced-motion: no-preference) {
  .details-animated {
    interpolate-size: allow-keywords;
  }

  .details-animated::details-content {
    block-size: 0;
    opacity: 0;
    overflow: clip;
    overflow-clip-margin: calc(var(--focus-outline-width) + var(--focus-outline-offset));
    transition:
      block-size var(--duration-normal) var(--ease-out),
      opacity var(--duration-normal) var(--ease-out),
      content-visibility var(--duration-normal) allow-discrete;
  }

  .details-animated[open]::details-content {
    block-size: auto;
    opacity: 1;
  }
}