[is="xo-lazyload"],
.xo-background-lazyload,
.xo-lazyload,
.xo-lazyloaded {
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
}
.xo-background-lazyload {
  height: 100%;
}
[data-xo-lazyloaded] {
  position: relative;
  z-index: 1;
}
.xo-lazyload-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.xo-lazyload-overlay:empty {
  backdrop-filter: blur(30px);
  will-change: backdrop-filter;
}
xo-container {
  display: block;
  max-width: var(--xo-container-width, 1400px);
  margin: auto;
  padding-left: var(--xo-container-gap, 20px);
  padding-right: var(--xo-container-gap, 20px);
}
xo-container[xo-fluid]:not([xo-fluid="false"]) {
  max-width: 100%;
}
xo-grid {
  display: grid;
  align-items: var(--align, normal);
  column-gap: var(--xo-grid-col-gap, 30px);
  row-gap: var(--xo-grid-row-gap, 30px);
  --xs: initial;
  --sm: initial;
  --md: initial;
  --lg: initial;
  --xl: initial;
}
xo-grid[style*="--col-width"] {
  grid-template-columns: repeat(
    auto-fill,
    minmax(min(var(--col-width, 0), 100%), 1fr)
  );
}
xo-grid:not([style*="--col-width"]) {
  grid-template-columns: repeat(12, 1fr);
}
xo-grid:not([style*="--col-width"])[style*="--xs"],
xo-grid:not([style*="--col-width"]) [style*="--sm"],
xo-grid:not([style*="--col-width"]) [style*="--md"],
xo-grid:not([style*="--col-width"]) [style*="--lg"],
xo-grid:not([style*="--col-width"]) [style*="--xl"],
xo-grid:not([style*="--col-width"]) [style*="--xxl"] {
  grid-template-columns: repeat(
    var(--xs, var(--sm, var(--md, var(--lg, var(--xl, var(--xxl)))))),
    1fr
  );
}
@media (min-width: 576px) {
  xo-grid:not([style*="--col-width"])[style*="--xs"],
  xo-grid:not([style*="--col-width"]) [style*="--sm"],
  xo-grid:not([style*="--col-width"]) [style*="--md"],
  xo-grid:not([style*="--col-width"]) [style*="--lg"],
  xo-grid:not([style*="--col-width"]) [style*="--xl"],
  xo-grid:not([style*="--col-width"]) [style*="--xxl"] {
    grid-template-columns: repeat(
      var(--sm, var(--xs, var(--md, var(--lg, var(--xl, var(--xxl)))))),
      1fr
    );
  }
}
@media (min-width: 768px) {
  xo-grid:not([style*="--col-width"])[style*="--xs"],
  xo-grid:not([style*="--col-width"]) [style*="--sm"],
  xo-grid:not([style*="--col-width"]) [style*="--md"],
  xo-grid:not([style*="--col-width"]) [style*="--lg"],
  xo-grid:not([style*="--col-width"]) [style*="--xl"],
  xo-grid:not([style*="--col-width"]) [style*="--xxl"] {
    grid-template-columns: repeat(
      var(--md, var(--sm, var(--xs, var(--lg, var(--xl, var(--xxl)))))),
      1fr
    );
  }
}
@media (min-width: 992px) {
  xo-grid:not([style*="--col-width"])[style*="--xs"],
  xo-grid:not([style*="--col-width"]) [style*="--sm"],
  xo-grid:not([style*="--col-width"]) [style*="--md"],
  xo-grid:not([style*="--col-width"]) [style*="--lg"],
  xo-grid:not([style*="--col-width"]) [style*="--xl"],
  xo-grid:not([style*="--col-width"]) [style*="--xxl"] {
    grid-template-columns: repeat(
      var(--lg, var(--md, var(--sm, var(--xs, var(--xl, var(--xxl)))))),
      1fr
    );
  }
}
@media (min-width: 1200px) {
  xo-grid:not([style*="--col-width"])[style*="--xs"],
  xo-grid:not([style*="--col-width"]) [style*="--sm"],
  xo-grid:not([style*="--col-width"]) [style*="--md"],
  xo-grid:not([style*="--col-width"]) [style*="--lg"],
  xo-grid:not([style*="--col-width"]) [style*="--xl"],
  xo-grid:not([style*="--col-width"]) [style*="--xxl"] {
    grid-template-columns: repeat(
      var(--xl, var(--lg, var(--md, var(--sm, var(--xs, var(--xxl)))))),
      1fr
    );
  }
}
@media (min-width: 1400px) {
  xo-grid:not([style*="--col-width"])[style*="--xs"],
  xo-grid:not([style*="--col-width"]) [style*="--sm"],
  xo-grid:not([style*="--col-width"]) [style*="--md"],
  xo-grid:not([style*="--col-width"]) [style*="--lg"],
  xo-grid:not([style*="--col-width"]) [style*="--xl"],
  xo-grid:not([style*="--col-width"]) [style*="--xxl"] {
    grid-template-columns: repeat(
      var(--xxl, var(--xl, var(--lg, var(--md, var(--sm, var(--xs)))))),
      1fr
    );
  }
}
xo-grid:not([style*="--col-width"]):not(
    [style*="--xs"],
    [style*="--sm"],
    [style*="--md"],
    [style*="--lg"],
    [style*="--xl"],
    [style*="--xxl"]
  )
  > * {
  grid-column-end: span
    var(--xs, var(--sm, var(--md, var(--lg, var(--xl, var(--xxl))))));
}
@media (min-width: 576px) {
  xo-grid:not([style*="--col-width"]):not(
      [style*="--xs"],
      [style*="--sm"],
      [style*="--md"],
      [style*="--lg"],
      [style*="--xl"],
      [style*="--xxl"]
    )
    > * {
    grid-column-end: span
      var(--sm, var(--xs, var(--md, var(--lg, var(--xl, var(--xxl))))));
  }
}
@media (min-width: 768px) {
  xo-grid:not([style*="--col-width"]):not(
      [style*="--xs"],
      [style*="--sm"],
      [style*="--md"],
      [style*="--lg"],
      [style*="--xl"],
      [style*="--xxl"]
    )
    > * {
    grid-column-end: span
      var(--md, var(--sm, var(--xs, var(--lg, var(--xl, var(--xxl))))));
  }
}
@media (min-width: 992px) {
  xo-grid:not([style*="--col-width"]):not(
      [style*="--xs"],
      [style*="--sm"],
      [style*="--md"],
      [style*="--lg"],
      [style*="--xl"],
      [style*="--xxl"]
    )
    > * {
    grid-column-end: span
      var(--lg, var(--md, var(--sm, var(--xs, var(--xl, var(--xxl))))));
  }
}
@media (min-width: 1200px) {
  xo-grid:not([style*="--col-width"]):not(
      [style*="--xs"],
      [style*="--sm"],
      [style*="--md"],
      [style*="--lg"],
      [style*="--xl"],
      [style*="--xxl"]
    )
    > * {
    grid-column-end: span
      var(--xl, var(--lg, var(--md, var(--sm, var(--xs, var(--xxl))))));
  }
}
@media (min-width: 1400px) {
  xo-grid:not([style*="--col-width"]):not(
      [style*="--xs"],
      [style*="--sm"],
      [style*="--md"],
      [style*="--lg"],
      [style*="--xl"],
      [style*="--xxl"]
    )
    > * {
    grid-column-end: span
      var(--xxl, var(--xl, var(--lg, var(--md, var(--sm, var(--xs))))));
  }
}
xo-grid:not([style*="--col-width"]) > * {
  order: var(--order-xs);
  grid-column-start: var(--start-xs, auto);
}
@media (min-width: 576px) {
  xo-grid:not([style*="--col-width"]) > * {
    order: var(--order-sm, var(--order-xs));
    grid-column-start: var(--start-sm, var(--start-xs, auto));
  }
}
@media (min-width: 768px) {
  xo-grid:not([style*="--col-width"]) > * {
    order: var(--order-md, var(--order-sm, var(--order-xs)));
    grid-column-start: var(--start-md, var(--start-sm, var(--start-xs, auto)));
  }
}
@media (min-width: 992px) {
  xo-grid:not([style*="--col-width"]) > * {
    order: var(--order-lg, var(--order-md, var(--order-sm, var(--order-xs))));
    grid-column-start: var(
      --start-lg,
      var(--start-md, var(--start-sm, var(--start-xs, auto)))
    );
  }
}
@media (min-width: 1200px) {
  xo-grid:not([style*="--col-width"]) > * {
    order: var(
      --order-xl,
      var(--order-lg, var(--order-md, var(--order-sm, var(--order-xs))))
    );
    grid-column-start: var(
      --start-xl,
      var(--start-lg, var(--start-md, var(--start-sm, var(--start-xs, auto))))
    );
  }
}
@media (min-width: 1400px) {
  xo-grid:not([style*="--col-width"]) > * {
    order: var(
      --order-xxl,
      var(
        --order-xl,
        var(--order-lg, var(--order-md, var(--order-sm, var(--order-xs))))
      )
    );
    grid-column-start: var(
      --start-xxl,
      var(
        --start-xl,
        var(--start-lg, var(--start-md, var(--start-sm, var(--start-xs, auto))))
      )
    );
  }
}
[style*="--start-xs"] xo-grid {
  --start-xs: 0;
}
[style*="--start-sm"] xo-grid {
  --start-sm: 0;
}
[style*="--start-md"] xo-grid {
  --start-md: 0;
}
[style*="--start-lg"] xo-grid {
  --start-lg: 0;
}
[style*="--start-xl"] xo-grid {
  --start-xl: 0;
}
[style*="--start-xxl"] xo-grid {
  --start-xxl: 0;
}
[style*="--order-xs"] xo-grid {
  --order-xs: 1;
}
[style*="--order-sm"] xo-grid {
  --order-sm: 1;
}
[style*="--order-md"] xo-grid {
  --order-md: 1;
}
[style*="--order-lg"] xo-grid {
  --order-lg: 1;
}
[style*="--order-xl"] xo-grid {
  --order-xl: 1;
}
[style*="--order-xxl"] xo-grid {
  --order-xxl: 1;
}
[xb-href] {
  cursor: pointer;
}
xo-parallax-scroll[xo-keyframes*="groupImg"] img {
  opacity: 1;
}
xo-parallax-scroll[xo-keyframes*="groupImg"] img + img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.xo-navigate-smooth {
  animation: xoNavigateSmooth both 0.3s ease;
}
@keyframes xoNavigateSmooth {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
xo-marquee {
  --xo-duration: 10s;
  display: flex;
  flex-wrap: nowrap;
  transform: translate3d(var(--xo-marquee-scroll, 0px), 0, 0);
}
xo-marquee[xo-rtl]:not([xo-rtl="false"]) {
  direction: rtl;
}
xo-marquee[xo-pause-on-hover]:not([xo-pause-on-hover="false"]):hover
  xo-marquee-item {
  animation-play-state: paused !important;
}
xo-marquee[xo-ready] xo-marquee-item {
  animation: xo-marquee var(--xo-marquee-duration) linear infinite;
}
@keyframes xo-marquee {
  0% {
    transform: translate3d(var(--xo-marquee-from), 0, 0);
  }
  to {
    transform: translate3d(var(--xo-marquee-to), 0, 0);
  }
}
xo-marquee-item {
  display: flex;
  flex-wrap: nowrap;
  flex-shrink: 0;
  will-change: transform;
}
xo-marquee-scroll-transform {
  display: block;
}
xo-toggle {
  display: block;
  width: auto;
  height: auto;
  border: 0;
  padding: 0;
  margin: 0;
  background-color: transparent;
  color: inherit;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
  overflow: visible;
}
xo-toggle::backdrop {
  display: none;
}
xo-modal {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  z-index: 99;
  visibility: hidden;
  opacity: 0;
  overflow-x: hidden;
  overflow-y: auto;
  border: 0 !important;
  padding: 0;
  margin: 0;
  background-color: transparent;
  color: inherit;
}
xo-modal::backdrop {
  display: none;
}
xo-modal:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
xo-modal img {
  vertical-align: middle;
}
xo-modal xo-modal-trigger {
  display: inline-block;
}
xo-modal[xo-current-disabled]:not([xo-current-disabled="false"]) {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  height: auto;
  visibility: visible;
  overflow: visible;
  z-index: auto;
}
xo-modal[xo-current-disabled]:not([xo-current-disabled="false"])
  xo-modal-trigger {
  display: none;
}
xo-modal[xo-scroll-disabled]:not([xo-current-disabled="false"]) {
  overflow: visible;
}
xo-modal xo-carousel-slide {
  pointer-events: none;
  visibility: hidden;
}
xo-modal[xo-active]:not([xo-active="false"]) xo-carousel-slide {
  pointer-events: auto;
  visibility: visible;
}
xo-modal-trigger {
  display: inline-block;
}
xo-modal-pan {
  display: block;
  width: fit-content;
  overflow: hidden;
  touch-action: pinch-zoom;
}
body.xo-modal-open {
  overflow: hidden;
  padding-right: var(--scroll-bar-width);
}
xo-scroll-x {
  display: block;
  position: relative;
}
xo-scroll-x-item {
  height: 100%;
  overflow: hidden;
}
xo-scroll-x-item ~ xo-scroll-x-item {
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
}
xo-toast-portal {
  position: fixed;
  z-index: 99999;
  display: flex;
  flex-direction: column;
  padding: 10px;
  max-width: none;
  max-height: none;
  border: 0 !important;
  margin: 0;
  background-color: transparent;
  color: inherit;
  inset: auto;
  pointer-events: none;
}
xo-toast-portal * {
  pointer-events: auto;
}
xo-toast-portal[xo-placement^="top-"] {
  top: 0;
}
xo-toast-portal[xo-placement^="bottom-"] {
  bottom: 0;
}
xo-toast-portal[xo-placement$="-left"] {
  left: 0;
}
xo-toast-portal[xo-placement$="-center"] {
  left: 50%;
  transform: translate(-50%);
  align-items: center;
}
xo-toast-portal[xo-placement$="-right"] {
  right: 0;
  align-items: flex-end;
}
xo-toast-portal xo-toast {
  display: inline-block;
  width: fit-content;
  max-width: calc(100vw - 20px);
}
xo-toast {
  position: relative;
  display: none;
}
xo-toast-close-button {
  position: absolute;
  padding: 8px;
  cursor: pointer;
  color: #b9b9b9;
  display: flex;
  align-items: center;
}
xo-toast-close-button[xo-placement^="top-"] {
  top: 0;
}
xo-toast-close-button[xo-placement^="bottom-"] {
  bottom: 0;
}
xo-toast-close-button[xo-placement$="-left"] {
  left: 0;
}
xo-toast-close-button[xo-placement^="center-"] {
  top: 50%;
  transform: translateY(-50%);
}
xo-toast-close-button[xo-placement$="-right"] {
  right: 0;
}
xo-toast-close-button[xo-placement="top"] {
  top: 0;
}
xo-toast-close-button svg {
  fill: currentColor;
  width: 20px;
  height: 20px;
}
xo-popover {
  position: fixed;
  z-index: 99;
  display: block;
  width: fit-content;
  visibility: hidden;
  border: 0;
  padding: 0;
  margin: 0;
  color: inherit;
  background-color: transparent;
  overflow: visible;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
}
xo-popover::backdrop {
  display: none;
}
xo-popover[xo-current-disabled]:not([xo-current-disabled="false"]) {
  position: static;
  width: auto;
  visibility: visible;
  z-index: auto;
}
xo-popover xo-carousel-slide {
  pointer-events: none;
  visibility: hidden;
}
xo-popover[xo-active]:not([xo-active="false"]) xo-carousel-slide {
  pointer-events: auto;
  visibility: visible;
}
xo-popover-trigger {
  display: inline-block;
}
xo-builder-popover-content {
  display: block;
  position: absolute;
  z-index: 9;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all var(--xo-popover-duration);
}
xo-builder-popover {
  display: inline-block;
  position: relative;
}
xo-builder-popover[xo-type="hover"]:hover xo-builder-popover-content,
xo-builder-popover[xo-open]:not([xo-open="false"]) xo-builder-popover-content {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none !important;
}
xo-builder-popover[xo-animate="zoom"] xo-builder-popover-content {
  transform: scale(0.5);
}
xo-builder-popover[xo-animate="fade-up"] xo-builder-popover-content {
  transform: translate3d(0, 20%, 0);
}
xo-builder-popover[xo-animate="fade-down"] xo-builder-popover-content {
  transform: translate3d(0, -20%, 0);
}
xo-builder-popover[xo-animate="fade-left"] xo-builder-popover-content {
  transform: translate3d(-20%, 0, 0);
}
xo-builder-popover[xo-animate="fade-right"] xo-builder-popover-content {
  transform: translate3d(20%, 0, 0);
}
xo-builder-popover[xo-animate="none"] xo-builder-popover-content {
  transition: none !important;
}
xo-builder-popover[xo-placement="top-left"] xo-builder-popover-content {
  bottom: 100%;
  left: 0;
}
xo-builder-popover[xo-placement="top-center"] xo-builder-popover-content {
  bottom: 100%;
  left: 50%;
  transform: translate(-50%);
}
xo-builder-popover[xo-placement="top-center"][xo-animate="zoom"]
  xo-builder-popover-content {
  transform: translate(-50%) scale(0.5);
}
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-up"]
  xo-builder-popover-content {
  transform: translate(-50%) translate3d(0, 20%, 0);
}
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-down"]
  xo-builder-popover-content {
  transform: translate(-50%) translate3d(0, -20%, 0);
}
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-left"]
  xo-builder-popover-content {
  transform: translate(-50%) translate3d(-20%, 0, 0);
}
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-right"]
  xo-builder-popover-content {
  transform: translate(-50%) translate3d(20%, 0, 0);
}
xo-builder-popover[xo-placement="top-center"][xo-animate="zoom"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="zoom"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-up"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-up"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-down"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-down"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-left"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-left"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-right"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="top-center"][xo-animate="fade-right"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content {
  transform: translate(-50%) scale(1) !important;
}
xo-builder-popover[xo-placement="top-right"] xo-builder-popover-content {
  bottom: 100%;
  right: 0;
}
xo-builder-popover[xo-placement="bottom-left"] xo-builder-popover-content {
  top: 100%;
  left: 0;
}
xo-builder-popover[xo-placement="bottom-center"] xo-builder-popover-content {
  top: 100%;
  left: 50%;
  transform: translate(-50%);
}
xo-builder-popover[xo-placement="bottom-center"][xo-animate="zoom"]
  xo-builder-popover-content {
  transform: translate(-50%) scale(0.5);
}
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-up"]
  xo-builder-popover-content {
  transform: translate(-50%) translate3d(0, 20%, 0);
}
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-down"]
  xo-builder-popover-content {
  transform: translate(-50%) translate3d(0, -20%, 0);
}
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-left"]
  xo-builder-popover-content {
  transform: translate(-50%) translate3d(-20%, 0, 0);
}
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-right"]
  xo-builder-popover-content {
  transform: translate(-50%) translate3d(20%, 0, 0);
}
xo-builder-popover[xo-placement="bottom-center"][xo-animate="zoom"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="zoom"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-up"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-up"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-down"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-down"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-left"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-left"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-right"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="bottom-center"][xo-animate="fade-right"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content {
  transform: translate(-50%) scale(1) !important;
}
xo-builder-popover[xo-placement="bottom-right"] xo-builder-popover-content {
  top: 100%;
  right: 0;
}
xo-builder-popover[xo-placement="left-top"] xo-builder-popover-content {
  top: 0;
  right: 100%;
}
xo-builder-popover[xo-placement="left-center"] xo-builder-popover-content {
  top: 50%;
  right: 100%;
  transform: translateY(-50%);
}
xo-builder-popover[xo-placement="left-center"][xo-animate="zoom"]
  xo-builder-popover-content {
  transform: translateY(-50%) scale(0.5);
}
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-up"]
  xo-builder-popover-content {
  transform: translateY(-50%) translate3d(0, 20%, 0);
}
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-down"]
  xo-builder-popover-content {
  transform: translateY(-50%) translate3d(0, -20%, 0);
}
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-left"]
  xo-builder-popover-content {
  transform: translateY(-50%) translate3d(-20%, 0, 0);
}
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-right"]
  xo-builder-popover-content {
  transform: translateY(-50%) translate3d(20%, 0, 0);
}
xo-builder-popover[xo-placement="left-center"][xo-animate="zoom"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="zoom"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-up"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-up"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-down"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-down"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-left"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-left"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-right"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="left-center"][xo-animate="fade-right"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content {
  transform: translateY(-50%) scale(1) !important;
}
xo-builder-popover[xo-placement="left-bottom"] xo-builder-popover-content {
  bottom: 0;
  right: 100%;
}
xo-builder-popover[xo-placement="right-top"] xo-builder-popover-content {
  top: 0;
  left: 100%;
}
xo-builder-popover[xo-placement="right-center"] xo-builder-popover-content {
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
}
xo-builder-popover[xo-placement="right-center"][xo-animate="zoom"]
  xo-builder-popover-content {
  transform: translateY(-50%) scale(0.5);
}
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-up"]
  xo-builder-popover-content {
  transform: translateY(-50%) translate3d(0, 20%, 0);
}
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-down"]
  xo-builder-popover-content {
  transform: translateY(-50%) translate3d(0, -20%, 0);
}
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-left"]
  xo-builder-popover-content {
  transform: translateY(-50%) translate3d(-20%, 0, 0);
}
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-right"]
  xo-builder-popover-content {
  transform: translateY(-50%) translate3d(20%, 0, 0);
}
xo-builder-popover[xo-placement="right-center"][xo-animate="zoom"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="zoom"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-up"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-up"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-down"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-down"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-left"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-left"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-right"][xo-type="hover"]:hover
  xo-builder-popover-content,
xo-builder-popover[xo-placement="right-center"][xo-animate="fade-right"][xo-open]:not(
    [xo-open="false"]
  )
  xo-builder-popover-content {
  transform: translateY(-50%) scale(1) !important;
}
xo-builder-popover[xo-placement="right-bottom"] xo-builder-popover-content {
  bottom: 0;
  left: 100%;
}
xo-tooltip {
  display: block;
  width: fit-content;
}
xo-tooltip-content {
  position: absolute;
  z-index: 9999;
  display: block;
  width: fit-content;
  pointer-events: none;
  background-color: #111;
  color: #fff;
  font-size: 13px;
  padding: 3px 10px;
  border-radius: 3px;
  visibility: hidden;
  transition-delay: 0.1s;
}
xo-tooltip-content[xo-active]:not([xo-active="false"]) {
  visibility: visible;
}
xo-tooltip-content[xo-animate="fade"] {
  opacity: 0;
}
xo-tooltip-content[xo-animate="fade"][xo-active]:not([xo-active="false"]) {
  opacity: 1;
}
xo-tooltip-content[xo-animate="fade-down"] {
  opacity: 0;
  transform: translate3d(0, -20px, 0);
}
xo-tooltip-content[xo-animate="fade-down"][xo-active]:not([xo-active="false"]) {
  opacity: 1;
  transform: translateZ(0);
}
xo-tooltip-content[xo-animate="fade-up"] {
  opacity: 0;
  transform: translate3d(0, 20px, 0);
}
xo-tooltip-content[xo-animate="fade-up"][xo-active]:not([xo-active="false"]) {
  opacity: 1;
  transform: translateZ(0);
}
xo-tooltip-content[xo-animate="fade-left"] {
  opacity: 0;
  transform: translate3d(20px, 0, 0);
}
xo-tooltip-content[xo-animate="fade-left"][xo-active]:not([xo-active="false"]) {
  opacity: 1;
  transform: translateZ(0);
}
xo-tooltip-content[xo-animate="fade-right"] {
  opacity: 0;
  transform: translate3d(-20px, 0, 0);
}
xo-tooltip-content[xo-animate="fade-right"][xo-active]:not(
    [xo-active="false"]
  ) {
  opacity: 1;
  transform: translateZ(0);
}
xo-tooltip-content[xo-animate="zoom"] {
  opacity: 0;
  transform: scale(0.4);
}
xo-tooltip-content[xo-animate="zoom"][xo-active]:not([xo-active="false"]) {
  opacity: 1;
  transform: scale(1);
}
xo-tooltip-content:after {
  content: "";
  border: solid transparent;
  border-width: 6px;
  border-top-color: #111;
  position: absolute;
  top: calc(100% - 1px);
  left: 50%;
  transform: translate(-50%);
}
xo-tooltip-content[xo-placement="top-left"]:after {
  left: 20px;
  transform: none;
}
xo-tooltip-content[xo-placement="top-right"]:after {
  left: auto;
  right: 20px;
  transform: none;
}
xo-tooltip-content[xo-placement^="bottom-"]:after {
  top: auto;
  bottom: calc(100% - 1px);
  transform: translate(-50%);
  border-color: transparent;
  border-bottom-color: #111;
}
xo-tooltip-content[xo-placement="bottom-center"]:after {
  left: 50%;
}
xo-tooltip-content[xo-placement="bottom-left"]:after {
  left: 20px;
  transform: none;
}
xo-tooltip-content[xo-placement="bottom-right"]:after {
  left: auto;
  right: 20px;
  transform: none;
}
xo-tooltip-content[xo-placement^="left-"]:after {
  left: calc(100% - 1px);
  top: 50%;
  transform: translateY(-50%);
  border-color: transparent;
  border-left-color: #111;
}
xo-tooltip-content[xo-placement^="right-"]:after {
  left: auto;
  right: calc(100% - 1px);
  top: 50%;
  transform: translateY(-50%);
  border-color: transparent;
  border-right-color: #111;
}
xo-collapse {
  display: block;
  height: 0;
  overflow: hidden;
  will-change: height;
}
xo-collapse-trigger {
  display: block;
}
xo-tabs {
  position: relative;
  display: block;
}
xo-tabs-trigger {
  display: block;
  cursor: pointer;
}
xo-tabs-content {
  position: relative;
  display: flex;
  flex-direction: column;
}
xo-tabs-pane {
  position: absolute;
  width: 100%;
  display: block;
  visibility: hidden;
}
xo-tabs-pane[xo-active]:not([xo-active="false"]) {
  position: static;
  visibility: visible;
}
[data-xb-section-id] xo-tabs-pane {
  position: static;
  width: 100%;
  display: none;
  visibility: visible;
}
[data-xb-section-id] xo-tabs-pane[xo-active]:not([xo-active="false"]) {
  display: block;
}
xo-tabs-active {
  display: block;
  position: absolute;
  will-change: transform, width;
}
xo-parallax,
[xo-parallax] {
  position: relative;
  display: block;
}
xo-parallax-scroll {
  display: block;
  width: fit-content;
  background-size: cover;
}
xo-parallax-scroll:empty {
  width: auto;
}
xo-parallax-hover {
  display: block;
  width: fit-content;
}
xo-parallax-hover:empty {
  width: auto;
}
xo-carousel,
xo-carousel-thumbnail {
  position: relative;
  display: block;
  user-select: none;
}
xo-carousel[xo-vertical] xo-carousel-list,
xo-carousel-thumbnail[xo-vertical] xo-carousel-list {
  flex-direction: column;
  height: 100%;
  touch-action: pan-x;
}
xo-carousel[xo-overflow="hidden"],
xo-carousel-thumbnail[xo-overflow="hidden"] {
  overflow: hidden;
}
xo-carousel[xo-overflow="visible"] xo-carousel-inner,
xo-carousel-thumbnail[xo-overflow="visible"] xo-carousel-inner {
  overflow: visible;
}
xo-carousel[xo-rtl]:not([xo-rtl="false"]),
xo-carousel-thumbnail[xo-rtl]:not([xo-rtl="false"]) {
  direction: rtl;
}
xo-carousel-inner {
  position: relative;
  z-index: 9;
  display: grid !important;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  grid-template-rows: repeat(1, minmax(0, 1fr));
  overflow: hidden;
}
xo-carousel[xo-type="urban"] :not(xo-carousel-thumbnail) xo-carousel-slide,
xo-carousel[xo-type="water"] :not(xo-carousel-thumbnail) xo-carousel-slide,
xo-carousel[xo-type="nature"] :not(xo-carousel-thumbnail) xo-carousel-slide,
xo-carousel[xo-type="fade"] :not(xo-carousel-thumbnail) xo-carousel-slide,
xo-carousel[xo-type="none"] :not(xo-carousel-thumbnail) xo-carousel-slide {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  visibility: hidden;
}
xo-carousel[xo-type="urban"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]),
xo-carousel[xo-type="water"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]),
xo-carousel[xo-type="nature"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]),
xo-carousel[xo-type="fade"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]),
xo-carousel[xo-type="none"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]) {
  visibility: visible;
  z-index: 9;
}
xo-carousel[xo-type="fade"] :not(xo-carousel-thumbnail) xo-carousel-slide {
  opacity: 0;
  transition: var(--xo-speed);
}
xo-carousel[xo-type="fade"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]) {
  opacity: 1;
}
xo-carousel[xo-type="urban"] :not(xo-carousel-thumbnail) xo-carousel-slide,
xo-carousel[xo-type="water"] :not(xo-carousel-thumbnail) xo-carousel-slide,
xo-carousel[xo-type="nature"] :not(xo-carousel-thumbnail) xo-carousel-slide {
  transition: var(--xo-speed);
}
xo-carousel[xo-type="urban"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]),
xo-carousel[xo-type="water"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]),
xo-carousel[xo-type="nature"]
  :not(xo-carousel-thumbnail)
  xo-carousel-slide[xo-visible]:not([xo-visible="false"]) {
  opacity: 1;
}
xo-carousel-thumbnail {
  display: block;
}
xo-carousel-thumbnail xo-carousel-slide {
  cursor: pointer;
}
xo-carousel-list {
  display: flex;
  flex-direction: row;
  touch-action: pan-y;
  will-change: transform;
  justify-content: flex-start;
}
xo-carousel-slide {
  width: calc(100% / var(--xo-per-view) + var(--xo-gap) / var(--xo-per-view));
  padding-inline-end: var(--xo-gap);
  flex-shrink: 0;
}
@keyframes xo-carousel-mask {
  0% {
    mask-position: 100% 0;
  }
  to {
    mask-position: 0% 0;
  }
}
[xo-type="nature"] xo-carousel-slide[xo-visible]:not([xo-visible="false"]) {
  mask-image: url(https://raw.githubusercontent.com/long-hp/storage/main/nature-sprite.png);
  mask-size: 2300% 100%;
  animation: xo-carousel-mask var(--xo-speed, 0.2s) steps(22) forwards;
}
[xo-type="water"] xo-carousel-slide[xo-visible]:not([xo-visible="false"]) {
  mask-image: url(https://raw.githubusercontent.com/long-hp/storage/main/nature-sprite-2.png);
  mask-size: 7100% 100%;
  animation: xo-carousel-mask var(--xo-speed, 0.2s) steps(70) forwards;
}
[xo-type="urban"] xo-carousel-slide[xo-visible]:not([xo-visible="false"]) {
  mask-image: url(https://raw.githubusercontent.com/long-hp/storage/main/urban-sprite.png);
  mask-size: 3000% 100%;
  animation: xo-carousel-mask var(--xo-speed, 0.2s) steps(29) forwards;
}
xo-carousel-thumbnail[xo-vertical] xo-carousel-slide,
xo-carousel[xo-vertical] xo-carousel-slide {
  width: auto;
  height: calc(100% / var(--xo-per-view) + var(--xo-gap) / var(--xo-per-view));
  padding-block-end: var(--xo-gap);
  padding-inline-end: 0;
}
xo-carousel-prev,
xo-carousel-next {
  display: inline-block;
  cursor: pointer;
  user-select: none;
}
xo-carousel-prev[xo-hide],
xo-carousel-next[xo-hide] {
  display: none;
}
xo-carousel-pagination {
  display: flex;
  align-items: center;
}
xo-carousel-bullet {
  display: flex;
  cursor: pointer;
}
xo-range {
  position: relative;
  display: block;
  height: calc(var(--size) * 1px);
}
xo-range input[type="range"] {
  display: block;
  margin: 0;
  padding: 0;
  appearance: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: transparent;
  pointer-events: none;
}
xo-range input[type="range"]::-webkit-slider-thumb {
  appearance: none;
  width: calc(var(--size) * 1px);
  height: calc(var(--size) * 1px);
  opacity: 0;
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  z-index: 2;
  pointer-events: auto;
}
xo-range input[type="range"]::-moz-range-thumb {
  width: calc(var(--size) * 1px);
  height: calc(var(--size) * 1px);
  opacity: 0;
  border-radius: 50%;
  cursor: pointer;
  position: absolute;
  z-index: 2;
  pointer-events: auto;
}
xo-range-track {
  display: block;
  background: #ddd;
  height: 5px;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  pointer-events: none;
  border-radius: calc(var(--size) * 1px);
}
xo-range-progress {
  position: absolute;
  top: 0;
  height: 100%;
  background: #4caf82;
  left: calc(var(--size) / 2 * 1px);
  will-change: transform, width;
}
xo-range-thumb {
  display: block;
  width: 20px;
  height: 20px;
  background: #4caf82;
  border-radius: 50%;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  will-change: transform;
}
xo-sticky {
  display: block;
}
xo-sticky[xo-placement="bottom"] {
  height: 0;
}
xo-sticky-space {
  display: block;
  transition: all 0.3s;
}
xo-filters-clear {
  display: none;
  width: fit-content;
  cursor: pointer;
}
xo-filters-clear[xo-visible]:not([xo-visible="false"]) {
  display: block;
}
xo-filters-refine {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
xo-filters-refine xo-filters-clear {
  background: #e8e8e8;
  padding: 3px 8px;
  margin-right: 5px;
  margin-bottom: 5px;
}
xo-filters-mobile,
xo-filters-sort-by-selected,
xo-filters-field {
  display: block;
}
xo-filters-fallback {
  display: none;
}
xo-filters-fallback[xo-visible]:not([xo-visible="false"]) {
  display: block;
}
xo-filters-refine-clear-icon {
  display: none;
}
xo-gallery {
  display: block;
}
xo-gallery-item {
  display: block;
}
xo-gallery-item xo-modal-trigger {
  display: block;
  width: 100%;
  height: 100%;
}
xo-gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
xo-gallery-portal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: flex;
  overflow-y: hidden;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  visibility: hidden;
  gap: 20px;
}
xo-gallery-portal[xo-active]:not([xo-active="false"]) {
  visibility: visible;
}
xo-gallery-portal[xo-active]:not([xo-active="false"]) xo-image-zoom-inner {
  display: block;
}
xo-gallery-portal::-webkit-scrollbar {
  width: 0;
  height: 0;
  background-color: transparent;
}
xo-gallery-portal xo-modal {
  position: relative;
  top: auto;
  left: auto;
  width: 100vw;
  flex-shrink: 0;
  scroll-snap-align: start;
  box-shadow: 20px 0 0 0 var(--xo-backdrop-color);
}
xo-gallery-portal xo-modal-pan {
  touch-action: pan-x;
}
xo-gallery-portal xo-modal-trigger {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #fff;
  font-size: 34px;
}
xo-gallery-portal xo-image-zoom-inner {
  display: none;
}
xo-gallery-portal video {
  height: 100vh;
  width: 100vw;
}
@-moz-document url-prefix() {
  xo-gallery-portal {
    scrollbar-color: transparent;
    scrollbar-width: none;
  }
}
xo-gallery-prev,
xo-gallery-next {
  position: fixed;
  top: 50%;
  z-index: 999;
  width: 50px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  cursor: pointer;
  color: #fff;
  font-size: 30px;
}
xo-gallery-prev {
  left: 0;
}
xo-gallery-next {
  right: 0;
}
xo-gallery-next svg {
  transform: rotate(180deg);
}
xo-gallery-counter {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  padding: 10px 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
xo-cart-quantity-minus,
xo-cart-quantity-plus {
  display: inline-block;
  cursor: pointer;
  user-select: none;
}
xo-product-pickup-availability-empty,
xo-product-liquid-static,
xo-product-data {
  display: none !important;
}
xo-product-recommendations,
xo-product-recipient-form-error,
xo-product-recipient-form,
xo-product-quick-view,
xo-product-quick-view-trigger,
xo-cart-add-error,
xo-cart-scroll,
xo-cart-shipping-rates-field,
xo-cart-note,
xo-product,
xo-cart,
xo-cart-mini,
xo-product-variant,
xo-product-will-change {
  display: block;
}
xo-cart-add-error {
  visibility: hidden;
  overflow: hidden;
  height: 0;
}
xo-cart-shipping-rates-field[xo-disabled] {
  display: none;
}
xo-cart-note-button {
  display: inline-block;
}
xo-cart-add-fallback,
xo-cart-change-fallback {
  display: none;
}
xo-cart-add-fallback[xo-visible]:not([xo-visible="false"]),
xo-cart-change-fallback[xo-visible]:not([xo-visible="false"]) {
  display: block;
}
xo-cart-add[xo-loading] xo-cart-add-fallback {
  display: block;
}
.xo-cart-add-error,
.xo-cart-change-error {
  background-color: #fa6e6e;
  color: #fff;
  font-size: 14px;
  padding: 10px;
  margin-bottom: 5px;
  border-radius: 4px;
  width: 360px;
}
.xo-cart-add-error xo-toast-close-button,
.xo-cart-change-error xo-toast-close-button {
  color: #fff;
}
.xo-cart-add-error xo-toast-close-button svg,
.xo-cart-change-error xo-toast-close-button svg {
  fill: currentColor;
  width: 20px;
  height: 20px;
}
xo-cart-fly {
  display: none;
  position: absolute;
  z-index: 9999;
}
:where(xo-animate:not([xo-item-used])) [xo-type="none"],
xo-animate[xo-type="none"] xo-animate-item,
[xo-animate="scroll"] [xo-type="none"] {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  opacity: 1;
}
:where(xo-animate:not([xo-item-used])),
[xo-animate="scroll"] {
  --xo-strength: 1;
}
:where(xo-animate:not([xo-item-used])),
xo-animate-item,
[xo-animate="scroll"] {
  display: block;
  opacity: 0.01;
  animation-duration: calc(var(--xo-duration) * 1ms);
  animation-timing-function: var(--xo-easing);
  animation-delay: calc(var(--xo-order) * var(--xo-constant) * 1ms);
  animation-fill-mode: both;
}
:where(xo-animate:not([xo-item-used]))[xo-type="width-increment"],
xo-animate-item[xo-type="width-increment"],
[xo-animate="scroll"][xo-type="width-increment"] {
  opacity: 1;
  overflow: hidden;
  animation: none !important;
  transition: all calc(var(--xo-duration) * 1ms) var(--xo-easing)
    calc(
      (var(--xo-order) * var(--xo-constant) + var(--xo-wrap-duration, 0)) * 1ms
    );
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not([xo-visible="false"]),
xo-animate-item[xo-visible]:not([xo-visible="false"]),
[xo-animate="scroll"][xo-visible]:not([xo-visible="false"]) {
  backface-visibility: hidden;
  opacity: 1;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="fade"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="fade"],
[xo-animate="scroll"][xo-visible]:not([xo-visible="false"])[xo-type="fade"] {
  animation-name: xo-fade;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="fade-up"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="fade-up"],
[xo-animate="scroll"][xo-visible]:not([xo-visible="false"])[xo-type="fade-up"] {
  animation-name: xo-fade-up;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="fade-down"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="fade-down"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="fade-down"] {
  animation-name: xo-fade-down;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="fade-left"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="fade-left"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="fade-left"] {
  animation-name: xo-fade-left;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="fade-right"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="fade-right"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="fade-right"] {
  animation-name: xo-fade-right;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="zoom-in"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="zoom-in"],
[xo-animate="scroll"][xo-visible]:not([xo-visible="false"])[xo-type="zoom-in"] {
  animation-name: xo-zoom-in;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="zoom-out"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="zoom-out"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="zoom-out"] {
  animation-name: xo-zoom-out;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="rotate-left-up"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="rotate-left-up"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="rotate-left-up"] {
  transform-origin: 0 50%;
  animation-name: xo-rotate-left-up;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="rotate-right-up"],
xo-animate-item[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="rotate-right-up"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="rotate-right-up"] {
  transform-origin: 100% 50%;
  animation-name: xo-rotate-right-up;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="snake-left"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="snake-left"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="snake-left"] {
  transform-origin: 100% 50%;
  animation-name: xo-snake-left;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="snake-right"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="snake-right"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="snake-right"] {
  transform-origin: 0 50%;
  animation-name: xo-snake-right;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="snake-up"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="snake-up"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="snake-up"] {
  transform-origin: 50% 0;
  animation-name: xo-snake-up;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="snake-down"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="snake-down"],
[xo-animate="scroll"][xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="snake-down"] {
  transform-origin: 50% 100%;
  animation-name: xo-snake-down;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="3d-up"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="3d-up"],
[xo-animate="scroll"][xo-visible]:not([xo-visible="false"])[xo-type="3d-up"] {
  transform-origin: 50% 0;
  animation-name: xo-3d-up;
}
:where(xo-animate:not([xo-item-used]))[xo-visible]:not(
    [xo-visible="false"]
  )[xo-type="blur"],
xo-animate-item[xo-visible]:not([xo-visible="false"])[xo-type="blur"],
[xo-animate="scroll"][xo-visible]:not([xo-visible="false"])[xo-type="blur"] {
  animation-name: xo-blur;
}
@keyframes xo-fade {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes xo-fade-up {
  0% {
    opacity: 0;
    transform: translate3d(0, calc(var(--xo-strength) * 30%), 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-fade-down {
  0% {
    opacity: 0;
    transform: translate3d(0, calc(var(--xo-strength) * -1 * 30%), 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-fade-left {
  0% {
    opacity: 0;
    transform: translate3d(calc(var(--xo-strength) * 30%), 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-fade-right {
  0% {
    opacity: 0;
    transform: translate3d(calc(var(--xo-strength) * -1 * 30%), 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-zoom-in {
  0% {
    opacity: 0;
    transform: scale(0.6);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-zoom-out {
  0% {
    opacity: 0;
    transform: scale(calc(var(--xo-strength) * 1.3));
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-rotate-left-up {
  0% {
    opacity: 0;
    transform: translate3d(0, calc(var(--xo-strength) * 30%), 0) rotate(10deg);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-rotate-right-up {
  0% {
    opacity: 0;
    transform: translate3d(0, calc(var(--xo-strength) * 30%), 0) rotate(-10deg);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-snake-up {
  0% {
    opacity: 0;
    transform: scaleY(1.8) translate3d(0, calc(var(--xo-strength) * 30%), 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-snake-down {
  0% {
    opacity: 0;
    transform: scaleY(1.8)
      translate3d(0, calc(var(--xo-strength) * -1 * 30%), 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-snake-left {
  0% {
    opacity: 0;
    transform: scaleX(1.8) translate3d(calc(var(--xo-strength) * 30%), 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-snake-right {
  0% {
    opacity: 0;
    transform: scaleX(1.8)
      translate3d(calc(var(--xo-strength) * -1 * 30%), 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-3d-up {
  0% {
    opacity: 0;
    transform: perspective(100rem) rotateX(-60deg);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes xo-blur {
  0% {
    opacity: 0;
    filter: blur(10px);
  }
  to {
    opacity: 1;
    filter: blur(0);
  }
}
[xo-animate="scroll"][xo-opacity] {
  opacity: 0.01;
}
xo-animate[xo-disabled],
xo-mega-menu [xo-animate="scroll"] {
  animation: none !important;
  transition: none !important;
  opacity: 1 !important;
  transform: none !important;
}
xo-toggle :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-toggle xo-animate-item,
xo-modal :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-modal xo-animate-item,
xo-popover :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-popover xo-animate-item,
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item,
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item,
xo-tabs-pane :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-tabs-pane xo-animate-item {
  animation: none !important;
}
xo-toggle
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="fade-up"],
xo-toggle xo-animate-item[xo-type="fade-up"],
xo-modal
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="fade-up"],
xo-modal xo-animate-item[xo-type="fade-up"],
xo-popover
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="fade-up"],
xo-popover xo-animate-item[xo-type="fade-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="fade-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="fade-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="fade-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="fade-up"],
xo-tabs-pane
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="fade-up"],
xo-tabs-pane xo-animate-item[xo-type="fade-up"] {
  transform: translate3d(0, calc(var(--xo-strength) * 30%), 0);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-down"],
xo-toggle xo-animate-item[xo-type="fade-down"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-down"],
xo-modal xo-animate-item[xo-type="fade-down"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-down"],
xo-popover xo-animate-item[xo-type="fade-down"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-down"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="fade-down"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-down"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="fade-down"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-down"],
xo-tabs-pane xo-animate-item[xo-type="fade-down"] {
  transform: translate3d(0, calc(var(--xo-strength) * -1 * 30%), 0);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-left"],
xo-toggle xo-animate-item[xo-type="fade-left"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-left"],
xo-modal xo-animate-item[xo-type="fade-left"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-left"],
xo-popover xo-animate-item[xo-type="fade-left"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-left"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="fade-left"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-left"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="fade-left"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-left"],
xo-tabs-pane xo-animate-item[xo-type="fade-left"] {
  transform: translate3d(calc(var(--xo-strength) * 30%), 0, 0);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-right"],
xo-toggle xo-animate-item[xo-type="fade-right"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-right"],
xo-modal xo-animate-item[xo-type="fade-right"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-right"],
xo-popover xo-animate-item[xo-type="fade-right"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-right"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="fade-right"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-right"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="fade-right"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="fade-right"],
xo-tabs-pane xo-animate-item[xo-type="fade-right"] {
  transform: translate3d(calc(var(--xo-strength) * -1 * 30%), 0, 0);
}
xo-toggle
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="zoom-in"],
xo-toggle xo-animate-item[xo-type="zoom-in"],
xo-modal
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="zoom-in"],
xo-modal xo-animate-item[xo-type="zoom-in"],
xo-popover
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="zoom-in"],
xo-popover xo-animate-item[xo-type="zoom-in"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="zoom-in"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="zoom-in"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="zoom-in"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="zoom-in"],
xo-tabs-pane
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="zoom-in"],
xo-tabs-pane xo-animate-item[xo-type="zoom-in"] {
  transform: scale(0.6);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="zoom-out"],
xo-toggle xo-animate-item[xo-type="zoom-out"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="zoom-out"],
xo-modal xo-animate-item[xo-type="zoom-out"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="zoom-out"],
xo-popover xo-animate-item[xo-type="zoom-out"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="zoom-out"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="zoom-out"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="zoom-out"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="zoom-out"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="zoom-out"],
xo-tabs-pane xo-animate-item[xo-type="zoom-out"] {
  transform: scale(calc(var(--xo-strength) * 1.3));
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-left-up"],
xo-toggle xo-animate-item[xo-type="rotate-left-up"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-left-up"],
xo-modal xo-animate-item[xo-type="rotate-left-up"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-left-up"],
xo-popover xo-animate-item[xo-type="rotate-left-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-left-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="rotate-left-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-left-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="rotate-left-up"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-left-up"],
xo-tabs-pane xo-animate-item[xo-type="rotate-left-up"] {
  transform-origin: 0 50%;
  transform: translate3d(0, calc(var(--xo-strength) * 30%), 0) rotate(10deg);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-right-up"],
xo-toggle xo-animate-item[xo-type="rotate-right-up"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-right-up"],
xo-modal xo-animate-item[xo-type="rotate-right-up"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-right-up"],
xo-popover xo-animate-item[xo-type="rotate-right-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-right-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="rotate-right-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-right-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="rotate-right-up"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="rotate-right-up"],
xo-tabs-pane xo-animate-item[xo-type="rotate-right-up"] {
  transform-origin: 100% 50%;
  transform: translate3d(0, calc(var(--xo-strength) * 30%), 0) rotate(-10deg);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-left"],
xo-toggle xo-animate-item[xo-type="snake-left"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-left"],
xo-modal xo-animate-item[xo-type="snake-left"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-left"],
xo-popover xo-animate-item[xo-type="snake-left"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-left"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="snake-left"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-left"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="snake-left"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-left"],
xo-tabs-pane xo-animate-item[xo-type="snake-left"] {
  transform-origin: 100% 50%;
  transform: scaleX(1.8) translate3d(calc(var(--xo-strength) * 30%), 0, 0);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-right"],
xo-toggle xo-animate-item[xo-type="snake-right"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-right"],
xo-modal xo-animate-item[xo-type="snake-right"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-right"],
xo-popover xo-animate-item[xo-type="snake-right"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-right"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="snake-right"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-right"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="snake-right"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-right"],
xo-tabs-pane xo-animate-item[xo-type="snake-right"] {
  transform-origin: 0 50%;
  transform: scaleX(1.8) translate3d(calc(var(--xo-strength) * -1 * 30%), 0, 0);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-up"],
xo-toggle xo-animate-item[xo-type="snake-up"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-up"],
xo-modal xo-animate-item[xo-type="snake-up"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-up"],
xo-popover xo-animate-item[xo-type="snake-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="snake-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="snake-up"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-up"],
xo-tabs-pane xo-animate-item[xo-type="snake-up"] {
  transform-origin: 50% 0;
  transform: scaleY(1.8) translate3d(0, calc(var(--xo-strength) * 30%), 0);
}
xo-toggle
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-down"],
xo-toggle xo-animate-item[xo-type="snake-down"],
xo-modal
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-down"],
xo-modal xo-animate-item[xo-type="snake-down"],
xo-popover
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-down"],
xo-popover xo-animate-item[xo-type="snake-down"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-down"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="snake-down"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-down"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="snake-down"],
xo-tabs-pane
  :where(
    xo-animate:not([xo-item-used], [xo-scroll-forced])
  )[xo-type="snake-down"],
xo-tabs-pane xo-animate-item[xo-type="snake-down"] {
  transform-origin: 50% 100%;
  transform: scaleY(1.8) translate3d(0, calc(var(--xo-strength) * -1 * 30%), 0);
}
xo-toggle
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="3d-up"],
xo-toggle xo-animate-item[xo-type="3d-up"],
xo-modal
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="3d-up"],
xo-modal xo-animate-item[xo-type="3d-up"],
xo-popover
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="3d-up"],
xo-popover xo-animate-item[xo-type="3d-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="3d-up"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="3d-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="3d-up"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="3d-up"],
xo-tabs-pane
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="3d-up"],
xo-tabs-pane xo-animate-item[xo-type="3d-up"] {
  transform-origin: 50% 0;
  transform: perspective(100rem) rotateX(-60deg);
}
xo-toggle
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="blur"],
xo-toggle xo-animate-item[xo-type="blur"],
xo-modal
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="blur"],
xo-modal xo-animate-item[xo-type="blur"],
xo-popover
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="blur"],
xo-popover xo-animate-item[xo-type="blur"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="blur"],
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="blur"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="blur"],
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide
  xo-animate-item[xo-type="blur"],
xo-tabs-pane
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced]))[xo-type="blur"],
xo-tabs-pane xo-animate-item[xo-type="blur"] {
  filter: blur(10px);
}
xo-toggle[xo-active]:not([xo-active="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-toggle[xo-active]:not([xo-active="false"]) xo-animate-item,
xo-modal[xo-active]:not([xo-active="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-modal[xo-active]:not([xo-active="false"]) xo-animate-item,
xo-popover[xo-active]:not([xo-active="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-popover[xo-active]:not([xo-active="false"]) xo-animate-item,
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide[xo-visible]:not([xo-visible="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide[xo-visible]:not([xo-visible="false"])
  xo-animate-item,
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide[xo-visible]:not([xo-visible="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide[xo-visible]:not([xo-visible="false"])
  xo-animate-item,
xo-tabs-pane[xo-active]:not([xo-active="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])),
xo-tabs-pane[xo-active]:not([xo-active="false"]) xo-animate-item {
  opacity: 1;
  backface-visibility: hidden;
}
xo-toggle[xo-active]:not([xo-active="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])):not(
    [xo-type="width-increment"]
  ),
xo-toggle[xo-active]:not([xo-active="false"])
  xo-animate-item:not([xo-type="width-increment"]),
xo-modal[xo-active]:not([xo-active="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])):not(
    [xo-type="width-increment"]
  ),
xo-modal[xo-active]:not([xo-active="false"])
  xo-animate-item:not([xo-type="width-increment"]),
xo-popover[xo-active]:not([xo-active="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])):not(
    [xo-type="width-increment"]
  ),
xo-popover[xo-active]:not([xo-active="false"])
  xo-animate-item:not([xo-type="width-increment"]),
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide[xo-visible]:not([xo-visible="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])):not(
    [xo-type="width-increment"]
  ),
xo-carousel:not([xo-per-view]):not([xo-column-width])
  xo-carousel-slide[xo-visible]:not([xo-visible="false"])
  xo-animate-item:not([xo-type="width-increment"]),
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide[xo-visible]:not([xo-visible="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])):not(
    [xo-type="width-increment"]
  ),
xo-carousel[xo-per-view="1"]:not([xo-column-width])
  xo-carousel-slide[xo-visible]:not([xo-visible="false"])
  xo-animate-item:not([xo-type="width-increment"]),
xo-tabs-pane[xo-active]:not([xo-active="false"])
  :where(xo-animate:not([xo-item-used], [xo-scroll-forced])):not(
    [xo-type="width-increment"]
  ),
xo-tabs-pane[xo-active]:not([xo-active="false"])
  xo-animate-item:not([xo-type="width-increment"]) {
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  xo-animate,
  xo-animate-item,
  [xo-animate="scroll"] {
    opacity: 1;
    transition: none !important;
    animation: none !important;
  }
}
[xo-animate="svg-infinite"]:not(.xo-animate-svg-none)
  [xo-next-stroke-dasharray],
[xo-animate="svg-infinite"]:not(.xo-animate-svg-none)
  [xo-next-stroke-dashoffset] {
  animation: xo-svg-infinite calc(var(--xo-duration) * 2ms) ease infinite;
}
@keyframes xo-svg-infinite {
  0% {
    opacity: 1;
    stroke-dasharray: var(--xo-stroke-dasharray);
    stroke-dashoffset: var(--xo-stroke-dashoffset);
  }
  50%,
  80% {
    opacity: 1;
    stroke-dasharray: var(--xo-next-stroke-dasharray);
    stroke-dashoffset: var(--xo-next-stroke-dashoffset);
  }
  90%,
  to {
    opacity: 0;
    stroke-dasharray: var(--xo-next-stroke-dasharray);
    stroke-dashoffset: var(--xo-next-stroke-dashoffset);
  }
}
:where(xo-animate:not([xo-item-used]))[xo-type^="xo-goo-"],
[xo-animate="scroll"][xo-type^="xo-goo-"] {
  animation: none !important;
  transition: none !important;
}
xo-image-zoom {
  position: relative;
  display: block;
  cursor: none;
}
xo-image-zoom img {
  width: 100%;
}
xo-image-zoom[xo-active]:not([xo-active="false"])[xo-zoom-full]:not(
    [xo-zoom-full="false"]
  )
  > img {
  visibility: hidden;
}
xo-image-zoom[xo-active]:not([xo-active="false"]) xo-image-zoom-item {
  display: block !important;
}
xo-image-zoom[xo-active]:not([xo-active="false"]) xo-image-zoom-thumb {
  opacity: 1;
}
xo-image-zoom[xo-placement="center"] {
  cursor: zoom-in;
}
xo-image-zoom[xo-placement="right"] xo-image-zoom-inner {
  left: calc(100% + 10px);
}
xo-image-zoom[xo-placement="left"] xo-image-zoom-inner {
  left: auto;
  right: calc(100% + 10px);
}
xo-image-zoom[xo-zoom-full]:not([xo-zoom-full="false"]) xo-image-zoom-inner {
  pointer-events: auto;
}
xo-image-zoom[xo-zoom-full]:not([xo-zoom-full="false"]) xo-image-zoom-item {
  position: fixed !important;
}
xo-image-zoom-thumb {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100px;
  height: 100px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  background-color: #ffffff1a;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}
xo-image-zoom-inner {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}
xo-image-zoom-item {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  z-index: 9;
  background-color: var(--color-light-freeze);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  transform-origin: 0 0;
  display: none !important;
}
xo-countdown {
  display: block;
}
xo-video-cover {
  display: block;
  position: relative;
  overflow: hidden;
}
xo-video-cover:after {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
}
xo-video-cover-item {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0;
}
xo-video-cover-item iframe,
xo-video-cover-item video,
xo-video-cover-item embed,
xo-video-cover-item object {
  display: block;
  border: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
xo-video-cover-button {
  display: inline-block;
}
xo-typing:after {
  content: attr(xo-cursor-char);
  display: inline-block;
  margin-left: 2px;
  animation: xo-typing 1.2s;
}
@keyframes xo-typing {
  0%,
  to {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}
xo-typing-inner {
  display: inline-flex;
  overflow: hidden;
}
xo-typing-content {
  position: relative;
  display: inline-flex;
  flex-direction: column;
}
xo-typing-content span:nth-child(2) {
  position: absolute;
  left: 0;
  top: 100%;
}
[xo-slide] > xo-typing-inner > xo-typing-content {
  animation: xo-typing-slide backwards calc(var(--xo-duration) * 1ms) ease;
}
@keyframes xo-typing-slide {
  0% {
    transform: translateZ(0);
    width: var(--xo-width-0);
  }
  to {
    transform: translate3d(0, -100%, 0);
    width: var(--xo-width-1);
  }
}
[xo-goo] > xo-typing-inner > xo-typing-content {
  width: var(--xo-width-1);
}
[xo-goo] > xo-typing-inner > xo-typing-content span:nth-child(1) {
  top: 10%;
  animation: xo-typing-goo-span-1 calc(var(--xo-duration) * 1ms) ease;
}
@keyframes xo-typing-goo-span-1 {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
[xo-goo] > xo-typing-inner > xo-typing-content span:nth-child(2) {
  top: 0;
  opacity: 0;
  animation: xo-typing-goo-span-2 calc(var(--xo-duration) * 1ms) ease;
}
@keyframes xo-typing-goo-span-2 {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
xo-typing[xo-effect="goo"] {
  position: relative;
}
xo-typing[xo-effect="goo"] span + span {
  position: absolute;
}
xo-image-comparison {
  display: block;
  width: 100%;
  position: relative;
  overflow: hidden;
  touch-action: pan-y;
}
xo-image-comparison-label {
  position: absolute;
  top: 0;
  z-index: 1;
  background-color: #000;
  color: #fff;
  padding: 5px 10px;
}
xo-image-comparison-after {
  display: block;
}
xo-image-comparison-after img {
  width: 100%;
  pointer-events: none;
}
xo-image-comparison-after xo-image-comparison-label {
  right: 0;
}
xo-image-comparison-before {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9;
  overflow: hidden;
  width: calc(var(--xo-value, 50) * 1%);
}
xo-image-comparison-before img {
  display: block;
  height: 100% !important;
  width: calc(100 / var(--xo-value, 50) * 100%) !important;
  max-width: none !important;
  object-fit: cover !important;
  pointer-events: none;
}
xo-image-comparison-before xo-image-comparison-label {
  left: 0;
}
xo-image-comparison-handle {
  display: block;
  position: absolute;
  top: 0;
  left: calc(var(--xo-value, 50) * 1%);
  z-index: 9;
  transform: translate(-50%);
  width: 2px;
  height: 100%;
  background-color: #fff;
  cursor: ew-resize;
}
xo-image-comparison-handle-icon {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: fit-content;
  height: fit-content;
  border-radius: 50%;
  cursor: ew-resize;
}
xo-masonry {
  display: block;
  position: relative;
}
xo-masonry-item {
  display: block !important;
}
xo-cursor-item {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 999;
  display: block;
  transition: transform 0.4s, opacity 0.4s;
  opacity: 0;
  transform: translate3d(-50%, -50%, 0) scale(0);
  pointer-events: none;
}
xo-cursor-item[xo-active]:not([xo-active="false"]) {
  opacity: 1;
  transform: translate3d(-50%, -50%, 0) scale(1);
}
[is="xo-cursor"][xo-absolute] xo-cursor-item {
  position: absolute;
}
xo-360-viewer {
  user-select: none;
}
xo-360-viewer-content {
  cursor: grab;
}
xo-360-viewer,
xo-360-viewer-content,
xo-360-viewer-next,
xo-360-viewer-prev,
xo-360-viewer-play,
xo-360-viewer-pause {
  display: block;
}
xo-360-viewer-content {
  position: relative;
}
xo-360-viewer-content img + img {
  position: absolute;
  inset: 0;
  object-fit: cover;
  visibility: hidden;
}
xo-scroll-carousel {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  grid-template-rows: repeat(1, minmax(0, 1fr));
  user-select: none;
  touch-action: pan-y;
}
xo-scroll-carousel[xo-rtl]:not([xo-rtl="false"]) {
  direction: rtl;
}
xo-scroll-carousel > * {
  display: flex;
  flex-wrap: nowrap;
}
xo-scroll-carousel > * > * {
  flex-shrink: 0;
  padding-inline-end: var(--xo-gap, 30px);
}
xo-scroll-carousel-next,
xo-scroll-carousel-prev {
  display: block;
  cursor: pointer;
}
xo-magnetic,
xo-magnetic-content {
  display: inline-block;
  will-change: transform;
}
xo-line-chart {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}
xo-line-chart svg {
  position: absolute;
  top: 0;
  left: 0;
}
xo-scroll-scene {
  position: relative;
  display: block;
}
xo-scroll-scene-inner {
  position: sticky;
  top: 0;
  left: 0;
  display: block;
  width: 100vw;
  height: 100vh;
}
xo-scroll-scene-item {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
}
xo-scroll-scene-item[xo-active]:not([xo-active="false"]) {
  pointer-events: auto;
  visibility: visible;
}
xo-collection-tabs,
xo-collection-tabs-trigger,
xo-collection-tabs-content {
  display: block;
}
.xo-hidden {
  width: 0 !important;
  height: 0 !important;
  position: absolute !important;
  pointer-events: none !important;
}
