/* Convert px to rem
** Usage:
** font-size: rem(23);
*/
/* A small function allowing skipping base64 encoding
** and simply pasting the SVG markup right in the CSS.
** @author Jakob Eriksen
** @link http://codepen.io/jakob-e/pen/doMoML
** @param {String} $svg - SVG image to encode
** @return {String} - Encoded SVG data uri
*/
/* Replace `$search` with `$replace` in `$string`
** @author Hugo Giraudel
** @link http://sassmeister.com/gist/1b4f2da5527830088e4d
** @param {String} $string - Initial string
** @param {String} $search - Substring to replace
** @param {String} $replace ('') - New value
** @return {String} - Updated string
*/
/* Replace substring 'fillColor' to real color from variables */
/* Convert px to rem
** Usage:
** font-size: rem(23);
*/
/* A small function allowing skipping base64 encoding
** and simply pasting the SVG markup right in the CSS.
** @author Jakob Eriksen
** @link http://codepen.io/jakob-e/pen/doMoML
** @param {String} $svg - SVG image to encode
** @return {String} - Encoded SVG data uri
*/
/* Replace `$search` with `$replace` in `$string`
** @author Hugo Giraudel
** @link http://sassmeister.com/gist/1b4f2da5527830088e4d
** @param {String} $string - Initial string
** @param {String} $search - Substring to replace
** @param {String} $replace ('') - New value
** @return {String} - Updated string
*/
/* Replace substring 'fillColor' to real color from variables */
/* Mixin for button animation,
    use: @include button-animation(); for .btn-primary-dark--white-bg button
*/
/* Mixin for arrow link animation,
    use: @include arrow-link-animation(); for .btn-tertiary-dark--white-bg button
*/
/* Mixin for link animation,
    use: @include link-animation(); for .btn-link-dark--white-bg button
*/
/* Mixin for button background animation,
    use: @include hoverBgEffect($primary-slate, $scale: 1.4, $speed: 0.4s);
*/
/**
 * Mixin for adding gradient line to the bottom.
 * @param {$side-colors} color.
 */
/**
 * Mixin for adding text underline.
 */
/**
 * Mixin for cropping the text.
 * @param {$line-clamp} number of visible lines.
 */
