/* IPTV Harmony Choice 6 — Prism Wipe with a restrained centre-play finish. */
.ih-logo-motion {
  position: relative !important;
  isolation: isolate;
}

.ih-logo-motion > img {
  position: relative;
  z-index: 0;
  /* Keep the resting artwork identical in every header. The homepage adds a
     drop-shadow to its unscrolled logo, while inner pages do not; that filter
     made the same prism overlay look like a different animation. */
  filter: none !important;
}

/* The homepage had its own mobile logo widths (127px/125.12px), while the
   shared inner-page header uses 130px/118px. Use one responsive footprint so
   the symbol overlay has the same size and alignment everywhere. */
@media (max-width: 767px) {
  .ih-logo-motion > img {
    width: 130px !important;
    height: auto !important;
  }
}

@media (max-width: 390px) {
  .ih-logo-motion > img {
    width: 118px !important;
  }
}

.ih-logo-motion__mark {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  display: block;
  width: 0;
  height: 0;
  overflow: visible;
  pointer-events: none;
}

.ih-logo-motion__layer {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  /* Keep the brand signature available even on pages whose generic
     reduced-motion reset targets every animated element. */
  animation-duration: 15s !important;
  animation-delay: 2s !important;
  animation-iteration-count: infinite !important;
  animation-fill-mode: none;
  animation-play-state: paused;
}

.ih-logo-motion[data-ih-logo-motion-state="running"] .ih-logo-motion__layer {
  animation-play-state: running;
}

.ih-logo-motion__prism {
  fill-rule: evenodd;
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  animation-name: ih-logo-prism-wipe;
  animation-timing-function: linear;
}

.ih-logo-motion__scan {
  transform-origin: center;
  animation-name: ih-logo-prism-scan;
  animation-timing-function: linear;
}

.ih-logo-motion__play {
  fill: #fff;
  animation-name: ih-logo-play-pulse;
  animation-timing-function: linear;
}

/* The active signature occupies the first two seconds of each 15-second cycle. */
@keyframes ih-logo-prism-wipe {
  0%, 1.0667% {
    opacity: 0;
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  }
  2.4% {
    opacity: 1;
  }
  8.5333%, 10.9333% {
    opacity: 1;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
  13.3333%, 100% {
    opacity: 0;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}

@keyframes ih-logo-prism-scan {
  0%, 1.6% {
    opacity: 0;
    transform: translateX(-130%) skewX(-18deg);
  }
  3.2% {
    opacity: .95;
  }
  9.0667% {
    opacity: .95;
    transform: translateX(260%) skewX(-18deg);
  }
  13.3333%, 100% {
    opacity: 0;
    transform: translateX(260%) skewX(-18deg);
  }
}

@keyframes ih-logo-play-pulse {
  0%, 6.66% {
    opacity: 0;
    transform: scale(.86);
  }
  7.34% {
    opacity: .35;
    transform: scale(.92);
  }
  8.2% {
    opacity: 1;
    transform: scale(1.15);
    animation-timing-function: cubic-bezier(.16, 1, .3, 1);
  }
  9.66% {
    opacity: 1;
    transform: scale(1);
  }
  11.46% {
    opacity: .96;
    transform: scale(1);
  }
  13.3333%, 100% {
    opacity: 0;
    transform: scale(1);
  }
}