.ps-pause-button {
  position: absolute;
  top: var(--focal-point-y, 0%);
  left: var(--focal-point-x, 0%);
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 36px;
  height: 90px;
  border-radius: 18px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 209, 210, 0.6)), to(rgba(0, 209, 210, 0.05)));
  background: linear-gradient(180deg, rgba(0, 209, 210, 0.6) 0%, rgba(0, 209, 210, 0.05) 100%);
  overflow-y: hidden;
  /* Animations */
}
@media (min-width: 1024px) {
  .ps-pause-button {
    width: 48px;
    height: 120px;
    border-radius: 24px;
  }
}
@media (min-width: 576px) and (max-width: 1023.98px) {
  .ps-pause-button {
    display: none;
  }
}
.ps-pause-button__toggler {
  position: absolute;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  aspect-ratio: 1;
  background-color: rgba(54, 41, 164, 0.3);
  border-radius: 50%;
}
.ps-pause-button__circle {
  height: 100%;
  width: 100%;
  border: 2px solid #00D1D2;
  border-radius: 50%;
}
@media (min-width: 1024px) {
  .ps-pause-button__circle {
    border-width: 2.67px;
  }
}
.ps-pause-button__icon {
  position: absolute;
  height: 28.8px;
  width: 28.8px;
  background-size: contain;
  -webkit-transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
}
@media (min-width: 1024px) {
  .ps-pause-button__icon {
    height: 38.4px;
    width: 38.4px;
  }
}
.ps-pause-button__icon--play {
  background: var(--play-icon-url) no-repeat center;
}
.ps-pause-button__icon--pause {
  background: var(--pause-icon-url) no-repeat center;
  opacity: 0;
  visibility: hidden;
}
.ps-pause-button--switch .ps-pause-button__toggler {
  -webkit-animation-name: shift-toggler-bottom;
          animation-name: shift-toggler-bottom;
  -webkit-animation-delay: 1600ms;
          animation-delay: 1600ms;
  -webkit-animation-duration: 600ms;
          animation-duration: 600ms;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  --shift-value: calc(90px - 36px);
}
@media (min-width: 1024px) {
  .ps-pause-button--switch .ps-pause-button__toggler {
    --shift-value: calc(120px - 48px);
  }
}
@-webkit-keyframes shift-toggler-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    background-color: rgba(54, 41, 164, 0.3);
  }
  100% {
    -webkit-transform: translateY(var(--shift-value));
            transform: translateY(var(--shift-value));
    background-color: rgba(54, 41, 164, 0.5);
  }
}
@keyframes shift-toggler-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    background-color: rgba(54, 41, 164, 0.3);
  }
  100% {
    -webkit-transform: translateY(var(--shift-value));
            transform: translateY(var(--shift-value));
    background-color: rgba(54, 41, 164, 0.5);
  }
}
.ps-pause-button--switch .ps-pause-button__circle {
  -webkit-animation-name: scale-circle, unscale-circle;
          animation-name: scale-circle, unscale-circle;
  -webkit-animation-delay: 600ms, 1600ms;
          animation-delay: 600ms, 1600ms;
  -webkit-animation-duration: 800ms, 300ms;
          animation-duration: 800ms, 300ms;
  -webkit-animation-timing-function: ease-out, ease-in;
          animation-timing-function: ease-out, ease-in;
  -webkit-animation-fill-mode: forwards, forwards;
          animation-fill-mode: forwards, forwards;
}
@-webkit-keyframes scale-circle {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.83);
            transform: scale(0.83);
  }
}
@keyframes scale-circle {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.83);
            transform: scale(0.83);
  }
}
@-webkit-keyframes unscale-circle {
  0% {
    -webkit-transform: scale(0.83);
            transform: scale(0.83);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes unscale-circle {
  0% {
    -webkit-transform: scale(0.83);
            transform: scale(0.83);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.ps-pause-button--switch .ps-pause-button__icon--play {
  -webkit-animation-name: hide-play-icon;
          animation-name: hide-play-icon;
  -webkit-animation-delay: 1600ms;
          animation-delay: 1600ms;
  -webkit-animation-duration: 300ms;
          animation-duration: 300ms;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes hide-play-icon {
  0% {
    opacity: 1;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}
@keyframes hide-play-icon {
  0% {
    opacity: 1;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}
.ps-pause-button--switch .ps-pause-button__icon--pause {
  -webkit-animation-name: show-pause-icon;
          animation-name: show-pause-icon;
  -webkit-animation-delay: 1600ms;
          animation-delay: 1600ms;
  -webkit-animation-duration: 300ms;
          animation-duration: 300ms;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes show-pause-icon {
  0% {
    opacity: 0;
    visibility: hidden;
  }
  100% {
    opacity: 1;
    visibility: visible;
  }
}
@keyframes show-pause-icon {
  0% {
    opacity: 0;
    visibility: hidden;
  }
  100% {
    opacity: 1;
    visibility: visible;
  }
}

:root {
  --holder-top: 29.3125rem;
  --holder-left: -3.125rem;
  --stick-top: 11.25rem;
  --stick-left: 0.5rem;
}

@media (min-width: 1024px) {
  :root {
    --holder-top: 28.9375rem;
    --holder-left: 10.625rem;
    --stick-top: 10rem;
    --stick-left: 15rem;
  }
}
@media (min-width: 1300px) {
  :root {
    --holder-top: 35.1875rem;
    --holder-left: 20.9375rem;
    --stick-top: 16.5rem;
    --stick-left: 25.125rem;
  }
}
@-webkit-keyframes kit-image {
  0% {
    top: 65%;
    opacity: 1;
  }
  90% {
    top: 6.875rem;
    opacity: 1;
  }
  100% {
    top: 6.875rem;
    opacity: 0;
  }
}
@keyframes kit-image {
  0% {
    top: 65%;
    opacity: 1;
  }
  90% {
    top: 6.875rem;
    opacity: 1;
  }
  100% {
    top: 6.875rem;
    opacity: 0;
  }
}
@-webkit-keyframes holder-image-mobile {
  0% {
    top: 19.75rem;
    left: -100% /*!rtl:ignore*/;
    -webkit-transform: translate(0) rotate(90deg) scale(0.65) /*!rtl:ignore*/;
            transform: translate(0) rotate(90deg) scale(0.65) /*!rtl:ignore*/;
    opacity: 0;
  }
  25%, 35% {
    top: 19.75rem;
    left: -50% /*!rtl:ignore*/;
    -webkit-transform: rotate(90deg) translate(0, -50%) scale(0.65) /*!rtl:ignore*/;
            transform: rotate(90deg) translate(0, -50%) scale(0.65) /*!rtl:ignore*/;
    opacity: 1;
  }
  50%, 99% {
    top: var(--holder-top);
    left: var(--holder-left) /*!rtl:ignore*/;
    opacity: 1;
    -webkit-transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
            transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
  }
  100% {
    top: var(--holder-top);
    left: var(--holder-left) /*!rtl:ignore*/;
    opacity: 0;
    -webkit-transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
            transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
  }
}
@keyframes holder-image-mobile {
  0% {
    top: 19.75rem;
    left: -100% /*!rtl:ignore*/;
    -webkit-transform: translate(0) rotate(90deg) scale(0.65) /*!rtl:ignore*/;
            transform: translate(0) rotate(90deg) scale(0.65) /*!rtl:ignore*/;
    opacity: 0;
  }
  25%, 35% {
    top: 19.75rem;
    left: -50% /*!rtl:ignore*/;
    -webkit-transform: rotate(90deg) translate(0, -50%) scale(0.65) /*!rtl:ignore*/;
            transform: rotate(90deg) translate(0, -50%) scale(0.65) /*!rtl:ignore*/;
    opacity: 1;
  }
  50%, 99% {
    top: var(--holder-top);
    left: var(--holder-left) /*!rtl:ignore*/;
    opacity: 1;
    -webkit-transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
            transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
  }
  100% {
    top: var(--holder-top);
    left: var(--holder-left) /*!rtl:ignore*/;
    opacity: 0;
    -webkit-transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
            transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
  }
}
@-webkit-keyframes holder-image {
  0% {
    top: 20%;
    left: 50% /*!rtl:ignore*/;
    -webkit-transform: translateX(0) scale(1.4) /*!rtl:ignore*/;
            transform: translateX(0) scale(1.4) /*!rtl:ignore*/;
    opacity: 0;
  }
  25%, 35% {
    top: 55%;
    left: 50% /*!rtl:ignore*/;
    -webkit-transform: translateX(-50%) scale(1.3) /*!rtl:ignore*/;
            transform: translateX(-50%) scale(1.3) /*!rtl:ignore*/;
    opacity: 1;
  }
  50%, 99% {
    top: var(--holder-top);
    left: var(--holder-left) /*!rtl:ignore*/;
    opacity: 1;
    -webkit-transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
            transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
  }
  100% {
    top: var(--holder-top);
    left: var(--holder-left) /*!rtl:ignore*/;
    opacity: 0;
    -webkit-transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
            transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
  }
}
@keyframes holder-image {
  0% {
    top: 20%;
    left: 50% /*!rtl:ignore*/;
    -webkit-transform: translateX(0) scale(1.4) /*!rtl:ignore*/;
            transform: translateX(0) scale(1.4) /*!rtl:ignore*/;
    opacity: 0;
  }
  25%, 35% {
    top: 55%;
    left: 50% /*!rtl:ignore*/;
    -webkit-transform: translateX(-50%) scale(1.3) /*!rtl:ignore*/;
            transform: translateX(-50%) scale(1.3) /*!rtl:ignore*/;
    opacity: 1;
  }
  50%, 99% {
    top: var(--holder-top);
    left: var(--holder-left) /*!rtl:ignore*/;
    opacity: 1;
    -webkit-transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
            transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
  }
  100% {
    top: var(--holder-top);
    left: var(--holder-left) /*!rtl:ignore*/;
    opacity: 0;
    -webkit-transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
            transform: rotate(60deg) scale(1) /*!rtl:ignore*/;
  }
}
@-webkit-keyframes stick-image {
  0% {
    top: 70%;
    left: 30% /*!rtl:ignore*/;
    opacity: 0;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  40%, 99% {
    top: var(--stick-top);
    left: var(--stick-left) /*!rtl:ignore*/;
    opacity: 1;
    -webkit-transform: rotate(59deg) /*!rtl:ignore*/;
            transform: rotate(59deg) /*!rtl:ignore*/;
  }
  100% {
    top: var(--stick-top);
    left: var(--stick-left) /*!rtl:ignore*/;
    opacity: 0;
    -webkit-transform: rotate(59deg) /*!rtl:ignore*/;
            transform: rotate(59deg) /*!rtl:ignore*/;
  }
}
@keyframes stick-image {
  0% {
    top: 70%;
    left: 30% /*!rtl:ignore*/;
    opacity: 0;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  40%, 99% {
    top: var(--stick-top);
    left: var(--stick-left) /*!rtl:ignore*/;
    opacity: 1;
    -webkit-transform: rotate(59deg) /*!rtl:ignore*/;
            transform: rotate(59deg) /*!rtl:ignore*/;
  }
  100% {
    top: var(--stick-top);
    left: var(--stick-left) /*!rtl:ignore*/;
    opacity: 0;
    -webkit-transform: rotate(59deg) /*!rtl:ignore*/;
            transform: rotate(59deg) /*!rtl:ignore*/;
  }
}
@-webkit-keyframes opacity-visible {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes opacity-visible {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes holder-vibrations {
  0%, 100% {
    opacity: 0;
  }
  30%, 70% {
    opacity: 1;
  }
}
@keyframes holder-vibrations {
  0%, 100% {
    opacity: 0;
  }
  30%, 70% {
    opacity: 1;
  }
}
@-webkit-keyframes nav-links-spacer {
  0% {
    bottom: 100%;
  }
  100% {
    bottom: 0;
  }
}
@keyframes nav-links-spacer {
  0% {
    bottom: 100%;
  }
  100% {
    bottom: 0;
  }
}
@-webkit-keyframes nav-links-spacer-back {
  0% {
    top: 4.625rem;
  }
  100% {
    top: 0;
  }
}
@keyframes nav-links-spacer-back {
  0% {
    top: 4.625rem;
  }
  100% {
    top: 0;
  }
}
.motion-tile {
  border-radius: 1rem;
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 370/648;
  min-height: 37.5rem;
}
.motion-tile-wrapper {
  padding: 0 1rem;
}
@media (min-width: 576px) {
  .motion-tile {
    aspect-ratio: 289/222;
  }
}
@media (min-width: 1024px) {
  .motion-tile {
    border-radius: 1.75rem;
    aspect-ratio: 2;
  }
}
.motion-tile-title {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  text-align: center;
  position: absolute;
  left: 50%;
  width: 100%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  opacity: 0;
  top: 50%;
  -webkit-transition: opacity 0.1s ease-out, top 1.5s ease-out;
  transition: opacity 0.1s ease-out, top 1.5s ease-out;
}
@media (min-width: 1024px) {
  .motion-tile-title {
    font-size: 3rem;
    line-height: 2.75rem;
  }
}
.motion-tile .motion-tile-image {
  opacity: 0;
  position: absolute;
}
.motion-tile .kit-image {
  display: block;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-animation: kit-image 1.6s 1 ease-in-out;
          animation: kit-image 1.6s 1 ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
  width: 30rem;
  max-width: none;
}
@media (min-width: 1024px) {
  .motion-tile .kit-image {
    width: 38rem;
  }
}
.motion-tile .holder-image {
  -webkit-animation: holder-image-mobile 4.1s 1 ease-in-out;
          animation: holder-image-mobile 4.1s 1 ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
  width: 38.125rem;
  max-width: none;
}
@media (min-width: 1024px) {
  .motion-tile .holder-image {
    -webkit-animation: holder-image 4.1s 1 ease-in-out;
            animation: holder-image 4.1s 1 ease-in-out;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    -webkit-animation-play-state: paused;
            animation-play-state: paused;
    width: 40rem;
  }
}
.motion-tile .stick-image {
  -webkit-animation: stick-image 2.1s 1 ease-in-out;
          animation: stick-image 2.1s 1 ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
  width: 7.75rem;
}
.motion-tile .motion-tile-carousel-wrapper {
  opacity: 0;
}
.motion-tile.visible .motion-tile-title {
  opacity: 1;
  top: 1rem;
}
@media (max-width: 1023.98px) {
  .motion-tile.visible .motion-tile-title {
    animation: opacity-visible 0.5s 1 forwards ease-in-out reverse;
    -webkit-animation-delay: 5.3s;
            animation-delay: 5.3s;
  }
}
.motion-tile.visible .kit-image {
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.motion-tile.visible .holder-image {
  -webkit-animation-play-state: running;
          animation-play-state: running;
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s;
}
.motion-tile.visible .stick-image {
  -webkit-animation-play-state: running;
          animation-play-state: running;
  -webkit-animation-delay: 3.5s;
          animation-delay: 3.5s;
}
.motion-tile.play-tabs .motion-tile-carousel-wrapper {
  -webkit-animation: opacity-visible 0s 1 ease-in-out;
          animation: opacity-visible 0s 1 ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.motion-tile.play-tabs .motion-tile-nav {
  -webkit-animation: opacity-visible 0.3s 1 ease-in-out;
          animation: opacity-visible 0.3s 1 ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s;
}
.motion-tile.play-tabs .motion-tile-scene-image {
  opacity: 0;
  position: absolute;
}
.motion-tile.play-tabs .scene-holder-image {
  position: absolute;
  top: 29.3125rem;
  left: -3.125rem /*!rtl:ignore*/;
  opacity: 1;
  -webkit-transform: rotate(60deg) /*!rtl:ignore*/;
          transform: rotate(60deg) /*!rtl:ignore*/;
  width: 38.125rem;
  max-width: none;
}
@media (min-width: 1024px) {
  .motion-tile.play-tabs .scene-holder-image {
    top: 28.9375rem;
    left: 10.625rem /*!rtl:ignore*/;
    width: 40rem;
  }
}
@media (min-width: 1300px) {
  .motion-tile.play-tabs .scene-holder-image {
    top: 35.1875rem;
    left: 20.9375rem /*!rtl:ignore*/;
  }
}
.motion-tile.play-tabs .scene-stick-image {
  width: 7.75rem;
  opacity: 1;
  top: 11.25rem;
  left: 0.5rem /*!rtl:ignore*/;
  -webkit-transform: rotate(59deg) /*!rtl:ignore*/;
          transform: rotate(59deg) /*!rtl:ignore*/;
}
@media (min-width: 1024px) {
  .motion-tile.play-tabs .scene-stick-image {
    top: 10rem;
    left: 15rem /*!rtl:ignore*/;
  }
}
@media (min-width: 1300px) {
  .motion-tile.play-tabs .scene-stick-image {
    top: 16.5rem;
    left: 25.125rem /*!rtl:ignore*/;
  }
}
.motion-tile.play-tabs .motion-tile-scene.show.device-vibrations .scene-active-holder-vibrations-image {
  position: absolute;
  top: 25rem;
  left: -3.125rem /*!rtl:ignore*/;
  width: 38.125rem;
  max-width: none;
  opacity: 0;
  -webkit-transform: rotate(60deg) /*!rtl:ignore*/;
          transform: rotate(60deg) /*!rtl:ignore*/;
  -webkit-animation: opacity-visible 0.3s 1 ease-in-out;
          animation: opacity-visible 0.3s 1 ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s;
}
@media (min-width: 1024px) {
  .motion-tile.play-tabs .motion-tile-scene.show.device-vibrations .scene-active-holder-vibrations-image {
    top: 24.375rem;
    left: 10.625rem /*!rtl:ignore*/;
    width: 40rem;
  }
}
@media (min-width: 1300px) {
  .motion-tile.play-tabs .motion-tile-scene.show.device-vibrations .scene-active-holder-vibrations-image {
    top: 30.6875rem;
    left: 20.9375rem /*!rtl:ignore*/;
  }
}
.motion-tile.play-tabs .motion-tile-scene.pause-mode .scene-active-holder-image {
  position: absolute;
  top: 10rem;
  left: 50% /*!rtl:ignore*/;
  opacity: 1;
  max-width: none;
  width: 46.875rem;
  -webkit-transform: translate(-50%, -50%) rotate(90deg) translateX(50%) /*!rtl:ignore*/;
          transform: translate(-50%, -50%) rotate(90deg) translateX(50%) /*!rtl:ignore*/;
}
@media (min-width: 1024px) {
  .motion-tile.play-tabs .motion-tile-scene.pause-mode .scene-active-holder-image {
    top: 13.875rem;
    width: 35rem;
  }
}
@media (min-width: 1300px) {
  .motion-tile.play-tabs .motion-tile-scene.pause-mode .scene-active-holder-image {
    top: 12.8125rem;
    width: 45.5rem;
  }
}
.motion-tile.play-tabs .motion-tile-scene.pause-mode .ps-pause-button {
  position: absolute;
  top: 27.1875rem;
  left: 50%;
  opacity: 1;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media (min-width: 1024px) {
  .motion-tile.play-tabs .motion-tile-scene.pause-mode .ps-pause-button {
    top: 26.75rem;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}
@media (min-width: 1300px) {
  .motion-tile.play-tabs .motion-tile-scene.pause-mode .ps-pause-button {
    top: 29.375rem;
  }
}
.motion-tile.play-tabs .motion-tile-scene.pause-mode + .motion-tile-scene.pause-mode {
  position: absolute;
  top: 0;
}
.motion-tile.play-tabs .motion-tile-scene.pause-mode + .motion-tile-scene.pause-mode .scene-active-holder-image,
.motion-tile.play-tabs .motion-tile-scene.pause-mode + .motion-tile-scene.pause-mode .ps-pause-button {
  display: none;
}
.motion-tile.play-tabs .motion-tile-scene.pause-mode.previous-to-show {
  display: block;
  opacity: 1;
}
.motion-tile.play-tabs .motion-tile-scene.pause-mode.previous-to-show .motion-tile-scene-subtitle,
.motion-tile.play-tabs .motion-tile-scene.pause-mode.previous-to-show .motion-tile-scene-description {
  opacity: 0;
}

.motion-tile-carousel, .motion-tile-carousel-wrapper,
.motion-tile-carousel .slick-list,
.motion-tile-carousel .slick-track,
.motion-tile-carousel .slick-slide > div,
.motion-tile-carousel .motion-tile-scene {
  height: 100%;
}

.motion-tile-nav {
  position: absolute;
  bottom: 1.25rem;
  right: 50%;
  -webkit-transform: translateX(50%);
          transform: translateX(50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 95%;
  opacity: 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (min-width: 1024px) {
  .motion-tile-nav {
    position: relative;
    top: -70%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    width: 23.125rem;
    right: -41% /*!rtl:-13%*/;
    display: block;
  }
}
@media (min-width: 1300px) {
  .motion-tile-nav {
    width: 28.125rem;
  }
}
@media (max-width: 1023.98px) {
  .motion-tile-nav .nav-tabs {
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    margin: 0;
    background-color: transparent;
    width: auto;
  }
}
.motion-tile-nav .nav-tabs .motion-tile-link.nav-link {
  border: 0;
  height: 0.125rem;
  width: 4rem;
  background-color: #99979e;
  margin: 0 0.5rem;
}
.motion-tile-nav .nav-tabs .motion-tile-link.nav-link::before, .motion-tile-nav .nav-tabs .motion-tile-link.nav-link::after {
  content: none;
}
.motion-tile-nav .nav-tabs .motion-tile-link.nav-link.active {
  background-color: #fff;
}
@media (max-width: 1023.98px) {
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link > * {
    display: none;
  }
}
@media (min-width: 1024px) {
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link {
    width: 100%;
    height: auto;
    line-height: 1.5rem;
    font-size: 1rem;
    color: #34303d;
    text-align: left;
    position: relative;
    padding: 1.5rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: unset;
    margin: 0;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link::before, .motion-tile-nav .nav-tabs .motion-tile-link.nav-link::after {
    content: "";
    position: absolute;
    display: block;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link::before {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 1rem;
    height: 1rem;
    margin-bottom: 1rem;
    -ms-flex-item-align: center;
        align-self: center;
    background: transparent url("data:image/svg+xml;charset=utf8,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 330 330' style='enable-background:new 0 0 330 330;' xml:space='preserve'%3E %3Cpath id='XMLID_225_' d='M325.607,79.393c-5.857-5.857-15.355-5.858-21.213,0.001l-139.39,139.393L25.607,79.393 c-5.857-5.857-15.355-5.858-21.213,0.001c-5.858,5.858-5.858,15.355,0,21.213l150.004,150c2.813,2.813,6.628,4.393,10.606,4.393 s7.794-1.581,10.606-4.394l149.996-150C331.465,94.749,331.465,85.251,325.607,79.393z'/%3E%3C/svg%3E") left center no-repeat;
    right: 0;
    left: auto;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    opacity: 1;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link::after {
    width: 100%;
    height: 0.0625rem;
    background-color: #34303d;
    bottom: 0;
    left: 0;
    -webkit-transform: none;
            transform: none;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link:not(:first-child):has(+ .active)::after {
    -webkit-animation: nav-links-spacer 0.5s 1 ease-in-out;
            animation: nav-links-spacer 0.5s 1 ease-in-out;
    animation-composition: replace;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link:not(:first-child):has(+ .active) .motion-tile-scene-nav-description {
    animation: opacity-visible reverse 0.3s 1 ease-in-out;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.active {
    background-color: unset;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.active .motion-tile-scene-nav-description,
.motion-tile-nav .nav-tabs .motion-tile-link.nav-link.active .motion-tile-scene-nav-subtitle {
    -webkit-animation: opacity-visible 0.3s 1 ease-in-out forwards;
            animation: opacity-visible 0.3s 1 ease-in-out forwards;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.active .motion-tile-scene-nav-description {
    opacity: 1;
    height: auto;
    padding-top: 0.5rem;
    font-weight: normal;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.active::before, .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.active::after {
    opacity: 0;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.active ~ .motion-tile-link {
    opacity: 0;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.back.active:not(:first-child) .motion-tile-scene-nav-subtitle {
    -webkit-animation: none;
            animation: none;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.back.active:not(:first-child)::after {
    opacity: 1;
    -webkit-animation: nav-links-spacer-back 0.5s 1 ease-in-out forwards;
            animation: nav-links-spacer-back 0.5s 1 ease-in-out forwards;
    animation-composition: replace;
  }
  .motion-tile-nav .nav-tabs .motion-tile-link.nav-link.back:has(+ .active)::after {
    animation: opacity-visible reverse 0.5s 1 ease-in-out forwards;
    animation-composition: replace;
  }
}
.motion-tile-nav .tab-arrow {
  width: 0.875rem;
  height: 0.875rem;
  background: transparent url("data:image/svg+xml;charset=utf8,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 330 330' style='enable-background:new 0 0 330 330;' xml:space='preserve'%3E %3Cpath id='XMLID_225_' d='M325.607,79.393c-5.857-5.857-15.355-5.858-21.213,0.001l-139.39,139.393L25.607,79.393 c-5.857-5.857-15.355-5.858-21.213,0.001c-5.858,5.858-5.858,15.355,0,21.213l150.004,150c2.813,2.813,6.628,4.393,10.606,4.393 s7.794-1.581,10.606-4.394l149.996-150C331.465,94.749,331.465,85.251,325.607,79.393z'/%3E%3C/svg%3E") left center no-repeat;
  padding: 0;
}
@media (min-width: 1024px) {
  .motion-tile-nav .tab-arrow {
    display: none;
  }
}
.motion-tile-nav .tab-arrow.tab-arrow-right {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}
.motion-tile-nav .tab-arrow.tab-arrow-left {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}

.motion-tile-scene {
  width: 100%;
  position: relative;
}
.motion-tile-scene-description {
  font-size: 0.9375rem;
  letter-spacing: -0.35px;
  line-height: 1.4375rem;
  padding: 0.5rem 0.9375rem 0;
}
@media (min-width: 1024px) {
  .motion-tile-scene-description {
    display: none;
  }
}
.motion-tile-scene-subtitle {
  font-weight: bold;
  font-size: 1rem;
  line-height: 1.5rem;
  padding: 0.875rem 1rem 0;
}
@media (min-width: 1024px) {
  .motion-tile-scene-subtitle {
    display: none;
  }
}
.motion-tile-scene-nav-subtitle {
  font-weight: 700;
}
.motion-tile-scene-nav-description {
  opacity: 0;
  height: 0;
}
.motion-tile-scene .ps-pause-button {
  width: 52px;
  height: 120px;
  border-radius: 24px;
  -webkit-animation-name: shift-background;
          animation-name: shift-background;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
@-webkit-keyframes shift-background {
  0%, 30%, 50%, 70%, 90%, 100% {
    background: transparent;
  }
  40% {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 209, 210, 0.05)), to(rgba(0, 209, 210, 0.6)));
    background: linear-gradient(180deg, rgba(0, 209, 210, 0.05) 0%, rgba(0, 209, 210, 0.6) 100%);
  }
  80% {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 209, 210, 0.6)), to(rgba(0, 209, 210, 0.05)));
    background: linear-gradient(180deg, rgba(0, 209, 210, 0.6) 0%, rgba(0, 209, 210, 0.05) 100%);
  }
}
@keyframes shift-background {
  0%, 30%, 50%, 70%, 90%, 100% {
    background: transparent;
  }
  40% {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 209, 210, 0.05)), to(rgba(0, 209, 210, 0.6)));
    background: linear-gradient(180deg, rgba(0, 209, 210, 0.05) 0%, rgba(0, 209, 210, 0.6) 100%);
  }
  80% {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 209, 210, 0.6)), to(rgba(0, 209, 210, 0.05)));
    background: linear-gradient(180deg, rgba(0, 209, 210, 0.6) 0%, rgba(0, 209, 210, 0.05) 100%);
  }
}
.motion-tile-scene .ps-pause-button--switch .ps-pause-button__toggler {
  width: 3.25rem;
  height: 3.25rem;
  background-color: rgba(54, 41, 164, 0.5);
  -webkit-animation-name: shift-toggler;
          animation-name: shift-toggler;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
@-webkit-keyframes shift-toggler {
  0%, 30%, 80%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  40%, 70% {
    -webkit-transform: translateY(calc(120px - 56px));
            transform: translateY(calc(120px - 56px));
  }
}
@keyframes shift-toggler {
  0%, 30%, 80%, 100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  40%, 70% {
    -webkit-transform: translateY(calc(120px - 56px));
            transform: translateY(calc(120px - 56px));
  }
}
.motion-tile-scene .ps-pause-button--switch .ps-pause-button__circle {
  -webkit-animation-name: scale-circle;
          animation-name: scale-circle;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
@keyframes scale-circle {
  0%, 15%, 50%, 55%, 90%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  40%, 75% {
    -webkit-transform: scale(0.7);
            transform: scale(0.7);
  }
}
.motion-tile-scene .ps-pause-button--switch .ps-pause-button__icon--play {
  -webkit-animation-name: hide-play-icon;
          animation-name: hide-play-icon;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
@keyframes hide-play-icon {
  0%, 30%, 80%, 100% {
    opacity: 1;
    visibility: visible;
  }
  40%, 70% {
    opacity: 0;
    visibility: hidden;
  }
}
.motion-tile-scene .ps-pause-button--switch .ps-pause-button__icon--pause {
  -webkit-animation-name: show-pause-icon;
          animation-name: show-pause-icon;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
@keyframes show-pause-icon {
  0%, 30%, 80%, 100% {
    opacity: 0;
    visibility: hidden;
  }
  40%, 70% {
    opacity: 1;
    visibility: visible;
  }
}