.omnise-lightbox-ct .omnise-lightbox .omnise-media-lb img {
  object-fit: contain;
  margin: 0 auto; 
  display: block;
  height: 100%;
  z-index: 100;
  width: 100%;
}

.omnise-lightbox-ct .omnise-button-zoom {
  position: absolute;
  right: 20px;
  bottom: 20px;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  border-radius: 4px;
  z-index: 1;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  background-color: var(--omnise-background-color);
}

.omnise-lightbox-ct .omnise-lightbox,
.omnise-lightbox-ct .omnise-bg-overlay {
  background-color: rgba(0, 0, 0, 0.85) !important;
  z-index: 999999999999999999999999999999;
}

.omnise-lightbox-ct {
  z-index: 999999999;
  opacity: 0;
}

.omnise-lightbox-ct.active {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-lightbox-toolbar,
.omnise-lightbox-ct .omnise-slider-controls {
  display: none !important;
}

.omnise-lightbox-ct.show-controls .omnise-lightbox-toolbar {
  display: flex !important;
}

.omnise-lightbox-ct.show-controls .omnise-slider-controls {
  display: block !important;
}

.omnise-lightbox-ct .omnise-lightbox {
  display: none;
  position: fixed !important;
  inset: 0;
}

.omnise-lightbox.active {
  display: flex !important;
}


.omnise-lightbox-ct .omnise-lightbox .omnise-carousel {
  position: relative;
  height: stretch;
  padding: 44px 0;
  width: 100%;
  overflow: hidden;
}

.omnise-lightbox .omnise-carousel .omnise-lightbox-toolbar {
  position: absolute;
  z-index: 100;
  top: 0;
  right: 0;
}

.omnise-lightbox .omnise-carousel .omnise-slider-wrapper {
  position: relative;
  overflow: hidden;
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.omnise-lightbox .omnise-carousel .omnise-slider-wrapper .omnise-slider-content {
  height: 100%;
  user-select: none;
  overflow: hidden;
  display: flex;
  touch-action: pan-y pinch-zoom;
}

.omnise-lightbox-ct .omnise-lightbox .omnise-carousel .omnise-slider-controls {
  display: block;
}

.omnise-lightbox-ct .omnise-lightbox .omnise-slider-nav-left,
.omnise-lightbox-ct .omnise-lightbox .omnise-slider-nav-right {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  width: 48px;
  height: 48px;
  box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: #fff;
  transition: all 0.3s ease-in-out;
}

.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-nav-right.disabled,
.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-nav-left.disabled {
  opacity: 0.5;
  pointer-events: all;
}

.omnise-lightbox-ct .omnise-slider-nav-left {
  left: 12px;
}

.omnise-lightbox-ct .omnise-slider-nav-right {
  right: 12px;
}

.omnise-lightbox-ct .omnise-slider-container[data-desktop-layout="slider"][data-mobile-layout="slider"] .omnise-slider-content {
  scroll-behavior: auto;
}

.omnise-lightbox-ct .omnise-slider-pagination-wrp {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
}

.omnise-lightbox-ct .omnise-slider-pagination-wrapper {
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.omnise-lightbox-ct .omnise-slider-pagination-total {
  color: #fff;
  align-items: center;
  justify-content: center;
}

.omnise-lightbox-ct .omnise-lightbox .omnise-bg-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.85);
  opacity: 0.1;
  z-index: -10;
  display: block;
  cursor: pointer;
}

.omnise-lightbox-ct .omnise-bg-overlay::after {
  content: "×";
  font-size: 48px;
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}

.omnise-lightbox-ct .omnise-bg-overlay:hover::after {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-media-lb {
  position: relative !important;
  margin: 0 auto;
  height: 100%;
  display: flex;
  align-items: center;
  @media (min-width: 1180px) {
    max-width: 70%;
  }
}

.omnise-lightbox-ct .omnise-lightbox-button {
  background: rgba(30, 30, 30, .6);
  border: 0;
  cursor: pointer;
  display: inline-block;
  height: 44px;
  width: 44px;
  padding: 10px;
  color: white;
  opacity: 0.5;
  transition: color .2s;
}

.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-nav-left,
.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-nav-right {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-pagination-wrapper,
.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-pagination-total,
.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-pagination-progress {
  display: block;
}

.omnise-lightbox-ct .omnise-slide-item{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  overflow: hidden;
  -webkit-user-select: none;
  user-select: none;
  position: relative;
}
.omnise-lightbox-ct .omnise-lightbox.omnise-zoom-in .omnise-slide-item img {
  cursor: zoom-in;
}

.omnise-lightbox-ct .omnise-lightbox-button--zoom.active,
.omnise-lightbox-ct .omnise-lightbox-button--thumbs.active {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-slide-item img {
  transition: transform 0.3s ease;
}

.omnise-lightbox-ct .omnise-thumb-item {
  position: relative;
  padding: 0;
  border: none;
  img{
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

.omnise-lightbox-ct .omnise-thumb-item::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 4px solid #3498db;
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.omnise-lightbox-ct .omnise-thumb-item.active::after {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-carousel.omnise-with-thumb {
  margin-right: 220px;
}

@media (min-width: 640px) and (max-width: 1023px) {
  .omnise-lightbox-ct .omnise-carousel.omnise-with-thumb {
    margin-right: 150px;
  }

  .omnise-lightbox-ct .omnise-media-lb img {
    max-height: 70%;
  }
}

@media (max-width: 639px) {
  .omnise-lightbox-ct .omnise-carousel.omnise-with-thumb {
    margin-right: 90px;
  }

  .omnise-lightbox .omnise-carousel .omnise-slider-wrapper {
    height: 92%;
  }
}

.omnise-lightbox-ct .omnise-lightbox-hover-overlay {
  position: absolute;
  inset: 0;
  transform: none;
  width: 70%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 150%;
  cursor: zoom-in;
  pointer-events: auto;
  touch-action: none;
  user-select: none;
  z-index: 500;
  overflow: hidden;
  display: block !important;
  margin: 0 auto;
}

@media (max-width: 1179px) {

  .omnise-lightbox .omnise-slider-nav-left,
  .omnise-lightbox .omnise-slider-nav-right {
    display: none !important;
  }

  .omnise-lightbox-ct .omnise-lightbox-hover-overlay {
    left: 0;
    transform: none;
    width: 100%;
    background-size: 250%;
  }
}

.omnise-lightbox-ct #omnise-lightbox {
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.omnise-lightbox-ct #omnise-lightbox.omnise-lightbox-closing {
  opacity: 0;
}

.omnise-lightbox-ct .omnise-thumbnails-grid {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 90px;
  overflow-y: auto;
  background-color: #fff;
  z-index: 40;
}

.omnise-lightbox-ct .omnise-thumbnails-grid .omnise-thumbnails-content {
  display: grid !important;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0.25rem;
  padding: 0.25rem;
}

@media (min-width: 640px) {
  .omnise-lightbox-ct .omnise-thumbnails-grid .omnise-thumbnails-content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 640px) {
  .omnise-lightbox-ct .omnise-thumbnails-grid {
    width: 150px;
  }
}

@media (min-width: 1024px) {
  .omnise-lightbox-ct .omnise-thumbnails-grid {
    width: 220px;
  }
}


/* ========== CONTROLS (Navigation & Pagination) ========== */
.omnise-carousel {
  position: relative;
  overflow-x: clip;
  overflow-y: visible;
  max-width: stretch;
  width: 100%;
  height: fit-content;
  .omnise-slider-item{
    min-width: 0;
  }
  .omnise-slider-wrapper{
    position: relative;
    height: 100%;
    .omnise-slider-items{
      display: flex;
      max-width: 100%;
    }
  }
}

.omnise-slider-nav-left,
.omnise-slider-nav-right {
  position: absolute;
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color:#f5f5f5;
  transition: all ease 0.3s;
  box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.2);
  opacity: 0;
  top: calc(50% - var(--height-controls,0px) / 2);
  transform: translate(0, -50%);
  color: #333333;
  cursor: pointer;
  &:hover {
    background-color: #cccccc;
    scale: 1.1;
    color: #333333;
  }
  svg {
    width: 20px;
    height: 20px;
  }
}

.omnise-slider-nav-left {
  left: 15px;
}

.omnise-slider-nav-right {
  right: 15px;
}

.omnise-carousel:hover {
  .omnise-slider-nav-left,
  .omnise-slider-nav-right {
    opacity: 1;
   
  }
  .omnise-slider-nav-left.disabled,
  .omnise-slider-nav-right.disabled {
    opacity: 0.5;
  }
}
.omnise-slider-nav-left.disabled,
.omnise-slider-nav-right.disabled {
  pointer-events: none;
  cursor: not-allowed;
}

/* ========== SLIDER CONTROLS & PAGINATION NESTING ========== */

.omnise-slider-controls {
  display: none;
  @media (min-width: 1024px) {
  &[show-desktop="true"] {
      display: block;
    }
  }
  @media (min-width: 767.79px) and (max-width: 1180px) {
  &[show-tablet="true"] {
      display: block;
    }
  }
  @media (max-width: 767px) {
  &[show-mobile="true"] {
      display: block;
    }
  }
  .omnise-slider-pagination-wrp {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    .omnise-slider-pagination-wrapper,
    .omnise-slider-pagination-total,
    .omnise-slider-pagination-progress {
      display: none;
      position: relative;
      line-height: 1;
    }
  }
}

.omnise-slider-wrapper {
  &[data-pagination="dots"],
  &[data-pagination="dynamic-dots"],
  &[data-pagination="numbers"] {
    & + .omnise-slider-controls .omnise-slider-pagination-wrapper {
      display: flex;
      gap: 8px;
      align-items: center;
      justify-content: center;
      .pagination-bullets-dynamic{
        gap: 8px;
        width: 100%;
      }
    }
  }
  &[data-pagination="dots"] + .omnise-slider-controls .omnise-slider-pagination {
    width: 8px;
    height: 8px;
    background: #e6e6e6;
    border-radius: 50%;
    cursor: pointer;
    &.active {
      background: #181818;
    }
    &:not(.active):hover {
      background: #cccccc;
    }
  }
  &[data-pagination="dynamic-dots"] + .omnise-slider-controls  .omnise-slider-pagination {
    display: inline-block;
    position: relative;
    width: 8px;
    height: 8px;
    min-width: 8px;
    background: #e6e6e6;
    border-radius: 50%;
    transition: all 0.3s ease;
    cursor: pointer;
    transform: scale(0);
    &.prev,
    &.next {
      transform: scale(0.66);
    }
    &.prev-prev,
    &.next-next {
      transform: scale(0.33);
    }
    &.active {
      background: #181818;
      opacity: 1;
      transform: scale(1);
    }

    &:not(.active):hover {
      background: #cccccc;
    }
  }

  &[data-pagination="numbers"] + .omnise-slider-controls .omnise-slider-pagination {
    padding: 10px;
    opacity: 0.7;
    cursor: pointer;
    color: #e6e6e6;
    &.active {
      text-decoration: underline;
      color: #181818;
      opacity: 1;
    }

    &:not(.active):hover {
      color: #cccccc;
    }
  }

  &[data-pagination="counter"]
    + .omnise-slider-controls
    .omnise-slider-pagination-total {
    display: flex;
  }

  &[data-pagination="progress"]
    + .omnise-slider-controls
    .omnise-slider-pagination-progress {
    display: flex;
    justify-content: center;
    height: 4px;
    width: 100%;
    background-color: #e6e6e6;

    span {
      display: flex;
      height: 100%;
      position: absolute;
      left: 0;
      background-color: #181818;
      transition: all ease 0.3s;
    }
  }
}

/* ========== FADE EFFECT ========== */
.omnise-slider-wrapper[data-effect="fade"] {
  .omnise-slider-items {
    scroll-behavior: auto;
  }
  .omnise-slide-item {
    flex: 0 0 100%;
  }
}


.omnise-product-media-wrapper[data-zoom="hover"] .omnise-product-media .omnise-slide-item .omnise-image-picture{
    cursor: zoom-in;
}
.media-hover-overlay {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 70%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 150%;
  pointer-events: auto;
  touch-action: none;
  user-select: none;
  z-index: 10;
  transition: background-position 0.1s ease;
  cursor: zoom-out;
  display: block !important;
}

@media (max-width: 1179px) {
  .media-hover-overlay {
    left: 0;
    transform: none;
    width: 100%;
    background-size: 250%;
  }
}
/**
 * Default flex layout via class / data-bnode selectors (no per-node data attributes).
 * Overrides use [data-bnode="id"] dynamic styles from buildFlexLayoutDynamicCss.
 *
 * Section: data-bnode is on <section>; flex host is child .omnise-section-container
 * (same as buildFlexLayoutDynamicCss childSelector "> .omnise-section-container").
 */

.omnise-section-container {
  display: flex;
  flex-direction: column;
  gap: var(--omnise-grid-gap,0);
    > *:not(.omnise-slot) {
      position: relative;
      z-index: 1;
    }
    > .omnise-bg-image {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      height: 100%;
      transform: translate(-50%, -50%);
      z-index: 0;
      img {
        width: 100%;
        height: 100%;
      }
    }
    > .omnise-video-background {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      height: 100%;
      transform: translate(-50%, -50%);
      z-index: 0;
      object-fit: cover;
      background: #000000;
    }
}

.omnise-section[data-bnode] {
  position: relative;
  max-width: 100%;
  padding: var(--omnise-section-padding-y, 0) var(--omnise-section-padding-x, 0);
}

@media (min-width: 767.79px) and (max-width: 1180px) {
  .omnise-section[data-bnode] {
    padding: var(--omnise-section-padding-y-tablet, var(--omnise-section-padding-y, 0))
      var(--omnise-section-padding-x-tablet, var(--omnise-section-padding-x, 0));
  }
}

@media (max-width: 767px) {
  .omnise-section[data-bnode] {
    padding: var(--omnise-section-padding-y-mobile, var(--omnise-section-padding-y-tablet, var(--omnise-section-padding-y, 0)))
      var(--omnise-section-padding-x-mobile, var(--omnise-section-padding-x-tablet, var(--omnise-section-padding-x, 0)));
  }
}

.omnise-slot {
  display: flex;
  flex-direction: column;
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  transform: none;
  max-width: 100%;
  width: 100%;
}

@media (min-width: 767.79px) and (max-width: 1180px) {
  .omnise-slot {
    gap: var(--omnise-slot-gap-tablet, var(--omnise-slot-gap, 0));
    padding: var(--omnise-slot-padding-y-tablet, var(--omnise-slot-padding-y, 0))
      var(--omnise-slot-padding-x-tablet, var(--omnise-slot-padding-x, 0));
  }
}

@media (max-width: 767px) {
  .omnise-slot {
    gap: var(--omnise-slot-gap-mobile, var(--omnise-slot-gap-tablet, var(--omnise-slot-gap, 0)));
    padding: var(--omnise-slot-padding-y-mobile, var(--omnise-slot-padding-y-tablet, var(--omnise-slot-padding-y, 0)))
      var(--omnise-slot-padding-x-mobile, var(--omnise-slot-padding-x-tablet, var(--omnise-slot-padding-x, 0)));
  }
}
.omnise-slot.omnise-virtual-slot {
  flex-direction: unset;
}
.omnise-slot.omnise-featured-product > .omnise-bg-image {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  z-index: 0;
}

.omnise-slot.omnise-featured-product > .omnise-bg-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.omnise-contact-fields.omnise-slot {
  overflow: hidden;
}

.omnise-contact-fields.omnise-slot > * {
  position: relative;
  z-index: 1;
}

.omnise-contact-fields.omnise-slot > .omnise-bg-image {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  border-radius: inherit;
  overflow: hidden;
  z-index: 0;
}

.omnise-contact-fields.omnise-slot > .omnise-bg-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* ========== CONTROLS (Navigation & Pagination) ========== */
.omnise-carousel {
  position: relative;
  overflow-x: clip;
  overflow-y: visible;
  max-width: stretch;
  width: 100%;
  height: fit-content;
  .omnise-slider-item{
    min-width: 0;
  }
  .omnise-slider-wrapper{
    position: relative;
    height: 100%;
    .omnise-slider-items{
      display: flex;
      max-width: 100%;
    }
  }
}

.omnise-slider-nav-left,
.omnise-slider-nav-right {
  position: absolute;
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color:#f5f5f5;
  transition: all ease 0.3s;
  box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.2);
  opacity: 0;
  top: calc(50% - var(--height-controls,0px) / 2);
  transform: translate(0, -50%);
  color: #333333;
  cursor: pointer;
  &:hover {
    background-color: #cccccc;
    scale: 1.1;
    color: #333333;
  }
  svg {
    width: 20px;
    height: 20px;
  }
}

.omnise-slider-nav-left {
  left: 15px;
}

.omnise-slider-nav-right {
  right: 15px;
}

.omnise-carousel:hover {
  .omnise-slider-nav-left,
  .omnise-slider-nav-right {
    opacity: 1;
   
  }
  .omnise-slider-nav-left.disabled,
  .omnise-slider-nav-right.disabled {
    opacity: 0.5;
  }
}
.omnise-slider-nav-left.disabled,
.omnise-slider-nav-right.disabled {
  pointer-events: none;
  cursor: not-allowed;
}

/* ========== SLIDER CONTROLS & PAGINATION NESTING ========== */

.omnise-slider-controls {
  display: none;
  @media (min-width: 1024px) {
  &[show-desktop="true"] {
      display: block;
    }
  }
  @media (min-width: 767.79px) and (max-width: 1180px) {
  &[show-tablet="true"] {
      display: block;
    }
  }
  @media (max-width: 767px) {
  &[show-mobile="true"] {
      display: block;
    }
  }
  .omnise-slider-pagination-wrp {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    .omnise-slider-pagination-wrapper,
    .omnise-slider-pagination-total,
    .omnise-slider-pagination-progress {
      display: none;
      position: relative;
      line-height: 1;
    }
  }
}

.omnise-slider-wrapper {
  &[data-pagination="dots"],
  &[data-pagination="dynamic-dots"],
  &[data-pagination="numbers"] {
    & + .omnise-slider-controls .omnise-slider-pagination-wrapper {
      display: flex;
      gap: 8px;
      align-items: center;
      justify-content: center;
      .pagination-bullets-dynamic{
        gap: 8px;
        width: 100%;
      }
    }
  }
  &[data-pagination="dots"] + .omnise-slider-controls .omnise-slider-pagination {
    width: 8px;
    height: 8px;
    background: #e6e6e6;
    border-radius: 50%;
    cursor: pointer;
    &.active {
      background: #181818;
    }
    &:not(.active):hover {
      background: #cccccc;
    }
  }
  &[data-pagination="dynamic-dots"] + .omnise-slider-controls  .omnise-slider-pagination {
    display: inline-block;
    position: relative;
    width: 8px;
    height: 8px;
    min-width: 8px;
    background: #e6e6e6;
    border-radius: 50%;
    transition: all 0.3s ease;
    cursor: pointer;
    transform: scale(0);
    &.prev,
    &.next {
      transform: scale(0.66);
    }
    &.prev-prev,
    &.next-next {
      transform: scale(0.33);
    }
    &.active {
      background: #181818;
      opacity: 1;
      transform: scale(1);
    }

    &:not(.active):hover {
      background: #cccccc;
    }
  }

  &[data-pagination="numbers"] + .omnise-slider-controls .omnise-slider-pagination {
    padding: 10px;
    opacity: 0.7;
    cursor: pointer;
    color: #e6e6e6;
    &.active {
      text-decoration: underline;
      color: #181818;
      opacity: 1;
    }

    &:not(.active):hover {
      color: #cccccc;
    }
  }

  &[data-pagination="counter"]
    + .omnise-slider-controls
    .omnise-slider-pagination-total {
    display: flex;
  }

  &[data-pagination="progress"]
    + .omnise-slider-controls
    .omnise-slider-pagination-progress {
    display: flex;
    justify-content: center;
    height: 4px;
    width: 100%;
    background-color: #e6e6e6;

    span {
      display: flex;
      height: 100%;
      position: absolute;
      left: 0;
      background-color: #181818;
      transition: all ease 0.3s;
    }
  }
}

/* ========== FADE EFFECT ========== */
.omnise-slider-wrapper[data-effect="fade"] {
  .omnise-slider-items {
    scroll-behavior: auto;
  }
  .omnise-slide-item {
    flex: 0 0 100%;
  }
}
.omnise-lightbox-ct .omnise-lightbox .omnise-media-lb img {
  object-fit: contain;
  margin: 0 auto; 
  display: block;
  height: 100%;
  z-index: 100;
  width: 100%;
}

.omnise-lightbox-ct .omnise-button-zoom {
  position: absolute;
  right: 20px;
  bottom: 20px;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  border-radius: 4px;
  z-index: 1;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  background-color: var(--omnise-background-color);
}

.omnise-lightbox-ct .omnise-lightbox,
.omnise-lightbox-ct .omnise-bg-overlay {
  background-color: rgba(0, 0, 0, 0.85) !important;
  z-index: 999999999999999999999999999999;
}

.omnise-lightbox-ct {
  z-index: 999999999;
  opacity: 0;
}

.omnise-lightbox-ct.active {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-lightbox-toolbar,
.omnise-lightbox-ct .omnise-slider-controls {
  display: none !important;
}

.omnise-lightbox-ct.show-controls .omnise-lightbox-toolbar {
  display: flex !important;
}

.omnise-lightbox-ct.show-controls .omnise-slider-controls {
  display: block !important;
}

.omnise-lightbox-ct .omnise-lightbox {
  display: none;
  position: fixed !important;
  inset: 0;
}

.omnise-lightbox.active {
  display: flex !important;
}


.omnise-lightbox-ct .omnise-lightbox .omnise-carousel {
  position: relative;
  height: stretch;
  padding: 44px 0;
  width: 100%;
  overflow: hidden;
}

.omnise-lightbox .omnise-carousel .omnise-lightbox-toolbar {
  position: absolute;
  z-index: 100;
  top: 0;
  right: 0;
}

.omnise-lightbox .omnise-carousel .omnise-slider-wrapper {
  position: relative;
  overflow: hidden;
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.omnise-lightbox .omnise-carousel .omnise-slider-wrapper .omnise-slider-content {
  height: 100%;
  user-select: none;
  overflow: hidden;
  display: flex;
  touch-action: pan-y pinch-zoom;
}

.omnise-lightbox-ct .omnise-lightbox .omnise-carousel .omnise-slider-controls {
  display: block;
}

.omnise-lightbox-ct .omnise-lightbox .omnise-slider-nav-left,
.omnise-lightbox-ct .omnise-lightbox .omnise-slider-nav-right {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  width: 48px;
  height: 48px;
  box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: #fff;
  transition: all 0.3s ease-in-out;
}

.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-nav-right.disabled,
.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-nav-left.disabled {
  opacity: 0.5;
  pointer-events: all;
}

.omnise-lightbox-ct .omnise-slider-nav-left {
  left: 12px;
}

.omnise-lightbox-ct .omnise-slider-nav-right {
  right: 12px;
}

.omnise-lightbox-ct .omnise-slider-container[data-desktop-layout="slider"][data-mobile-layout="slider"] .omnise-slider-content {
  scroll-behavior: auto;
}

.omnise-lightbox-ct .omnise-slider-pagination-wrp {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
}

.omnise-lightbox-ct .omnise-slider-pagination-wrapper {
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.omnise-lightbox-ct .omnise-slider-pagination-total {
  color: #fff;
  align-items: center;
  justify-content: center;
}

.omnise-lightbox-ct .omnise-lightbox .omnise-bg-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.85);
  opacity: 0.1;
  z-index: -10;
  display: block;
  cursor: pointer;
}

.omnise-lightbox-ct .omnise-bg-overlay::after {
  content: "×";
  font-size: 48px;
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}

.omnise-lightbox-ct .omnise-bg-overlay:hover::after {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-media-lb {
  position: relative !important;
  margin: 0 auto;
  height: 100%;
  display: flex;
  align-items: center;
  @media (min-width: 1180px) {
    max-width: 70%;
  }
}

.omnise-lightbox-ct .omnise-lightbox-button {
  background: rgba(30, 30, 30, .6);
  border: 0;
  cursor: pointer;
  display: inline-block;
  height: 44px;
  width: 44px;
  padding: 10px;
  color: white;
  opacity: 0.5;
  transition: color .2s;
}

.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-nav-left,
.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-nav-right {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-pagination-wrapper,
.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-pagination-total,
.omnise-lightbox-ct .omnise-lightbox.omnise-slide-show:hover .omnise-slider-pagination-progress {
  display: block;
}

.omnise-lightbox-ct .omnise-slide-item{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  overflow: hidden;
  -webkit-user-select: none;
  user-select: none;
  position: relative;
}
.omnise-lightbox-ct .omnise-lightbox.omnise-zoom-in .omnise-slide-item img {
  cursor: zoom-in;
}

.omnise-lightbox-ct .omnise-lightbox-button--zoom.active,
.omnise-lightbox-ct .omnise-lightbox-button--thumbs.active {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-slide-item img {
  transition: transform 0.3s ease;
}

.omnise-lightbox-ct .omnise-thumb-item {
  position: relative;
  padding: 0;
  border: none;
  img{
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

.omnise-lightbox-ct .omnise-thumb-item::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 4px solid #3498db;
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.omnise-lightbox-ct .omnise-thumb-item.active::after {
  opacity: 1;
}

.omnise-lightbox-ct .omnise-carousel.omnise-with-thumb {
  margin-right: 220px;
}

@media (min-width: 640px) and (max-width: 1023px) {
  .omnise-lightbox-ct .omnise-carousel.omnise-with-thumb {
    margin-right: 150px;
  }

  .omnise-lightbox-ct .omnise-media-lb img {
    max-height: 70%;
  }
}

@media (max-width: 639px) {
  .omnise-lightbox-ct .omnise-carousel.omnise-with-thumb {
    margin-right: 90px;
  }

  .omnise-lightbox .omnise-carousel .omnise-slider-wrapper {
    height: 92%;
  }
}

.omnise-lightbox-ct .omnise-lightbox-hover-overlay {
  position: absolute;
  inset: 0;
  transform: none;
  width: 70%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 150%;
  cursor: zoom-in;
  pointer-events: auto;
  touch-action: none;
  user-select: none;
  z-index: 500;
  overflow: hidden;
  display: block !important;
  margin: 0 auto;
}

@media (max-width: 1179px) {

  .omnise-lightbox .omnise-slider-nav-left,
  .omnise-lightbox .omnise-slider-nav-right {
    display: none !important;
  }

  .omnise-lightbox-ct .omnise-lightbox-hover-overlay {
    left: 0;
    transform: none;
    width: 100%;
    background-size: 250%;
  }
}

.omnise-lightbox-ct #omnise-lightbox {
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.omnise-lightbox-ct #omnise-lightbox.omnise-lightbox-closing {
  opacity: 0;
}

.omnise-lightbox-ct .omnise-thumbnails-grid {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 90px;
  overflow-y: auto;
  background-color: #fff;
  z-index: 40;
}

.omnise-lightbox-ct .omnise-thumbnails-grid .omnise-thumbnails-content {
  display: grid !important;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0.25rem;
  padding: 0.25rem;
}

@media (min-width: 640px) {
  .omnise-lightbox-ct .omnise-thumbnails-grid .omnise-thumbnails-content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 640px) {
  .omnise-lightbox-ct .omnise-thumbnails-grid {
    width: 150px;
  }
}

@media (min-width: 1024px) {
  .omnise-lightbox-ct .omnise-thumbnails-grid {
    width: 220px;
  }
}
.omnise-product-media-wrapper[data-zoom="hover"] .omnise-product-media .omnise-slide-item .omnise-image-picture{
    cursor: zoom-in;
}
.media-hover-overlay {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 70%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 150%;
  pointer-events: auto;
  touch-action: none;
  user-select: none;
  z-index: 10;
  transition: background-position 0.1s ease;
  cursor: zoom-out;
  display: block !important;
}

@media (max-width: 1179px) {
  .media-hover-overlay {
    left: 0;
    transform: none;
    width: 100%;
    background-size: 250%;
  }
}
[data-bnode="omnise-pv6pqj"].omnise-section { padding-top: 40px; padding-right: 32px; padding-bottom: 40px; padding-left: 32px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-pv6pqj"].omnise-section { padding-top: 40px; padding-right: 32px; padding-bottom: 40px; padding-left: 32px; } } @media (max-width: 767px) { [data-bnode="omnise-pv6pqj"].omnise-section { padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } } [data-bnode="omnise-pv6pqj"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: 1080px;   margin: 0 auto;    flex-direction: row;   flex-wrap: nowrap;     align-items: flex-end;   gap: 20;        &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-pv6pqj"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: 1080px;   margin: 0 auto;              gap: 20;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-pv6pqj"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;    flex-direction: column;     justify-content: flex-end;     gap: 0px;     }  }[data-bnode="omnise-u6khru"] {   position: absolute; top: 0px; left: 0px; height: 100%;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-u6khru"] {      }  }  @media (max-width: 767px) {   [data-bnode="omnise-u6khru"] {    position: relative;   }  } [data-bnode="omnise-u6khru"] {     flex-direction: row;   flex-wrap: nowrap;                &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-u6khru"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-u6khru"] {                     }  }[data-bnode="omnise-d2hgut"] { --d2hgut-width: 100%; --d2hgut-width-tablet: 100%; --d2hgut-width-mobile: 100%; --d2hgut-imageRatio: 21/9; --d2hgut-imageRatio-tablet: 21/9; --d2hgut-imageRatio-mobile: 1/1; --d2hgut-objFit: cover; --d2hgut-objFit-tablet: cover; --d2hgut-objFit-mobile: cover; --d2hgut-borderStyle: none; --d2hgut-borderStyle-tablet: none; --d2hgut-borderStyle-mobile: none; --d2hgut-borderRadius-tl: 0px; --d2hgut-borderRadius-tl-tablet: 0px; --d2hgut-borderRadius-tl-mobile: 0px; --d2hgut-borderRadius-tr: 0px; --d2hgut-borderRadius-tr-tablet: 0px; --d2hgut-borderRadius-tr-mobile: 0px; --d2hgut-borderRadius-bl: 0px; --d2hgut-borderRadius-bl-tablet: 0px; --d2hgut-borderRadius-bl-mobile: 0px; --d2hgut-borderRadius-br: 0px; --d2hgut-borderRadius-br-tablet: 0px; --d2hgut-borderRadius-br-mobile: 0px; }[data-bnode="omnise-d2hgut"] { margin-top: var(--d2hgut-margin-top, 0px); margin-right: var(--d2hgut-margin-right, 0px); margin-bottom: var(--d2hgut-margin-bottom, 0px); margin-left: var(--d2hgut-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--d2hgut-margin-top-tablet, 0px); margin-right: var(--d2hgut-margin-right-tablet, 0px); margin-bottom: var(--d2hgut-margin-bottom-tablet, 0px); margin-left: var(--d2hgut-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--d2hgut-margin-top-mobile, 0px); margin-right: var(--d2hgut-margin-right-mobile, 0px); margin-bottom: var(--d2hgut-margin-bottom-mobile, 0px); margin-left: var(--d2hgut-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--d2hgut-width,100%) - var(--d2hgut-margin-left,0px) - var(--d2hgut-margin-right,0px)); width: calc(var(--d2hgut-width,100%) - var(--d2hgut-margin-left,0px) - var(--d2hgut-margin-right,0px)); min-height: min-content; border-color: var(--d2hgut-borderColor,var(--omnise-card-media-border-color)); border-style: var(--d2hgut-borderStyle,solid); border-width: var(--d2hgut-borderWidth-tl,var(--omnise-card-border-width)) var(--d2hgut-borderWidth-tr,var(--omnise-card-border-width)) var(--d2hgut-borderWidth-br,var(--omnise-card-border-width)) var(--d2hgut-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--d2hgut-borderRadius-tl,var(--omnise-card-border-radius)) var(--d2hgut-borderRadius-tr,var(--omnise-card-border-radius)) var(--d2hgut-borderRadius-br,var(--omnise-card-border-radius)) var(--d2hgut-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--d2hgut-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--d2hgut-borderWidth-tl-tablet, var(--d2hgut-borderWidth-tl,var(--omnise-card-border-width))) var(--d2hgut-borderWidth-tr-tablet, var(--d2hgut-borderWidth-tr,var(--omnise-card-border-width))) var(--d2hgut-borderWidth-br-tablet, var(--d2hgut-borderWidth-br,var(--omnise-card-border-width))) var(--d2hgut-borderWidth-bl-tablet, var(--d2hgut-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--d2hgut-borderRadius-tl-tablet, var(--d2hgut-borderRadius-tl,var(--omnise-card-border-radius))) var(--d2hgut-borderRadius-tr-tablet, var(--d2hgut-borderRadius-tr,var(--omnise-card-border-radius))) var(--d2hgut-borderRadius-br-tablet, var(--d2hgut-borderRadius-br,var(--omnise-card-border-radius))) var(--d2hgut-borderRadius-bl-tablet, var(--d2hgut-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--d2hgut-borderWidth-tl-mobile, var(--d2hgut-borderWidth-tl,var(--omnise-card-border-width))) var(--d2hgut-borderWidth-tr-mobile, var(--d2hgut-borderWidth-tr,var(--omnise-card-border-width))) var(--d2hgut-borderWidth-br-mobile, var(--d2hgut-borderWidth-br,var(--omnise-card-border-width))) var(--d2hgut-borderWidth-bl-mobile, var(--d2hgut-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--d2hgut-borderRadius-tl-mobile, var(--d2hgut-borderRadius-tl,var(--omnise-card-border-radius))) var(--d2hgut-borderRadius-tr-mobile, var(--d2hgut-borderRadius-tr,var(--omnise-card-border-radius))) var(--d2hgut-borderRadius-br-mobile, var(--d2hgut-borderRadius-br,var(--omnise-card-border-radius))) var(--d2hgut-borderRadius-bl-mobile, var(--d2hgut-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--d2hgut-shadowHorizontal, var(--omnise-card-shadow-x)) var(--d2hgut-shadowVertical, var(--omnise-card-shadow-y)) var(--d2hgut-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--d2hgut-shadowColor, var(--omnise-card-media-shadow-color)) var(--d2hgut-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--d2hgut-overlayColor-color, #000); opacity: var(--d2hgut-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--d2hgut-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--d2hgut-width-tablet,var(--d2hgut-width,100%)) - var(--d2hgut-margin-left-tablet,var(--d2hgut-margin-left,0px)) - var(--d2hgut-margin-right-tablet,var(--d2hgut-margin-right,0px))); width: calc(var(--d2hgut-width-tablet,var(--d2hgut-width,100%)) - var(--d2hgut-margin-left-tablet,var(--d2hgut-margin-left,0px)) - var(--d2hgut-margin-right-tablet,var(--d2hgut-margin-right,0px))); aspect-ratio: var(--d2hgut-imageRatio-tablet, var(--d2hgut-imageRatio, auto)); img { object-fit: var(--d2hgut-objFit-tablet, var(--d2hgut-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--d2hgut-width-mobile,var(--d2hgut-width,100%)) - var(--d2hgut-margin-left-mobile,var(--d2hgut-margin-left,0px)) - var(--d2hgut-margin-right-mobile,var(--d2hgut-margin-right,0px))); width: calc(var(--d2hgut-width-mobile,var(--d2hgut-width,100%)) - var(--d2hgut-margin-left-mobile,var(--d2hgut-margin-left,0px)) - var(--d2hgut-margin-right-mobile,var(--d2hgut-margin-right,0px))); aspect-ratio: var(--d2hgut-imageRatio-mobile, var(--d2hgut-imageRatio, auto)); img { object-fit: var(--d2hgut-objFit-mobile, var(--d2hgut-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-gks6me"] { border-style: dotted; border-color: #ffffff; border-width: 0px 0px 0px 0px; border-radius: 9px 9px 9px 9px; background: #05480d; -webkit-backdrop-filter: blur(0px) saturate(100%); backdrop-filter: blur(0px) saturate(100%); padding-top: 0px; padding-right: 96px; padding-bottom: 0px; padding-left: 96px; } @media (max-width: 767px) { [data-bnode="omnise-gks6me"] { padding-top: 36px; padding-right: 20px; padding-bottom: 36px; padding-left: 20px; } } [data-bnode="omnise-gks6me"] {   max-width: fit-content;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-gks6me"] {    z-index: 1000;   }  }  @media (max-width: 767px) {   [data-bnode="omnise-gks6me"] {    z-index: 1000; max-width: 100%;   }  } [data-bnode="omnise-gks6me"] {        flex-wrap: nowrap;   justify-content: flex-end;   align-items: flex-start;   gap: 32px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-gks6me"] {                gap: 32px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-gks6me"] {           justify-content: flex-start;     gap: 24px;     }  }[data-bnode="omnise-pv1eqo"] { -webkit-backdrop-filter: saturate(109%); backdrop-filter: saturate(109%); } [data-bnode="omnise-pv1eqo"] {        flex-wrap: nowrap;   justify-content: flex-end;   align-items: flex-start;       }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-pv1eqo"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-pv1eqo"] {                     }  }[data-bnode="omnise-617ghr"] { --617ghr-typography: h1; --617ghr-typography-tablet: h1; --617ghr-typography-mobile: h1; --omnise-h3-text-align-tablet: start; --omnise-h3-text-align-mobile: start; --omnise-h1-text-align: start; --omnise-h1-line-height: 1.8; --omnise-h1-letter-spacing: -1.5px; }[data-bnode="omnise-617ghr"] { margin-top: var(--617ghr-margin-top, 0px); margin-right: var(--617ghr-margin-right, 0px); margin-bottom: var(--617ghr-margin-bottom, 0px); margin-left: var(--617ghr-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--617ghr-margin-top-tablet, 0px); margin-right: var(--617ghr-margin-right-tablet, 0px); margin-bottom: var(--617ghr-margin-bottom-tablet, 0px); margin-left: var(--617ghr-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--617ghr-margin-top-mobile, 0px); margin-right: var(--617ghr-margin-right-mobile, 0px); margin-bottom: var(--617ghr-margin-bottom-mobile, 0px); margin-left: var(--617ghr-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--617ghr-highlightColor,var(--omnise-p-color)); top: var(--617ghr-highlightTop, 100%); } }[data-bnode="omnise-nnrmni"] { --omnise-p-text-align-tablet: start; --omnise-p-text-align-mobile: start; --nnrmni-typography: p; --nnrmni-typography-tablet: p; --nnrmni-typography-mobile: p; --omnise-p-text-align: start; }[data-bnode="omnise-nnrmni"] { margin-top: var(--nnrmni-margin-top, 0px); margin-right: var(--nnrmni-margin-right, 0px); margin-bottom: var(--nnrmni-margin-bottom, 0px); margin-left: var(--nnrmni-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--nnrmni-margin-top-tablet, 0px); margin-right: var(--nnrmni-margin-right-tablet, 0px); margin-bottom: var(--nnrmni-margin-bottom-tablet, 0px); margin-left: var(--nnrmni-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--nnrmni-margin-top-mobile, 0px); margin-right: var(--nnrmni-margin-right-mobile, 0px); margin-bottom: var(--nnrmni-margin-bottom-mobile, 0px); margin-left: var(--nnrmni-margin-left-mobile, 0px); } }[data-bnode="omnise-hy9wou"] { --hy9wou-button: pr; --hy9wou-button-tablet: pr; --hy9wou-button-mobile: pr; --omnise-btn-pr-label-color: #ffffff; --omnise-btn-font-size: 28px; --omnise-btn-border-radius: 44px; --omnise-btn-pr-background-color: #05480d; --omnise-btn-padding: 29px; --omnise-btn-height: 60px; --omnise-btn-font-weight: 700; --hy9wou-margin-top: 0px; --hy9wou-margin-top-tablet: 0px; --hy9wou-margin-top-mobile: 0px; --hy9wou-margin-right: 0px; --hy9wou-margin-right-tablet: 0px; --hy9wou-margin-right-mobile: 0px; --hy9wou-margin-bottom: 0px; --hy9wou-margin-bottom-tablet: 0px; --hy9wou-margin-bottom-mobile: 0px; --hy9wou-margin-left: 0px; --hy9wou-margin-left-tablet: 0px; --hy9wou-margin-left-mobile: 0px; }[data-bnode="omnise-hy9wou"] { margin-top: var(--hy9wou-margin-top, 0px); margin-right: var(--hy9wou-margin-right, 0px); margin-bottom: var(--hy9wou-margin-bottom, 0px); margin-left: var(--hy9wou-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--hy9wou-margin-top-tablet, 0px); margin-right: var(--hy9wou-margin-right-tablet, 0px); margin-bottom: var(--hy9wou-margin-bottom-tablet, 0px); margin-left: var(--hy9wou-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--hy9wou-margin-top-mobile, 0px); margin-right: var(--hy9wou-margin-right-mobile, 0px); margin-bottom: var(--hy9wou-margin-bottom-mobile, 0px); margin-left: var(--hy9wou-margin-left-mobile, 0px); } &{ gap:var(--hy9wou-iconGap,5px); &.omnise-btn-pr:hover{ background-color: if( style(--hy9wou-bgBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-background-color), white calc(abs(var(--hy9wou-bgBtnHover)) * 1%)); style(--hy9wou-bgBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-background-color), black calc(abs(var(--hy9wou-bgBtnHover)) * 1%)); else: var(--omnise-btn-pr-background-hover) ); color: if( style(--hy9wou-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-label-color), white calc(abs(var(--hy9wou-labelBtnHover)) * 1%)); style(--hy9wou-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-label-color), black calc(abs(var(--hy9wou-labelBtnHover)) * 1%)); else: var(--omnise-btn-pr-label-hover) ); outline-color: if( style(--hy9wou-borderBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-borde-color), white calc(abs(var(--hy9wou-borderBtnHover)) * 1%)); style(--hy9wou-borderBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-border-color), black calc(abs(var(--hy9wou-borderBtnHover)) * 1%)); else: var(--omnise-btn-pr-border-hover) ); } &.omnise-btn-se:hover{ background-color: if( style(--hy9wou-bgBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-background-color), white calc(abs(var(--hy9wou-bgBtnHover)) * 1%)); style(--hy9wou-bgBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-background-color), black calc(abs(var(--hy9wou-bgBtnHover)) * 1%)); else: var(--omnise-btn-se-background-hover) ); color: if( style(--hy9wou-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-label-color), white calc(abs(var(--hy9wou-labelBtnHover)) * 1%)); style(--hy9wou-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-label-color), black calc(abs(var(--hy9wou-labelBtnHover)) * 1%)); else: var(--omnise-btn-se-label-hover) ); outline-color: if( style(--hy9wou-borderBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-borde-color), white calc(abs(var(--hy9wou-borderBtnHover)) * 1%)); style(--hy9wou-borderBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-border-color), black calc(abs(var(--hy9wou-borderBtnHover)) * 1%)); else: var(--omnise-btn-se-border-hover) ); } &.omnise-btn-te:hover{ color: if( style(--hy9wou-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-te-label-color), white calc(abs(var(--hy9wou-labelBtnHover)) * 1%)); style(--hy9wou-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-te-label-color), black calc(abs(var(--hy9wou-labelBtnHover)) * 1%)); else: var(--omnise-btn-te-label-hover) ); } span{ display: flex; font-size: var(--hy9wou-iconWidth); } svg { width: var(--hy9wou-iconWidth,20px); min-width: var(--hy9wou-iconWidth,20px); height: 100%; } @media(min-width: 767.79px) and (max-width: 1180px){ gap: var(--hy9wou-iconGap-tablet); &:not(.omnise-btn-te){ height: var(--omnise-btn-height-tablet, var(--omnise-btn-height)); } span{ font-size: var(--hy9wou-iconWidth-tablet, var(--hy9wou-iconWidth)); } svg { width: var(--hy9wou-iconWidth-tablet, var(--hy9wou-iconWidth, 20px)); min-width: var(--hy9wou-iconWidth-tablet, var(--hy9wou-iconWidth, 20px)); height: 100%; } } @media(max-width: 767px){ gap: var(--hy9wou-iconGap-mobile); &:not(.omnise-btn-te){ height: var(--omnise-btn-height-mobile, var(--omnise-btn-height)); } span{ font-size: var(--hy9wou-iconWidth-mobile, var(--hy9wou-iconWidth)); } svg { width: var(--hy9wou-iconWidth-mobile, var(--hy9wou-iconWidth, 20px)); min-width: var(--hy9wou-iconWidth-mobile, var(--hy9wou-iconWidth, 20px)); height: 100%; } } } &[omnise-btn-po="right"] { flex-direction: row-reverse; svg{ margin-right:0; } } }[data-bnode="omnise-3w55bt"].omnise-section { padding-top: 40px; padding-bottom: 40px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-3w55bt"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } @media (max-width: 767px) { [data-bnode="omnise-3w55bt"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } [data-bnode="omnise-3w55bt"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;    flex-direction: row;   flex-wrap: nowrap;              &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-3w55bt"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                    &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }   }  }  @media (max-width: 767px) {   [data-bnode="omnise-3w55bt"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                    &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }   }  }[data-bnode="omnise-2xg4wf"] { --2xg4wf-typography: h1; --2xg4wf-typography-tablet: h1; --2xg4wf-typography-mobile: h1; --omnise-h3-text-align-tablet: start; --omnise-h3-text-align-mobile: start; --omnise-h1-text-align: center; --omnise-h1-color: #05480d; --omnise-h1-font-weight: 700; }[data-bnode="omnise-2xg4wf"] { margin-top: var(--2xg4wf-margin-top, 0px); margin-right: var(--2xg4wf-margin-right, 0px); margin-bottom: var(--2xg4wf-margin-bottom, 0px); margin-left: var(--2xg4wf-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--2xg4wf-margin-top-tablet, 0px); margin-right: var(--2xg4wf-margin-right-tablet, 0px); margin-bottom: var(--2xg4wf-margin-bottom-tablet, 0px); margin-left: var(--2xg4wf-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--2xg4wf-margin-top-mobile, 0px); margin-right: var(--2xg4wf-margin-right-mobile, 0px); margin-bottom: var(--2xg4wf-margin-bottom-mobile, 0px); margin-left: var(--2xg4wf-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--2xg4wf-highlightColor,var(--omnise-p-color)); top: var(--2xg4wf-highlightTop, 100%); } }[data-bnode="omnise-tedcoi"].omnise-section { background: #004225; padding-top: 80px; padding-right: 32px; padding-bottom: 80px; padding-left: 32px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-tedcoi"].omnise-section { background: #004225; padding-top: 80px; padding-right: 32px; padding-bottom: 80px; padding-left: 32px; } } @media (max-width: 767px) { [data-bnode="omnise-tedcoi"].omnise-section { background: #004225; padding-top: 80px; padding-right: 32px; padding-bottom: 80px; padding-left: 32px; } } [data-bnode="omnise-tedcoi"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;       flex-wrap: nowrap;        gap: 48px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-tedcoi"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;              gap: 48px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-tedcoi"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;              gap: 48px;     }  }[data-bnode="omnise-nvznno"] { --nvznno-typography: h2; --nvznno-typography-tablet: h2; --nvznno-typography-mobile: h2; --omnise-h2-text-align: center; --omnise-h2-font-size-tablet: 32px; --omnise-h2-font-size-mobile: 28px; }[data-bnode="omnise-nvznno"] { margin-top: var(--nvznno-margin-top, 0px); margin-right: var(--nvznno-margin-right, 0px); margin-bottom: var(--nvznno-margin-bottom, 0px); margin-left: var(--nvznno-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--nvznno-margin-top-tablet, 0px); margin-right: var(--nvznno-margin-right-tablet, 0px); margin-bottom: var(--nvznno-margin-bottom-tablet, 0px); margin-left: var(--nvznno-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--nvznno-margin-top-mobile, 0px); margin-right: var(--nvznno-margin-right-mobile, 0px); margin-bottom: var(--nvznno-margin-bottom-mobile, 0px); margin-left: var(--nvznno-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--nvznno-highlightColor,var(--omnise-p-color)); top: var(--nvznno-highlightTop, 100%); } }[data-bnode="omnise-cptp8w"] { --cptp8w-columns: 4; --cptp8w-columns-tablet: 2; --cptp8w-columns-mobile: 1; --cptp8w-gap: 20px; --cptp8w-gap-tablet: 32px; --cptp8w-gap-mobile: 32px; --cptp8w-navType: true; --cptp8w-navType-tablet: true; --cptp8w-navType-mobile: true; --cptp8w-pagiType: false; --cptp8w-pagiType-tablet: false; --cptp8w-pagiType-mobile: false; --cptp8w-listType: grid; --cptp8w-listType-tablet: grid; --cptp8w-listType-mobile: grid; --cptp8w-stateNavigation: normal; --cptp8w-stateNavigation-tablet: normal; --cptp8w-stateNavigation-mobile: normal; --cptp8w-statePagination: normal; --cptp8w-statePagination-tablet: normal; --cptp8w-statePagination-mobile: normal; --cptp8w-stateNavigtion: normal; --cptp8w-stateNavigtion-tablet: normal; --cptp8w-stateNavigtion-mobile: normal; --cptp8w-columnsMobile-mobile: 1; } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-contlt"] { --omnise-h4-color: #A65959; --omnise-h4-text-align: center; --omnise-h4-font-weight: 700; } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-contlp"] { --omnise-p-text-align: justify; } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-item2a"] { --item2a-direction: row; } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-nbf990"] { --nbf990-width: 64px; --nbf990-imageRatio: 1/1; --nbf990-objFit: cover; --nbf990-borderColor: #000000; --nbf990-shadowColor: #000000; --nbf990-borderStyle: none; --nbf990-enableShadow: false; --nbf990-shadowVertical: 0px; --nbf990-shadowBlur: 0px; --nbf990-shadowTransparent: 0%; } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-duerge"] { --duerge-typography: h4; --omnise-h4-text-align: center; } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-vgrt0j"] { --vgrt0j-typography: p; --omnise-p-text-align: center; } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-tvpoc0"] { --tvpoc0-direction: column; --tvpoc0-structure: auto; --tvpoc0-align-items: center; --tvpoc0-gap: 6px; }[data-bnode="omnise-cptp8w"] { margin-top: var(--cptp8w-margin-top, 0px); margin-right: var(--cptp8w-margin-right, 0px); margin-bottom: var(--cptp8w-margin-bottom, 0px); margin-left: var(--cptp8w-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--cptp8w-margin-top-tablet, 0px); margin-right: var(--cptp8w-margin-right-tablet, 0px); margin-bottom: var(--cptp8w-margin-bottom-tablet, 0px); margin-left: var(--cptp8w-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--cptp8w-margin-top-mobile, 0px); margin-right: var(--cptp8w-margin-right-mobile, 0px); margin-bottom: var(--cptp8w-margin-bottom-mobile, 0px); margin-left: var(--cptp8w-margin-left-mobile, 0px); } &.omnise-content-list { .omnise-slider-item{ > .omnise-slot[data-bnode="be-ctl-item"]{ height: 100%; } } @media (min-width: 1180px) { & .omnise-slider-wrapper[data-desktop-layout="slider"]{ .omnise-slider-items { gap: var(--cptp8w-gap,var(--omnise-grid-gap, 20px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--cptp8w-gap,var(--omnise-grid-gap, 20px)) * (var(--cptp8w-columns, 3) - 1)) / var(--cptp8w-columns, 3)); &:last-child{ margin-right: var(--cptp8w-gap,var(--omnise-grid-gap, 20px)); } } } } & .omnise-slider-wrapper[data-desktop-layout="grid"]{ &[data-item="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--cptp8w-columns, 3), minmax(0, 1fr)); gap: var(--cptp8w-gap,var(--omnise-grid-gap, 20px)); .omnise-slider-item { min-width: 0; } } } } @media (min-width: 767.79px) and (max-width: 1180px) { & .omnise-slider-wrapper[data-tablet-layout="slider"]{ .omnise-slider-items { gap: var(--cptp8w-gap-tablet,var(--omnise-grid-gap-tablet, 20px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--cptp8w-gap-tablet,var(--omnise-grid-gap-tablet, 16px)) * (var(--cptp8w-columns-tablet, 3) - 1)) / var(--cptp8w-columns-tablet, 3)); &:last-child{ margin-right: var(--cptp8w-gap-tablet,var(--omnise-grid-gap-tablet, 16px)); } } } } & .omnise-slider-wrapper[data-tablet-layout="grid"]{ &[data-item-tablet="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--cptp8w-columns-tablet, 3), minmax(0, 1fr)); gap: var(--cptp8w-gap-tablet,var(--omnise-grid-gap-tablet, 16px)); .omnise-slider-item { min-width: 0; } } } } @media (max-width: 767px) { & .omnise-slider-wrapper[data-mobile-layout="slider"]{ .omnise-slider-items { gap: var(--cptp8w-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--cptp8w-gap-mobile,var(--omnise-grid-gap-mobile, 10px)) * (var(--cptp8w-columnsMobile-mobile, 1) - 1)) / var(--cptp8w-columnsMobile-mobile, 1)); &:last-child{ margin-right: var(--cptp8w-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); } } } } & .omnise-slider-wrapper[data-mobile-layout="grid"]{ &[data-item-mobile="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--cptp8w-columnsMobile-mobile, 1), minmax(0, 1fr)); gap: var(--cptp8w-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item { min-width: 0; } } } } /* Navigation & Pagination */ .omnise-slider-nav-left, .omnise-slider-nav-right { padding: var(--cptp8w-navPadding,12px); background:var(--cptp8w-navBg,#F5F5F5); color: var(--cptp8w-navColor,var(--omnise-text-color)); cursor: pointer; border-radius: var(--cptp8w-navRadius,50%); &:hover { background:var(--cptp8w-navBgHover,#CCCCCC); color: var(--cptp8w-navColorHover,var(--omnise-text-color)); } svg { width: var(--cptp8w-navIconSize,20px); height: var(--cptp8w-navIconSize,20px); } } & .omnise-slider-wrapper[data-pagination="dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--cptp8w-pagiBg,#E6E6E6); &.active { background:var(--cptp8w-pagiBgActive,#181818); } &:not(.active):hover { background:var(--cptp8w-pagiBgHover,#CCCCCC); } } & .omnise-slider-wrapper[data-pagination="numbers"] + .omnise-slider-controls .omnise-slider-pagination { color: var(--cptp8w-pagiColor,#e6e6e6); &.active { color:var(--cptp8w-pagiColorActive,#181818); } &:not(.active):hover { color: var(--cptp8w-pagiColorHover,#181818); } } & .omnise-slider-wrapper[data-pagination="counter"] + .omnise-slider-controls .omnise-slider-pagination-total { color: var(--cptp8w-pagiColor,#e6e6e6); } & .omnise-slider-wrapper[data-pagination="dynamic-dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--cptp8w-pagiBg,#E6E6E6); &.active { background: var(--cptp8w-pagiBgActive,#181818); opacity: 1; } &:not(.active):hover { background: var(--cptp8w-pagiBgHover,#CCCCCC); } } .omnise-slider-pagination-wrp{ margin-top: 20px; } } & .omnise-content-list-empty { min-height: 80px; display: flex; align-items: center; justify-content: center; background-color: #f0f0f0; color: #666; } & .omnise-content-list-empty button { padding: 12px; cursor: pointer; border: none; background: transparent; } & [data-bnode="be-ctl-item"] { min-height: 0; } & .be-ctl-item-empty { min-height: 60px; display: flex; align-items: center; justify-content: center; background-color: #f8f8f8; } } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-nbf990"] { margin-top: var(--nbf990-margin-top, 0px); margin-right: var(--nbf990-margin-right, 0px); margin-bottom: var(--nbf990-margin-bottom, 0px); margin-left: var(--nbf990-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--nbf990-margin-top-tablet, 0px); margin-right: var(--nbf990-margin-right-tablet, 0px); margin-bottom: var(--nbf990-margin-bottom-tablet, 0px); margin-left: var(--nbf990-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--nbf990-margin-top-mobile, 0px); margin-right: var(--nbf990-margin-right-mobile, 0px); margin-bottom: var(--nbf990-margin-bottom-mobile, 0px); margin-left: var(--nbf990-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--nbf990-width,100%) - var(--nbf990-margin-left,0px) - var(--nbf990-margin-right,0px)); width: calc(var(--nbf990-width,100%) - var(--nbf990-margin-left,0px) - var(--nbf990-margin-right,0px)); min-height: min-content; border-color: var(--nbf990-borderColor,var(--omnise-card-media-border-color)); border-style: var(--nbf990-borderStyle,solid); border-width: var(--nbf990-borderWidth-tl,var(--omnise-card-border-width)) var(--nbf990-borderWidth-tr,var(--omnise-card-border-width)) var(--nbf990-borderWidth-br,var(--omnise-card-border-width)) var(--nbf990-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--nbf990-borderRadius-tl,var(--omnise-card-border-radius)) var(--nbf990-borderRadius-tr,var(--omnise-card-border-radius)) var(--nbf990-borderRadius-br,var(--omnise-card-border-radius)) var(--nbf990-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--nbf990-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--nbf990-borderWidth-tl-tablet, var(--nbf990-borderWidth-tl,var(--omnise-card-border-width))) var(--nbf990-borderWidth-tr-tablet, var(--nbf990-borderWidth-tr,var(--omnise-card-border-width))) var(--nbf990-borderWidth-br-tablet, var(--nbf990-borderWidth-br,var(--omnise-card-border-width))) var(--nbf990-borderWidth-bl-tablet, var(--nbf990-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--nbf990-borderRadius-tl-tablet, var(--nbf990-borderRadius-tl,var(--omnise-card-border-radius))) var(--nbf990-borderRadius-tr-tablet, var(--nbf990-borderRadius-tr,var(--omnise-card-border-radius))) var(--nbf990-borderRadius-br-tablet, var(--nbf990-borderRadius-br,var(--omnise-card-border-radius))) var(--nbf990-borderRadius-bl-tablet, var(--nbf990-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--nbf990-borderWidth-tl-mobile, var(--nbf990-borderWidth-tl,var(--omnise-card-border-width))) var(--nbf990-borderWidth-tr-mobile, var(--nbf990-borderWidth-tr,var(--omnise-card-border-width))) var(--nbf990-borderWidth-br-mobile, var(--nbf990-borderWidth-br,var(--omnise-card-border-width))) var(--nbf990-borderWidth-bl-mobile, var(--nbf990-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--nbf990-borderRadius-tl-mobile, var(--nbf990-borderRadius-tl,var(--omnise-card-border-radius))) var(--nbf990-borderRadius-tr-mobile, var(--nbf990-borderRadius-tr,var(--omnise-card-border-radius))) var(--nbf990-borderRadius-br-mobile, var(--nbf990-borderRadius-br,var(--omnise-card-border-radius))) var(--nbf990-borderRadius-bl-mobile, var(--nbf990-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--nbf990-shadowHorizontal, var(--omnise-card-shadow-x)) var(--nbf990-shadowVertical, var(--omnise-card-shadow-y)) var(--nbf990-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--nbf990-shadowColor, var(--omnise-card-media-shadow-color)) var(--nbf990-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--nbf990-overlayColor-color, #000); opacity: var(--nbf990-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--nbf990-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--nbf990-width-tablet,var(--nbf990-width,100%)) - var(--nbf990-margin-left-tablet,var(--nbf990-margin-left,0px)) - var(--nbf990-margin-right-tablet,var(--nbf990-margin-right,0px))); width: calc(var(--nbf990-width-tablet,var(--nbf990-width,100%)) - var(--nbf990-margin-left-tablet,var(--nbf990-margin-left,0px)) - var(--nbf990-margin-right-tablet,var(--nbf990-margin-right,0px))); aspect-ratio: var(--nbf990-imageRatio-tablet, var(--nbf990-imageRatio, auto)); img { object-fit: var(--nbf990-objFit-tablet, var(--nbf990-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--nbf990-width-mobile,var(--nbf990-width,100%)) - var(--nbf990-margin-left-mobile,var(--nbf990-margin-left,0px)) - var(--nbf990-margin-right-mobile,var(--nbf990-margin-right,0px))); width: calc(var(--nbf990-width-mobile,var(--nbf990-width,100%)) - var(--nbf990-margin-left-mobile,var(--nbf990-margin-left,0px)) - var(--nbf990-margin-right-mobile,var(--nbf990-margin-right,0px))); aspect-ratio: var(--nbf990-imageRatio-mobile, var(--nbf990-imageRatio, auto)); img { object-fit: var(--nbf990-objFit-mobile, var(--nbf990-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-duerge"] { margin-top: var(--duerge-margin-top, 0px); margin-right: var(--duerge-margin-right, 0px); margin-bottom: var(--duerge-margin-bottom, 0px); margin-left: var(--duerge-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--duerge-margin-top-tablet, 0px); margin-right: var(--duerge-margin-right-tablet, 0px); margin-bottom: var(--duerge-margin-bottom-tablet, 0px); margin-left: var(--duerge-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--duerge-margin-top-mobile, 0px); margin-right: var(--duerge-margin-right-mobile, 0px); margin-bottom: var(--duerge-margin-bottom-mobile, 0px); margin-left: var(--duerge-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--duerge-highlightColor,var(--omnise-p-color)); top: var(--duerge-highlightTop, 100%); } } [data-bnode="omnise-cptp8w"] [data-bnode="omnise-vgrt0j"] { margin-top: var(--vgrt0j-margin-top, 0px); margin-right: var(--vgrt0j-margin-right, 0px); margin-bottom: var(--vgrt0j-margin-bottom, 0px); margin-left: var(--vgrt0j-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--vgrt0j-margin-top-tablet, 0px); margin-right: var(--vgrt0j-margin-right-tablet, 0px); margin-bottom: var(--vgrt0j-margin-bottom-tablet, 0px); margin-left: var(--vgrt0j-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--vgrt0j-margin-top-mobile, 0px); margin-right: var(--vgrt0j-margin-right-mobile, 0px); margin-bottom: var(--vgrt0j-margin-bottom-mobile, 0px); margin-left: var(--vgrt0j-margin-left-mobile, 0px); } }[data-bnode="omnise-cptp8w"] [data-bnode="be-ctl-item"] {   gap: 16px;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-cptp8w"] [data-bnode="be-ctl-item"] {    gap: 16px;   }  }  @media (max-width: 767px) {   [data-bnode="omnise-cptp8w"] [data-bnode="be-ctl-item"] {    gap: 16px;   }  }[data-bnode="omnise-cptp8w"] [data-bnode="be-ctl-item"] {        flex-wrap: nowrap;     align-items: center;   gap: 16px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-cptp8w"] [data-bnode="be-ctl-item"] {                gap: 16px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-cptp8w"] [data-bnode="be-ctl-item"] {                gap: 16px;     }  }[data-bnode="omnise-tvpoc0"] {        flex-wrap: nowrap;     align-items: center;   gap: 6px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-tvpoc0"] {                gap: 6px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-tvpoc0"] {                gap: 6px;     }  }[data-bnode="omnise-bojdui"].omnise-section { background: #004225; padding-top: 40px; padding-right: 30px; padding-bottom: 40px; padding-left: 30px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-bojdui"].omnise-section { background: #004225; padding-top: 40px; padding-right: 28px; padding-bottom: 40px; padding-left: 28px; } } @media (max-width: 767px) { [data-bnode="omnise-bojdui"].omnise-section { background: #004225; padding-top: 40px; padding-right: 16px; padding-bottom: 40px; padding-left: 16px; } } [data-bnode="omnise-bojdui"] > .omnise-section-container{     width: 100%;   max-width: 1600px;   height: fit-content;   margin: 0 auto;       flex-wrap: nowrap;        gap: 40px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-bojdui"] > .omnise-section-container{      width: 100%;   max-width: 1600px;   height: fit-content;   margin: 0 auto;              gap: 40px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-bojdui"] > .omnise-section-container{      width: 100%;   max-width: 1600px;   height: fit-content;   margin: 0 auto;              gap: 40px;     }  }[data-bnode="omnise-j5dobb"] {        flex-wrap: nowrap;     align-items: center;   gap: 12px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-j5dobb"] {                gap: 12px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-j5dobb"] {                gap: 12px;     }  }[data-bnode="omnise-x83hif"] { --omnise-eyebrow-font-size: 37px; --omnise-eyebrow-font-size-tablet: 14px; --omnise-eyebrow-font-size-mobile: 14px; --omnise-eyebrow-color: #F9F5F5; --omnise-eyebrow-font-family: IBM Plex Sans; --omnise-eyebrow-font-weight: 600; --omnise-eyebrow-line-height: 1.5; --omnise-eyebrow-line-height-tablet: 1.5; --omnise-eyebrow-line-height-mobile: 1.5; --omnise-eyebrow-letter-spacing: 0.14px; --omnise-eyebrow-letter-spacing-tablet: 0.14px; --omnise-eyebrow-letter-spacing-mobile: 0.14px; --omnise-eyebrow-text-transform: capitalize; --x83hif-typography: eyebrow; --x83hif-typography-tablet: eyebrow; --x83hif-typography-mobile: eyebrow; --omnise-eyebrow-text-align: center; }[data-bnode="omnise-x83hif"] { margin-top: var(--x83hif-margin-top, 0px); margin-right: var(--x83hif-margin-right, 0px); margin-bottom: var(--x83hif-margin-bottom, 0px); margin-left: var(--x83hif-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--x83hif-margin-top-tablet, 0px); margin-right: var(--x83hif-margin-right-tablet, 0px); margin-bottom: var(--x83hif-margin-bottom-tablet, 0px); margin-left: var(--x83hif-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--x83hif-margin-top-mobile, 0px); margin-right: var(--x83hif-margin-right-mobile, 0px); margin-bottom: var(--x83hif-margin-bottom-mobile, 0px); margin-left: var(--x83hif-margin-left-mobile, 0px); } }[data-bnode="omnise-plpmey"] { --omnise-h2-font-size-tablet: 32px; --omnise-h2-font-size-mobile: 30px; --omnise-h2-color: #F4F5FB; --omnise-h2-font-family: Poppins; --omnise-h2-font-weight: 400; --omnise-h2-line-height: 1.2; --omnise-h2-line-height-tablet: 1.2; --omnise-h2-line-height-mobile: 1.3; --omnise-h2-letter-spacing: -0.8px; --omnise-h2-letter-spacing-tablet: 0px; --omnise-h2-letter-spacing-mobile: 0px; --omnise-h2-text-transform: capitalize; --plpmey-typography: h2; --plpmey-typography-tablet: h2; --plpmey-typography-mobile: h2; --omnise-h2-text-align-mobile: center; --omnise-h2-text-align: start; --omnise-h2-font-size: 45px; }[data-bnode="omnise-plpmey"] { margin-top: var(--plpmey-margin-top, 0px); margin-right: var(--plpmey-margin-right, 0px); margin-bottom: var(--plpmey-margin-bottom, 0px); margin-left: var(--plpmey-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--plpmey-margin-top-tablet, 0px); margin-right: var(--plpmey-margin-right-tablet, 0px); margin-bottom: var(--plpmey-margin-bottom-tablet, 0px); margin-left: var(--plpmey-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--plpmey-margin-top-mobile, 0px); margin-right: var(--plpmey-margin-right-mobile, 0px); margin-bottom: var(--plpmey-margin-bottom-mobile, 0px); margin-left: var(--plpmey-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--plpmey-highlightColor,var(--omnise-p-color)); top: var(--plpmey-highlightTop, 100%); } }[data-bnode="omnise-lf7960"] { --lf7960-columns: 4.5; --lf7960-columns-tablet: 3.2; --lf7960-columns-mobile: 1; --lf7960-gap: 20px; --lf7960-gap-tablet: 12px; --lf7960-gap-mobile: 12px; --lf7960-navType: true; --lf7960-navType-tablet: true; --lf7960-navType-mobile: true; --lf7960-pagiType: false; --lf7960-pagiType-tablet: false; --lf7960-pagiType-mobile: false; --lf7960-listType: slider; --lf7960-listType-tablet: slider; --lf7960-listType-mobile: slider; --lf7960-stateNavigation: normal; --lf7960-stateNavigation-tablet: normal; --lf7960-stateNavigation-mobile: normal; --lf7960-statePagination: normal; --lf7960-statePagination-tablet: normal; --lf7960-statePagination-mobile: normal; --lf7960-stateNavigtion: normal; --lf7960-stateNavigtion-tablet: normal; --lf7960-stateNavigtion-mobile: normal; --lf7960-columnsMobile-mobile: 1; } [data-bnode="omnise-lf7960"] [data-bnode="omnise-contlt"] { --omnise-h4-color: #A65959; --omnise-h4-text-align: center; --omnise-h4-font-weight: 700; } [data-bnode="omnise-lf7960"] [data-bnode="omnise-contlp"] { --omnise-p-text-align: justify; } [data-bnode="omnise-lf7960"] [data-bnode="omnise-item2a"] { --item2a-direction: row; } [data-bnode="omnise-lf7960"] [data-bnode="omnise-mrldnm"] { --mrldnm-width: 100%; --mrldnm-imageRatio: 3/4; --mrldnm-objFit: cover; --mrldnm-borderColor: #000000; --mrldnm-shadowColor: #000000; --mrldnm-borderStyle: none; --mrldnm-enableShadow: false; --mrldnm-borderRadius-tl: 0px; --mrldnm-borderRadius-tr: 0px; --mrldnm-borderRadius-bl: 0px; --mrldnm-borderRadius-br: 0px; } [data-bnode="omnise-lf7960"] [data-bnode="omnise-t7xjbd"] { --omnise-h4-font-size: 20px; --omnise-h4-font-size-tablet: 22px; --omnise-h4-font-size-mobile: 20px; --omnise-h4-color: #F9F9FB; --omnise-h4-font-family: Poppins; --omnise-h4-font-weight: 400; --omnise-h4-line-height: 1.4; --omnise-h4-line-height-tablet: 1.4; --omnise-h4-line-height-mobile: 1.4; --omnise-h4-letter-spacing: -0.5px; --omnise-h4-letter-spacing-tablet: 0px; --omnise-h4-letter-spacing-mobile: 0px; --omnise-h4-text-transform: uppercase; --t7xjbd-typography: h4; --omnise-h4-text-align: start; } [data-bnode="omnise-lf7960"] [data-bnode="omnise-255ec1"] { --omnise-p-font-size: 16px; --omnise-p-font-size-tablet: 16px; --omnise-p-font-size-mobile: 16px; --omnise-p-color: #FEFBFB; --omnise-p-font-family: Instrument Sans; --omnise-p-font-weight: 400; --omnise-p-line-height: 1.5; --omnise-p-line-height-tablet: 1.5; --omnise-p-line-height-mobile: 1.5; --omnise-p-letter-spacing: 0px; --omnise-p-letter-spacing-tablet: 0px; --omnise-p-letter-spacing-mobile: 0px; --omnise-p-text-transform: none; --255ec1-typography: p; --omnise-p-text-align: start; } [data-bnode="omnise-lf7960"] [data-bnode="omnise-zyyp4p"] { --omnise-h4-font-size: 20px; --omnise-h4-font-size-tablet: 20px; --omnise-h4-font-size-mobile: 20px; --omnise-h4-color: #181818; --omnise-h4-font-family: Poppins; --omnise-h4-font-weight: 400; --omnise-h4-line-height: 1.4; --omnise-h4-line-height-tablet: 1.4; --omnise-h4-line-height-mobile: 1.4; --omnise-h4-letter-spacing: 0px; --omnise-h4-letter-spacing-tablet: 0px; --omnise-h4-letter-spacing-mobile: 0px; --omnise-h4-text-transform: capitalize; --zyyp4p-typography: h4; } [data-bnode="omnise-lf7960"] [data-bnode="omnise-jhc5up"] { --jhc5up-direction: column; --jhc5up-structure: columns; --jhc5up-gap: 12px; --jhc5up-padding-top: 0px; --jhc5up-padding-right: 24px; --jhc5up-padding-bottom: 0px; --jhc5up-padding-left: 24px; --jhc5up-position: relative; }[data-bnode="omnise-lf7960"] { margin-top: var(--lf7960-margin-top, 0px); margin-right: var(--lf7960-margin-right, 0px); margin-bottom: var(--lf7960-margin-bottom, 0px); margin-left: var(--lf7960-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--lf7960-margin-top-tablet, 0px); margin-right: var(--lf7960-margin-right-tablet, 0px); margin-bottom: var(--lf7960-margin-bottom-tablet, 0px); margin-left: var(--lf7960-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--lf7960-margin-top-mobile, 0px); margin-right: var(--lf7960-margin-right-mobile, 0px); margin-bottom: var(--lf7960-margin-bottom-mobile, 0px); margin-left: var(--lf7960-margin-left-mobile, 0px); } &.omnise-content-list { .omnise-slider-item{ > .omnise-slot[data-bnode="be-ctl-item"]{ height: 100%; } } @media (min-width: 1180px) { & .omnise-slider-wrapper[data-desktop-layout="slider"]{ .omnise-slider-items { gap: var(--lf7960-gap,var(--omnise-grid-gap, 20px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--lf7960-gap,var(--omnise-grid-gap, 20px)) * (var(--lf7960-columns, 3) - 1)) / var(--lf7960-columns, 3)); &:last-child{ margin-right: var(--lf7960-gap,var(--omnise-grid-gap, 20px)); } } } } & .omnise-slider-wrapper[data-desktop-layout="grid"]{ &[data-item="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--lf7960-columns, 3), minmax(0, 1fr)); gap: var(--lf7960-gap,var(--omnise-grid-gap, 20px)); .omnise-slider-item { min-width: 0; } } } } @media (min-width: 767.79px) and (max-width: 1180px) { & .omnise-slider-wrapper[data-tablet-layout="slider"]{ .omnise-slider-items { gap: var(--lf7960-gap-tablet,var(--omnise-grid-gap-tablet, 20px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--lf7960-gap-tablet,var(--omnise-grid-gap-tablet, 16px)) * (var(--lf7960-columns-tablet, 3) - 1)) / var(--lf7960-columns-tablet, 3)); &:last-child{ margin-right: var(--lf7960-gap-tablet,var(--omnise-grid-gap-tablet, 16px)); } } } } & .omnise-slider-wrapper[data-tablet-layout="grid"]{ &[data-item-tablet="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--lf7960-columns-tablet, 3), minmax(0, 1fr)); gap: var(--lf7960-gap-tablet,var(--omnise-grid-gap-tablet, 16px)); .omnise-slider-item { min-width: 0; } } } } @media (max-width: 767px) { & .omnise-slider-wrapper[data-mobile-layout="slider"]{ .omnise-slider-items { gap: var(--lf7960-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--lf7960-gap-mobile,var(--omnise-grid-gap-mobile, 10px)) * (var(--lf7960-columnsMobile-mobile, 1) - 1)) / var(--lf7960-columnsMobile-mobile, 1)); &:last-child{ margin-right: var(--lf7960-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); } } } } & .omnise-slider-wrapper[data-mobile-layout="grid"]{ &[data-item-mobile="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--lf7960-columnsMobile-mobile, 1), minmax(0, 1fr)); gap: var(--lf7960-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item { min-width: 0; } } } } /* Navigation & Pagination */ .omnise-slider-nav-left, .omnise-slider-nav-right { padding: var(--lf7960-navPadding,12px); background:var(--lf7960-navBg,#F5F5F5); color: var(--lf7960-navColor,var(--omnise-text-color)); cursor: pointer; border-radius: var(--lf7960-navRadius,50%); &:hover { background:var(--lf7960-navBgHover,#CCCCCC); color: var(--lf7960-navColorHover,var(--omnise-text-color)); } svg { width: var(--lf7960-navIconSize,20px); height: var(--lf7960-navIconSize,20px); } } & .omnise-slider-wrapper[data-pagination="dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--lf7960-pagiBg,#E6E6E6); &.active { background:var(--lf7960-pagiBgActive,#181818); } &:not(.active):hover { background:var(--lf7960-pagiBgHover,#CCCCCC); } } & .omnise-slider-wrapper[data-pagination="numbers"] + .omnise-slider-controls .omnise-slider-pagination { color: var(--lf7960-pagiColor,#e6e6e6); &.active { color:var(--lf7960-pagiColorActive,#181818); } &:not(.active):hover { color: var(--lf7960-pagiColorHover,#181818); } } & .omnise-slider-wrapper[data-pagination="counter"] + .omnise-slider-controls .omnise-slider-pagination-total { color: var(--lf7960-pagiColor,#e6e6e6); } & .omnise-slider-wrapper[data-pagination="dynamic-dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--lf7960-pagiBg,#E6E6E6); &.active { background: var(--lf7960-pagiBgActive,#181818); opacity: 1; } &:not(.active):hover { background: var(--lf7960-pagiBgHover,#CCCCCC); } } .omnise-slider-pagination-wrp{ margin-top: 20px; } } & .omnise-content-list-empty { min-height: 80px; display: flex; align-items: center; justify-content: center; background-color: #f0f0f0; color: #666; } & .omnise-content-list-empty button { padding: 12px; cursor: pointer; border: none; background: transparent; } & [data-bnode="be-ctl-item"] { min-height: 0; } & .be-ctl-item-empty { min-height: 60px; display: flex; align-items: center; justify-content: center; background-color: #f8f8f8; } } [data-bnode="omnise-lf7960"] [data-bnode="omnise-mrldnm"] { margin-top: var(--mrldnm-margin-top, 0px); margin-right: var(--mrldnm-margin-right, 0px); margin-bottom: var(--mrldnm-margin-bottom, 0px); margin-left: var(--mrldnm-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--mrldnm-margin-top-tablet, 0px); margin-right: var(--mrldnm-margin-right-tablet, 0px); margin-bottom: var(--mrldnm-margin-bottom-tablet, 0px); margin-left: var(--mrldnm-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--mrldnm-margin-top-mobile, 0px); margin-right: var(--mrldnm-margin-right-mobile, 0px); margin-bottom: var(--mrldnm-margin-bottom-mobile, 0px); margin-left: var(--mrldnm-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--mrldnm-width,100%) - var(--mrldnm-margin-left,0px) - var(--mrldnm-margin-right,0px)); width: calc(var(--mrldnm-width,100%) - var(--mrldnm-margin-left,0px) - var(--mrldnm-margin-right,0px)); min-height: min-content; border-color: var(--mrldnm-borderColor,var(--omnise-card-media-border-color)); border-style: var(--mrldnm-borderStyle,solid); border-width: var(--mrldnm-borderWidth-tl,var(--omnise-card-border-width)) var(--mrldnm-borderWidth-tr,var(--omnise-card-border-width)) var(--mrldnm-borderWidth-br,var(--omnise-card-border-width)) var(--mrldnm-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--mrldnm-borderRadius-tl,var(--omnise-card-border-radius)) var(--mrldnm-borderRadius-tr,var(--omnise-card-border-radius)) var(--mrldnm-borderRadius-br,var(--omnise-card-border-radius)) var(--mrldnm-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--mrldnm-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--mrldnm-borderWidth-tl-tablet, var(--mrldnm-borderWidth-tl,var(--omnise-card-border-width))) var(--mrldnm-borderWidth-tr-tablet, var(--mrldnm-borderWidth-tr,var(--omnise-card-border-width))) var(--mrldnm-borderWidth-br-tablet, var(--mrldnm-borderWidth-br,var(--omnise-card-border-width))) var(--mrldnm-borderWidth-bl-tablet, var(--mrldnm-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--mrldnm-borderRadius-tl-tablet, var(--mrldnm-borderRadius-tl,var(--omnise-card-border-radius))) var(--mrldnm-borderRadius-tr-tablet, var(--mrldnm-borderRadius-tr,var(--omnise-card-border-radius))) var(--mrldnm-borderRadius-br-tablet, var(--mrldnm-borderRadius-br,var(--omnise-card-border-radius))) var(--mrldnm-borderRadius-bl-tablet, var(--mrldnm-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--mrldnm-borderWidth-tl-mobile, var(--mrldnm-borderWidth-tl,var(--omnise-card-border-width))) var(--mrldnm-borderWidth-tr-mobile, var(--mrldnm-borderWidth-tr,var(--omnise-card-border-width))) var(--mrldnm-borderWidth-br-mobile, var(--mrldnm-borderWidth-br,var(--omnise-card-border-width))) var(--mrldnm-borderWidth-bl-mobile, var(--mrldnm-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--mrldnm-borderRadius-tl-mobile, var(--mrldnm-borderRadius-tl,var(--omnise-card-border-radius))) var(--mrldnm-borderRadius-tr-mobile, var(--mrldnm-borderRadius-tr,var(--omnise-card-border-radius))) var(--mrldnm-borderRadius-br-mobile, var(--mrldnm-borderRadius-br,var(--omnise-card-border-radius))) var(--mrldnm-borderRadius-bl-mobile, var(--mrldnm-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--mrldnm-shadowHorizontal, var(--omnise-card-shadow-x)) var(--mrldnm-shadowVertical, var(--omnise-card-shadow-y)) var(--mrldnm-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--mrldnm-shadowColor, var(--omnise-card-media-shadow-color)) var(--mrldnm-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--mrldnm-overlayColor-color, #000); opacity: var(--mrldnm-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--mrldnm-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--mrldnm-width-tablet,var(--mrldnm-width,100%)) - var(--mrldnm-margin-left-tablet,var(--mrldnm-margin-left,0px)) - var(--mrldnm-margin-right-tablet,var(--mrldnm-margin-right,0px))); width: calc(var(--mrldnm-width-tablet,var(--mrldnm-width,100%)) - var(--mrldnm-margin-left-tablet,var(--mrldnm-margin-left,0px)) - var(--mrldnm-margin-right-tablet,var(--mrldnm-margin-right,0px))); aspect-ratio: var(--mrldnm-imageRatio-tablet, var(--mrldnm-imageRatio, auto)); img { object-fit: var(--mrldnm-objFit-tablet, var(--mrldnm-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--mrldnm-width-mobile,var(--mrldnm-width,100%)) - var(--mrldnm-margin-left-mobile,var(--mrldnm-margin-left,0px)) - var(--mrldnm-margin-right-mobile,var(--mrldnm-margin-right,0px))); width: calc(var(--mrldnm-width-mobile,var(--mrldnm-width,100%)) - var(--mrldnm-margin-left-mobile,var(--mrldnm-margin-left,0px)) - var(--mrldnm-margin-right-mobile,var(--mrldnm-margin-right,0px))); aspect-ratio: var(--mrldnm-imageRatio-mobile, var(--mrldnm-imageRatio, auto)); img { object-fit: var(--mrldnm-objFit-mobile, var(--mrldnm-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } } [data-bnode="omnise-lf7960"] [data-bnode="omnise-azdd7r"] { margin-top: var(--azdd7r-margin-top, 0px); margin-right: var(--azdd7r-margin-right, 0px); margin-bottom: var(--azdd7r-margin-bottom, 0px); margin-left: var(--azdd7r-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--azdd7r-margin-top-tablet, 0px); margin-right: var(--azdd7r-margin-right-tablet, 0px); margin-bottom: var(--azdd7r-margin-bottom-tablet, 0px); margin-left: var(--azdd7r-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--azdd7r-margin-top-mobile, 0px); margin-right: var(--azdd7r-margin-right-mobile, 0px); margin-bottom: var(--azdd7r-margin-bottom-mobile, 0px); margin-left: var(--azdd7r-margin-left-mobile, 0px); } } [data-bnode="omnise-lf7960"] [data-bnode="omnise-t7xjbd"] { margin-top: var(--t7xjbd-margin-top, 0px); margin-right: var(--t7xjbd-margin-right, 0px); margin-bottom: var(--t7xjbd-margin-bottom, 0px); margin-left: var(--t7xjbd-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--t7xjbd-margin-top-tablet, 0px); margin-right: var(--t7xjbd-margin-right-tablet, 0px); margin-bottom: var(--t7xjbd-margin-bottom-tablet, 0px); margin-left: var(--t7xjbd-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--t7xjbd-margin-top-mobile, 0px); margin-right: var(--t7xjbd-margin-right-mobile, 0px); margin-bottom: var(--t7xjbd-margin-bottom-mobile, 0px); margin-left: var(--t7xjbd-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--t7xjbd-highlightColor,var(--omnise-p-color)); top: var(--t7xjbd-highlightTop, 100%); } } [data-bnode="omnise-lf7960"] [data-bnode="omnise-255ec1"] { margin-top: var(--255ec1-margin-top, 0px); margin-right: var(--255ec1-margin-right, 0px); margin-bottom: var(--255ec1-margin-bottom, 0px); margin-left: var(--255ec1-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--255ec1-margin-top-tablet, 0px); margin-right: var(--255ec1-margin-right-tablet, 0px); margin-bottom: var(--255ec1-margin-bottom-tablet, 0px); margin-left: var(--255ec1-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--255ec1-margin-top-mobile, 0px); margin-right: var(--255ec1-margin-right-mobile, 0px); margin-bottom: var(--255ec1-margin-bottom-mobile, 0px); margin-left: var(--255ec1-margin-left-mobile, 0px); } }[data-bnode="omnise-lf7960"] [data-bnode="be-ctl-item"] {   gap: 28px;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-lf7960"] [data-bnode="be-ctl-item"] {    gap: 28px;   }  }  @media (max-width: 767px) {   [data-bnode="omnise-lf7960"] [data-bnode="be-ctl-item"] {    gap: 28px;   }  }[data-bnode="omnise-lf7960"] [data-bnode="be-ctl-item"] {        flex-wrap: nowrap;        gap: 28px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-lf7960"] [data-bnode="be-ctl-item"] {                gap: 28px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-lf7960"] [data-bnode="be-ctl-item"] {                gap: 28px;     }  }[data-bnode="omnise-jhc5up"] { padding-top: 0px; padding-right: 24px; padding-bottom: 0px; padding-left: 24px; } [data-bnode="omnise-jhc5up"] {        flex-wrap: nowrap;        gap: 12px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-jhc5up"] {                gap: 12px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-jhc5up"] {                gap: 12px;     }  }[data-bnode="omnise-pna6sa"] { --pna6sa-typography: p; --pna6sa-typography-tablet: p; --pna6sa-typography-mobile: p; --omnise-p-text-align: center; --omnise-p-color: #ffffff; }[data-bnode="omnise-pna6sa"] { margin-top: var(--pna6sa-margin-top, 0px); margin-right: var(--pna6sa-margin-right, 0px); margin-bottom: var(--pna6sa-margin-bottom, 0px); margin-left: var(--pna6sa-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--pna6sa-margin-top-tablet, 0px); margin-right: var(--pna6sa-margin-right-tablet, 0px); margin-bottom: var(--pna6sa-margin-bottom-tablet, 0px); margin-left: var(--pna6sa-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--pna6sa-margin-top-mobile, 0px); margin-right: var(--pna6sa-margin-right-mobile, 0px); margin-bottom: var(--pna6sa-margin-bottom-mobile, 0px); margin-left: var(--pna6sa-margin-left-mobile, 0px); } }[data-bnode="omnise-la1ujb"].omnise-section { padding-top: 40px; padding-bottom: 40px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-la1ujb"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } @media (max-width: 767px) { [data-bnode="omnise-la1ujb"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } [data-bnode="omnise-la1ujb"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;    flex-direction: row;   flex-wrap: nowrap;              &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-la1ujb"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                    &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }   }  }  @media (max-width: 767px) {   [data-bnode="omnise-la1ujb"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                    &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }   }  }[data-bnode="omnise-inobew"] { --inobew-typography: h1; --inobew-typography-tablet: h1; --inobew-typography-mobile: h1; --omnise-h3-text-align-tablet: start; --omnise-h3-text-align-mobile: start; --omnise-h1-text-align: center; --omnise-h1-color: #05480d; --omnise-h1-font-weight: 700; }[data-bnode="omnise-inobew"] { margin-top: var(--inobew-margin-top, 0px); margin-right: var(--inobew-margin-right, 0px); margin-bottom: var(--inobew-margin-bottom, 0px); margin-left: var(--inobew-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--inobew-margin-top-tablet, 0px); margin-right: var(--inobew-margin-right-tablet, 0px); margin-bottom: var(--inobew-margin-bottom-tablet, 0px); margin-left: var(--inobew-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--inobew-margin-top-mobile, 0px); margin-right: var(--inobew-margin-right-mobile, 0px); margin-bottom: var(--inobew-margin-bottom-mobile, 0px); margin-left: var(--inobew-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--inobew-highlightColor,var(--omnise-p-color)); top: var(--inobew-highlightTop, 100%); } }[data-bnode="omnise-1kzyou"].omnise-section { padding-top: 56px; padding-right: 32px; padding-bottom: 56px; padding-left: 32px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-1kzyou"].omnise-section { padding-top: 56px; padding-right: 32px; padding-bottom: 56px; padding-left: 32px; } } @media (max-width: 767px) { [data-bnode="omnise-1kzyou"].omnise-section { padding-top: 56px; padding-right: 32px; padding-bottom: 56px; padding-left: 32px; } } [data-bnode="omnise-1kzyou"] > .omnise-section-container{     width: 100%;   max-width: 1400px;   height: fit-content;   margin: 0 auto;       flex-wrap: nowrap;            }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-1kzyou"] > .omnise-section-container{      width: 100%;   max-width: 1400px;   height: fit-content;   margin: 0 auto;                   }  }  @media (max-width: 767px) {   [data-bnode="omnise-1kzyou"] > .omnise-section-container{      width: 100%;   max-width: 1400px;   height: fit-content;   margin: 0 auto;              gap: 20px;     }  }[data-bnode="omnise-4e71yv"] {        flex-wrap: nowrap;     align-items: center;       }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-4e71yv"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-4e71yv"] {                     }  }[data-bnode="omnise-nbzcgp"] { --omnise-p-text-align-tablet: start; --omnise-p-text-align-mobile: start; --nbzcgp-typography: p; --nbzcgp-typography-tablet: p; --nbzcgp-typography-mobile: p; --omnise-p-text-align: start; --nbzcgp-gap: 16px; --nbzcgp-gap-tablet: 16px; --nbzcgp-gap-mobile: 4px; --nbzcgp-iconSize: 17px; --nbzcgp-iconSize-tablet: 17px; --nbzcgp-iconSize-mobile: 17px; }[data-bnode="omnise-nbzcgp"] { margin-top: var(--nbzcgp-margin-top, 0px); margin-right: var(--nbzcgp-margin-right, 0px); margin-bottom: var(--nbzcgp-margin-bottom, 0px); margin-left: var(--nbzcgp-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--nbzcgp-margin-top-tablet, 0px); margin-right: var(--nbzcgp-margin-right-tablet, 0px); margin-bottom: var(--nbzcgp-margin-bottom-tablet, 0px); margin-left: var(--nbzcgp-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--nbzcgp-margin-top-mobile, 0px); margin-right: var(--nbzcgp-margin-right-mobile, 0px); margin-bottom: var(--nbzcgp-margin-bottom-mobile, 0px); margin-left: var(--nbzcgp-margin-left-mobile, 0px); } &.omnise-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; justify-content: var(--nbzcgp-justify-content, flex-start); gap: var(--nbzcgp-gap, 8px); } &.omnise-p { justify-content: if( style(--omnise-p-text-align: center): center; style(--omnise-p-text-align: end): flex-end; else: var(--nbzcgp-justify-content, flex-start) ); } &.omnise-p2 { justify-content: if( style(--omnise-p2-text-align: center): center; style(--omnise-p2-text-align: end): flex-end; else: var(--nbzcgp-justify-content, flex-start) ); } &.omnise-p3 { justify-content: if( style(--omnise-p3-text-align: center): center; style(--omnise-p3-text-align: end): flex-end; else: var(--nbzcgp-justify-content, flex-start) ); } &.omnise-eyebrow { justify-content: if( style(--omnise-eyebrow-text-align: center): center; style(--omnise-eyebrow-text-align: end): flex-end; else: var(--nbzcgp-justify-content, flex-start) ); } & .omnise-breadcrumb-item, & .omnise-breadcrumb-separator { display: inline-flex; align-items: center; min-width: 0; } & .omnise-breadcrumb-item { color: inherit; text-decoration: none; } & .omnise-breadcrumb-current { opacity: 0.72; } & .omnise-breadcrumb-separator svg { width: var(--nbzcgp-iconSize, 16px); height: var(--nbzcgp-iconSize, 16px); } @media (min-width: 767.79px) and (max-width: 1180px) { &.omnise-breadcrumb { gap: var(--nbzcgp-gap-tablet, var(--nbzcgp-gap, 8px)); } &.omnise-p { justify-content: if( style(--omnise-p-text-align-tablet: center): center; style(--omnise-p-text-align-tablet: end): flex-end; else: var(--nbzcgp-justify-content-tablet, var(--nbzcgp-justify-content, flex-start)) ); } &.omnise-p2 { justify-content: if( style(--omnise-p2-text-align-tablet: center): center; style(--omnise-p2-text-align-tablet: end): flex-end; else: var(--nbzcgp-justify-content-tablet, var(--nbzcgp-justify-content, flex-start)) ); } &.omnise-p3 { justify-content: if( style(--omnise-p3-text-align-tablet: center): center; style(--omnise-p3-text-align-tablet: end): flex-end; else: var(--nbzcgp-justify-content-tablet, var(--nbzcgp-justify-content, flex-start)) ); } &.omnise-eyebrow { justify-content: if( style(--omnise-eyebrow-text-align-tablet: center): center; style(--omnise-eyebrow-text-align-tablet: end): flex-end; else: var(--nbzcgp-justify-content-tablet, var(--nbzcgp-justify-content, flex-start)) ); } & .omnise-breadcrumb-separator svg { width: var(--nbzcgp-iconSize-tablet, var(--nbzcgp-iconSize, 16px)); height: var(--nbzcgp-iconSize-tablet, var(--nbzcgp-iconSize, 16px)); } } @media (max-width: 767px) { &.omnise-breadcrumb { gap: var(--nbzcgp-gap-mobile, var(--nbzcgp-gap-tablet, var(--nbzcgp-gap, 8px))); } &.omnise-p { justify-content: if( style(--omnise-p-text-align-mobile: center): center; style(--omnise-p-text-align-mobile: end): flex-end; else: var(--nbzcgp-justify-content-mobile, var(--nbzcgp-justify-content-tablet, var(--nbzcgp-justify-content, flex-start))) ); } &.omnise-p2 { justify-content: if( style(--omnise-p2-text-align-mobile: center): center; style(--omnise-p2-text-align-mobile: end): flex-end; else: var(--nbzcgp-justify-content-mobile, var(--nbzcgp-justify-content-tablet, var(--nbzcgp-justify-content, flex-start))) ); } &.omnise-p3 { justify-content: if( style(--omnise-p3-text-align-mobile: center): center; style(--omnise-p3-text-align-mobile: end): flex-end; else: var(--nbzcgp-justify-content-mobile, var(--nbzcgp-justify-content-tablet, var(--nbzcgp-justify-content, flex-start))) ); } &.omnise-eyebrow { justify-content: if( style(--omnise-eyebrow-text-align-mobile: center): center; style(--omnise-eyebrow-text-align-mobile: end): flex-end; else: var(--nbzcgp-justify-content-mobile, var(--nbzcgp-justify-content-tablet, var(--nbzcgp-justify-content, flex-start))) ); } & .omnise-breadcrumb-separator svg { width: var(--nbzcgp-iconSize-mobile, var(--nbzcgp-iconSize-tablet, var(--nbzcgp-iconSize, 16px))); height: var(--nbzcgp-iconSize-mobile, var(--nbzcgp-iconSize-tablet, var(--nbzcgp-iconSize, 16px))); } } }[data-bnode="omnise-y0e1q1"] {     flex-direction: row;   flex-wrap: nowrap;     align-items: flex-start;   gap: 24px;      &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index="1"] {     flex-basis: calc(75.00% - 0px - 0px);    }    &>.omnise-slot[data-bnode-index="2"] {     flex-basis: calc(25.00% - 0px - 0px);    }    &>.omnise-slot[data-bnode-index="3"] {     flex-basis: calc(100% - 0px - 0px);    }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-y0e1q1"] {      flex-direction: column;          gap: 24px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-y0e1q1"] {      flex-direction: column;          gap: 20px;     }  }[data-bnode="omnise-1yxm5d"] {        flex-wrap: nowrap;        gap: 24px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-1yxm5d"] {                gap: 24px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-1yxm5d"] {                gap: 32px;     }  }[data-bnode="omnise-5kcif2"] {     flex-direction: row;   flex-wrap: nowrap;     align-items: flex-start;   gap: 40px;      &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index="1"] {     flex-basis: calc(66.66% - 0px - 0px);    }    &>.omnise-slot[data-bnode-index="2"] {     flex-basis: calc(33.33% - 0px - 0px);    }    &>.omnise-slot[data-bnode-index="3"] {     flex-basis: calc(100% - 0px - 0px);    }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-5kcif2"] {      flex-direction: column;          gap: 40px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-5kcif2"] {      flex-direction: column;          gap: 40px;     }  }[data-bnode="omnise-a9fm9c"] {   position: sticky; top: 20px; z-index: 10;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-a9fm9c"] {    position: relative; top: auto;   }  }  @media (max-width: 767px) {   [data-bnode="omnise-a9fm9c"] {    position: relative; top: auto;   }  } [data-bnode="omnise-a9fm9c"] {        flex-wrap: nowrap;            }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-a9fm9c"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-a9fm9c"] {                     }  }[data-bnode="omnise-ttqo3x"] { --ttqo3x-media: main; --ttqo3x-media-tablet: main; --ttqo3x-media-mobile: main; --ttqo3x-effect: fade; --ttqo3x-effect-tablet: fade; --ttqo3x-effect-mobile: fade; --ttqo3x-imageRatioMain: 1/1; --ttqo3x-imageRatioMain-tablet: 1/1; --ttqo3x-imageRatioMain-mobile: 1/1; --ttqo3x-positionThumb: left; --ttqo3x-positionThumb-tablet: bottom; --ttqo3x-positionThumb-mobile: bottom; --ttqo3x-widthItemThumbs: 60px; --ttqo3x-widthItemThumbs-tablet: 80px; --ttqo3x-widthItemThumbs-mobile: 64px; --ttqo3x-imageRatioThumbs: 1/1; --ttqo3x-imageRatioThumbs-tablet: 1/1; --ttqo3x-imageRatioThumbs-mobile: 1/1; --ttqo3x-borderStyleThumbs: solid; --ttqo3x-borderStyleThumbs-tablet: solid; --ttqo3x-borderStyleThumbs-mobile: solid; --ttqo3x-borderColorThumbs: var(--omnise-heading-color); --ttqo3x-borderColorThumbs-tablet: var(--omnise-heading-color); --ttqo3x-borderColorThumbs-mobile: var(--omnise-heading-color); --ttqo3x-borderWidthThumbs-tl: 1px; --ttqo3x-borderWidthThumbs-tl-tablet: 1px; --ttqo3x-borderWidthThumbs-tl-mobile: 1px; --ttqo3x-borderWidthThumbs-tr: 1px; --ttqo3x-borderWidthThumbs-tr-tablet: 1px; --ttqo3x-borderWidthThumbs-tr-mobile: 1px; --ttqo3x-borderWidthThumbs-bl: 1px; --ttqo3x-borderWidthThumbs-bl-tablet: 1px; --ttqo3x-borderWidthThumbs-bl-mobile: 1px; --ttqo3x-borderWidthThumbs-br: 1px; --ttqo3x-borderWidthThumbs-br-tablet: 1px; --ttqo3x-borderWidthThumbs-br-mobile: 1px; --ttqo3x-borderRadiusThumbs-tl: 8px; --ttqo3x-borderRadiusThumbs-tl-tablet: 8px; --ttqo3x-borderRadiusThumbs-tl-mobile: 8px; --ttqo3x-borderRadiusThumbs-tr: 8px; --ttqo3x-borderRadiusThumbs-tr-tablet: 8px; --ttqo3x-borderRadiusThumbs-tr-mobile: 8px; --ttqo3x-borderRadiusThumbs-bl: 8px; --ttqo3x-borderRadiusThumbs-bl-tablet: 8px; --ttqo3x-borderRadiusThumbs-bl-mobile: 8px; --ttqo3x-borderRadiusThumbs-br: 8px; --ttqo3x-borderRadiusThumbs-br-tablet: 8px; --ttqo3x-borderRadiusThumbs-br-mobile: 8px; --ttqo3x-borderRadiusMain-tl: 8px; --ttqo3x-borderRadiusMain-tl-tablet: 8px; --ttqo3x-borderRadiusMain-tl-mobile: 8px; --ttqo3x-borderRadiusMain-tr: 8px; --ttqo3x-borderRadiusMain-tr-tablet: 8px; --ttqo3x-borderRadiusMain-tr-mobile: 8px; --ttqo3x-borderRadiusMain-bl: 8px; --ttqo3x-borderRadiusMain-bl-tablet: 8px; --ttqo3x-borderRadiusMain-bl-mobile: 8px; --ttqo3x-borderRadiusMain-br: 8px; --ttqo3x-borderRadiusMain-br-tablet: 8px; --ttqo3x-borderRadiusMain-br-mobile: 8px; --ttqo3x-gapItemThumbs: 6px; --ttqo3x-gapItemThumbs-tablet: 6px; --ttqo3x-gapItemThumbs-mobile: 6px; --ttqo3x-gap-mobile: 8px; }[data-bnode="omnise-ttqo3x"] { margin-top: var(--ttqo3x-margin-top, 0px); margin-right: var(--ttqo3x-margin-right, 0px); margin-bottom: var(--ttqo3x-margin-bottom, 0px); margin-left: var(--ttqo3x-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--ttqo3x-margin-top-tablet, 0px); margin-right: var(--ttqo3x-margin-right-tablet, 0px); margin-bottom: var(--ttqo3x-margin-bottom-tablet, 0px); margin-left: var(--ttqo3x-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--ttqo3x-margin-top-mobile, 0px); margin-right: var(--ttqo3x-margin-right-mobile, 0px); margin-bottom: var(--ttqo3x-margin-bottom-mobile, 0px); margin-left: var(--ttqo3x-margin-left-mobile, 0px); } & { max-width:100%; .omnise-media-product { display: flex; gap: var(--ttqo3x-gap, 16px); width: 100%; .omnise-main-slider-wrap { width: 100%; height: fit-content; overflow: hidden; } } .omnise-product-media-main[data-effect="fade"] { width: 100%; height: fit-content; border-style: var(--ttqo3x-borderStyleMain, solid); border-color: var(--ttqo3x-borderColorMain, #000000); border-width: var(--ttqo3x-borderWidthMain-tl, 0px) var(--ttqo3x-borderWidthMain-tr, 0px) var(--ttqo3x-borderWidthMain-br, 0px) var(--ttqo3x-borderWidthMain-bl, 0px); border-radius: var(--ttqo3x-borderRadiusMain-tl, 0px) var(--ttqo3x-borderRadiusMain-tr, 0px) var(--ttqo3x-borderRadiusMain-br, 0px) var(--ttqo3x-borderRadiusMain-bl, 0px); overflow: hidden; @media (min-width: 768px) and (max-width: 1180px) { border-width: var(--ttqo3x-borderWidthMain-tl-tablet, 0px) var(--ttqo3x-borderWidthMain-tr-tablet, 0px) var(--ttqo3x-borderWidthMain-br-tablet, 0px) var(--ttqo3x-borderWidthMain-bl-tablet, 0px); border-radius: var(--ttqo3x-borderRadiusMain-tl-tablet, 0px) var(--ttqo3x-borderRadiusMain-tr-tablet, 0px) var(--ttqo3x-borderRadiusMain-br-tablet, 0px) var(--ttqo3x-borderRadiusMain-bl-tablet, 0px); } @media (max-width: 767px) { border-width: var(--ttqo3x-borderWidthMain-tl-mobile, 0px) var(--ttqo3x-borderWidthMain-tr-mobile, 0px) var(--ttqo3x-borderWidthMain-br-mobile, 0px) var(--ttqo3x-borderWidthMain-bl-mobile, 0px); border-radius: var(--ttqo3x-borderRadiusMain-tl-mobile, 0px) var(--ttqo3x-borderRadiusMain-tr-mobile, 0px) var(--ttqo3x-borderRadiusMain-br-mobile, 0px) var(--ttqo3x-borderRadiusMain-bl-mobile, 0px); } } .omnise-product-media-main[data-effect="slide"] { overflow: hidden; .omnise-slider-item { border-style: var(--ttqo3x-borderStyleMain, solid); border-color: var(--ttqo3x-borderColorMain, #000000); border-width: var(--ttqo3x-borderWidthMain-tl, 0px) var(--ttqo3x-borderWidthMain-tr, 0px) var(--ttqo3x-borderWidthMain-br, 0px) var(--ttqo3x-borderWidthMain-bl, 0px); border-radius: var(--ttqo3x-borderRadiusMain-tl, 0px) var(--ttqo3x-borderRadiusMain-tr, 0px) var(--ttqo3x-borderRadiusMain-br, 0px) var(--ttqo3x-borderRadiusMain-bl, 0px); overflow: hidden; @media (min-width: 768px) and (max-width: 1180px) { border-width: var(--ttqo3x-borderWidthMain-tl-tablet, 0px) var(--ttqo3x-borderWidthMain-tr-tablet, 0px) var(--ttqo3x-borderWidthMain-br-tablet, 0px) var(--ttqo3x-borderWidthMain-bl-tablet, 0px); border-radius: var(--ttqo3x-borderRadiusMain-tl-tablet, 0px) var(--ttqo3x-borderRadiusMain-tr-tablet, 0px) var(--ttqo3x-borderRadiusMain-br-tablet, 0px) var(--ttqo3x-borderRadiusMain-bl-tablet, 0px); } @media (max-width: 767px) { border-width: var(--ttqo3x-borderWidthMain-tl-mobile, 0px) var(--ttqo3x-borderWidthMain-tr-mobile, 0px) var(--ttqo3x-borderWidthMain-br-mobile, 0px) var(--ttqo3x-borderWidthMain-bl-mobile, 0px); border-radius: var(--ttqo3x-borderRadiusMain-tl-mobile, 0px) var(--ttqo3x-borderRadiusMain-tr-mobile, 0px) var(--ttqo3x-borderRadiusMain-br-mobile, 0px) var(--ttqo3x-borderRadiusMain-bl-mobile, 0px); } } } .omnise-product-media-hover-overlay { left: 0; width: 100%; transform: none; background-size: 150%; pointer-events: none; cursor: inherit; } .omnise-product-picture { display: block; position: relative; height: auto; aspect-ratio: var(--ttqo3x-imageRatioMain); overflow: hidden; .omnise-product-image { width: 100%; height: 100%; object-fit: var(--ttqo3x-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); vertical-align: middle; } @media (min-width: 768px) and (max-width: 1180px) { aspect-ratio: var(--ttqo3x-imageRatioMain-tablet); border-radius: var(--ttqo3x-borderRadiusMain-tl-tablet, var(--ttqo3x-borderRadiusMain-tl, 0px)) var(--ttqo3x-borderRadiusMain-tr-tablet, var(--ttqo3x-borderRadiusMain-tr, 0px)) var(--ttqo3x-borderRadiusMain-br-tablet, var(--ttqo3x-borderRadiusMain-br, 0px)) var(--ttqo3x-borderRadiusMain-bl-tablet, var(--ttqo3x-borderRadiusMain-bl, 0px)); .omnise-product-image, .omnise-product-media-player video { object-fit: var(--ttqo3x-objFit-tablet, var(--ttqo3x-objFit, cover)); } } @media (max-width: 767px) { aspect-ratio: var(--ttqo3x-imageRatioMain-mobile); border-radius: var(--ttqo3x-borderRadiusMedia-tl-mobile, var(--ttqo3x-borderRadiusMedia-tl, 0px)) var(--ttqo3x-borderRadiusMedia-tr-mobile, var(--ttqo3x-borderRadiusMedia-tr, 0px)) var(--ttqo3x-borderRadiusMedia-br-mobile, var(--ttqo3x-borderRadiusMedia-br, 0px)) var(--ttqo3x-borderRadiusMedia-bl-mobile, var(--ttqo3x-borderRadiusMedia-bl, 0px)); .omnise-product-image, .omnise-product-media-player video { object-fit: var(--ttqo3x-objFit-mobile, var(--ttqo3x-objFit, cover)); } } &.omnise-product-picture--zoom, &.omnise-product-picture--lightbox { cursor: zoom-in; } .omnise-product-lightbox-button { position: absolute; right: 14px; bottom: 14px; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 999px; background: rgba(17, 17, 17, 0.72); color: #ffffff; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18); pointer-events: none; z-index: 2; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: transform 0.2s ease, background 0.2s ease; } &.omnise-product-picture--lightbox:hover .omnise-product-lightbox-button { transform: scale(1.06); background: rgba(17, 17, 17, 0.86); } &.omnise-product-media-video { cursor: default; } .omnise-product-video-play { position: absolute; top: 50%; left: 50%; z-index: 3; display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; padding: 0; border: none; border-radius: 50%; background: #ffffff; color: #111111; box-shadow: 0 1px 10px 3px rgba(0, 0, 0, 0.2); transform: translate(-50%, -50%); cursor: pointer; } .omnise-product-video-play[hidden] { display: none; } .omnise-product-media-player { position: absolute; inset: 0; z-index: 4; } .omnise-product-media-player video { width: 100%; height: 100%; border: 0; background: #000000; object-fit: var(--ttqo3x-objFit, cover); } @media (max-width: 767px) { .omnise-product-lightbox-button { right: 10px; bottom: 10px; width: 36px; height: 36px; } } } .omnise-product-thumb-slide { .omnise-slider-items { gap: var(--ttqo3x-gapItemThumbs, 16px); } .omnise-slider-item { flex: 1 0 var(--ttqo3x-widthItemThumbs, 100px) !important; max-width: var(--ttqo3x-widthItemThumbs, 100px); } .omnise-slider-item.is-active .omnise-thumb-image { border-style: var(--ttqo3x-borderStyleThumbs, solid); border-color: var(--ttqo3x-borderColorThumbs, #000000); border-width: var(--ttqo3x-borderWidthThumbs-tl, 0px) var(--ttqo3x-borderWidthThumbs-tr, 0px) var(--ttqo3x-borderWidthThumbs-br, 0px) var(--ttqo3x-borderWidthThumbs-bl, 0px); } @media (min-width: 768px) and (max-width: 1180px) { .omnise-slider-items { gap: var(--ttqo3x-gapItemThumbs-tablet, 16px); } .omnise-slider-item { flex: 1 0 var(--ttqo3x-widthItemThumbs-tablet, 80px) !important; max-width: var(--ttqo3x-widthItemThumbs-tablet, 80px); } .omnise-slider-item.is-active .omnise-thumb-image { border-width: var(--ttqo3x-borderWidthThumbs-tl-tablet, 0px) var(--ttqo3x-borderWidthThumbs-tr-tablet, 0px) var(--ttqo3x-borderWidthThumbs-br-tablet, 0px) var(--ttqo3x-borderWidthThumbs-bl-tablet, 0px); } } @media (max-width: 767px) { .omnise-slider-items { gap: var(--ttqo3x-gapItemThumbs-mobile, 16px); } .omnise-slider-item { flex: 1 0 var(--ttqo3x-widthItemThumbs-mobile, 64px) !important; max-width: var(--ttqo3x-widthItemThumbs-mobile, 64px); } .omnise-slider-item.is-active .omnise-thumb-image { border-width: var(--ttqo3x-borderWidthThumbs-tl-mobile, 0px) var(--ttqo3x-borderWidthThumbs-tr-mobile, 0px) var(--ttqo3x-borderWidthThumbs-br-mobile, 0px) var(--ttqo3x-borderWidthThumbs-bl-mobile, 0px); } } } .omnise-thumb-image { position: relative; width: 100%; max-width: 100%; border-radius: var(--ttqo3x-borderRadiusThumbs-tl, 0px) var(--ttqo3x-borderRadiusThumbs-tr, 0px) var(--ttqo3x-borderRadiusThumbs-br, 0px) var(--ttqo3x-borderRadiusThumbs-bl, 0px); overflow: hidden; .omnise-thumb-img { display: block; aspect-ratio: var(--ttqo3x-imageRatioThumbs); width: 100%; height: auto; object-fit: cover; object-position: center; } .omnise-product-video-badge { position: absolute; left: 6px; bottom: 6px; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: rgba(17, 17, 17, 0.72); color: #ffffff; pointer-events: none; } @media (min-width: 768px) and (max-width: 1180px) { border-radius: var(--ttqo3x-borderRadiusThumbs-tl-tablet, var(--ttqo3x-borderRadiusThumbs-tl, 0px)) var(--ttqo3x-borderRadiusThumbs-tr-tablet, var(--ttqo3x-borderRadiusThumbs-tr, 0px)) var(--ttqo3x-borderRadiusThumbs-br-tablet, var(--ttqo3x-borderRadiusThumbs-br, 0px)) var(--ttqo3x-borderRadiusThumbs-bl-tablet, var(--ttqo3x-borderRadiusThumbs-bl, 0px)); .omnise-thumb-img { aspect-ratio: var(--ttqo3x-imageRatioThumbs-tablet); } } @media (max-width: 767px) { border-radius: var(--ttqo3x-borderRadiusThumbs-tl-mobile, var(--ttqo3x-borderRadiusThumbs-tl, 0px)) var(--ttqo3x-borderRadiusThumbs-tr-mobile, var(--ttqo3x-borderRadiusThumbs-tr, 0px)) var(--ttqo3x-borderRadiusThumbs-br-mobile, var(--ttqo3x-borderRadiusThumbs-br, 0px)) var(--ttqo3x-borderRadiusThumbs-bl-mobile, var(--ttqo3x-borderRadiusThumbs-bl, 0px)); .omnise-thumb-img { aspect-ratio: var(--ttqo3x-imageRatioThumbs-mobile); } } } .omnise-main-slider-wrap { @media (min-width: 1024px) { & .omnise-slider-wrapper[data-desktop-layout="slider"] { .omnise-slider-items { gap: var(--ttqo3x-gap, 20px); .omnise-slider-item { flex: 0 0 calc((100% - var(--ttqo3x-gap, 20px) * (1 - 1)) / 1); } } } & .omnise-slider-wrapper[data-desktop-layout="grid"] { .omnise-slider-items { flex-wrap: wrap; gap: var(--ttqo3x-gap, 20px); .omnise-slider-item { flex: 0 0 calc((100% - (1 - 1) * var(--ttqo3x-gap, 20px)) / 1); } } } } @media (min-width: 768px) and (max-width: 1180px) { & .omnise-slider-wrapper[data-tablet-layout="slider"] { .omnise-slider-items { gap: var(--ttqo3x-gap-tablet, 20px); .omnise-slider-item { flex: 0 0 calc((100% - var(--ttqo3x-gap-tablet, 20px) * (1 - 1)) / 1); } } } & .omnise-slider-wrapper[data-tablet-layout="grid"] { .omnise-slider-items { flex-wrap: wrap; gap: var(--ttqo3x-gap-tablet, 20px); .omnise-slider-item { flex: 0 0 calc((100% - (1 - 1) * var(--ttqo3x-gap-tablet, 20px)) / 1); } } } } @media (max-width: 767px) { & .omnise-slider-wrapper[data-mobile-layout="slider"] { .omnise-slider-items { gap: var(--ttqo3x-gap-mobile, 20px); .omnise-slider-item { flex: 0 0 calc((100% - var(--ttqo3x-gap-mobile, 20px) * (1 - 1)) / 1); } } } & .omnise-slider-wrapper[data-mobile-layout="grid"] { .omnise-slider-items { flex-wrap: wrap; gap: var(--ttqo3x-gap-mobile, 20px); .omnise-slider-item { flex: 0 0 calc((100% - (1 - 1) * var(--ttqo3x-gap-mobile, 20px)) / 1); } } } } /* Navigation & Pagination */ .omnise-slider-nav-left, .omnise-slider-nav-right { padding: var(--ttqo3x-navPadding, 12px); background: var(--ttqo3x-navBg, #F5F5F5); color: var(--ttqo3x-navColor, #333333); cursor: pointer; z-index: 10; &:hover { background: var(--ttqo3x-navBgHover, #CCCCCC); color: var(--ttqo3x-navColorHover, #333333); } svg { width: var(--ttqo3x-navIconSize, 20px); height: var(--ttqo3x-navIconSize, 20px); } } } @media (min-width: 1181px) { .omnise-media-product { &[data-position-thumbs='bottom'] { flex-direction: column; .omnise-thumb-wrapper { max-width: 100%; width: 100%; overflow: hidden; } } &:not([data-position-thumbs='bottom']) { .omnise-main-slider-wrap { flex: 1; min-width: 0; } .omnise-thumb-wrapper { width: fit-content; height: 100%; overflow: hidden; } .omnise-product-thumb-slide { height: 100%; } .omnise-product-thumb-slide .omnise-slider-items { flex-direction: column; } .omnise-product-thumb-slide .omnise-slider-item { flex: 1 0 0 !important; } } &[data-position-thumbs='left'] { flex-direction: row-reverse; } } } @media (min-width: 768px) and (max-width: 1180px) { .omnise-media-product { gap: var(--ttqo3x-gap-tablet, 16px); &[data-position-thumbs-tablet='bottom'] { flex-direction: column; .omnise-thumb-wrapper { max-width: 100%; width: 100%; overflow: hidden; } } &:not([data-position-thumbs-tablet='bottom']) { .omnise-main-slider-wrap { flex: 1; min-width: 0; } .omnise-thumb-wrapper { width: fit-content; height: 100%; overflow: hidden; } .omnise-product-thumb-slide { height: 100%; } .omnise-product-thumb-slide .omnise-slider-items { flex-direction: column; } .omnise-product-thumb-slide .omnise-slider-item { flex: 1 0 0 !important; } } &[data-position-thumbs-tablet='left'] { flex-direction: row-reverse; } } } @media (max-width: 767px) { .omnise-media-product { gap: var(--ttqo3x-gap-mobile, 16px); &[data-position-thumbs-mobile='bottom'] { flex-direction: column; .omnise-thumb-wrapper { max-width: 100%; width: 100%; overflow: hidden; } } } } } }[data-bnode="omnise-u39lc7"] {        flex-wrap: nowrap;        gap: 8px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-u39lc7"] {                gap: 8px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-u39lc7"] {                gap: 12px;     }  }[data-bnode="omnise-kgrmer"] { --kgrmer-typography: p; --kgrmer-typography-tablet: p; --kgrmer-typography-mobile: p; --kgrmer-veryLowColor: #e74c3c; --kgrmer-veryLowColor-tablet: #e74c3c; --kgrmer-veryLowColor-mobile: #e74c3c; --kgrmer-lowColor: #f1c40f; --kgrmer-lowColor-tablet: #f1c40f; --kgrmer-lowColor-mobile: #f1c40f; --kgrmer-progressHeight: 4px; --kgrmer-progressHeight-tablet: 4px; --kgrmer-progressHeight-mobile: 4px; --kgrmer-margin-top: 0px; --kgrmer-margin-top-tablet: 0px; --kgrmer-margin-top-mobile: 0px; --kgrmer-margin-right: 0px; --kgrmer-margin-right-tablet: 0px; --kgrmer-margin-right-mobile: 0px; --kgrmer-margin-bottom: 0px; --kgrmer-margin-bottom-tablet: 0px; --kgrmer-margin-bottom-mobile: 0px; --kgrmer-margin-left: 0px; --kgrmer-margin-left-tablet: 0px; --kgrmer-margin-left-mobile: 0px; --kgrmer-color: #08823B; --kgrmer-color-tablet: #08823B; --kgrmer-color-mobile: #08823B; --omnise-p-color: #004225; --omnise-p-font-weight: 600; --omnise-p-font-size: 23px; }[data-bnode="omnise-kgrmer"] { margin-top: var(--kgrmer-margin-top, 0px); margin-right: var(--kgrmer-margin-right, 0px); margin-bottom: var(--kgrmer-margin-bottom, 0px); margin-left: var(--kgrmer-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--kgrmer-margin-top-tablet, 0px); margin-right: var(--kgrmer-margin-right-tablet, 0px); margin-bottom: var(--kgrmer-margin-bottom-tablet, 0px); margin-left: var(--kgrmer-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--kgrmer-margin-top-mobile, 0px); margin-right: var(--kgrmer-margin-right-mobile, 0px); margin-bottom: var(--kgrmer-margin-bottom-mobile, 0px); margin-left: var(--kgrmer-margin-left-mobile, 0px); } &.omnise-inventory-low { color: var(--kgrmer-lowColor); } &.omnise-inventory-critical, &.omnise-inventory-out { color: var(--kgrmer-veryLowColor); } & .omnise-inventory-text{ display:none; &.omnise-show{ display:block; } } & .omnise-inventory-progress { width: 100%; height: var(--kgrmer-progressHeight,4px); background: rgba(0, 0, 0, 0.08); border-radius: 999px; overflow: hidden; margin-top: 6px; & .omnise-inventory-progress-bar { display:block; height: 100%; width: 0%; background: var(--kgrmer-lowColor); border-radius: 999px; transition: width 0.3s ease; } } &.omnise-inventory-critical .omnise-inventory-progress-bar { background: var(--kgrmer-veryLowColor); } &.omnise-inventory-out .omnise-inventory-progress-bar { background: var(--kgrmer-veryLowColor); width: 0% !important; } }[data-bnode="omnise-ui2h8y"] {     flex-direction: row;   flex-wrap: nowrap;     align-items: center;           &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-ui2h8y"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-ui2h8y"] {                     }  }[data-bnode="omnise-k3tl56"] { --k3tl56-typography: p; --k3tl56-typography-tablet: p; --k3tl56-typography-mobile: p; --k3tl56-decoration: line-through; --k3tl56-decoration-tablet: line-through; --k3tl56-decoration-mobile: line-through; --k3tl56-comparePriceColor: #8e90a1; --k3tl56-comparePriceColor-tablet: #8e90a1; --k3tl56-comparePriceColor-mobile: #8e90a1; --k3tl56-priceType: comparePrice; --k3tl56-priceType-tablet: comparePrice; --k3tl56-priceType-mobile: comparePrice; --k3tl56-salePriceColor: var(--omnise-other-sale-price-color); --k3tl56-salePriceColor-tablet: var(--omnise-other-sale-price-color); --k3tl56-salePriceColor-mobile: var(--omnise-other-sale-price-color); --omnise-p-font-size: 24px; --omnise-p-font-weight: 700; --k3tl56-scale: 0.8; --k3tl56-scale-tablet: 0.8; --k3tl56-scale-mobile: 0.8; }[data-bnode="omnise-k3tl56"] { margin-top: var(--k3tl56-margin-top, 0px); margin-right: var(--k3tl56-margin-right, 0px); margin-bottom: var(--k3tl56-margin-bottom, 0px); margin-left: var(--k3tl56-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--k3tl56-margin-top-tablet, 0px); margin-right: var(--k3tl56-margin-right-tablet, 0px); margin-bottom: var(--k3tl56-margin-bottom-tablet, 0px); margin-left: var(--k3tl56-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--k3tl56-margin-top-mobile, 0px); margin-right: var(--k3tl56-margin-right-mobile, 0px); margin-bottom: var(--k3tl56-margin-bottom-mobile, 0px); margin-left: var(--k3tl56-margin-left-mobile, 0px); } &.omnise-product-price-unsupported{ background: antiquewhite; padding: 0px 10px; font-weight: 500; } .omnise-product-price-compare{ color: var(--k3tl56-comparePriceColor); text-decoration: var(--k3tl56-decoration,none); font-size: calc(var(--k3tl56-scale, 1) * 1em); display: inline-block; margin-left:7px; } &.omnise-on-sale .omnise-price-sale{ color: var(--k3tl56-salePriceColor,var(--omnise-other-sale-price-color)); } }[data-bnode="omnise-14aqwc"] { --14aqwc-typography: h4; --14aqwc-typography-tablet: h4; --14aqwc-typography-mobile: h4; --14aqwc-margin-top: 10px; --14aqwc-margin-top-tablet: 10px; --14aqwc-margin-top-mobile: 10px; --14aqwc-margin-right: 0px; --14aqwc-margin-right-tablet: 0px; --14aqwc-margin-right-mobile: 0px; --14aqwc-margin-bottom: 10px; --14aqwc-margin-bottom-tablet: 10px; --14aqwc-margin-bottom-mobile: 10px; --14aqwc-margin-left: 0px; --14aqwc-margin-left-tablet: 0px; --14aqwc-margin-left-mobile: 0px; --omnise-h4-text-align: start; }[data-bnode="omnise-14aqwc"] { margin-top: var(--14aqwc-margin-top, 0px); margin-right: var(--14aqwc-margin-right, 0px); margin-bottom: var(--14aqwc-margin-bottom, 0px); margin-left: var(--14aqwc-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--14aqwc-margin-top-tablet, 0px); margin-right: var(--14aqwc-margin-right-tablet, 0px); margin-bottom: var(--14aqwc-margin-bottom-tablet, 0px); margin-left: var(--14aqwc-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--14aqwc-margin-top-mobile, 0px); margin-right: var(--14aqwc-margin-right-mobile, 0px); margin-bottom: var(--14aqwc-margin-bottom-mobile, 0px); margin-left: var(--14aqwc-margin-left-mobile, 0px); } }[data-bnode="omnise-s98o1q"] { --s98o1q-margin-top: 0px; --s98o1q-margin-top-tablet: 0px; --s98o1q-margin-top-mobile: 0px; --s98o1q-margin-right: 0px; --s98o1q-margin-right-tablet: 0px; --s98o1q-margin-right-mobile: 0px; --s98o1q-margin-bottom: 12px; --s98o1q-margin-bottom-tablet: 12px; --s98o1q-margin-bottom-mobile: 12px; --s98o1q-margin-left: 0px; --s98o1q-margin-left-tablet: 0px; --s98o1q-margin-left-mobile: 0px; }[data-bnode="omnise-s98o1q"] { margin-top: var(--s98o1q-margin-top, 0px); margin-right: var(--s98o1q-margin-right, 0px); margin-bottom: var(--s98o1q-margin-bottom, 0px); margin-left: var(--s98o1q-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--s98o1q-margin-top-tablet, 0px); margin-right: var(--s98o1q-margin-right-tablet, 0px); margin-bottom: var(--s98o1q-margin-bottom-tablet, 0px); margin-left: var(--s98o1q-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--s98o1q-margin-top-mobile, 0px); margin-right: var(--s98o1q-margin-right-mobile, 0px); margin-bottom: var(--s98o1q-margin-bottom-mobile, 0px); margin-left: var(--s98o1q-margin-left-mobile, 0px); } }[data-bnode="omnise-imyc9d"] { --imyc9d-columns: 1; --imyc9d-columns-tablet: 1; --imyc9d-columns-mobile: 1; --imyc9d-navType: true; --imyc9d-navType-tablet: true; --imyc9d-navType-mobile: true; --imyc9d-pagiType: false; --imyc9d-pagiType-tablet: false; --imyc9d-pagiType-mobile: false; --imyc9d-listType: grid; --imyc9d-listType-tablet: grid; --imyc9d-listType-mobile: grid; --imyc9d-stateNavigation: normal; --imyc9d-stateNavigation-tablet: normal; --imyc9d-stateNavigation-mobile: normal; --imyc9d-statePagination: normal; --imyc9d-statePagination-tablet: normal; --imyc9d-statePagination-mobile: normal; --imyc9d-stateNavigtion: normal; --imyc9d-stateNavigtion-tablet: normal; --imyc9d-stateNavigtion-mobile: normal; --imyc9d-gap: 0px; --imyc9d-gap-tablet: 0px; --imyc9d-gap-mobile: 0px; --imyc9d-columnsMobile-mobile: 1; } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-contlp"] { --omnise-p-text-align: justify; } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-item2a"] { --item2a-direction: row; } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-9ybsgs"] { --9ybsgs-width: 100%; --9ybsgs-imageRatio: auto; --9ybsgs-objFit: cover; --9ybsgs-borderColor: #000000; --9ybsgs-shadowColor: #000000; --9ybsgs-borderStyle: none; --9ybsgs-enableShadow: false; } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-c654e4"] { --c654e4-typography: h5; --omnise-h5-text-align: start; } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-3qu7bi"] { --3qu7bi-typography: p; --omnise-p-font-size-mobile: 16px; --omnise-p-line-height-mobile: 1.5; --omnise-p-letter-spacing-mobile: 0px; } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-kfl2yc"] { --kfl2yc-iconColor: #2C63E2; } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-bssmc1"] { --bssmc1-direction: column; --bssmc1-structure: columns; --bssmc1-gap: 4px; }[data-bnode="omnise-imyc9d"] { margin-top: var(--imyc9d-margin-top, 0px); margin-right: var(--imyc9d-margin-right, 0px); margin-bottom: var(--imyc9d-margin-bottom, 0px); margin-left: var(--imyc9d-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--imyc9d-margin-top-tablet, 0px); margin-right: var(--imyc9d-margin-right-tablet, 0px); margin-bottom: var(--imyc9d-margin-bottom-tablet, 0px); margin-left: var(--imyc9d-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--imyc9d-margin-top-mobile, 0px); margin-right: var(--imyc9d-margin-right-mobile, 0px); margin-bottom: var(--imyc9d-margin-bottom-mobile, 0px); margin-left: var(--imyc9d-margin-left-mobile, 0px); } &.omnise-content-list { .omnise-slider-item{ > .omnise-slot[data-bnode="be-ctl-item"]{ height: 100%; } } @media (min-width: 1180px) { & .omnise-slider-wrapper[data-desktop-layout="slider"]{ .omnise-slider-items { gap: var(--imyc9d-gap,var(--omnise-grid-gap, 20px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--imyc9d-gap,var(--omnise-grid-gap, 20px)) * (var(--imyc9d-columns, 3) - 1)) / var(--imyc9d-columns, 3)); &:last-child{ margin-right: var(--imyc9d-gap,var(--omnise-grid-gap, 20px)); } } } } & .omnise-slider-wrapper[data-desktop-layout="grid"]{ &[data-item="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--imyc9d-columns, 3), minmax(0, 1fr)); gap: var(--imyc9d-gap,var(--omnise-grid-gap, 20px)); .omnise-slider-item { min-width: 0; } } } } @media (min-width: 767.79px) and (max-width: 1180px) { & .omnise-slider-wrapper[data-tablet-layout="slider"]{ .omnise-slider-items { gap: var(--imyc9d-gap-tablet,var(--omnise-grid-gap-tablet, 20px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--imyc9d-gap-tablet,var(--omnise-grid-gap-tablet, 16px)) * (var(--imyc9d-columns-tablet, 3) - 1)) / var(--imyc9d-columns-tablet, 3)); &:last-child{ margin-right: var(--imyc9d-gap-tablet,var(--omnise-grid-gap-tablet, 16px)); } } } } & .omnise-slider-wrapper[data-tablet-layout="grid"]{ &[data-item-tablet="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--imyc9d-columns-tablet, 3), minmax(0, 1fr)); gap: var(--imyc9d-gap-tablet,var(--omnise-grid-gap-tablet, 16px)); .omnise-slider-item { min-width: 0; } } } } @media (max-width: 767px) { & .omnise-slider-wrapper[data-mobile-layout="slider"]{ .omnise-slider-items { gap: var(--imyc9d-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--imyc9d-gap-mobile,var(--omnise-grid-gap-mobile, 10px)) * (var(--imyc9d-columnsMobile-mobile, 1) - 1)) / var(--imyc9d-columnsMobile-mobile, 1)); &:last-child{ margin-right: var(--imyc9d-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); } } } } & .omnise-slider-wrapper[data-mobile-layout="grid"]{ &[data-item-mobile="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--imyc9d-columnsMobile-mobile, 1), minmax(0, 1fr)); gap: var(--imyc9d-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item { min-width: 0; } } } } /* Navigation & Pagination */ .omnise-slider-nav-left, .omnise-slider-nav-right { padding: var(--imyc9d-navPadding,12px); background:var(--imyc9d-navBg,#F5F5F5); color: var(--imyc9d-navColor,var(--omnise-text-color)); cursor: pointer; border-radius: var(--imyc9d-navRadius,50%); &:hover { background:var(--imyc9d-navBgHover,#CCCCCC); color: var(--imyc9d-navColorHover,var(--omnise-text-color)); } svg { width: var(--imyc9d-navIconSize,20px); height: var(--imyc9d-navIconSize,20px); } } & .omnise-slider-wrapper[data-pagination="dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--imyc9d-pagiBg,#E6E6E6); &.active { background:var(--imyc9d-pagiBgActive,#181818); } &:not(.active):hover { background:var(--imyc9d-pagiBgHover,#CCCCCC); } } & .omnise-slider-wrapper[data-pagination="numbers"] + .omnise-slider-controls .omnise-slider-pagination { color: var(--imyc9d-pagiColor,#e6e6e6); &.active { color:var(--imyc9d-pagiColorActive,#181818); } &:not(.active):hover { color: var(--imyc9d-pagiColorHover,#181818); } } & .omnise-slider-wrapper[data-pagination="counter"] + .omnise-slider-controls .omnise-slider-pagination-total { color: var(--imyc9d-pagiColor,#e6e6e6); } & .omnise-slider-wrapper[data-pagination="dynamic-dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--imyc9d-pagiBg,#E6E6E6); &.active { background: var(--imyc9d-pagiBgActive,#181818); opacity: 1; } &:not(.active):hover { background: var(--imyc9d-pagiBgHover,#CCCCCC); } } .omnise-slider-pagination-wrp{ margin-top: 20px; } } & .omnise-content-list-empty { min-height: 80px; display: flex; align-items: center; justify-content: center; background-color: #f0f0f0; color: #666; } & .omnise-content-list-empty button { padding: 12px; cursor: pointer; border: none; background: transparent; } & [data-bnode="be-ctl-item"] { min-height: 0; } & .be-ctl-item-empty { min-height: 60px; display: flex; align-items: center; justify-content: center; background-color: #f8f8f8; } } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-kfl2yc"] { margin-top: var(--kfl2yc-margin-top, 0px); margin-right: var(--kfl2yc-margin-right, 0px); margin-bottom: var(--kfl2yc-margin-bottom, 0px); margin-left: var(--kfl2yc-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--kfl2yc-margin-top-tablet, 0px); margin-right: var(--kfl2yc-margin-right-tablet, 0px); margin-bottom: var(--kfl2yc-margin-bottom-tablet, 0px); margin-left: var(--kfl2yc-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--kfl2yc-margin-top-mobile, 0px); margin-right: var(--kfl2yc-margin-right-mobile, 0px); margin-bottom: var(--kfl2yc-margin-bottom-mobile, 0px); margin-left: var(--kfl2yc-margin-left-mobile, 0px); } & { display: flex; align-items:center; justify-content: center; padding: var(--kfl2yc-padding, 4px); border-style: var(--kfl2yc-borderStyle,solid); border-color: var(--kfl2yc-borderColor,#000000); border-width: var(--kfl2yc-borderWidth-tl,0px) var(--kfl2yc-borderWidth-tr,0px) var(--kfl2yc-borderWidth-br,0px) var(--kfl2yc-borderWidth-bl,0px); border-radius: var(--kfl2yc-borderRadius-tl,0px) var(--kfl2yc-borderRadius-tr,0px) var(--kfl2yc-borderRadius-br,0px) var(--kfl2yc-borderRadius-bl,0px); box-shadow: if( style(--kfl2yc-enableShadow: true): var(--kfl2yc-shadowHorizontal, 0) var(--kfl2yc-shadowVertical, 0) var(--kfl2yc-shadowBlur, 0) 1px var(--kfl2yc-shadowColor, #000000); else: none ); color: var(--kfl2yc-iconColor,var(--omnise-text-color)); background-color: var(--kfl2yc-backgroundColor); overflow: hidden; width: var(--kfl2yc-size, 28px); min-width: var(--kfl2yc-size, 28px); height: fit-content; max-width: var(--kfl2yc-size, 28px); width: var(--kfl2yc-size-tablet, 28px); @media(min-width: 767.79px) and (max-width: 1180px){ border-width: var(--kfl2yc-borderWidth-tl-tablet,0px) var(--kfl2yc-borderWidth-tr-tablet,0px) var(--kfl2yc-borderWidth-br-tablet,0px) var(--kfl2yc-borderWidth-bl-tablet,0px); border-radius: var(--kfl2yc-borderRadius-tl-tablet,0px) var(--kfl2yc-borderRadius-tr-tablet,0px) var(--kfl2yc-borderRadius-br-tablet,0px) var(--kfl2yc-borderRadius-bl-tablet,0px); min-width: var(--kfl2yc-size-tablet, var(--kfl2yc-size, 28px)); max-width: var(--kfl2yc-size-tablet, var(--kfl2yc-size, 28px)); } @media(max-width: 767px){ width: var(--kfl2yc-size-mobile, var(--kfl2yc-size-tablet, var(--kfl2yc-size, 28px))); min-width: var(--kfl2yc-size-mobile, var(--kfl2yc-size-tablet, var(--kfl2yc-size, 28px))); max-width: var(--kfl2yc-size-mobile, var(--kfl2yc-size-tablet, var(--kfl2yc-size, 28px))); border-width: var(--kfl2yc-borderWidth-tl-mobile,0px) var(--kfl2yc-borderWidth-tr-mobile,0px) var(--kfl2yc-borderWidth-br-mobile,0px) var(--kfl2yc-borderWidth-bl-mobile,0px); border-radius: var(--kfl2yc-borderRadius-tl-mobile,0px) var(--kfl2yc-borderRadius-tr-mobile,0px) var(--kfl2yc-borderRadius-br-mobile,0px) var(--kfl2yc-borderRadius-bl-mobile,0px); } svg { width: 100%; height: 100%; } } } [data-bnode="omnise-imyc9d"] [data-bnode="omnise-3qu7bi"] { margin-top: var(--3qu7bi-margin-top, 0px); margin-right: var(--3qu7bi-margin-right, 0px); margin-bottom: var(--3qu7bi-margin-bottom, 0px); margin-left: var(--3qu7bi-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--3qu7bi-margin-top-tablet, 0px); margin-right: var(--3qu7bi-margin-right-tablet, 0px); margin-bottom: var(--3qu7bi-margin-bottom-tablet, 0px); margin-left: var(--3qu7bi-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--3qu7bi-margin-top-mobile, 0px); margin-right: var(--3qu7bi-margin-right-mobile, 0px); margin-bottom: var(--3qu7bi-margin-bottom-mobile, 0px); margin-left: var(--3qu7bi-margin-left-mobile, 0px); } }[data-bnode="omnise-imyc9d"] [data-bnode="be-ctl-item"] {   gap: 4px;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-imyc9d"] [data-bnode="be-ctl-item"] {    gap: 4px;   }  }  @media (max-width: 767px) {   [data-bnode="omnise-imyc9d"] [data-bnode="be-ctl-item"] {    gap: 4px;   }  }[data-bnode="omnise-imyc9d"] [data-bnode="be-ctl-item"] {     flex-direction: row;   flex-wrap: nowrap;     align-items: center;   gap: 4px;        &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-imyc9d"] [data-bnode="be-ctl-item"] {                gap: 4px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-imyc9d"] [data-bnode="be-ctl-item"] {                gap: 4px;     }  }[data-bnode="omnise-56so1t"] { padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } [data-bnode="omnise-56so1t"] {        flex-wrap: nowrap;        gap: 16px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-56so1t"] {                gap: 16px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-56so1t"] {                gap: 16px;     }  }[data-bnode="omnise-wey2o7"] { --wey2o7-variantType: options; --wey2o7-variantType-tablet: options; --wey2o7-variantType-mobile: options; --wey2o7-headerState: normal; --wey2o7-headerState-tablet: normal; --wey2o7-headerState-mobile: normal; --wey2o7-borderStyle: solid; --wey2o7-borderStyle-tablet: solid; --wey2o7-borderStyle-mobile: solid; --wey2o7-borderWidth: 1px; --wey2o7-borderWidth-tablet: 1px; --wey2o7-borderWidth-mobile: 1px; --wey2o7-styleColor: square; --wey2o7-styleColor-tablet: square; --wey2o7-styleColor-mobile: square; --wey2o7-labelTypo: p; --wey2o7-labelTypo-tablet: p; --wey2o7-labelTypo-mobile: p; --omnise-labelTypo-text-align: start; --wey2o7-activeValueTypo: p; --wey2o7-activeValueTypo-tablet: p; --wey2o7-activeValueTypo-mobile: p; --omnise-activeValueTypo-text-align: start; --omnise-activeValueTypo-font-weight: 700; --wey2o7-sizeColor: 64px; --wey2o7-sizeColor-tablet: 64px; --wey2o7-sizeColor-mobile: 64px; --wey2o7-paddingX: 12px; --wey2o7-paddingX-tablet: 12px; --wey2o7-paddingX-mobile: 12px; --wey2o7-paddingY: 14px; --wey2o7-paddingY-tablet: 14px; --wey2o7-paddingY-mobile: 14px; --wey2o7-btnTypo: p; --wey2o7-btnTypo-tablet: p; --wey2o7-btnTypo-mobile: p; --omnise-p-text-align: start; --omnise-labelTypo-font-weight: 600; --wey2o7-borderRadius: 8px; --wey2o7-borderRadius-tablet: 8px; --wey2o7-borderRadius-mobile: 8px; --wey2o7-tabBg: #ffffff00; --wey2o7-tabBg-tablet: #ffffff00; --wey2o7-tabBg-mobile: #ffffff00; --wey2o7-tabBgHover: #f5f5f5; --wey2o7-tabBgHover-tablet: #f5f5f5; --wey2o7-tabBgHover-mobile: #f5f5f5; }[data-bnode="omnise-wey2o7"] { margin-top: var(--wey2o7-margin-top, 0px); margin-right: var(--wey2o7-margin-right, 0px); margin-bottom: var(--wey2o7-margin-bottom, 0px); margin-left: var(--wey2o7-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--wey2o7-margin-top-tablet, 0px); margin-right: var(--wey2o7-margin-right-tablet, 0px); margin-bottom: var(--wey2o7-margin-bottom-tablet, 0px); margin-left: var(--wey2o7-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--wey2o7-margin-top-mobile, 0px); margin-right: var(--wey2o7-margin-right-mobile, 0px); margin-bottom: var(--wey2o7-margin-bottom-mobile, 0px); margin-left: var(--wey2o7-margin-left-mobile, 0px); } &.omnise-variant-box { display: flex; flex-direction: column; gap: 12px; width: 100%; .omnise-option { display: flex; flex-direction: column; gap: 6px; } .omnise-option-heading { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } .omnise-option-lb { font-size: var(--omnise-labelTypo-font-size); font-weight: var(--omnise-labelTypo-font-weight); line-height: var(--omnise-labelTypo-line-height); letter-spacing: var(--omnise-labelTypo-letter-spacing); text-transform: var(--omnise-labelTypo-text-transform); color: var(--omnise-labelTypo-color, var(--omnise-text-color)); text-align: var(--omnise-labelTypo-text-align); } .omnise-option-active-value { font-size: var(--omnise-activeValueTypo-font-size); font-weight: var(--omnise-activeValueTypo-font-weight); line-height: var(--omnise-activeValueTypo-line-height); letter-spacing: var(--omnise-activeValueTypo-letter-spacing); text-transform: var(--omnise-activeValueTypo-text-transform); color: var(--omnise-activeValueTypo-color, var(--omnise-text-color)); text-align: var(--omnise-activeValueTypo-text-align); } .omnise-size-chart { margin-left: auto; display: inline-flex; align-items: center; justify-content: center; gap: var(--wey2o7-iconGap, 5px); background: none; border: 0; padding: 0; cursor: pointer; } .omnise-size-chart[omnise-btn-po="right"] { flex-direction: row-reverse; } .omnise-size-chart-icon { display: inline-flex; align-items: center; justify-content: center; width: var(--wey2o7-iconWidth, 20px); min-width: var(--wey2o7-iconWidth, 20px); } .omnise-size-chart-icon > svg, .omnise-size-chart-icon > img { width: 100%; height: auto; } .omnise-size-chart-modal-backdrop { position: fixed; inset: 0; z-index: 9999; box-sizing: border-box; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0; background: rgba(17, 24, 39, 0); padding: 24px 16px; display: flex; align-items: center; justify-content: center; overflow: hidden; transition: background-color 220ms ease; } .omnise-size-chart-modal-backdrop[data-state="open"] { background: rgba(17, 24, 39, 0.34); } .omnise-size-chart-modal-backdrop::backdrop { background: transparent; } .omnise-size-chart-modal-backdrop[hidden] { display: none !important; } .omnise-size-chart-modal-dialog { width: min(720px, 100%); margin: auto; max-height: calc(100dvh - 48px); overflow-x: hidden; overflow-y: auto; background: #ffffff; border-radius: 18px; box-shadow: 0 24px 64px rgba(15, 23, 42, 0.18); color: #111827; opacity: 0; transform: scale(0.94); transform-origin: center; transition: opacity 220ms ease, transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1); } .omnise-size-chart-modal-backdrop[data-state="open"] .omnise-size-chart-modal-dialog { opacity: 1; transform: scale(1); } .omnise-size-chart-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 18px 10px; } .omnise-size-chart-modal-heading { font-size: 32px; line-height: 1.1; font-weight: 700; letter-spacing: -0.03em; } .omnise-size-chart-modal-close { width: 40px; height: 40px; border: 0; border-radius: 999px; background: #F3F4F6; color: #111827; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex: 0 0 auto; } .omnise-size-chart-modal-body { padding: 10px 18px 18px; img{ width: 100%; height: 100%; } } .omnise-size-chart-modal-empty, .omnise-size-chart-modal-placeholder, .omnise-size-chart-modal-preview-note { color: #6B7280; } .omnise-size-chart-modal-content { color: #111827; } .omnise-size-chart-modal-preview-note { margin-bottom: 12px; } .omnise-size-chart-modal-fallback { width: 100%; } .omnise-size-chart-template { width: 100%; } .omnise-size-chart-template-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; } .omnise-size-chart-template-select { font-size: 16px; line-height: 1.4; font-weight: 600; color: #111827; } .omnise-size-chart-template-select::after { content: "⌄"; margin-left: 6px; font-size: 12px; } .omnise-size-chart-template-units { display: inline-flex; align-items: center; gap: 8px; } .omnise-size-chart-template-unit { min-width: 42px; height: 42px; padding: 0 14px; border-radius: 999px; background: #F3F4F6; color: #111827; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 500; } .omnise-size-chart-template-unit-active { background: #111111; color: #FFFFFF; } .omnise-size-chart-template-table-wrap { overflow-x: auto; } .omnise-size-chart-template-table { width: 100%; min-width: 640px; border-collapse: collapse; color: #374151; } .omnise-size-chart-template-table th, .omnise-size-chart-template-table td { padding: 20px 18px; text-align: center; border-bottom: 1px solid #E5E7EB; } .omnise-size-chart-template-table th:first-child, .omnise-size-chart-template-table td:first-child { border-right: 1px solid #E5E7EB; } .omnise-size-chart-template-table th { background: #F7F7F7; color: #374151; font-size: 15px; font-weight: 700; } .omnise-size-chart-template-table td:first-child { font-weight: 700; } .omnise-size-chart-template-note { margin-top: 16px; font-size: 14px; line-height: 1.5; color: #9CA3AF; } @media (max-width: 767px) { .omnise-size-chart-modal-backdrop { padding: 12px; } .omnise-size-chart-modal-dialog { border-radius: 16px; max-height: calc(100dvh - 24px); } .omnise-size-chart-modal-header { padding: 16px 16px 8px; } .omnise-size-chart-modal-heading { font-size: 24px; } .omnise-size-chart-modal-body { padding: 8px 16px 16px; } } @media (prefers-reduced-motion: reduce) { .omnise-size-chart-modal-backdrop, .omnise-size-chart-modal-dialog { transition-duration: 0.01ms !important; } } @media (min-width: 767.79px) and (max-width: 1180px) { .omnise-option-lb { font-size: var(--omnise-labelTypo-font-size-tablet); line-height: var(--omnise-labelTypo-line-height-tablet); letter-spacing: var(--omnise-labelTypo-letter-spacing-tablet); text-align: var(--omnise-labelTypo-text-align-tablet); } .omnise-option-active-value { font-size: var(--omnise-activeValueTypo-font-size-tablet); line-height: var(--omnise-activeValueTypo-line-height-tablet); letter-spacing: var(--omnise-activeValueTypo-letter-spacing-tablet); text-align: var(--omnise-activeValueTypo-text-align-tablet); } } @media (max-width: 767px) { .omnise-option-lb { font-size: var(--omnise-labelTypo-font-size-mobile); line-height: var(--omnise-labelTypo-line-height-mobile); letter-spacing: var(--omnise-labelTypo-letter-spacing-mobile); text-align: var(--omnise-labelTypo-text-align-mobile); } .omnise-option-active-value { font-size: var(--omnise-activeValueTypo-font-size-mobile); line-height: var(--omnise-activeValueTypo-line-height-mobile); letter-spacing: var(--omnise-activeValueTypo-letter-spacing-mobile); text-align: var(--omnise-activeValueTypo-text-align-mobile); } } /* ===== SWATCH WRAP ===== */ .omnise-swatch { display: flex; flex-wrap: wrap; gap: 6px; &.omnise-p{ justify-content: var(--omnise-p-text-align, start); } &.omnise-p2{ justify-content: var(--omnise-p2-text-align, start); } &.omnise-p3{ justify-content: var(--omnise-p3-text-align, start); } @media (min-width: 767.79px) and (max-width: 1180px) { &.omnise-p{ justify-content: var(--omnise-p-text-align-tablet, var(--omnise-p-text-align, start)); } &.omnise-p2{ justify-content: var(--omnise-p2-text-align-tablet, var(--omnise-p2-text-align, start)); } &.omnise-p3{ justify-content: var(--omnise-p3-text-align-tablet, var(--omnise-p3-text-align, start)); } } @media (max-width: 767px) { &.omnise-p{ justify-content: var(--omnise-p-text-align-mobile, var(--omnise-p-text-align, start)); } &.omnise-p2{ justify-content: var(--omnise-p2-text-align-mobile, var(--omnise-p2-text-align, start)); } &.omnise-p3{ justify-content: var(--omnise-p3-text-align-mobile, var(--omnise-p3-text-align, start)); } } } /* ===== RADIO ===== */ .omnise-radio-wrap { display: inline-flex; align-items: center; cursor: pointer; margin: 0; position: relative; transition: all 0.2s; } .omnise-radio { position: absolute; opacity: 0; pointer-events: none; } .omnise-radio-lb { display: inline-block; padding-inline: var(--wey2o7-paddingX, 20px); padding-block: var(--wey2o7-paddingY, 12px); background-color: var(--wey2o7-tabBg, #F5F5F5); cursor: pointer; border-style: var(--wey2o7-borderStyle, none); border-color: var(--wey2o7-borderColor, #D1D1D1); border-width: var(--wey2o7-borderWidth,0px); border-radius: var(--wey2o7-borderRadius, 0px); box-shadow: var(--wey2o7-shadowHorizontal, 0px) var(--wey2o7-shadowVertical, 0px) var(--wey2o7-shadowBlur, 0px) 1px color-mix( in srgb, var(--wey2o7-shadowColor, #000000) var(--wey2o7-shadowTransparent, 0%), transparent ); transition: all 0.2s; } /* ===== HOVER ===== */ .omnise-radio-wrap:hover .omnise-radio-lb { background-color: var(--wey2o7-tabBgHover,#cccccc); color: var(--wey2o7-colorHover,#333333); border-color: var(--wey2o7-borderColorHover, var(--wey2o7-borderColor, #D1D1D1)); } /* ===== ACTIVE ===== */ .omnise-radio:checked + .omnise-radio-lb { background-color: var(--wey2o7-tabBgActive, #000); color: var(--wey2o7-colorActive, #fff); border-color: var(--wey2o7-borderColorActive, var(--wey2o7-borderColor, #D1D1D1)); } /* ===== DISABLED ===== */ .omnise-variant-disabled { opacity: 0.3 !important; pointer-events: none !important; cursor: not-allowed !important; } /* ===== COLOR SWATCH ===== */ .omnise-swatch-color, .omnise-swatch-image { width: var(--wey2o7-sizeColor,40px); height: var(--wey2o7-sizeColor,40px); padding: 0; overflow: hidden; transition: all .2s; border-radius: if(style(--wey2o7-styleColor : true ): 50%; else: var(--wey2o7-borderRadius,0px)); border: var(--wey2o7-borderWidth,0) solid color-mix( in srgb, var(--wey2o7-borderColor,#D1D1D1) 30%, transparent ); box-shadow: var(--wey2o7-shadowHorizontal,0px) var(--wey2o7-shadowVertical,0px) var(--wey2o7-shadowBlur,0px) 1px color-mix( in srgb, var(--wey2o7-shadowColor,#000) var(--wey2o7-shadowTransparent,0%), transparent ); .omnise-radio-lb { display: none; } &:hover { border-color: var(--wey2o7-borderColorHover,#000); } &:has(.omnise-radio:checked) { border-color: var(--wey2o7-borderColorActive,#000); padding: 2px !important; } &.omnise-variant-disabled { position: relative; &::after { content: ""; position: absolute; inset: 0; border-radius: inherit; mask-image: linear-gradient( to bottom left, transparent calc(50% - 1px), black 50%, transparent calc(50% + 1px) ); mask-mode: alpha; background: #000; pointer-events: none; z-index: 2; } } @media (min-width: 767.79px) and (max-width:1180px) { width: var(--wey2o7-sizeColor-tablet,var(--wey2o7-sizeColor,40px)); height: var(--wey2o7-sizeColor-tablet,var(--wey2o7-sizeColor,40px)); } @media (max-width:767px) { width: var(--wey2o7-sizeColor-mobile,var(--wey2o7-sizeColor,40px)); height: var(--wey2o7-sizeColor-mobile,var(--wey2o7-sizeColor,40px)); } } .omnise-swatch-color { background-color: #eee; background-clip: content-box; } .omnise-swatch-image { background-color: #eee; background-position: center; background-repeat: no-repeat; background-size: cover; } /* ===== DROPDOWN ===== */ .omnise-swatch-sel { display: inline-block; padding-inline: var(--wey2o7-paddingX, 20px); padding-block: var(--wey2o7-paddingY, 12px); background-color: var(--wey2o7-tabBg, #F5F5F5); cursor: pointer; border-style: var(--wey2o7-borderStyle, none); border-color: var(--wey2o7-borderColor, #D1D1D1); border-width: var(--wey2o7-borderWidth,0px); border-radius: var(--wey2o7-borderRadius, 0px); box-shadow: var(--wey2o7-shadowHorizontal, 0px) var(--wey2o7-shadowVertical, 0px) var(--wey2o7-shadowBlur, 0px) 1px color-mix( in srgb, var(--wey2o7-shadowColor, #000000) var(--wey2o7-shadowTransparent, 0%), transparent ); transition: all 0.2s; } .omnise-swatch-sel:hover { color: var(--wey2o7-colorHover, #333333); background-color: var(--wey2o7-tabBgHover, #cccccc); border-color: var(--wey2o7-borderColorHover, #000000); } .omnise-swatch-sel:disabled { opacity: 0.5; cursor: not-allowed; } } }[data-bnode="omnise-a2sjao"] { --a2sjao-width: 130px; --a2sjao-width-tablet: 130px; --a2sjao-width-mobile: 130px; --a2sjao-height: 45px; --a2sjao-height-tablet: 45px; --a2sjao-height-mobile: 45px; --a2sjao-borderStyle: none; --a2sjao-borderStyle-tablet: none; --a2sjao-borderStyle-mobile: none; --a2sjao-margin-top: 0px; --a2sjao-margin-top-tablet: 0px; --a2sjao-margin-top-mobile: 0px; --a2sjao-margin-right: 0px; --a2sjao-margin-right-tablet: 0px; --a2sjao-margin-right-mobile: 0px; --a2sjao-margin-bottom: 16px; --a2sjao-margin-bottom-tablet: 16px; --a2sjao-margin-bottom-mobile: 16px; --a2sjao-margin-left: 0px; --a2sjao-margin-left-tablet: 0px; --a2sjao-margin-left-mobile: 0px; --a2sjao-enableShadow: false; --a2sjao-enableShadow-tablet: false; --a2sjao-enableShadow-mobile: false; --a2sjao-btnWdith: 80px; --a2sjao-btnWdith-tablet: 80px; --a2sjao-btnWdith-mobile: 80px; --a2sjao-typography: p; --a2sjao-typography-tablet: p; --a2sjao-typography-mobile: p; --a2sjao-inputWidth: 60px; --a2sjao-inputWidth-tablet: 60px; --a2sjao-inputWidth-mobile: 60px; --a2sjao-btnWidth: 40px; --a2sjao-btnWidth-tablet: 40px; --a2sjao-btnWidth-mobile: 40px; --omnise-p-font-weight: 600; --omnise-p-color: #000000; }[data-bnode="omnise-a2sjao"] { margin-top: var(--a2sjao-margin-top, 0px); margin-right: var(--a2sjao-margin-right, 0px); margin-bottom: var(--a2sjao-margin-bottom, 0px); margin-left: var(--a2sjao-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--a2sjao-margin-top-tablet, 0px); margin-right: var(--a2sjao-margin-right-tablet, 0px); margin-bottom: var(--a2sjao-margin-bottom-tablet, 0px); margin-left: var(--a2sjao-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--a2sjao-margin-top-mobile, 0px); margin-right: var(--a2sjao-margin-right-mobile, 0px); margin-bottom: var(--a2sjao-margin-bottom-mobile, 0px); margin-left: var(--a2sjao-margin-left-mobile, 0px); } &.omnise-qty { display: flex; flex-direction: column; gap: var(--a2sjao-gap, 16px); @media(min-width: 767.79px) and (max-width: 1180px) { gap: var(--a2sjao-gap-tablet, 16px); } @media(max-width: 767px) { gap: var(--a2sjao-gap-mobile, 16px); } .omnise-qty-wrap { display: flex; align-items: stretch; width: if(style(--a2sjao-inputWidth: 100%): 100%; else: fit-content); border-style: var(--a2sjao-borderStyle,solid); border-color: var(--a2sjao-borderColor,#000000); border-width: var(--a2sjao-borderWidth-tl,0px) var(--a2sjao-borderWidth-tr,0px) var(--a2sjao-borderWidth-br,0px) var(--a2sjao-borderWidth-bl,0px); border-radius: var(--a2sjao-borderRadius-tl,0px) var(--a2sjao-borderRadius-tr,0px) var(--a2sjao-borderRadius-br,0px) var(--a2sjao-borderRadius-bl,0px); box-shadow: var(--a2sjao-shadowHorizontal, 0) var(--a2sjao-shadowVertical, 0) var(--a2sjao-shadowBlur, 0) 0 var(--a2sjao-shadowColor, #000000); overflow: hidden; @media(min-width: 767.79px) and (max-width: 1180px) { width: if(style(--a2sjao-inputWidth-tablet: 100%): 100%; else: fit-content); border-width: var(--a2sjao-borderWidth-tl-tablet, 0px) var(--a2sjao-borderWidth-tr-tablet, 0px) var(--a2sjao-borderWidth-br-tablet, 0px) var(--a2sjao-borderWidth-bl-tablet, 0px); border-radius: var(--a2sjao-borderRadius-tl-tablet, 0px) var(--a2sjao-borderRadius-tr-tablet, 0px) var(--a2sjao-borderRadius-br-tablet, 0px) var(--a2sjao-borderRadius-bl-tablet, 0px); } @media(max-width: 767px) { width: if(style(--a2sjao-inputWidth-mobile: 100%): 100%; else: fit-content); border-width: var(--a2sjao-borderWidth-tl-mobile, 0px) var(--a2sjao-borderWidth-tr-mobile, 0px) var(--a2sjao-borderWidth-br-mobile, 0px) var(--a2sjao-borderWidth-bl-mobile, 0px); border-radius: var(--a2sjao-borderRadius-tl-mobile, 0px) var(--a2sjao-borderRadius-tr-mobile, 0px) var(--a2sjao-borderRadius-br-mobile, 0px) var(--a2sjao-borderRadius-bl-mobile, 0px); } } .omnise-qty-btn { display: flex; align-items: center; justify-content: center; width: var(--a2sjao-btnWidth, 40px); height: var(--a2sjao-btnWidth, 40px); padding: 0; border: none; background: var(--a2sjao-btnBg, #f5f5f5); color: var(--a2sjao-btnColor, #333); cursor: pointer; transition: opacity 0.2s; @media(min-width: 767.79px) and (max-width: 1180px) { width: var(--a2sjao-btnWidth-tablet, 40px); height: var(--a2sjao-btnWidth-tablet, 40px); } @media(max-width: 767px) { width: var(--a2sjao-btnWidth-mobile, 40px); height: var(--a2sjao-btnWidth-mobile, 40px); } } .omnise-qty-input { flex: 1; min-width: 0; width: var(--a2sjao-inputWidth, 40px); text-align: center; border: none; color: var(--a2sjao-inputColor, #333); background: var(--a2sjao-inputBg, #ffffff); font-size: 16px; @media(min-width: 767.79px) and (max-width: 1180px) { width: var(--a2sjao-inputWidth-tablet, 40px); } @media(max-width: 767px) { width: var(--a2sjao-inputWidth-mobile, 40px); } } .omnise-qty-input::-webkit-outer-spin-button, .omnise-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .omnise-qty-input:focus { outline: none; } .omnise-qty-warning { color: #f59e0b; } } }[data-bnode="omnise-qxt0e6"] { --qxt0e6-button: pr; --qxt0e6-button-tablet: pr; --qxt0e6-button-mobile: pr; --qxt0e6-width: fill; --qxt0e6-width-tablet: fill; --qxt0e6-width-mobile: fill; --qxt0e6-transform: none; --qxt0e6-transform-tablet: none; --qxt0e6-transform-mobile: none; --qxt0e6-iconWidth: 20px; --qxt0e6-iconWidth-tablet: 20px; --qxt0e6-iconWidth-mobile: 20px; --qxt0e6-iconGap: 5px; --qxt0e6-iconGap-tablet: 5px; --qxt0e6-iconGap-mobile: 5px; --omnise-btn-te-label-color: #121212; --omnise-btn-height-tablet: 44px; --omnise-btn-pr-background-color: #05480d; --omnise-btn-font-size: 25px; }[data-bnode="omnise-qxt0e6"] { margin-top: var(--qxt0e6-margin-top, 0px); margin-right: var(--qxt0e6-margin-right, 0px); margin-bottom: var(--qxt0e6-margin-bottom, 0px); margin-left: var(--qxt0e6-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--qxt0e6-margin-top-tablet, 0px); margin-right: var(--qxt0e6-margin-right-tablet, 0px); margin-bottom: var(--qxt0e6-margin-bottom-tablet, 0px); margin-left: var(--qxt0e6-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--qxt0e6-margin-top-mobile, 0px); margin-right: var(--qxt0e6-margin-right-mobile, 0px); margin-bottom: var(--qxt0e6-margin-bottom-mobile, 0px); margin-left: var(--qxt0e6-margin-left-mobile, 0px); } &.omnise-atc-btn { gap: var(--qxt0e6-iconGap); &.omnise-btn-pr:hover{ background-color: if( style(--qxt0e6-bgBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-background-color), white calc(abs(var(--qxt0e6-bgBtnHover)) * 1%)); style(--qxt0e6-bgBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-background-color), black calc(abs(var(--qxt0e6-bgBtnHover)) * 1%)); else: var(--omnise-btn-pr-background-hover) ); color: if( style(--qxt0e6-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-label-color), white calc(abs(var(--qxt0e6-labelBtnHover)) * 1%)); style(--qxt0e6-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-label-color), black calc(abs(var(--qxt0e6-labelBtnHover)) * 1%)); else: var(--omnise-btn-pr-label-hover) ); outline-color: if( style(--qxt0e6-borderBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-borde-color), white calc(abs(var(--qxt0e6-borderBtnHover)) * 1%)); style(--qxt0e6-borderBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-border-color), black calc(abs(var(--qxt0e6-borderBtnHover)) * 1%)); else: var(--omnise-btn-pr-border-hover) ); } &.omnise-btn-se:hover{ background-color: if( style(--qxt0e6-bgBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-background-color), white calc(abs(var(--qxt0e6-bgBtnHover)) * 1%)); style(--qxt0e6-bgBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-background-color), black calc(abs(var(--qxt0e6-bgBtnHover)) * 1%)); else: var(--omnise-btn-se-background-hover) ); color: if( style(--qxt0e6-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-label-color), white calc(abs(var(--qxt0e6-labelBtnHover)) * 1%)); style(--qxt0e6-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-label-color), black calc(abs(var(--qxt0e6-labelBtnHover)) * 1%)); else: var(--omnise-btn-se-label-hover) ); outline-color: if( style(--qxt0e6-borderBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-borde-color), white calc(abs(var(--qxt0e6-borderBtnHover)) * 1%)); style(--qxt0e6-borderBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-border-color), black calc(abs(var(--qxt0e6-borderBtnHover)) * 1%)); else: var(--omnise-btn-se-border-hover) ); } &.omnise-btn-te:hover{ color: if( style(--qxt0e6-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-te-label-color), white calc(abs(var(--qxt0e6-labelBtnHover)) * 1%)); style(--qxt0e6-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-te-label-color), black calc(abs(var(--qxt0e6-labelBtnHover)) * 1%)); else: var(--omnise-btn-te-label-hover) ); } &:disabled { opacity: 0.5; pointer-events: none; } span{ display: flex; } svg { width: var(--qxt0e6-iconWidth,20px); min-width: var(--qxt0e6-iconWidth,20px); height: 100%; } &[omnise-btn-po="right"] { flex-direction: row-reverse; svg { margin-right: 0; } } @media (min-width: 768px) and (max-width: 1180px) { &:not(.omnise-btn-te){ height: var(--omnise-btn-height-tablet); } gap: var(--qxt0e6-iconGap-tablet); svg { width: var(--qxt0e6-iconWidth-tablet,var(--qxt0e6-iconWidth,20px)); min-width: var(--qxt0e6-iconWidth-tablet,var(--qxt0e6-iconWidth,20px)); height: 100%; } } @media(max-width: 767px){ gap: var(--qxt0e6-iconGap-mobile); &:not(.omnise-btn-te){ height: var(--omnise-btn-height-mobile, var(--omnise-btn-height)); } svg { width: var(--qxt0e6-iconWidth-mobile,var(--qxt0e6-iconWidth,20px)); min-width: var(--qxt0e6-iconWidth-mobile,var(--qxt0e6-iconWidth,20px)); height: 100%; } } } }[data-bnode="omnise-iulau5"] {        flex-wrap: nowrap;        gap: 8px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-iulau5"] {                gap: 8px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-iulau5"] {                gap: 8px;     }  }[data-bnode="omnise-ar2v8l"] { --ar2v8l-listType: grid; --ar2v8l-listType-tablet: grid; --ar2v8l-listType-mobile: grid; --ar2v8l-columns: 1; --ar2v8l-columns-tablet: 1; --ar2v8l-columns-mobile: 1; --ar2v8l-navType: true; --ar2v8l-navType-tablet: true; --ar2v8l-navType-mobile: true; --ar2v8l-navColor: #333333; --ar2v8l-navColor-tablet: #333333; --ar2v8l-navColor-mobile: #333333; --ar2v8l-pagiType: true; --ar2v8l-pagiType-tablet: true; --ar2v8l-pagiType-mobile: true; --ar2v8l-gap: 10px; --ar2v8l-gap-tablet: 10px; --ar2v8l-gap-mobile: 8px; --ar2v8l-statePagination: normal; --ar2v8l-statePagination-tablet: normal; --ar2v8l-statePagination-mobile: normal; --ar2v8l-columnsMobile-mobile: 1; }[data-bnode="omnise-ar2v8l"] { margin-top: var(--ar2v8l-margin-top, 0px); margin-right: var(--ar2v8l-margin-right, 0px); margin-bottom: var(--ar2v8l-margin-bottom, 0px); margin-left: var(--ar2v8l-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--ar2v8l-margin-top-tablet, 0px); margin-right: var(--ar2v8l-margin-right-tablet, 0px); margin-bottom: var(--ar2v8l-margin-bottom-tablet, 0px); margin-left: var(--ar2v8l-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--ar2v8l-margin-top-mobile, 0px); margin-right: var(--ar2v8l-margin-right-mobile, 0px); margin-bottom: var(--ar2v8l-margin-bottom-mobile, 0px); margin-left: var(--ar2v8l-margin-left-mobile, 0px); } &.omnise-content-list { @media (min-width: 1180px) { & .omnise-slider-wrapper[data-desktop-layout="slider"] { .omnise-slider-items { gap: var(--ar2v8l-gap, var(--omnise-grid-gap, 20px)); .omnise-slider-item { flex: 0 0 calc( ( 100% - var(--ar2v8l-gap, var(--omnise-grid-gap, 20px)) * (var(--ar2v8l-columns, 3) - 1) + 1px ) / var(--ar2v8l-columns, 3) ); &:last-child { margin-right: var(--ar2v8l-gap, var(--omnise-grid-gap, 20px)); } } } } & .omnise-slider-wrapper[data-desktop-layout="grid"] { &[data-item="1"] { .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--ar2v8l-columns, 3), minmax(0, 1fr)); gap: var(--ar2v8l-gap, var(--omnise-grid-gap, 20px)); .omnise-slider-item { min-width: 0; } } } } @media (min-width: 767.79px) and (max-width: 1180px) { & .omnise-slider-wrapper[data-tablet-layout="slider"] { .omnise-slider-items { gap: var(--ar2v8l-gap-tablet, var(--omnise-grid-gap-tablet, 20px)); .omnise-slider-item { flex: 0 0 calc( ( 100% - var(--ar2v8l-gap-tablet, var(--omnise-grid-gap-tablet, 16px)) * (var(--ar2v8l-columns-tablet, 3) - 1) ) / var(--ar2v8l-columns-tablet, 3) ); &:last-child { margin-right: var(--ar2v8l-gap-tablet, var(--omnise-grid-gap-tablet, 16px) ); } } } } & .omnise-slider-wrapper[data-tablet-layout="grid"] { &[data-item-tablet="1"] { .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--ar2v8l-columns-tablet, 3), minmax(0, 1fr)); gap: var(--ar2v8l-gap-tablet, var(--omnise-grid-gap-tablet, 16px)); .omnise-slider-item { min-width: 0; } } } } @media (max-width: 767px) { & .omnise-slider-wrapper[data-mobile-layout="slider"] { .omnise-slider-items { gap: var(--ar2v8l-gap-mobile, var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item { flex: 0 0 calc( ( 100% - var(--ar2v8l-gap-mobile, 20px) * (var(--ar2v8l-columnsMobile-mobile, 1) - 1) ) / var(--ar2v8l-columnsMobile-mobile, 1) ); &:last-child { margin-right: var(--ar2v8l-gap-mobile, 20px); } } } } & .omnise-slider-wrapper[data-mobile-layout="grid"] { &[data-item-mobile="1"] { .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat( var(--ar2v8l-columnsMobile-mobile, 1), minmax(0, 1fr) ); gap: var(--ar2v8l-gap-mobile, var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item { min-width: 0; } } } } /* Navigation & Pagination */ .omnise-slider-nav-left, .omnise-slider-nav-right { padding: var(--ar2v8l-navPadding, 12px); background: var(--ar2v8l-navBg, #f5f5f5); color: var(--ar2v8l-navColor, #333333); cursor: pointer; &:hover { background: var(--ar2v8l-navBgHover, #cccccc); color: var(--ar2v8l-navColorHover, #333333); } svg { width: var(--ar2v8l-navIconSize, 20px); height: var(--ar2v8l-navIconSize, 20px); } } & .omnise-slider-wrapper[data-pagination="dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--ar2v8l-pagiBg, #e6e6e6); &.active { background: var(--ar2v8l-pagiBgActive, #181818); } &:not(.active):hover { background: var(--ar2v8l-pagiBgHover, #cccccc); } } & .omnise-slider-wrapper[data-pagination="numbers"] + .omnise-slider-controls .omnise-slider-pagination { color: var(--ar2v8l-pagiColor, #e6e6e6); &.active { color: var(--ar2v8l-pagiColorActive, #181818); } &:not(.active):hover { color: var(--ar2v8l-pagiColorHover, #181818); } } & .omnise-slider-wrapper[data-pagination="counter"] + .omnise-slider-controls .omnise-slider-pagination-total { color: var(--ar2v8l-pagiColor, #e6e6e6); } & .omnise-slider-wrapper[data-pagination="dynamic-dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--ar2v8l-pagiBg, #e6e6e6); &.active { background: var(--ar2v8l-pagiBgActive, #181818); opacity: 1; } &:not(.active):hover { background: var(--ar2v8l-pagiBgHover, #cccccc); } } .omnise-slider-pagination-wrp { margin-top: 20px; } } }[data-bnode="omnise-pf8vhb"] {        flex-wrap: wrap;        gap: 0px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-pf8vhb"] {                gap: 0px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-pf8vhb"] {                gap: 0px;     }  }[data-bnode="omnise-n15zv6"] { --n15zv6-headerState: hover; --n15zv6-headerState-tablet: hover; --n15zv6-headerState-mobile: hover; --n15zv6-tabBgActive: #ffffff00; --n15zv6-tabBgActive-tablet: #ffffff00; --n15zv6-tabBgActive-mobile: #ffffff00; --n15zv6-paddingX: 0; --n15zv6-paddingX-tablet: 0; --n15zv6-paddingX-mobile: 0; --n15zv6-paddingY: 12px; --n15zv6-paddingY-tablet: 12px; --n15zv6-paddingY-mobile: 12px; --n15zv6-borderStyle: none; --n15zv6-borderStyle-tablet: none; --n15zv6-borderStyle-mobile: none; --n15zv6-headingTypo: h4; --n15zv6-headingTypo-tablet: h4; --n15zv6-headingTypo-mobile: h4; --n15zv6-borderWidth-tl: 1px; --n15zv6-borderWidth-tl-tablet: 1px; --n15zv6-borderWidth-tl-mobile: 1px; --n15zv6-borderWidth-tr: 1px; --n15zv6-borderWidth-tr-tablet: 1px; --n15zv6-borderWidth-tr-mobile: 1px; --n15zv6-borderWidth-bl: 1px; --n15zv6-borderWidth-bl-tablet: 1px; --n15zv6-borderWidth-bl-mobile: 1px; --n15zv6-borderWidth-br: 1px; --n15zv6-borderWidth-br-tablet: 1px; --n15zv6-borderWidth-br-mobile: 1px; --n15zv6-borderColor: #e6e6e6; --n15zv6-borderColor-tablet: #e6e6e6; --n15zv6-borderColor-mobile: #e6e6e6; --omnise-h5-text-align: start; --omnise-h4-text-align: start; --n15zv6-gap: 0px; --n15zv6-gap-tablet: 0px; --n15zv6-gap-mobile: 0px; }[data-bnode="omnise-n15zv6"] { margin-top: var(--n15zv6-margin-top, 0px); margin-right: var(--n15zv6-margin-right, 0px); margin-bottom: var(--n15zv6-margin-bottom, 0px); margin-left: var(--n15zv6-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--n15zv6-margin-top-tablet, 0px); margin-right: var(--n15zv6-margin-right-tablet, 0px); margin-bottom: var(--n15zv6-margin-bottom-tablet, 0px); margin-left: var(--n15zv6-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--n15zv6-margin-top-mobile, 0px); margin-right: var(--n15zv6-margin-right-mobile, 0px); margin-bottom: var(--n15zv6-margin-bottom-mobile, 0px); margin-left: var(--n15zv6-margin-left-mobile, 0px); } &.omnise-accordion-root { display: flex; flex-direction: column; width: 100%; gap: var(--n15zv6-gap, 16px); @media(min-width: 767.79px) and (max-width: 1180px){ gap: var(--n15zv6-gap-tablet, 16px); } @media(max-width: 767px){ gap: var(--n15zv6-gap-mobile, 16px); } > .omnise-accordion-item { border-style: var(--n15zv6-borderStyle,solid); border-color: var(--n15zv6-borderColor,#000000); border-width: var(--n15zv6-borderWidth-tl,0px) var(--n15zv6-borderWidth-tr,0px) var(--n15zv6-borderWidth-br,0px) var(--n15zv6-borderWidth-bl,0px); border-radius: var(--n15zv6-borderRadius-tl,0px) var(--n15zv6-borderRadius-tr,0px) var(--n15zv6-borderRadius-br,0px) var(--n15zv6-borderRadius-bl,0px); box-shadow: var(--n15zv6-shadowHorizontal, 0px) var(--n15zv6-shadowVertical, 0px) var(--n15zv6-shadowBlur, 0px) 1px color-mix( in srgb, var(--n15zv6-shadowColor, #000000) var(--n15zv6-shadowTransparent, 0%), transparent ); overflow: hidden; transition: all 0.3s ease; @media(min-width: 767.79px) and (max-width: 1180px){ border-width: var(--n15zv6-borderWidth-tl-tablet,0px) var(--n15zv6-borderWidth-tr-tablet,0px) var(--n15zv6-borderWidth-br-tablet,0px) var(--n15zv6-borderWidth-bl-tablet,0px); border-radius: var(--n15zv6-borderRadius-tl-tablet,0px) var(--n15zv6-borderRadius-tr-tablet,0px) var(--n15zv6-borderRadius-br-tablet,0px) var(--n15zv6-borderRadius-bl-tablet,0px); } @media(max-width: 767px){ border-width: var(--n15zv6-borderWidth-tl-mobile,0px) var(--n15zv6-borderWidth-tr-mobile,0px) var(--n15zv6-borderWidth-br-mobile,0px) var(--n15zv6-borderWidth-bl-mobile,0px); border-radius: var(--n15zv6-borderRadius-tl-mobile,0px) var(--n15zv6-borderRadius-tr-mobile,0px) var(--n15zv6-borderRadius-br-mobile,0px) var(--n15zv6-borderRadius-bl-mobile,0px); } > .omnise-accordion-summary > .omnise-accordion-icon { flex-shrink: 0; svg, path { transform: rotate(0); transform-origin: center; transition: transform .5s cubic-bezier(.3, 1, .3, 1); width: 100%; height: 100%; } } &[open] { > .omnise-accordion-summary { color: var(--n15zv6-colorActive); background: var(--n15zv6-tabBgActive); } > .omnise-accordion-content { opacity: 1; } > .omnise-accordion-summary > .omnise-accordion-icon { .omnise-svg-plus{ .stroke-vertical{ transform: rotate(270deg); } } .omnise-icon-chevron{ transform: rotate(180deg); } .omnise-icon-arrow{ transform: rotate(90deg); } } } } > .omnise-accordion-item > .omnise-accordion-summary > .omnise-accordion-title { flex: auto; cursor: pointer; } > .omnise-accordion-item > .omnise-accordion-summary { display: flex; flex-direction: var(--omnise-icon-dir); justify-content: space-between; align-items: center; padding-inline: var(--n15zv6-paddingX, 20px); padding-block: var(--n15zv6-paddingY, 20px); cursor: pointer; list-style: none; user-select: none; transition: background 0.2s; gap: 10px; background: var(--n15zv6-tabBg); &:marker { display: none; } &:hover { background: var(--n15zv6-tabBgHover); color: var(--n15zv6-colorHover); } @media(min-width: 767.79px) and (max-width: 1180px) { padding-inline: var(--n15zv6-paddingX-tablet, 20px); padding-block: var(--n15zv6-paddingY-tablet, 20px); } @media(max-width: 767px) { padding-inline: var(--n15zv6-paddingX-mobile, 20px); padding-block: var(--n15zv6-paddingY-mobile, 20px); } } > .omnise-accordion-item > .omnise-accordion-summary > .omnise-accordion-icon { display: flex; align-items: center; justify-content: center; transition: transform 0.3s ease; } > .omnise-accordion-item > .omnise-accordion-content { opacity: 0; animation: omniseSlideDown 0.3s ease-out; } > .omnise-accordion-item > .omnise-accordion-summary > .omnise-accordion-icon .omnise-icon-plus::before { content: "+"; font-size: 1.2em; } } } @keyframes omniseSlideDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }[data-bnode="omnise-8ivuyg"] { padding-top: 0px; padding-right: 0px; padding-bottom: 16px; padding-left: 0px; } [data-bnode="omnise-8ivuyg"] {        flex-wrap: nowrap;        gap: 0px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-8ivuyg"] {                gap: 0px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-8ivuyg"] {                gap: 0px;     }  }[data-bnode="omnise-vfrol4"] { --omnise-p-font-size-mobile: 16px; --omnise-p-line-height-tablet: 1.8; --omnise-p-line-height-mobile: 1.8; --omnise-p-letter-spacing-mobile: 0px; --vfrol4-typography: p; --vfrol4-typography-tablet: p; --vfrol4-typography-mobile: p; --omnise-p-text-align: start; --omnise-p-text-align-tablet: start; --omnise-p-text-align-mobile: start; }[data-bnode="omnise-vfrol4"] { margin-top: var(--vfrol4-margin-top, 0px); margin-right: var(--vfrol4-margin-right, 0px); margin-bottom: var(--vfrol4-margin-bottom, 0px); margin-left: var(--vfrol4-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--vfrol4-margin-top-tablet, 0px); margin-right: var(--vfrol4-margin-right-tablet, 0px); margin-bottom: var(--vfrol4-margin-bottom-tablet, 0px); margin-left: var(--vfrol4-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--vfrol4-margin-top-mobile, 0px); margin-right: var(--vfrol4-margin-right-mobile, 0px); margin-bottom: var(--vfrol4-margin-bottom-mobile, 0px); margin-left: var(--vfrol4-margin-left-mobile, 0px); } & { .omnise-description[data-omnise-description-content="true"] { overflow: hidden; max-height: var(--omnise-description-collapsed-height, 180px); transition: max-height 0.35s cubic-bezier(0.22, 1, 0.36, 1); position: relative; } &[data-omnise-description-expanded="true"] .omnise-description[data-omnise-description-content="true"] { max-height: none; } .omnise-description[data-omnise-description-content="true"]::before { content: ""; position: absolute; bottom: 0; height: 100px; width: 100%; display: block; background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff); pointer-events: none; opacity: 1; transform: translateY(0); transition: opacity 0.25s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1); } &[data-omnise-description-has-toggle="false"] .omnise-description[data-omnise-description-content="true"]::before { opacity: 0; transform: translateY(12px); } &[data-omnise-description-expanded="true"] .omnise-description[data-omnise-description-content="true"]::before { opacity: 0; transform: translateY(12px); } .omnise-description-toggle { margin-top: 12px; display: inline-flex; align-items: center; gap: 6px; border: 0; padding: 0; background: none; cursor: pointer; } .omnise-description-toggle-icon { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1); } .omnise-description-toggle-icon > svg, .omnise-description-toggle-icon > img { width: 100%; height: 100%; } &[data-omnise-description-expanded="true"] .omnise-description-toggle-icon { transform: rotate(180deg); } } & .omnise-description { p:only-child { margin: 0; } } }[data-bnode="omnise-ii6rwp"] { padding-top: 0px; padding-right: 0px; padding-bottom: 16px; padding-left: 0px; } [data-bnode="omnise-ii6rwp"] {        flex-wrap: nowrap;        gap: 20px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-ii6rwp"] {                gap: 20px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-ii6rwp"] {                gap: 20px;     }  }[data-bnode="omnise-dho16i"] { --dho16i-columns: 1; --dho16i-columns-tablet: 1; --dho16i-columns-mobile: 1; --dho16i-navType: true; --dho16i-navType-tablet: true; --dho16i-navType-mobile: true; --dho16i-pagiType: false; --dho16i-pagiType-tablet: false; --dho16i-pagiType-mobile: false; --dho16i-listType: grid; --dho16i-listType-tablet: grid; --dho16i-listType-mobile: grid; --dho16i-stateNavigation: normal; --dho16i-stateNavigation-tablet: normal; --dho16i-stateNavigation-mobile: normal; --dho16i-statePagination: normal; --dho16i-statePagination-tablet: normal; --dho16i-statePagination-mobile: normal; --dho16i-stateNavigtion: normal; --dho16i-stateNavigtion-tablet: normal; --dho16i-stateNavigtion-mobile: normal; --dho16i-gap: 0px; --dho16i-gap-tablet: 0px; --dho16i-gap-mobile: 0px; --dho16i-columnsMobile-mobile: 1; } [data-bnode="omnise-dho16i"] [data-bnode="omnise-contlp"] { --omnise-p-text-align: justify; } [data-bnode="omnise-dho16i"] [data-bnode="omnise-item2a"] { --item2a-direction: row; } [data-bnode="omnise-dho16i"] [data-bnode="omnise-9ybsgs"] { --9ybsgs-width: 100%; --9ybsgs-imageRatio: auto; --9ybsgs-objFit: cover; --9ybsgs-borderColor: #000000; --9ybsgs-shadowColor: #000000; --9ybsgs-borderStyle: none; --9ybsgs-enableShadow: false; } [data-bnode="omnise-dho16i"] [data-bnode="omnise-c654e4"] { --c654e4-typography: h5; --omnise-h5-text-align: start; } [data-bnode="omnise-dho16i"] [data-bnode="omnise-rqwkaa"] { --rqwkaa-typography: p; --omnise-p-font-size-mobile: 16px; --omnise-p-line-height-mobile: 1.5; --omnise-p-letter-spacing-mobile: 0px; } [data-bnode="omnise-dho16i"] [data-bnode="omnise-ufncyx"] { --ufncyx-direction: column; --ufncyx-structure: columns; --ufncyx-gap: 4px; }[data-bnode="omnise-dho16i"] { margin-top: var(--dho16i-margin-top, 0px); margin-right: var(--dho16i-margin-right, 0px); margin-bottom: var(--dho16i-margin-bottom, 0px); margin-left: var(--dho16i-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--dho16i-margin-top-tablet, 0px); margin-right: var(--dho16i-margin-right-tablet, 0px); margin-bottom: var(--dho16i-margin-bottom-tablet, 0px); margin-left: var(--dho16i-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--dho16i-margin-top-mobile, 0px); margin-right: var(--dho16i-margin-right-mobile, 0px); margin-bottom: var(--dho16i-margin-bottom-mobile, 0px); margin-left: var(--dho16i-margin-left-mobile, 0px); } &.omnise-content-list { .omnise-slider-item{ > .omnise-slot[data-bnode="be-ctl-item"]{ height: 100%; } } @media (min-width: 1180px) { & .omnise-slider-wrapper[data-desktop-layout="slider"]{ .omnise-slider-items { gap: var(--dho16i-gap,var(--omnise-grid-gap, 20px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--dho16i-gap,var(--omnise-grid-gap, 20px)) * (var(--dho16i-columns, 3) - 1)) / var(--dho16i-columns, 3)); &:last-child{ margin-right: var(--dho16i-gap,var(--omnise-grid-gap, 20px)); } } } } & .omnise-slider-wrapper[data-desktop-layout="grid"]{ &[data-item="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--dho16i-columns, 3), minmax(0, 1fr)); gap: var(--dho16i-gap,var(--omnise-grid-gap, 20px)); .omnise-slider-item { min-width: 0; } } } } @media (min-width: 767.79px) and (max-width: 1180px) { & .omnise-slider-wrapper[data-tablet-layout="slider"]{ .omnise-slider-items { gap: var(--dho16i-gap-tablet,var(--omnise-grid-gap-tablet, 20px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--dho16i-gap-tablet,var(--omnise-grid-gap-tablet, 16px)) * (var(--dho16i-columns-tablet, 3) - 1)) / var(--dho16i-columns-tablet, 3)); &:last-child{ margin-right: var(--dho16i-gap-tablet,var(--omnise-grid-gap-tablet, 16px)); } } } } & .omnise-slider-wrapper[data-tablet-layout="grid"]{ &[data-item-tablet="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--dho16i-columns-tablet, 3), minmax(0, 1fr)); gap: var(--dho16i-gap-tablet,var(--omnise-grid-gap-tablet, 16px)); .omnise-slider-item { min-width: 0; } } } } @media (max-width: 767px) { & .omnise-slider-wrapper[data-mobile-layout="slider"]{ .omnise-slider-items { gap: var(--dho16i-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item{ flex: 0 0 calc((100% - var(--dho16i-gap-mobile,var(--omnise-grid-gap-mobile, 10px)) * (var(--dho16i-columnsMobile-mobile, 1) - 1)) / var(--dho16i-columnsMobile-mobile, 1)); &:last-child{ margin-right: var(--dho16i-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); } } } } & .omnise-slider-wrapper[data-mobile-layout="grid"]{ &[data-item-mobile="1"]{ .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--dho16i-columnsMobile-mobile, 1), minmax(0, 1fr)); gap: var(--dho16i-gap-mobile,var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item { min-width: 0; } } } } /* Navigation & Pagination */ .omnise-slider-nav-left, .omnise-slider-nav-right { padding: var(--dho16i-navPadding,12px); background:var(--dho16i-navBg,#F5F5F5); color: var(--dho16i-navColor,var(--omnise-text-color)); cursor: pointer; border-radius: var(--dho16i-navRadius,50%); &:hover { background:var(--dho16i-navBgHover,#CCCCCC); color: var(--dho16i-navColorHover,var(--omnise-text-color)); } svg { width: var(--dho16i-navIconSize,20px); height: var(--dho16i-navIconSize,20px); } } & .omnise-slider-wrapper[data-pagination="dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--dho16i-pagiBg,#E6E6E6); &.active { background:var(--dho16i-pagiBgActive,#181818); } &:not(.active):hover { background:var(--dho16i-pagiBgHover,#CCCCCC); } } & .omnise-slider-wrapper[data-pagination="numbers"] + .omnise-slider-controls .omnise-slider-pagination { color: var(--dho16i-pagiColor,#e6e6e6); &.active { color:var(--dho16i-pagiColorActive,#181818); } &:not(.active):hover { color: var(--dho16i-pagiColorHover,#181818); } } & .omnise-slider-wrapper[data-pagination="counter"] + .omnise-slider-controls .omnise-slider-pagination-total { color: var(--dho16i-pagiColor,#e6e6e6); } & .omnise-slider-wrapper[data-pagination="dynamic-dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--dho16i-pagiBg,#E6E6E6); &.active { background: var(--dho16i-pagiBgActive,#181818); opacity: 1; } &:not(.active):hover { background: var(--dho16i-pagiBgHover,#CCCCCC); } } .omnise-slider-pagination-wrp{ margin-top: 20px; } } & .omnise-content-list-empty { min-height: 80px; display: flex; align-items: center; justify-content: center; background-color: #f0f0f0; color: #666; } & .omnise-content-list-empty button { padding: 12px; cursor: pointer; border: none; background: transparent; } & [data-bnode="be-ctl-item"] { min-height: 0; } & .be-ctl-item-empty { min-height: 60px; display: flex; align-items: center; justify-content: center; background-color: #f8f8f8; } } [data-bnode="omnise-dho16i"] [data-bnode="omnise-y8nd2n"] { margin-top: var(--y8nd2n-margin-top, 0px); margin-right: var(--y8nd2n-margin-right, 0px); margin-bottom: var(--y8nd2n-margin-bottom, 0px); margin-left: var(--y8nd2n-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--y8nd2n-margin-top-tablet, 0px); margin-right: var(--y8nd2n-margin-right-tablet, 0px); margin-bottom: var(--y8nd2n-margin-bottom-tablet, 0px); margin-left: var(--y8nd2n-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--y8nd2n-margin-top-mobile, 0px); margin-right: var(--y8nd2n-margin-right-mobile, 0px); margin-bottom: var(--y8nd2n-margin-bottom-mobile, 0px); margin-left: var(--y8nd2n-margin-left-mobile, 0px); } & { display: flex; align-items:center; justify-content: center; padding: var(--y8nd2n-padding, 4px); border-style: var(--y8nd2n-borderStyle,solid); border-color: var(--y8nd2n-borderColor,#000000); border-width: var(--y8nd2n-borderWidth-tl,0px) var(--y8nd2n-borderWidth-tr,0px) var(--y8nd2n-borderWidth-br,0px) var(--y8nd2n-borderWidth-bl,0px); border-radius: var(--y8nd2n-borderRadius-tl,0px) var(--y8nd2n-borderRadius-tr,0px) var(--y8nd2n-borderRadius-br,0px) var(--y8nd2n-borderRadius-bl,0px); box-shadow: if( style(--y8nd2n-enableShadow: true): var(--y8nd2n-shadowHorizontal, 0) var(--y8nd2n-shadowVertical, 0) var(--y8nd2n-shadowBlur, 0) 1px var(--y8nd2n-shadowColor, #000000); else: none ); color: var(--y8nd2n-iconColor,var(--omnise-text-color)); background-color: var(--y8nd2n-backgroundColor); overflow: hidden; width: var(--y8nd2n-size, 28px); min-width: var(--y8nd2n-size, 28px); height: fit-content; max-width: var(--y8nd2n-size, 28px); width: var(--y8nd2n-size-tablet, 28px); @media(min-width: 767.79px) and (max-width: 1180px){ border-width: var(--y8nd2n-borderWidth-tl-tablet,0px) var(--y8nd2n-borderWidth-tr-tablet,0px) var(--y8nd2n-borderWidth-br-tablet,0px) var(--y8nd2n-borderWidth-bl-tablet,0px); border-radius: var(--y8nd2n-borderRadius-tl-tablet,0px) var(--y8nd2n-borderRadius-tr-tablet,0px) var(--y8nd2n-borderRadius-br-tablet,0px) var(--y8nd2n-borderRadius-bl-tablet,0px); min-width: var(--y8nd2n-size-tablet, var(--y8nd2n-size, 28px)); max-width: var(--y8nd2n-size-tablet, var(--y8nd2n-size, 28px)); } @media(max-width: 767px){ width: var(--y8nd2n-size-mobile, var(--y8nd2n-size-tablet, var(--y8nd2n-size, 28px))); min-width: var(--y8nd2n-size-mobile, var(--y8nd2n-size-tablet, var(--y8nd2n-size, 28px))); max-width: var(--y8nd2n-size-mobile, var(--y8nd2n-size-tablet, var(--y8nd2n-size, 28px))); border-width: var(--y8nd2n-borderWidth-tl-mobile,0px) var(--y8nd2n-borderWidth-tr-mobile,0px) var(--y8nd2n-borderWidth-br-mobile,0px) var(--y8nd2n-borderWidth-bl-mobile,0px); border-radius: var(--y8nd2n-borderRadius-tl-mobile,0px) var(--y8nd2n-borderRadius-tr-mobile,0px) var(--y8nd2n-borderRadius-br-mobile,0px) var(--y8nd2n-borderRadius-bl-mobile,0px); } svg { width: 100%; height: 100%; } } } [data-bnode="omnise-dho16i"] [data-bnode="omnise-rqwkaa"] { margin-top: var(--rqwkaa-margin-top, 0px); margin-right: var(--rqwkaa-margin-right, 0px); margin-bottom: var(--rqwkaa-margin-bottom, 0px); margin-left: var(--rqwkaa-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--rqwkaa-margin-top-tablet, 0px); margin-right: var(--rqwkaa-margin-right-tablet, 0px); margin-bottom: var(--rqwkaa-margin-bottom-tablet, 0px); margin-left: var(--rqwkaa-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--rqwkaa-margin-top-mobile, 0px); margin-right: var(--rqwkaa-margin-right-mobile, 0px); margin-bottom: var(--rqwkaa-margin-bottom-mobile, 0px); margin-left: var(--rqwkaa-margin-left-mobile, 0px); } }[data-bnode="omnise-dho16i"] [data-bnode="be-ctl-item"] {   gap: 4px;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-dho16i"] [data-bnode="be-ctl-item"] {    gap: 4px;   }  }  @media (max-width: 767px) {   [data-bnode="omnise-dho16i"] [data-bnode="be-ctl-item"] {    gap: 4px;   }  }[data-bnode="omnise-dho16i"] [data-bnode="be-ctl-item"] {     flex-direction: row;   flex-wrap: nowrap;        gap: 4px;        &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-dho16i"] [data-bnode="be-ctl-item"] {                gap: 4px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-dho16i"] [data-bnode="be-ctl-item"] {                gap: 4px;     }  }[data-bnode="omnise-ufncyx"] {        flex-wrap: nowrap;        gap: 4px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-ufncyx"] {                gap: 4px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-ufncyx"] {                gap: 4px;     }  }[data-bnode="omnise-rux6e5"] { padding-top: 0px; padding-right: 0px; padding-bottom: 16px; padding-left: 0px; } [data-bnode="omnise-rux6e5"] {        flex-wrap: nowrap;        gap: 2px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-rux6e5"] {                gap: 2px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-rux6e5"] {                gap: 2px;     }  }[data-bnode="omnise-qka7sz"] { margin-top: var(--qka7sz-margin-top, 0px); margin-right: var(--qka7sz-margin-right, 0px); margin-bottom: var(--qka7sz-margin-bottom, 0px); margin-left: var(--qka7sz-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--qka7sz-margin-top-tablet, 0px); margin-right: var(--qka7sz-margin-right-tablet, 0px); margin-bottom: var(--qka7sz-margin-bottom-tablet, 0px); margin-left: var(--qka7sz-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--qka7sz-margin-top-mobile, 0px); margin-right: var(--qka7sz-margin-right-mobile, 0px); margin-bottom: var(--qka7sz-margin-bottom-mobile, 0px); margin-left: var(--qka7sz-margin-left-mobile, 0px); } }[data-bnode="omnise-2awoaj"] {        flex-wrap: nowrap;        gap: 16px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-2awoaj"] {                gap: 16px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-2awoaj"] {                gap: 16px;     }  }[data-bnode="omnise-6pr9rm"] {     flex-direction: row;   flex-wrap: nowrap;     align-items: center;   gap: 20px;        &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-6pr9rm"] {                gap: 20px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-6pr9rm"] {                gap: 20px;     }  }[data-bnode="omnise-m4he25"] { --m4he25-width: 100px; --m4he25-width-tablet: 100px; --m4he25-width-mobile: 100px; --m4he25-imageRatio: 1/1; --m4he25-imageRatio-tablet: 1/1; --m4he25-imageRatio-mobile: 1/1; --m4he25-objFit: cover; --m4he25-objFit-tablet: cover; --m4he25-objFit-mobile: cover; --m4he25-borderStyle: none; --m4he25-borderStyle-tablet: none; --m4he25-borderStyle-mobile: none; }[data-bnode="omnise-m4he25"] { margin-top: var(--m4he25-margin-top, 0px); margin-right: var(--m4he25-margin-right, 0px); margin-bottom: var(--m4he25-margin-bottom, 0px); margin-left: var(--m4he25-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--m4he25-margin-top-tablet, 0px); margin-right: var(--m4he25-margin-right-tablet, 0px); margin-bottom: var(--m4he25-margin-bottom-tablet, 0px); margin-left: var(--m4he25-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--m4he25-margin-top-mobile, 0px); margin-right: var(--m4he25-margin-right-mobile, 0px); margin-bottom: var(--m4he25-margin-bottom-mobile, 0px); margin-left: var(--m4he25-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--m4he25-width,100%) - var(--m4he25-margin-left,0px) - var(--m4he25-margin-right,0px)); width: calc(var(--m4he25-width,100%) - var(--m4he25-margin-left,0px) - var(--m4he25-margin-right,0px)); min-height: min-content; border-color: var(--m4he25-borderColor,var(--omnise-card-media-border-color)); border-style: var(--m4he25-borderStyle,solid); border-width: var(--m4he25-borderWidth-tl,var(--omnise-card-border-width)) var(--m4he25-borderWidth-tr,var(--omnise-card-border-width)) var(--m4he25-borderWidth-br,var(--omnise-card-border-width)) var(--m4he25-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--m4he25-borderRadius-tl,var(--omnise-card-border-radius)) var(--m4he25-borderRadius-tr,var(--omnise-card-border-radius)) var(--m4he25-borderRadius-br,var(--omnise-card-border-radius)) var(--m4he25-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--m4he25-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--m4he25-borderWidth-tl-tablet, var(--m4he25-borderWidth-tl,var(--omnise-card-border-width))) var(--m4he25-borderWidth-tr-tablet, var(--m4he25-borderWidth-tr,var(--omnise-card-border-width))) var(--m4he25-borderWidth-br-tablet, var(--m4he25-borderWidth-br,var(--omnise-card-border-width))) var(--m4he25-borderWidth-bl-tablet, var(--m4he25-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--m4he25-borderRadius-tl-tablet, var(--m4he25-borderRadius-tl,var(--omnise-card-border-radius))) var(--m4he25-borderRadius-tr-tablet, var(--m4he25-borderRadius-tr,var(--omnise-card-border-radius))) var(--m4he25-borderRadius-br-tablet, var(--m4he25-borderRadius-br,var(--omnise-card-border-radius))) var(--m4he25-borderRadius-bl-tablet, var(--m4he25-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--m4he25-borderWidth-tl-mobile, var(--m4he25-borderWidth-tl,var(--omnise-card-border-width))) var(--m4he25-borderWidth-tr-mobile, var(--m4he25-borderWidth-tr,var(--omnise-card-border-width))) var(--m4he25-borderWidth-br-mobile, var(--m4he25-borderWidth-br,var(--omnise-card-border-width))) var(--m4he25-borderWidth-bl-mobile, var(--m4he25-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--m4he25-borderRadius-tl-mobile, var(--m4he25-borderRadius-tl,var(--omnise-card-border-radius))) var(--m4he25-borderRadius-tr-mobile, var(--m4he25-borderRadius-tr,var(--omnise-card-border-radius))) var(--m4he25-borderRadius-br-mobile, var(--m4he25-borderRadius-br,var(--omnise-card-border-radius))) var(--m4he25-borderRadius-bl-mobile, var(--m4he25-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--m4he25-shadowHorizontal, var(--omnise-card-shadow-x)) var(--m4he25-shadowVertical, var(--omnise-card-shadow-y)) var(--m4he25-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--m4he25-shadowColor, var(--omnise-card-media-shadow-color)) var(--m4he25-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--m4he25-overlayColor-color, #000); opacity: var(--m4he25-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--m4he25-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--m4he25-width-tablet,var(--m4he25-width,100%)) - var(--m4he25-margin-left-tablet,var(--m4he25-margin-left,0px)) - var(--m4he25-margin-right-tablet,var(--m4he25-margin-right,0px))); width: calc(var(--m4he25-width-tablet,var(--m4he25-width,100%)) - var(--m4he25-margin-left-tablet,var(--m4he25-margin-left,0px)) - var(--m4he25-margin-right-tablet,var(--m4he25-margin-right,0px))); aspect-ratio: var(--m4he25-imageRatio-tablet, var(--m4he25-imageRatio, auto)); img { object-fit: var(--m4he25-objFit-tablet, var(--m4he25-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--m4he25-width-mobile,var(--m4he25-width,100%)) - var(--m4he25-margin-left-mobile,var(--m4he25-margin-left,0px)) - var(--m4he25-margin-right-mobile,var(--m4he25-margin-right,0px))); width: calc(var(--m4he25-width-mobile,var(--m4he25-width,100%)) - var(--m4he25-margin-left-mobile,var(--m4he25-margin-left,0px)) - var(--m4he25-margin-right-mobile,var(--m4he25-margin-right,0px))); aspect-ratio: var(--m4he25-imageRatio-mobile, var(--m4he25-imageRatio, auto)); img { object-fit: var(--m4he25-objFit-mobile, var(--m4he25-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-jn3h6w"] { --jn3h6w-typography: h3; --jn3h6w-typography-tablet: h3; --jn3h6w-typography-mobile: h3; --omnise-h3-text-align: start; --omnise-h3-text-align-tablet: start; --omnise-h3-text-align-mobile: start; }[data-bnode="omnise-jn3h6w"] { margin-top: var(--jn3h6w-margin-top, 0px); margin-right: var(--jn3h6w-margin-right, 0px); margin-bottom: var(--jn3h6w-margin-bottom, 0px); margin-left: var(--jn3h6w-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--jn3h6w-margin-top-tablet, 0px); margin-right: var(--jn3h6w-margin-right-tablet, 0px); margin-bottom: var(--jn3h6w-margin-bottom-tablet, 0px); margin-left: var(--jn3h6w-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--jn3h6w-margin-top-mobile, 0px); margin-right: var(--jn3h6w-margin-right-mobile, 0px); margin-bottom: var(--jn3h6w-margin-bottom-mobile, 0px); margin-left: var(--jn3h6w-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--jn3h6w-highlightColor,var(--omnise-p-color)); top: var(--jn3h6w-highlightTop, 100%); } }[data-bnode="omnise-s5fuzr"] { --omnise-p-text-align-tablet: start; --omnise-p-text-align-mobile: start; --s5fuzr-typography: p; --s5fuzr-typography-tablet: p; --s5fuzr-typography-mobile: p; --omnise-p-text-align: start; }[data-bnode="omnise-s5fuzr"] { margin-top: var(--s5fuzr-margin-top, 0px); margin-right: var(--s5fuzr-margin-right, 0px); margin-bottom: var(--s5fuzr-margin-bottom, 0px); margin-left: var(--s5fuzr-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--s5fuzr-margin-top-tablet, 0px); margin-right: var(--s5fuzr-margin-right-tablet, 0px); margin-bottom: var(--s5fuzr-margin-bottom-tablet, 0px); margin-left: var(--s5fuzr-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--s5fuzr-margin-top-mobile, 0px); margin-right: var(--s5fuzr-margin-right-mobile, 0px); margin-bottom: var(--s5fuzr-margin-bottom-mobile, 0px); margin-left: var(--s5fuzr-margin-left-mobile, 0px); } }[data-bnode="omnise-oyxun1"] { --oyxun1-button: se; --oyxun1-button-tablet: se; --oyxun1-button-mobile: se; }[data-bnode="omnise-oyxun1"] { margin-top: var(--oyxun1-margin-top, 0px); margin-right: var(--oyxun1-margin-right, 0px); margin-bottom: var(--oyxun1-margin-bottom, 0px); margin-left: var(--oyxun1-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--oyxun1-margin-top-tablet, 0px); margin-right: var(--oyxun1-margin-right-tablet, 0px); margin-bottom: var(--oyxun1-margin-bottom-tablet, 0px); margin-left: var(--oyxun1-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--oyxun1-margin-top-mobile, 0px); margin-right: var(--oyxun1-margin-right-mobile, 0px); margin-bottom: var(--oyxun1-margin-bottom-mobile, 0px); margin-left: var(--oyxun1-margin-left-mobile, 0px); } &{ gap:var(--oyxun1-iconGap,5px); &.omnise-btn-pr:hover{ background-color: if( style(--oyxun1-bgBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-background-color), white calc(abs(var(--oyxun1-bgBtnHover)) * 1%)); style(--oyxun1-bgBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-background-color), black calc(abs(var(--oyxun1-bgBtnHover)) * 1%)); else: var(--omnise-btn-pr-background-hover) ); color: if( style(--oyxun1-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-label-color), white calc(abs(var(--oyxun1-labelBtnHover)) * 1%)); style(--oyxun1-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-label-color), black calc(abs(var(--oyxun1-labelBtnHover)) * 1%)); else: var(--omnise-btn-pr-label-hover) ); outline-color: if( style(--oyxun1-borderBtnHover < 0): color-mix(in srgb, var(--omnise-btn-pr-borde-color), white calc(abs(var(--oyxun1-borderBtnHover)) * 1%)); style(--oyxun1-borderBtnHover > 0): color-mix(in srgb, var(--omnise-btn-pr-border-color), black calc(abs(var(--oyxun1-borderBtnHover)) * 1%)); else: var(--omnise-btn-pr-border-hover) ); } &.omnise-btn-se:hover{ background-color: if( style(--oyxun1-bgBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-background-color), white calc(abs(var(--oyxun1-bgBtnHover)) * 1%)); style(--oyxun1-bgBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-background-color), black calc(abs(var(--oyxun1-bgBtnHover)) * 1%)); else: var(--omnise-btn-se-background-hover) ); color: if( style(--oyxun1-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-label-color), white calc(abs(var(--oyxun1-labelBtnHover)) * 1%)); style(--oyxun1-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-label-color), black calc(abs(var(--oyxun1-labelBtnHover)) * 1%)); else: var(--omnise-btn-se-label-hover) ); outline-color: if( style(--oyxun1-borderBtnHover < 0): color-mix(in srgb, var(--omnise-btn-se-borde-color), white calc(abs(var(--oyxun1-borderBtnHover)) * 1%)); style(--oyxun1-borderBtnHover > 0): color-mix(in srgb, var(--omnise-btn-se-border-color), black calc(abs(var(--oyxun1-borderBtnHover)) * 1%)); else: var(--omnise-btn-se-border-hover) ); } &.omnise-btn-te:hover{ color: if( style(--oyxun1-labelBtnHover < 0): color-mix(in srgb, var(--omnise-btn-te-label-color), white calc(abs(var(--oyxun1-labelBtnHover)) * 1%)); style(--oyxun1-labelBtnHover > 0): color-mix(in srgb, var(--omnise-btn-te-label-color), black calc(abs(var(--oyxun1-labelBtnHover)) * 1%)); else: var(--omnise-btn-te-label-hover) ); } span{ display: flex; font-size: var(--oyxun1-iconWidth); } svg { width: var(--oyxun1-iconWidth,20px); min-width: var(--oyxun1-iconWidth,20px); height: 100%; } @media(min-width: 767.79px) and (max-width: 1180px){ gap: var(--oyxun1-iconGap-tablet); &:not(.omnise-btn-te){ height: var(--omnise-btn-height-tablet, var(--omnise-btn-height)); } span{ font-size: var(--oyxun1-iconWidth-tablet, var(--oyxun1-iconWidth)); } svg { width: var(--oyxun1-iconWidth-tablet, var(--oyxun1-iconWidth, 20px)); min-width: var(--oyxun1-iconWidth-tablet, var(--oyxun1-iconWidth, 20px)); height: 100%; } } @media(max-width: 767px){ gap: var(--oyxun1-iconGap-mobile); &:not(.omnise-btn-te){ height: var(--omnise-btn-height-mobile, var(--omnise-btn-height)); } span{ font-size: var(--oyxun1-iconWidth-mobile, var(--oyxun1-iconWidth)); } svg { width: var(--oyxun1-iconWidth-mobile, var(--oyxun1-iconWidth, 20px)); min-width: var(--oyxun1-iconWidth-mobile, var(--oyxun1-iconWidth, 20px)); height: 100%; } } } &[omnise-btn-po="right"] { flex-direction: row-reverse; svg{ margin-right:0; } } }[data-bnode="omnise-ylzgad"] {        flex-wrap: nowrap;        gap: 16px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-ylzgad"] {                gap: 16px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-ylzgad"] {                gap: 16px;     }  }[data-bnode="omnise-487kw0"] { --487kw0-listType: slider; --487kw0-listType-tablet: slider; --487kw0-listType-mobile: slider; --487kw0-columns: 6; --487kw0-columns-tablet: 5; --487kw0-columns-mobile: 5; --487kw0-navType: true; --487kw0-navType-tablet: true; --487kw0-navType-mobile: true; --487kw0-navColor: #333333; --487kw0-navColor-tablet: #333333; --487kw0-navColor-mobile: #333333; --487kw0-pagiType: true; --487kw0-pagiType-tablet: true; --487kw0-pagiType-mobile: true; --487kw0-gap: 8px; --487kw0-gap-tablet: 8px; --487kw0-gap-mobile: 8px; --487kw0-statePagination: normal; --487kw0-statePagination-tablet: normal; --487kw0-statePagination-mobile: normal; --487kw0-columnsMobile-mobile: 2; }[data-bnode="omnise-487kw0"] { margin-top: var(--487kw0-margin-top, 0px); margin-right: var(--487kw0-margin-right, 0px); margin-bottom: var(--487kw0-margin-bottom, 0px); margin-left: var(--487kw0-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--487kw0-margin-top-tablet, 0px); margin-right: var(--487kw0-margin-right-tablet, 0px); margin-bottom: var(--487kw0-margin-bottom-tablet, 0px); margin-left: var(--487kw0-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--487kw0-margin-top-mobile, 0px); margin-right: var(--487kw0-margin-right-mobile, 0px); margin-bottom: var(--487kw0-margin-bottom-mobile, 0px); margin-left: var(--487kw0-margin-left-mobile, 0px); } &.omnise-content-list { @media (min-width: 1180px) { & .omnise-slider-wrapper[data-desktop-layout="slider"] { .omnise-slider-items { gap: var(--487kw0-gap, var(--omnise-grid-gap, 20px)); .omnise-slider-item { flex: 0 0 calc( ( 100% - var(--487kw0-gap, var(--omnise-grid-gap, 20px)) * (var(--487kw0-columns, 3) - 1) + 1px ) / var(--487kw0-columns, 3) ); &:last-child { margin-right: var(--487kw0-gap, var(--omnise-grid-gap, 20px)); } } } } & .omnise-slider-wrapper[data-desktop-layout="grid"] { &[data-item="1"] { .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--487kw0-columns, 3), minmax(0, 1fr)); gap: var(--487kw0-gap, var(--omnise-grid-gap, 20px)); .omnise-slider-item { min-width: 0; } } } } @media (min-width: 767.79px) and (max-width: 1180px) { & .omnise-slider-wrapper[data-tablet-layout="slider"] { .omnise-slider-items { gap: var(--487kw0-gap-tablet, var(--omnise-grid-gap-tablet, 20px)); .omnise-slider-item { flex: 0 0 calc( ( 100% - var(--487kw0-gap-tablet, var(--omnise-grid-gap-tablet, 16px)) * (var(--487kw0-columns-tablet, 3) - 1) ) / var(--487kw0-columns-tablet, 3) ); &:last-child { margin-right: var(--487kw0-gap-tablet, var(--omnise-grid-gap-tablet, 16px) ); } } } } & .omnise-slider-wrapper[data-tablet-layout="grid"] { &[data-item-tablet="1"] { .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat(var(--487kw0-columns-tablet, 3), minmax(0, 1fr)); gap: var(--487kw0-gap-tablet, var(--omnise-grid-gap-tablet, 16px)); .omnise-slider-item { min-width: 0; } } } } @media (max-width: 767px) { & .omnise-slider-wrapper[data-mobile-layout="slider"] { .omnise-slider-items { gap: var(--487kw0-gap-mobile, var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item { flex: 0 0 calc( ( 100% - var(--487kw0-gap-mobile, 20px) * (var(--487kw0-columnsMobile-mobile, 1) - 1) ) / var(--487kw0-columnsMobile-mobile, 1) ); &:last-child { margin-right: var(--487kw0-gap-mobile, 20px); } } } } & .omnise-slider-wrapper[data-mobile-layout="grid"] { &[data-item-mobile="1"] { .omnise-slider-items { grid-template-columns: minmax(0, 1fr); } } .omnise-slider-items { display: grid; grid-template-columns: repeat( var(--487kw0-columnsMobile-mobile, 1), minmax(0, 1fr) ); gap: var(--487kw0-gap-mobile, var(--omnise-grid-gap-mobile, 10px)); .omnise-slider-item { min-width: 0; } } } } /* Navigation & Pagination */ .omnise-slider-nav-left, .omnise-slider-nav-right { padding: var(--487kw0-navPadding, 12px); background: var(--487kw0-navBg, #f5f5f5); color: var(--487kw0-navColor, #333333); cursor: pointer; &:hover { background: var(--487kw0-navBgHover, #cccccc); color: var(--487kw0-navColorHover, #333333); } svg { width: var(--487kw0-navIconSize, 20px); height: var(--487kw0-navIconSize, 20px); } } & .omnise-slider-wrapper[data-pagination="dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--487kw0-pagiBg, #e6e6e6); &.active { background: var(--487kw0-pagiBgActive, #181818); } &:not(.active):hover { background: var(--487kw0-pagiBgHover, #cccccc); } } & .omnise-slider-wrapper[data-pagination="numbers"] + .omnise-slider-controls .omnise-slider-pagination { color: var(--487kw0-pagiColor, #e6e6e6); &.active { color: var(--487kw0-pagiColorActive, #181818); } &:not(.active):hover { color: var(--487kw0-pagiColorHover, #181818); } } & .omnise-slider-wrapper[data-pagination="counter"] + .omnise-slider-controls .omnise-slider-pagination-total { color: var(--487kw0-pagiColor, #e6e6e6); } & .omnise-slider-wrapper[data-pagination="dynamic-dots"] + .omnise-slider-controls .omnise-slider-pagination { background: var(--487kw0-pagiBg, #e6e6e6); &.active { background: var(--487kw0-pagiBgActive, #181818); opacity: 1; } &:not(.active):hover { background: var(--487kw0-pagiBgHover, #cccccc); } } .omnise-slider-pagination-wrp { margin-top: 20px; } } }[data-bnode="omnise-114kdb"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;    flex-direction: row;   flex-wrap: nowrap;              &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-114kdb"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                    &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }   }  }  @media (max-width: 767px) {   [data-bnode="omnise-114kdb"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                    &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(100.00% - 0px - 0px);    }   }  }[data-bnode="omnise-bkmt6h"] { padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } [data-bnode="omnise-bkmt6h"] {     flex-direction: row;   flex-wrap: nowrap;        gap: 0px;      &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(50.00% - 0px - 0px);    }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-bkmt6h"] {                gap: 40px;      &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(50.00% - 0px - 0px);    }   }  }  @media (max-width: 767px) {   [data-bnode="omnise-bkmt6h"] {      flex-direction: column;          gap: 32px;     }  }[data-bnode="omnise-smjdar"] { background: #004225; padding-top: 112px; padding-right: 112px; padding-bottom: 112px; padding-left: 112px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-smjdar"] { padding-top: 40px; padding-right: 20px; padding-bottom: 40px; padding-left: 20px; } } @media (max-width: 767px) { [data-bnode="omnise-smjdar"] { padding-top: 40px; padding-right: 16px; padding-bottom: 40px; padding-left: 16px; } } [data-bnode="omnise-smjdar"] {        flex-wrap: nowrap;            }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-smjdar"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-smjdar"] {                     }  }[data-bnode="omnise-3iqrzf"] { --3iqrzf-typography: h2; --3iqrzf-typography-tablet: h2; --3iqrzf-typography-mobile: h2; --3iqrzf-margin-top: 0px; --3iqrzf-margin-top-tablet: 0px; --3iqrzf-margin-top-mobile: 0px; --3iqrzf-margin-right: 0px; --3iqrzf-margin-right-tablet: 0px; --3iqrzf-margin-right-mobile: 0px; --3iqrzf-margin-bottom: 16px; --3iqrzf-margin-bottom-tablet: 16px; --3iqrzf-margin-bottom-mobile: 16px; --3iqrzf-margin-left: 0px; --3iqrzf-margin-left-tablet: 0px; --3iqrzf-margin-left-mobile: 0px; --omnise-h2-color: #FEF6F6; }[data-bnode="omnise-3iqrzf"] { margin-top: var(--3iqrzf-margin-top, 0px); margin-right: var(--3iqrzf-margin-right, 0px); margin-bottom: var(--3iqrzf-margin-bottom, 0px); margin-left: var(--3iqrzf-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--3iqrzf-margin-top-tablet, 0px); margin-right: var(--3iqrzf-margin-right-tablet, 0px); margin-bottom: var(--3iqrzf-margin-bottom-tablet, 0px); margin-left: var(--3iqrzf-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--3iqrzf-margin-top-mobile, 0px); margin-right: var(--3iqrzf-margin-right-mobile, 0px); margin-bottom: var(--3iqrzf-margin-bottom-mobile, 0px); margin-left: var(--3iqrzf-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--3iqrzf-highlightColor,var(--omnise-p-color)); top: var(--3iqrzf-highlightTop, 100%); } }[data-bnode="omnise-yenxpb"] { --yenxpb-typography: p; --yenxpb-typography-tablet: p; --yenxpb-typography-mobile: p; --omnise-p-color: #F9F6F6; }[data-bnode="omnise-yenxpb"] { margin-top: var(--yenxpb-margin-top, 0px); margin-right: var(--yenxpb-margin-right, 0px); margin-bottom: var(--yenxpb-margin-bottom, 0px); margin-left: var(--yenxpb-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--yenxpb-margin-top-tablet, 0px); margin-right: var(--yenxpb-margin-right-tablet, 0px); margin-bottom: var(--yenxpb-margin-bottom-tablet, 0px); margin-left: var(--yenxpb-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--yenxpb-margin-top-mobile, 0px); margin-right: var(--yenxpb-margin-right-mobile, 0px); margin-bottom: var(--yenxpb-margin-bottom-mobile, 0px); margin-left: var(--yenxpb-margin-left-mobile, 0px); } }[data-bnode="omnise-e2ke98"] { --e2ke98-paddingX: 20px; --e2ke98-paddingX-tablet: 20px; --e2ke98-paddingX-mobile: 20px; --e2ke98-paddingY: 16px; --e2ke98-paddingY-tablet: 16px; --e2ke98-paddingY-mobile: 16px; --e2ke98-margin-top: 40px; --e2ke98-margin-top-tablet: 40px; --e2ke98-margin-top-mobile: 40px; --e2ke98-margin-right: 0px; --e2ke98-margin-right-tablet: 0px; --e2ke98-margin-right-mobile: 0px; --e2ke98-margin-bottom: 0px; --e2ke98-margin-bottom-tablet: 0px; --e2ke98-margin-bottom-mobile: 0px; --e2ke98-margin-left: 0px; --e2ke98-margin-left-tablet: 0px; --e2ke98-margin-left-mobile: 0px; --e2ke98-headerState: normal; --e2ke98-headerState-tablet: normal; --e2ke98-headerState-mobile: normal; --e2ke98-tabBg: #ffffff; --e2ke98-tabBg-tablet: #ffffff; --e2ke98-tabBg-mobile: #ffffff; --e2ke98-tabBgHover: #ffffff; --e2ke98-tabBgHover-tablet: #ffffff; --e2ke98-tabBgHover-mobile: #ffffff; --e2ke98-tabBgActive: #ffffff; --e2ke98-tabBgActive-tablet: #ffffff; --e2ke98-tabBgActive-mobile: #ffffff; --e2ke98-headingTypo: h5; --e2ke98-headingTypo-tablet: h5; --e2ke98-headingTypo-mobile: h5; --e2ke98-borderRadius-tl: 12px; --e2ke98-borderRadius-tl-tablet: 12px; --e2ke98-borderRadius-tl-mobile: 12px; --e2ke98-borderRadius-tr: 12px; --e2ke98-borderRadius-tr-tablet: 12px; --e2ke98-borderRadius-tr-mobile: 12px; --e2ke98-borderRadius-bl: 12px; --e2ke98-borderRadius-bl-tablet: 12px; --e2ke98-borderRadius-bl-mobile: 12px; --e2ke98-borderRadius-br: 12px; --e2ke98-borderRadius-br-tablet: 12px; --e2ke98-borderRadius-br-mobile: 12px; --omnise-h5-text-align: start; --e2ke98-colorHover: #000000; --e2ke98-colorHover-tablet: #000000; --e2ke98-colorHover-mobile: #000000; --e2ke98-colorActive: #0a0a0a; --e2ke98-colorActive-tablet: #0a0a0a; --e2ke98-colorActive-mobile: #0a0a0a; --omnise-h5-color: #0a0a0a; }[data-bnode="omnise-e2ke98"] { margin-top: var(--e2ke98-margin-top, 0px); margin-right: var(--e2ke98-margin-right, 0px); margin-bottom: var(--e2ke98-margin-bottom, 0px); margin-left: var(--e2ke98-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--e2ke98-margin-top-tablet, 0px); margin-right: var(--e2ke98-margin-right-tablet, 0px); margin-bottom: var(--e2ke98-margin-bottom-tablet, 0px); margin-left: var(--e2ke98-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--e2ke98-margin-top-mobile, 0px); margin-right: var(--e2ke98-margin-right-mobile, 0px); margin-bottom: var(--e2ke98-margin-bottom-mobile, 0px); margin-left: var(--e2ke98-margin-left-mobile, 0px); } &.omnise-accordion-root { display: flex; flex-direction: column; width: 100%; gap: var(--e2ke98-gap, 16px); @media(min-width: 767.79px) and (max-width: 1180px){ gap: var(--e2ke98-gap-tablet, 16px); } @media(max-width: 767px){ gap: var(--e2ke98-gap-mobile, 16px); } > .omnise-accordion-item { border-style: var(--e2ke98-borderStyle,solid); border-color: var(--e2ke98-borderColor,#000000); border-width: var(--e2ke98-borderWidth-tl,0px) var(--e2ke98-borderWidth-tr,0px) var(--e2ke98-borderWidth-br,0px) var(--e2ke98-borderWidth-bl,0px); border-radius: var(--e2ke98-borderRadius-tl,0px) var(--e2ke98-borderRadius-tr,0px) var(--e2ke98-borderRadius-br,0px) var(--e2ke98-borderRadius-bl,0px); box-shadow: var(--e2ke98-shadowHorizontal, 0px) var(--e2ke98-shadowVertical, 0px) var(--e2ke98-shadowBlur, 0px) 1px color-mix( in srgb, var(--e2ke98-shadowColor, #000000) var(--e2ke98-shadowTransparent, 0%), transparent ); overflow: hidden; transition: all 0.3s ease; @media(min-width: 767.79px) and (max-width: 1180px){ border-width: var(--e2ke98-borderWidth-tl-tablet,0px) var(--e2ke98-borderWidth-tr-tablet,0px) var(--e2ke98-borderWidth-br-tablet,0px) var(--e2ke98-borderWidth-bl-tablet,0px); border-radius: var(--e2ke98-borderRadius-tl-tablet,0px) var(--e2ke98-borderRadius-tr-tablet,0px) var(--e2ke98-borderRadius-br-tablet,0px) var(--e2ke98-borderRadius-bl-tablet,0px); } @media(max-width: 767px){ border-width: var(--e2ke98-borderWidth-tl-mobile,0px) var(--e2ke98-borderWidth-tr-mobile,0px) var(--e2ke98-borderWidth-br-mobile,0px) var(--e2ke98-borderWidth-bl-mobile,0px); border-radius: var(--e2ke98-borderRadius-tl-mobile,0px) var(--e2ke98-borderRadius-tr-mobile,0px) var(--e2ke98-borderRadius-br-mobile,0px) var(--e2ke98-borderRadius-bl-mobile,0px); } > .omnise-accordion-summary > .omnise-accordion-icon { flex-shrink: 0; svg, path { transform: rotate(0); transform-origin: center; transition: transform .5s cubic-bezier(.3, 1, .3, 1); width: 100%; height: 100%; } } &[open] { > .omnise-accordion-summary { color: var(--e2ke98-colorActive); background: var(--e2ke98-tabBgActive); } > .omnise-accordion-content { opacity: 1; } > .omnise-accordion-summary > .omnise-accordion-icon { .omnise-svg-plus{ .stroke-vertical{ transform: rotate(270deg); } } .omnise-icon-chevron{ transform: rotate(180deg); } .omnise-icon-arrow{ transform: rotate(90deg); } } } } > .omnise-accordion-item > .omnise-accordion-summary > .omnise-accordion-title { flex: auto; cursor: pointer; } > .omnise-accordion-item > .omnise-accordion-summary { display: flex; flex-direction: var(--omnise-icon-dir); justify-content: space-between; align-items: center; padding-inline: var(--e2ke98-paddingX, 20px); padding-block: var(--e2ke98-paddingY, 20px); cursor: pointer; list-style: none; user-select: none; transition: background 0.2s; gap: 10px; background: var(--e2ke98-tabBg); &:marker { display: none; } &:hover { background: var(--e2ke98-tabBgHover); color: var(--e2ke98-colorHover); } @media(min-width: 767.79px) and (max-width: 1180px) { padding-inline: var(--e2ke98-paddingX-tablet, 20px); padding-block: var(--e2ke98-paddingY-tablet, 20px); } @media(max-width: 767px) { padding-inline: var(--e2ke98-paddingX-mobile, 20px); padding-block: var(--e2ke98-paddingY-mobile, 20px); } } > .omnise-accordion-item > .omnise-accordion-summary > .omnise-accordion-icon { display: flex; align-items: center; justify-content: center; transition: transform 0.3s ease; } > .omnise-accordion-item > .omnise-accordion-content { opacity: 0; animation: omniseSlideDown 0.3s ease-out; } > .omnise-accordion-item > .omnise-accordion-summary > .omnise-accordion-icon .omnise-icon-plus::before { content: "+"; font-size: 1.2em; } } } @keyframes omniseSlideDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }[data-bnode="omnise-vkwimy"] { background: var(--omnise-background-color); padding-top: 0px; padding-right: 20px; padding-bottom: 16px; padding-left: 20px; } [data-bnode="omnise-vkwimy"] {        flex-wrap: nowrap;        gap: 16px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-vkwimy"] {                gap: 16px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-vkwimy"] {                gap: 16px;     }  }[data-bnode="omnise-iet8k1"] { margin-top: var(--iet8k1-margin-top, 0px); margin-right: var(--iet8k1-margin-right, 0px); margin-bottom: var(--iet8k1-margin-bottom, 0px); margin-left: var(--iet8k1-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--iet8k1-margin-top-tablet, 0px); margin-right: var(--iet8k1-margin-right-tablet, 0px); margin-bottom: var(--iet8k1-margin-bottom-tablet, 0px); margin-left: var(--iet8k1-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--iet8k1-margin-top-mobile, 0px); margin-right: var(--iet8k1-margin-right-mobile, 0px); margin-bottom: var(--iet8k1-margin-bottom-mobile, 0px); margin-left: var(--iet8k1-margin-left-mobile, 0px); } }[data-bnode="omnise-lr6lnw"] { background: var(--omnise-background-color); padding-top: 12px; padding-right: 20px; padding-bottom: 12px; padding-left: 20px; } [data-bnode="omnise-lr6lnw"] {        flex-wrap: nowrap;        gap: 16px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-lr6lnw"] {                gap: 16px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-lr6lnw"] {                gap: 16px;     }  }[data-bnode="omnise-kkpm2l"] { margin-top: var(--kkpm2l-margin-top, 0px); margin-right: var(--kkpm2l-margin-right, 0px); margin-bottom: var(--kkpm2l-margin-bottom, 0px); margin-left: var(--kkpm2l-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--kkpm2l-margin-top-tablet, 0px); margin-right: var(--kkpm2l-margin-right-tablet, 0px); margin-bottom: var(--kkpm2l-margin-bottom-tablet, 0px); margin-left: var(--kkpm2l-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--kkpm2l-margin-top-mobile, 0px); margin-right: var(--kkpm2l-margin-right-mobile, 0px); margin-bottom: var(--kkpm2l-margin-bottom-mobile, 0px); margin-left: var(--kkpm2l-margin-left-mobile, 0px); } }[data-bnode="omnise-a3xv22"] { background: var(--omnise-background-color); padding-top: 12px; padding-right: 20px; padding-bottom: 12px; padding-left: 20px; } [data-bnode="omnise-a3xv22"] {        flex-wrap: nowrap;        gap: 16px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-a3xv22"] {                gap: 16px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-a3xv22"] {                gap: 16px;     }  }[data-bnode="omnise-eu7yjn"] { margin-top: var(--eu7yjn-margin-top, 0px); margin-right: var(--eu7yjn-margin-right, 0px); margin-bottom: var(--eu7yjn-margin-bottom, 0px); margin-left: var(--eu7yjn-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--eu7yjn-margin-top-tablet, 0px); margin-right: var(--eu7yjn-margin-right-tablet, 0px); margin-bottom: var(--eu7yjn-margin-bottom-tablet, 0px); margin-left: var(--eu7yjn-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--eu7yjn-margin-top-mobile, 0px); margin-right: var(--eu7yjn-margin-right-mobile, 0px); margin-bottom: var(--eu7yjn-margin-bottom-mobile, 0px); margin-left: var(--eu7yjn-margin-left-mobile, 0px); } }[data-bnode="omnise-icgwvf"] { background: var(--omnise-background-color); padding-top: 12px; padding-right: 20px; padding-bottom: 12px; padding-left: 20px; } [data-bnode="omnise-icgwvf"] {        flex-wrap: nowrap;        gap: 16px;    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-icgwvf"] {                gap: 16px;     }  }  @media (max-width: 767px) {   [data-bnode="omnise-icgwvf"] {                gap: 16px;     }  }[data-bnode="omnise-w7auw0"] { margin-top: var(--w7auw0-margin-top, 0px); margin-right: var(--w7auw0-margin-right, 0px); margin-bottom: var(--w7auw0-margin-bottom, 0px); margin-left: var(--w7auw0-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--w7auw0-margin-top-tablet, 0px); margin-right: var(--w7auw0-margin-right-tablet, 0px); margin-bottom: var(--w7auw0-margin-bottom-tablet, 0px); margin-left: var(--w7auw0-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--w7auw0-margin-top-mobile, 0px); margin-right: var(--w7auw0-margin-right-mobile, 0px); margin-bottom: var(--w7auw0-margin-bottom-mobile, 0px); margin-left: var(--w7auw0-margin-left-mobile, 0px); } }[data-bnode="omnise-2wkae0"] {     flex-direction: row;   flex-wrap: nowrap;                &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-2wkae0"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-2wkae0"] {                     }  }[data-bnode="omnise-u3bvoj"] { --u3bvoj-width: 100%; --u3bvoj-width-tablet: 100%; --u3bvoj-width-mobile: 100%; --u3bvoj-imageRatio: auto; --u3bvoj-imageRatio-tablet: auto; --u3bvoj-imageRatio-mobile: auto; --u3bvoj-objFit: cover; --u3bvoj-objFit-tablet: cover; --u3bvoj-objFit-mobile: cover; --u3bvoj-borderColor: #000000; --u3bvoj-borderColor-tablet: #000000; --u3bvoj-borderColor-mobile: #000000; --u3bvoj-shadowColor: #000000; --u3bvoj-shadowColor-tablet: #000000; --u3bvoj-shadowColor-mobile: #000000; --u3bvoj-borderStyle: none; --u3bvoj-borderStyle-tablet: none; --u3bvoj-borderStyle-mobile: none; --u3bvoj-enableShadow: false; --u3bvoj-enableShadow-tablet: false; --u3bvoj-enableShadow-mobile: false; }[data-bnode="omnise-u3bvoj"] { margin-top: var(--u3bvoj-margin-top, 0px); margin-right: var(--u3bvoj-margin-right, 0px); margin-bottom: var(--u3bvoj-margin-bottom, 0px); margin-left: var(--u3bvoj-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--u3bvoj-margin-top-tablet, 0px); margin-right: var(--u3bvoj-margin-right-tablet, 0px); margin-bottom: var(--u3bvoj-margin-bottom-tablet, 0px); margin-left: var(--u3bvoj-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--u3bvoj-margin-top-mobile, 0px); margin-right: var(--u3bvoj-margin-right-mobile, 0px); margin-bottom: var(--u3bvoj-margin-bottom-mobile, 0px); margin-left: var(--u3bvoj-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--u3bvoj-width,100%) - var(--u3bvoj-margin-left,0px) - var(--u3bvoj-margin-right,0px)); width: calc(var(--u3bvoj-width,100%) - var(--u3bvoj-margin-left,0px) - var(--u3bvoj-margin-right,0px)); min-height: min-content; border-color: var(--u3bvoj-borderColor,var(--omnise-card-media-border-color)); border-style: var(--u3bvoj-borderStyle,solid); border-width: var(--u3bvoj-borderWidth-tl,var(--omnise-card-border-width)) var(--u3bvoj-borderWidth-tr,var(--omnise-card-border-width)) var(--u3bvoj-borderWidth-br,var(--omnise-card-border-width)) var(--u3bvoj-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--u3bvoj-borderRadius-tl,var(--omnise-card-border-radius)) var(--u3bvoj-borderRadius-tr,var(--omnise-card-border-radius)) var(--u3bvoj-borderRadius-br,var(--omnise-card-border-radius)) var(--u3bvoj-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--u3bvoj-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--u3bvoj-borderWidth-tl-tablet, var(--u3bvoj-borderWidth-tl,var(--omnise-card-border-width))) var(--u3bvoj-borderWidth-tr-tablet, var(--u3bvoj-borderWidth-tr,var(--omnise-card-border-width))) var(--u3bvoj-borderWidth-br-tablet, var(--u3bvoj-borderWidth-br,var(--omnise-card-border-width))) var(--u3bvoj-borderWidth-bl-tablet, var(--u3bvoj-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--u3bvoj-borderRadius-tl-tablet, var(--u3bvoj-borderRadius-tl,var(--omnise-card-border-radius))) var(--u3bvoj-borderRadius-tr-tablet, var(--u3bvoj-borderRadius-tr,var(--omnise-card-border-radius))) var(--u3bvoj-borderRadius-br-tablet, var(--u3bvoj-borderRadius-br,var(--omnise-card-border-radius))) var(--u3bvoj-borderRadius-bl-tablet, var(--u3bvoj-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--u3bvoj-borderWidth-tl-mobile, var(--u3bvoj-borderWidth-tl,var(--omnise-card-border-width))) var(--u3bvoj-borderWidth-tr-mobile, var(--u3bvoj-borderWidth-tr,var(--omnise-card-border-width))) var(--u3bvoj-borderWidth-br-mobile, var(--u3bvoj-borderWidth-br,var(--omnise-card-border-width))) var(--u3bvoj-borderWidth-bl-mobile, var(--u3bvoj-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--u3bvoj-borderRadius-tl-mobile, var(--u3bvoj-borderRadius-tl,var(--omnise-card-border-radius))) var(--u3bvoj-borderRadius-tr-mobile, var(--u3bvoj-borderRadius-tr,var(--omnise-card-border-radius))) var(--u3bvoj-borderRadius-br-mobile, var(--u3bvoj-borderRadius-br,var(--omnise-card-border-radius))) var(--u3bvoj-borderRadius-bl-mobile, var(--u3bvoj-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--u3bvoj-shadowHorizontal, var(--omnise-card-shadow-x)) var(--u3bvoj-shadowVertical, var(--omnise-card-shadow-y)) var(--u3bvoj-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--u3bvoj-shadowColor, var(--omnise-card-media-shadow-color)) var(--u3bvoj-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--u3bvoj-overlayColor-color, #000); opacity: var(--u3bvoj-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--u3bvoj-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--u3bvoj-width-tablet,var(--u3bvoj-width,100%)) - var(--u3bvoj-margin-left-tablet,var(--u3bvoj-margin-left,0px)) - var(--u3bvoj-margin-right-tablet,var(--u3bvoj-margin-right,0px))); width: calc(var(--u3bvoj-width-tablet,var(--u3bvoj-width,100%)) - var(--u3bvoj-margin-left-tablet,var(--u3bvoj-margin-left,0px)) - var(--u3bvoj-margin-right-tablet,var(--u3bvoj-margin-right,0px))); aspect-ratio: var(--u3bvoj-imageRatio-tablet, var(--u3bvoj-imageRatio, auto)); img { object-fit: var(--u3bvoj-objFit-tablet, var(--u3bvoj-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--u3bvoj-width-mobile,var(--u3bvoj-width,100%)) - var(--u3bvoj-margin-left-mobile,var(--u3bvoj-margin-left,0px)) - var(--u3bvoj-margin-right-mobile,var(--u3bvoj-margin-right,0px))); width: calc(var(--u3bvoj-width-mobile,var(--u3bvoj-width,100%)) - var(--u3bvoj-margin-left-mobile,var(--u3bvoj-margin-left,0px)) - var(--u3bvoj-margin-right-mobile,var(--u3bvoj-margin-right,0px))); aspect-ratio: var(--u3bvoj-imageRatio-mobile, var(--u3bvoj-imageRatio, auto)); img { object-fit: var(--u3bvoj-objFit-mobile, var(--u3bvoj-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-0c8isg"].omnise-section { padding-top: 40px; padding-bottom: 40px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-0c8isg"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } @media (max-width: 767px) { [data-bnode="omnise-0c8isg"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } [data-bnode="omnise-0c8isg"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;    flex-direction: row;   flex-wrap: nowrap;   justify-content: center;             &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-0c8isg"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                   }  }  @media (max-width: 767px) {   [data-bnode="omnise-0c8isg"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                   }  }[data-bnode="omnise-elcboh"] { border-style: solid; border-color: #000000; border-width: 0px 0px 0px 0px; border-radius: 24px 24px 24px 24px; } [data-bnode="omnise-elcboh"] {     flex-direction: row;   flex-wrap: nowrap;   justify-content: center;   align-items: center;           &>.omnise-slot[data-bnode-index] {       flex: 1;      }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-elcboh"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-elcboh"] {                     }  }[data-bnode="omnise-2lh5mr"] { --2lh5mr-width: 100%; --2lh5mr-width-tablet: 100%; --2lh5mr-width-mobile: 100%; --2lh5mr-imageRatio: 16/9; --2lh5mr-imageRatio-tablet: 3/2; --2lh5mr-imageRatio-mobile: 2/3; --2lh5mr-objFit: cover; --2lh5mr-objFit-tablet: cover; --2lh5mr-objFit-mobile: cover; --2lh5mr-borderColor: #000000; --2lh5mr-borderColor-tablet: #000000; --2lh5mr-borderColor-mobile: #000000; --2lh5mr-shadowColor: #000000; --2lh5mr-shadowColor-tablet: #000000; --2lh5mr-shadowColor-mobile: #000000; --2lh5mr-borderStyle: none; --2lh5mr-borderStyle-tablet: none; --2lh5mr-borderStyle-mobile: none; --2lh5mr-borderRadius-tl: 24px; --2lh5mr-borderRadius-tl-tablet: 24px; --2lh5mr-borderRadius-tl-mobile: 24px; --2lh5mr-borderRadius-tr: 24px; --2lh5mr-borderRadius-tr-tablet: 24px; --2lh5mr-borderRadius-tr-mobile: 24px; --2lh5mr-borderRadius-bl: 24px; --2lh5mr-borderRadius-bl-tablet: 24px; --2lh5mr-borderRadius-bl-mobile: 24px; --2lh5mr-borderRadius-br: 24px; --2lh5mr-borderRadius-br-tablet: 24px; --2lh5mr-borderRadius-br-mobile: 24px; }[data-bnode="omnise-2lh5mr"] { margin-top: var(--2lh5mr-margin-top, 0px); margin-right: var(--2lh5mr-margin-right, 0px); margin-bottom: var(--2lh5mr-margin-bottom, 0px); margin-left: var(--2lh5mr-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--2lh5mr-margin-top-tablet, 0px); margin-right: var(--2lh5mr-margin-right-tablet, 0px); margin-bottom: var(--2lh5mr-margin-bottom-tablet, 0px); margin-left: var(--2lh5mr-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--2lh5mr-margin-top-mobile, 0px); margin-right: var(--2lh5mr-margin-right-mobile, 0px); margin-bottom: var(--2lh5mr-margin-bottom-mobile, 0px); margin-left: var(--2lh5mr-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--2lh5mr-width,100%) - var(--2lh5mr-margin-left,0px) - var(--2lh5mr-margin-right,0px)); width: calc(var(--2lh5mr-width,100%) - var(--2lh5mr-margin-left,0px) - var(--2lh5mr-margin-right,0px)); min-height: min-content; border-color: var(--2lh5mr-borderColor,var(--omnise-card-media-border-color)); border-style: var(--2lh5mr-borderStyle,solid); border-width: var(--2lh5mr-borderWidth-tl,var(--omnise-card-border-width)) var(--2lh5mr-borderWidth-tr,var(--omnise-card-border-width)) var(--2lh5mr-borderWidth-br,var(--omnise-card-border-width)) var(--2lh5mr-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--2lh5mr-borderRadius-tl,var(--omnise-card-border-radius)) var(--2lh5mr-borderRadius-tr,var(--omnise-card-border-radius)) var(--2lh5mr-borderRadius-br,var(--omnise-card-border-radius)) var(--2lh5mr-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--2lh5mr-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--2lh5mr-borderWidth-tl-tablet, var(--2lh5mr-borderWidth-tl,var(--omnise-card-border-width))) var(--2lh5mr-borderWidth-tr-tablet, var(--2lh5mr-borderWidth-tr,var(--omnise-card-border-width))) var(--2lh5mr-borderWidth-br-tablet, var(--2lh5mr-borderWidth-br,var(--omnise-card-border-width))) var(--2lh5mr-borderWidth-bl-tablet, var(--2lh5mr-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--2lh5mr-borderRadius-tl-tablet, var(--2lh5mr-borderRadius-tl,var(--omnise-card-border-radius))) var(--2lh5mr-borderRadius-tr-tablet, var(--2lh5mr-borderRadius-tr,var(--omnise-card-border-radius))) var(--2lh5mr-borderRadius-br-tablet, var(--2lh5mr-borderRadius-br,var(--omnise-card-border-radius))) var(--2lh5mr-borderRadius-bl-tablet, var(--2lh5mr-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--2lh5mr-borderWidth-tl-mobile, var(--2lh5mr-borderWidth-tl,var(--omnise-card-border-width))) var(--2lh5mr-borderWidth-tr-mobile, var(--2lh5mr-borderWidth-tr,var(--omnise-card-border-width))) var(--2lh5mr-borderWidth-br-mobile, var(--2lh5mr-borderWidth-br,var(--omnise-card-border-width))) var(--2lh5mr-borderWidth-bl-mobile, var(--2lh5mr-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--2lh5mr-borderRadius-tl-mobile, var(--2lh5mr-borderRadius-tl,var(--omnise-card-border-radius))) var(--2lh5mr-borderRadius-tr-mobile, var(--2lh5mr-borderRadius-tr,var(--omnise-card-border-radius))) var(--2lh5mr-borderRadius-br-mobile, var(--2lh5mr-borderRadius-br,var(--omnise-card-border-radius))) var(--2lh5mr-borderRadius-bl-mobile, var(--2lh5mr-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--2lh5mr-shadowHorizontal, var(--omnise-card-shadow-x)) var(--2lh5mr-shadowVertical, var(--omnise-card-shadow-y)) var(--2lh5mr-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--2lh5mr-shadowColor, var(--omnise-card-media-shadow-color)) var(--2lh5mr-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--2lh5mr-overlayColor-color, #000); opacity: var(--2lh5mr-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--2lh5mr-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--2lh5mr-width-tablet,var(--2lh5mr-width,100%)) - var(--2lh5mr-margin-left-tablet,var(--2lh5mr-margin-left,0px)) - var(--2lh5mr-margin-right-tablet,var(--2lh5mr-margin-right,0px))); width: calc(var(--2lh5mr-width-tablet,var(--2lh5mr-width,100%)) - var(--2lh5mr-margin-left-tablet,var(--2lh5mr-margin-left,0px)) - var(--2lh5mr-margin-right-tablet,var(--2lh5mr-margin-right,0px))); aspect-ratio: var(--2lh5mr-imageRatio-tablet, var(--2lh5mr-imageRatio, auto)); img { object-fit: var(--2lh5mr-objFit-tablet, var(--2lh5mr-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--2lh5mr-width-mobile,var(--2lh5mr-width,100%)) - var(--2lh5mr-margin-left-mobile,var(--2lh5mr-margin-left,0px)) - var(--2lh5mr-margin-right-mobile,var(--2lh5mr-margin-right,0px))); width: calc(var(--2lh5mr-width-mobile,var(--2lh5mr-width,100%)) - var(--2lh5mr-margin-left-mobile,var(--2lh5mr-margin-left,0px)) - var(--2lh5mr-margin-right-mobile,var(--2lh5mr-margin-right,0px))); aspect-ratio: var(--2lh5mr-imageRatio-mobile, var(--2lh5mr-imageRatio, auto)); img { object-fit: var(--2lh5mr-objFit-mobile, var(--2lh5mr-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-szj43v"] { -webkit-backdrop-filter: blur(0px) saturate(100%); backdrop-filter: blur(0px) saturate(100%); } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-szj43v"] { padding-top: 56px; padding-right: 56px; padding-bottom: 56px; padding-left: 56px; } } @media (max-width: 767px) { [data-bnode="omnise-szj43v"] { padding-top: 32px; padding-right: 24px; padding-bottom: 32px; padding-left: 24px; } } [data-bnode="omnise-szj43v"] {   position: absolute; max-width: 1024px;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-szj43v"] {    z-index: 1000;   }  }  @media (max-width: 767px) {   [data-bnode="omnise-szj43v"] {    z-index: 1000;   }  } [data-bnode="omnise-szj43v"] {        flex-wrap: nowrap;   justify-content: center;   align-items: center;       }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-szj43v"] {                     }  }  @media (max-width: 767px) {   [data-bnode="omnise-szj43v"] {                     }  }[data-bnode="omnise-u1ox10"] {   max-width: 672px;  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-u1ox10"] {      }  }  @media (max-width: 767px) {   [data-bnode="omnise-u1ox10"] {      }  } [data-bnode="omnise-u1ox10"] {    }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-u1ox10"] {      }  }  @media (max-width: 767px) {   [data-bnode="omnise-u1ox10"] {      }  }[data-bnode="omnise-jy4iai"].omnise-section { padding-top: 40px; padding-bottom: 40px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-jy4iai"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } @media (max-width: 767px) { [data-bnode="omnise-jy4iai"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } [data-bnode="omnise-jy4iai"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;    flex-direction: row;   flex-wrap: nowrap;              &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(33.33% - 0px - 0px);    }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-jy4iai"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                    &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(33.33% - 0px - 0px);    }   }  }  @media (max-width: 767px) {   [data-bnode="omnise-jy4iai"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                    &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(33.33% - 0px - 0px);    }   }  }[data-bnode="omnise-507wwu"] { margin-top: var(--507wwu-margin-top, 0px); margin-right: var(--507wwu-margin-right, 0px); margin-bottom: var(--507wwu-margin-bottom, 0px); margin-left: var(--507wwu-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--507wwu-margin-top-tablet, 0px); margin-right: var(--507wwu-margin-right-tablet, 0px); margin-bottom: var(--507wwu-margin-bottom-tablet, 0px); margin-left: var(--507wwu-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--507wwu-margin-top-mobile, 0px); margin-right: var(--507wwu-margin-right-mobile, 0px); margin-bottom: var(--507wwu-margin-bottom-mobile, 0px); margin-left: var(--507wwu-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--507wwu-width,100%) - var(--507wwu-margin-left,0px) - var(--507wwu-margin-right,0px)); width: calc(var(--507wwu-width,100%) - var(--507wwu-margin-left,0px) - var(--507wwu-margin-right,0px)); min-height: min-content; border-color: var(--507wwu-borderColor,var(--omnise-card-media-border-color)); border-style: var(--507wwu-borderStyle,solid); border-width: var(--507wwu-borderWidth-tl,var(--omnise-card-border-width)) var(--507wwu-borderWidth-tr,var(--omnise-card-border-width)) var(--507wwu-borderWidth-br,var(--omnise-card-border-width)) var(--507wwu-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--507wwu-borderRadius-tl,var(--omnise-card-border-radius)) var(--507wwu-borderRadius-tr,var(--omnise-card-border-radius)) var(--507wwu-borderRadius-br,var(--omnise-card-border-radius)) var(--507wwu-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--507wwu-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--507wwu-borderWidth-tl-tablet, var(--507wwu-borderWidth-tl,var(--omnise-card-border-width))) var(--507wwu-borderWidth-tr-tablet, var(--507wwu-borderWidth-tr,var(--omnise-card-border-width))) var(--507wwu-borderWidth-br-tablet, var(--507wwu-borderWidth-br,var(--omnise-card-border-width))) var(--507wwu-borderWidth-bl-tablet, var(--507wwu-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--507wwu-borderRadius-tl-tablet, var(--507wwu-borderRadius-tl,var(--omnise-card-border-radius))) var(--507wwu-borderRadius-tr-tablet, var(--507wwu-borderRadius-tr,var(--omnise-card-border-radius))) var(--507wwu-borderRadius-br-tablet, var(--507wwu-borderRadius-br,var(--omnise-card-border-radius))) var(--507wwu-borderRadius-bl-tablet, var(--507wwu-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--507wwu-borderWidth-tl-mobile, var(--507wwu-borderWidth-tl,var(--omnise-card-border-width))) var(--507wwu-borderWidth-tr-mobile, var(--507wwu-borderWidth-tr,var(--omnise-card-border-width))) var(--507wwu-borderWidth-br-mobile, var(--507wwu-borderWidth-br,var(--omnise-card-border-width))) var(--507wwu-borderWidth-bl-mobile, var(--507wwu-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--507wwu-borderRadius-tl-mobile, var(--507wwu-borderRadius-tl,var(--omnise-card-border-radius))) var(--507wwu-borderRadius-tr-mobile, var(--507wwu-borderRadius-tr,var(--omnise-card-border-radius))) var(--507wwu-borderRadius-br-mobile, var(--507wwu-borderRadius-br,var(--omnise-card-border-radius))) var(--507wwu-borderRadius-bl-mobile, var(--507wwu-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--507wwu-shadowHorizontal, var(--omnise-card-shadow-x)) var(--507wwu-shadowVertical, var(--omnise-card-shadow-y)) var(--507wwu-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--507wwu-shadowColor, var(--omnise-card-media-shadow-color)) var(--507wwu-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--507wwu-overlayColor-color, #000); opacity: var(--507wwu-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--507wwu-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--507wwu-width-tablet,var(--507wwu-width,100%)) - var(--507wwu-margin-left-tablet,var(--507wwu-margin-left,0px)) - var(--507wwu-margin-right-tablet,var(--507wwu-margin-right,0px))); width: calc(var(--507wwu-width-tablet,var(--507wwu-width,100%)) - var(--507wwu-margin-left-tablet,var(--507wwu-margin-left,0px)) - var(--507wwu-margin-right-tablet,var(--507wwu-margin-right,0px))); aspect-ratio: var(--507wwu-imageRatio-tablet, var(--507wwu-imageRatio, auto)); img { object-fit: var(--507wwu-objFit-tablet, var(--507wwu-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--507wwu-width-mobile,var(--507wwu-width,100%)) - var(--507wwu-margin-left-mobile,var(--507wwu-margin-left,0px)) - var(--507wwu-margin-right-mobile,var(--507wwu-margin-right,0px))); width: calc(var(--507wwu-width-mobile,var(--507wwu-width,100%)) - var(--507wwu-margin-left-mobile,var(--507wwu-margin-left,0px)) - var(--507wwu-margin-right-mobile,var(--507wwu-margin-right,0px))); aspect-ratio: var(--507wwu-imageRatio-mobile, var(--507wwu-imageRatio, auto)); img { object-fit: var(--507wwu-objFit-mobile, var(--507wwu-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-xqoh43"] { margin-top: var(--xqoh43-margin-top, 0px); margin-right: var(--xqoh43-margin-right, 0px); margin-bottom: var(--xqoh43-margin-bottom, 0px); margin-left: var(--xqoh43-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--xqoh43-margin-top-tablet, 0px); margin-right: var(--xqoh43-margin-right-tablet, 0px); margin-bottom: var(--xqoh43-margin-bottom-tablet, 0px); margin-left: var(--xqoh43-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--xqoh43-margin-top-mobile, 0px); margin-right: var(--xqoh43-margin-right-mobile, 0px); margin-bottom: var(--xqoh43-margin-bottom-mobile, 0px); margin-left: var(--xqoh43-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--xqoh43-width,100%) - var(--xqoh43-margin-left,0px) - var(--xqoh43-margin-right,0px)); width: calc(var(--xqoh43-width,100%) - var(--xqoh43-margin-left,0px) - var(--xqoh43-margin-right,0px)); min-height: min-content; border-color: var(--xqoh43-borderColor,var(--omnise-card-media-border-color)); border-style: var(--xqoh43-borderStyle,solid); border-width: var(--xqoh43-borderWidth-tl,var(--omnise-card-border-width)) var(--xqoh43-borderWidth-tr,var(--omnise-card-border-width)) var(--xqoh43-borderWidth-br,var(--omnise-card-border-width)) var(--xqoh43-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--xqoh43-borderRadius-tl,var(--omnise-card-border-radius)) var(--xqoh43-borderRadius-tr,var(--omnise-card-border-radius)) var(--xqoh43-borderRadius-br,var(--omnise-card-border-radius)) var(--xqoh43-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--xqoh43-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--xqoh43-borderWidth-tl-tablet, var(--xqoh43-borderWidth-tl,var(--omnise-card-border-width))) var(--xqoh43-borderWidth-tr-tablet, var(--xqoh43-borderWidth-tr,var(--omnise-card-border-width))) var(--xqoh43-borderWidth-br-tablet, var(--xqoh43-borderWidth-br,var(--omnise-card-border-width))) var(--xqoh43-borderWidth-bl-tablet, var(--xqoh43-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--xqoh43-borderRadius-tl-tablet, var(--xqoh43-borderRadius-tl,var(--omnise-card-border-radius))) var(--xqoh43-borderRadius-tr-tablet, var(--xqoh43-borderRadius-tr,var(--omnise-card-border-radius))) var(--xqoh43-borderRadius-br-tablet, var(--xqoh43-borderRadius-br,var(--omnise-card-border-radius))) var(--xqoh43-borderRadius-bl-tablet, var(--xqoh43-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--xqoh43-borderWidth-tl-mobile, var(--xqoh43-borderWidth-tl,var(--omnise-card-border-width))) var(--xqoh43-borderWidth-tr-mobile, var(--xqoh43-borderWidth-tr,var(--omnise-card-border-width))) var(--xqoh43-borderWidth-br-mobile, var(--xqoh43-borderWidth-br,var(--omnise-card-border-width))) var(--xqoh43-borderWidth-bl-mobile, var(--xqoh43-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--xqoh43-borderRadius-tl-mobile, var(--xqoh43-borderRadius-tl,var(--omnise-card-border-radius))) var(--xqoh43-borderRadius-tr-mobile, var(--xqoh43-borderRadius-tr,var(--omnise-card-border-radius))) var(--xqoh43-borderRadius-br-mobile, var(--xqoh43-borderRadius-br,var(--omnise-card-border-radius))) var(--xqoh43-borderRadius-bl-mobile, var(--xqoh43-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--xqoh43-shadowHorizontal, var(--omnise-card-shadow-x)) var(--xqoh43-shadowVertical, var(--omnise-card-shadow-y)) var(--xqoh43-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--xqoh43-shadowColor, var(--omnise-card-media-shadow-color)) var(--xqoh43-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--xqoh43-overlayColor-color, #000); opacity: var(--xqoh43-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--xqoh43-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--xqoh43-width-tablet,var(--xqoh43-width,100%)) - var(--xqoh43-margin-left-tablet,var(--xqoh43-margin-left,0px)) - var(--xqoh43-margin-right-tablet,var(--xqoh43-margin-right,0px))); width: calc(var(--xqoh43-width-tablet,var(--xqoh43-width,100%)) - var(--xqoh43-margin-left-tablet,var(--xqoh43-margin-left,0px)) - var(--xqoh43-margin-right-tablet,var(--xqoh43-margin-right,0px))); aspect-ratio: var(--xqoh43-imageRatio-tablet, var(--xqoh43-imageRatio, auto)); img { object-fit: var(--xqoh43-objFit-tablet, var(--xqoh43-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--xqoh43-width-mobile,var(--xqoh43-width,100%)) - var(--xqoh43-margin-left-mobile,var(--xqoh43-margin-left,0px)) - var(--xqoh43-margin-right-mobile,var(--xqoh43-margin-right,0px))); width: calc(var(--xqoh43-width-mobile,var(--xqoh43-width,100%)) - var(--xqoh43-margin-left-mobile,var(--xqoh43-margin-left,0px)) - var(--xqoh43-margin-right-mobile,var(--xqoh43-margin-right,0px))); aspect-ratio: var(--xqoh43-imageRatio-mobile, var(--xqoh43-imageRatio, auto)); img { object-fit: var(--xqoh43-objFit-mobile, var(--xqoh43-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-2kr4zx"] { margin-top: var(--2kr4zx-margin-top, 0px); margin-right: var(--2kr4zx-margin-right, 0px); margin-bottom: var(--2kr4zx-margin-bottom, 0px); margin-left: var(--2kr4zx-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--2kr4zx-margin-top-tablet, 0px); margin-right: var(--2kr4zx-margin-right-tablet, 0px); margin-bottom: var(--2kr4zx-margin-bottom-tablet, 0px); margin-left: var(--2kr4zx-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--2kr4zx-margin-top-mobile, 0px); margin-right: var(--2kr4zx-margin-right-mobile, 0px); margin-bottom: var(--2kr4zx-margin-bottom-mobile, 0px); margin-left: var(--2kr4zx-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--2kr4zx-width,100%) - var(--2kr4zx-margin-left,0px) - var(--2kr4zx-margin-right,0px)); width: calc(var(--2kr4zx-width,100%) - var(--2kr4zx-margin-left,0px) - var(--2kr4zx-margin-right,0px)); min-height: min-content; border-color: var(--2kr4zx-borderColor,var(--omnise-card-media-border-color)); border-style: var(--2kr4zx-borderStyle,solid); border-width: var(--2kr4zx-borderWidth-tl,var(--omnise-card-border-width)) var(--2kr4zx-borderWidth-tr,var(--omnise-card-border-width)) var(--2kr4zx-borderWidth-br,var(--omnise-card-border-width)) var(--2kr4zx-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--2kr4zx-borderRadius-tl,var(--omnise-card-border-radius)) var(--2kr4zx-borderRadius-tr,var(--omnise-card-border-radius)) var(--2kr4zx-borderRadius-br,var(--omnise-card-border-radius)) var(--2kr4zx-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--2kr4zx-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--2kr4zx-borderWidth-tl-tablet, var(--2kr4zx-borderWidth-tl,var(--omnise-card-border-width))) var(--2kr4zx-borderWidth-tr-tablet, var(--2kr4zx-borderWidth-tr,var(--omnise-card-border-width))) var(--2kr4zx-borderWidth-br-tablet, var(--2kr4zx-borderWidth-br,var(--omnise-card-border-width))) var(--2kr4zx-borderWidth-bl-tablet, var(--2kr4zx-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--2kr4zx-borderRadius-tl-tablet, var(--2kr4zx-borderRadius-tl,var(--omnise-card-border-radius))) var(--2kr4zx-borderRadius-tr-tablet, var(--2kr4zx-borderRadius-tr,var(--omnise-card-border-radius))) var(--2kr4zx-borderRadius-br-tablet, var(--2kr4zx-borderRadius-br,var(--omnise-card-border-radius))) var(--2kr4zx-borderRadius-bl-tablet, var(--2kr4zx-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--2kr4zx-borderWidth-tl-mobile, var(--2kr4zx-borderWidth-tl,var(--omnise-card-border-width))) var(--2kr4zx-borderWidth-tr-mobile, var(--2kr4zx-borderWidth-tr,var(--omnise-card-border-width))) var(--2kr4zx-borderWidth-br-mobile, var(--2kr4zx-borderWidth-br,var(--omnise-card-border-width))) var(--2kr4zx-borderWidth-bl-mobile, var(--2kr4zx-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--2kr4zx-borderRadius-tl-mobile, var(--2kr4zx-borderRadius-tl,var(--omnise-card-border-radius))) var(--2kr4zx-borderRadius-tr-mobile, var(--2kr4zx-borderRadius-tr,var(--omnise-card-border-radius))) var(--2kr4zx-borderRadius-br-mobile, var(--2kr4zx-borderRadius-br,var(--omnise-card-border-radius))) var(--2kr4zx-borderRadius-bl-mobile, var(--2kr4zx-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--2kr4zx-shadowHorizontal, var(--omnise-card-shadow-x)) var(--2kr4zx-shadowVertical, var(--omnise-card-shadow-y)) var(--2kr4zx-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--2kr4zx-shadowColor, var(--omnise-card-media-shadow-color)) var(--2kr4zx-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--2kr4zx-overlayColor-color, #000); opacity: var(--2kr4zx-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--2kr4zx-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--2kr4zx-width-tablet,var(--2kr4zx-width,100%)) - var(--2kr4zx-margin-left-tablet,var(--2kr4zx-margin-left,0px)) - var(--2kr4zx-margin-right-tablet,var(--2kr4zx-margin-right,0px))); width: calc(var(--2kr4zx-width-tablet,var(--2kr4zx-width,100%)) - var(--2kr4zx-margin-left-tablet,var(--2kr4zx-margin-left,0px)) - var(--2kr4zx-margin-right-tablet,var(--2kr4zx-margin-right,0px))); aspect-ratio: var(--2kr4zx-imageRatio-tablet, var(--2kr4zx-imageRatio, auto)); img { object-fit: var(--2kr4zx-objFit-tablet, var(--2kr4zx-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--2kr4zx-width-mobile,var(--2kr4zx-width,100%)) - var(--2kr4zx-margin-left-mobile,var(--2kr4zx-margin-left,0px)) - var(--2kr4zx-margin-right-mobile,var(--2kr4zx-margin-right,0px))); width: calc(var(--2kr4zx-width-mobile,var(--2kr4zx-width,100%)) - var(--2kr4zx-margin-left-mobile,var(--2kr4zx-margin-left,0px)) - var(--2kr4zx-margin-right-mobile,var(--2kr4zx-margin-right,0px))); aspect-ratio: var(--2kr4zx-imageRatio-mobile, var(--2kr4zx-imageRatio, auto)); img { object-fit: var(--2kr4zx-objFit-mobile, var(--2kr4zx-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-q3rp5l"].omnise-section { padding-top: 0px; padding-right: 32px; padding-bottom: 0px; padding-left: 32px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-q3rp5l"].omnise-section { padding-top: 0px; padding-right: 32px; padding-bottom: 0px; padding-left: 32px; } } @media (max-width: 767px) { [data-bnode="omnise-q3rp5l"].omnise-section { padding-top: 0px; padding-right: 32px; padding-bottom: 0px; padding-left: 32px; } } [data-bnode="omnise-q3rp5l"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;       flex-wrap: nowrap;     align-items: flex-start;       }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-q3rp5l"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                   }  }  @media (max-width: 767px) {   [data-bnode="omnise-q3rp5l"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                   }  }[data-bnode="omnise-jq4xea"] { --jq4xea-typography: h3; --jq4xea-typography-tablet: h3; --jq4xea-typography-mobile: h3; --omnise-h3-text-align: start; --omnise-h3-text-align-tablet: start; --omnise-h3-text-align-mobile: start; --omnise-h3-font-weight: 700; --omnise-h3-color: #05480d; --omnise-h3-font-size: 35px; }[data-bnode="omnise-jq4xea"] { margin-top: var(--jq4xea-margin-top, 0px); margin-right: var(--jq4xea-margin-right, 0px); margin-bottom: var(--jq4xea-margin-bottom, 0px); margin-left: var(--jq4xea-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--jq4xea-margin-top-tablet, 0px); margin-right: var(--jq4xea-margin-right-tablet, 0px); margin-bottom: var(--jq4xea-margin-bottom-tablet, 0px); margin-left: var(--jq4xea-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--jq4xea-margin-top-mobile, 0px); margin-right: var(--jq4xea-margin-right-mobile, 0px); margin-bottom: var(--jq4xea-margin-bottom-mobile, 0px); margin-left: var(--jq4xea-margin-left-mobile, 0px); } & .omnise-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--jq4xea-highlightColor,var(--omnise-p-color)); top: var(--jq4xea-highlightTop, 100%); } }[data-bnode="omnise-lp9cpn"].omnise-section { padding-top: 40px; padding-bottom: 40px; } @media (min-width: 767.79px) and (max-width: 1180px) { [data-bnode="omnise-lp9cpn"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } @media (max-width: 767px) { [data-bnode="omnise-lp9cpn"].omnise-section { padding-top: 40px; padding-bottom: 40px; } } [data-bnode="omnise-lp9cpn"] > .omnise-section-container{     width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;       flex-wrap: nowrap;     align-items: flex-start;       }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-lp9cpn"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                   }  }  @media (max-width: 767px) {   [data-bnode="omnise-lp9cpn"] > .omnise-section-container{      width: 100%;   max-width: var(--omnise-section-width);   height: fit-content;   margin: 0 auto;                   }  }[data-bnode="omnise-pf7tgl"] { --pf7tgl-imageRatio: 3/2; --pf7tgl-imageRatio-tablet: 3/2; --pf7tgl-imageRatio-mobile: 3/2; }[data-bnode="omnise-pf7tgl"] { margin-top: var(--pf7tgl-margin-top, 0px); margin-right: var(--pf7tgl-margin-right, 0px); margin-bottom: var(--pf7tgl-margin-bottom, 0px); margin-left: var(--pf7tgl-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--pf7tgl-margin-top-tablet, 0px); margin-right: var(--pf7tgl-margin-right-tablet, 0px); margin-bottom: var(--pf7tgl-margin-bottom-tablet, 0px); margin-left: var(--pf7tgl-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--pf7tgl-margin-top-mobile, 0px); margin-right: var(--pf7tgl-margin-right-mobile, 0px); margin-bottom: var(--pf7tgl-margin-bottom-mobile, 0px); margin-left: var(--pf7tgl-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--pf7tgl-width,100%) - var(--pf7tgl-margin-left,0px) - var(--pf7tgl-margin-right,0px)); width: calc(var(--pf7tgl-width,100%) - var(--pf7tgl-margin-left,0px) - var(--pf7tgl-margin-right,0px)); min-height: min-content; border-color: var(--pf7tgl-borderColor,var(--omnise-card-media-border-color)); border-style: var(--pf7tgl-borderStyle,solid); border-width: var(--pf7tgl-borderWidth-tl,var(--omnise-card-border-width)) var(--pf7tgl-borderWidth-tr,var(--omnise-card-border-width)) var(--pf7tgl-borderWidth-br,var(--omnise-card-border-width)) var(--pf7tgl-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--pf7tgl-borderRadius-tl,var(--omnise-card-border-radius)) var(--pf7tgl-borderRadius-tr,var(--omnise-card-border-radius)) var(--pf7tgl-borderRadius-br,var(--omnise-card-border-radius)) var(--pf7tgl-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--pf7tgl-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--pf7tgl-borderWidth-tl-tablet, var(--pf7tgl-borderWidth-tl,var(--omnise-card-border-width))) var(--pf7tgl-borderWidth-tr-tablet, var(--pf7tgl-borderWidth-tr,var(--omnise-card-border-width))) var(--pf7tgl-borderWidth-br-tablet, var(--pf7tgl-borderWidth-br,var(--omnise-card-border-width))) var(--pf7tgl-borderWidth-bl-tablet, var(--pf7tgl-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--pf7tgl-borderRadius-tl-tablet, var(--pf7tgl-borderRadius-tl,var(--omnise-card-border-radius))) var(--pf7tgl-borderRadius-tr-tablet, var(--pf7tgl-borderRadius-tr,var(--omnise-card-border-radius))) var(--pf7tgl-borderRadius-br-tablet, var(--pf7tgl-borderRadius-br,var(--omnise-card-border-radius))) var(--pf7tgl-borderRadius-bl-tablet, var(--pf7tgl-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--pf7tgl-borderWidth-tl-mobile, var(--pf7tgl-borderWidth-tl,var(--omnise-card-border-width))) var(--pf7tgl-borderWidth-tr-mobile, var(--pf7tgl-borderWidth-tr,var(--omnise-card-border-width))) var(--pf7tgl-borderWidth-br-mobile, var(--pf7tgl-borderWidth-br,var(--omnise-card-border-width))) var(--pf7tgl-borderWidth-bl-mobile, var(--pf7tgl-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--pf7tgl-borderRadius-tl-mobile, var(--pf7tgl-borderRadius-tl,var(--omnise-card-border-radius))) var(--pf7tgl-borderRadius-tr-mobile, var(--pf7tgl-borderRadius-tr,var(--omnise-card-border-radius))) var(--pf7tgl-borderRadius-br-mobile, var(--pf7tgl-borderRadius-br,var(--omnise-card-border-radius))) var(--pf7tgl-borderRadius-bl-mobile, var(--pf7tgl-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--pf7tgl-shadowHorizontal, var(--omnise-card-shadow-x)) var(--pf7tgl-shadowVertical, var(--omnise-card-shadow-y)) var(--pf7tgl-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--pf7tgl-shadowColor, var(--omnise-card-media-shadow-color)) var(--pf7tgl-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--pf7tgl-overlayColor-color, #000); opacity: var(--pf7tgl-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--pf7tgl-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--pf7tgl-width-tablet,var(--pf7tgl-width,100%)) - var(--pf7tgl-margin-left-tablet,var(--pf7tgl-margin-left,0px)) - var(--pf7tgl-margin-right-tablet,var(--pf7tgl-margin-right,0px))); width: calc(var(--pf7tgl-width-tablet,var(--pf7tgl-width,100%)) - var(--pf7tgl-margin-left-tablet,var(--pf7tgl-margin-left,0px)) - var(--pf7tgl-margin-right-tablet,var(--pf7tgl-margin-right,0px))); aspect-ratio: var(--pf7tgl-imageRatio-tablet, var(--pf7tgl-imageRatio, auto)); img { object-fit: var(--pf7tgl-objFit-tablet, var(--pf7tgl-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--pf7tgl-width-mobile,var(--pf7tgl-width,100%)) - var(--pf7tgl-margin-left-mobile,var(--pf7tgl-margin-left,0px)) - var(--pf7tgl-margin-right-mobile,var(--pf7tgl-margin-right,0px))); width: calc(var(--pf7tgl-width-mobile,var(--pf7tgl-width,100%)) - var(--pf7tgl-margin-left-mobile,var(--pf7tgl-margin-left,0px)) - var(--pf7tgl-margin-right-mobile,var(--pf7tgl-margin-right,0px))); aspect-ratio: var(--pf7tgl-imageRatio-mobile, var(--pf7tgl-imageRatio, auto)); img { object-fit: var(--pf7tgl-objFit-mobile, var(--pf7tgl-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-0ovwza"] {     flex-direction: row;   flex-wrap: nowrap;        gap: 24px;      &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(50.00% - 0px - 0px);    }  }  @media (min-width: 767.79px) and (max-width: 1180px) {   [data-bnode="omnise-0ovwza"] {                gap: 24px;      &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(50.00% - 0px - 0px);    }   }  }  @media (max-width: 767px) {   [data-bnode="omnise-0ovwza"] {                gap: 24px;      &>.omnise-slot {     flex: 1 1 0;     min-width: 0;    }    &>.omnise-slot[data-bnode-index] {     flex-basis: calc(50.00% - 0px - 0px);    }   }  }[data-bnode="omnise-ctpvdb"] { margin-top: var(--ctpvdb-margin-top, 0px); margin-right: var(--ctpvdb-margin-right, 0px); margin-bottom: var(--ctpvdb-margin-bottom, 0px); margin-left: var(--ctpvdb-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--ctpvdb-margin-top-tablet, 0px); margin-right: var(--ctpvdb-margin-right-tablet, 0px); margin-bottom: var(--ctpvdb-margin-bottom-tablet, 0px); margin-left: var(--ctpvdb-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--ctpvdb-margin-top-mobile, 0px); margin-right: var(--ctpvdb-margin-right-mobile, 0px); margin-bottom: var(--ctpvdb-margin-bottom-mobile, 0px); margin-left: var(--ctpvdb-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--ctpvdb-width,100%) - var(--ctpvdb-margin-left,0px) - var(--ctpvdb-margin-right,0px)); width: calc(var(--ctpvdb-width,100%) - var(--ctpvdb-margin-left,0px) - var(--ctpvdb-margin-right,0px)); min-height: min-content; border-color: var(--ctpvdb-borderColor,var(--omnise-card-media-border-color)); border-style: var(--ctpvdb-borderStyle,solid); border-width: var(--ctpvdb-borderWidth-tl,var(--omnise-card-border-width)) var(--ctpvdb-borderWidth-tr,var(--omnise-card-border-width)) var(--ctpvdb-borderWidth-br,var(--omnise-card-border-width)) var(--ctpvdb-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--ctpvdb-borderRadius-tl,var(--omnise-card-border-radius)) var(--ctpvdb-borderRadius-tr,var(--omnise-card-border-radius)) var(--ctpvdb-borderRadius-br,var(--omnise-card-border-radius)) var(--ctpvdb-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--ctpvdb-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--ctpvdb-borderWidth-tl-tablet, var(--ctpvdb-borderWidth-tl,var(--omnise-card-border-width))) var(--ctpvdb-borderWidth-tr-tablet, var(--ctpvdb-borderWidth-tr,var(--omnise-card-border-width))) var(--ctpvdb-borderWidth-br-tablet, var(--ctpvdb-borderWidth-br,var(--omnise-card-border-width))) var(--ctpvdb-borderWidth-bl-tablet, var(--ctpvdb-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--ctpvdb-borderRadius-tl-tablet, var(--ctpvdb-borderRadius-tl,var(--omnise-card-border-radius))) var(--ctpvdb-borderRadius-tr-tablet, var(--ctpvdb-borderRadius-tr,var(--omnise-card-border-radius))) var(--ctpvdb-borderRadius-br-tablet, var(--ctpvdb-borderRadius-br,var(--omnise-card-border-radius))) var(--ctpvdb-borderRadius-bl-tablet, var(--ctpvdb-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--ctpvdb-borderWidth-tl-mobile, var(--ctpvdb-borderWidth-tl,var(--omnise-card-border-width))) var(--ctpvdb-borderWidth-tr-mobile, var(--ctpvdb-borderWidth-tr,var(--omnise-card-border-width))) var(--ctpvdb-borderWidth-br-mobile, var(--ctpvdb-borderWidth-br,var(--omnise-card-border-width))) var(--ctpvdb-borderWidth-bl-mobile, var(--ctpvdb-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--ctpvdb-borderRadius-tl-mobile, var(--ctpvdb-borderRadius-tl,var(--omnise-card-border-radius))) var(--ctpvdb-borderRadius-tr-mobile, var(--ctpvdb-borderRadius-tr,var(--omnise-card-border-radius))) var(--ctpvdb-borderRadius-br-mobile, var(--ctpvdb-borderRadius-br,var(--omnise-card-border-radius))) var(--ctpvdb-borderRadius-bl-mobile, var(--ctpvdb-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--ctpvdb-shadowHorizontal, var(--omnise-card-shadow-x)) var(--ctpvdb-shadowVertical, var(--omnise-card-shadow-y)) var(--ctpvdb-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--ctpvdb-shadowColor, var(--omnise-card-media-shadow-color)) var(--ctpvdb-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--ctpvdb-overlayColor-color, #000); opacity: var(--ctpvdb-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--ctpvdb-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--ctpvdb-width-tablet,var(--ctpvdb-width,100%)) - var(--ctpvdb-margin-left-tablet,var(--ctpvdb-margin-left,0px)) - var(--ctpvdb-margin-right-tablet,var(--ctpvdb-margin-right,0px))); width: calc(var(--ctpvdb-width-tablet,var(--ctpvdb-width,100%)) - var(--ctpvdb-margin-left-tablet,var(--ctpvdb-margin-left,0px)) - var(--ctpvdb-margin-right-tablet,var(--ctpvdb-margin-right,0px))); aspect-ratio: var(--ctpvdb-imageRatio-tablet, var(--ctpvdb-imageRatio, auto)); img { object-fit: var(--ctpvdb-objFit-tablet, var(--ctpvdb-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--ctpvdb-width-mobile,var(--ctpvdb-width,100%)) - var(--ctpvdb-margin-left-mobile,var(--ctpvdb-margin-left,0px)) - var(--ctpvdb-margin-right-mobile,var(--ctpvdb-margin-right,0px))); width: calc(var(--ctpvdb-width-mobile,var(--ctpvdb-width,100%)) - var(--ctpvdb-margin-left-mobile,var(--ctpvdb-margin-left,0px)) - var(--ctpvdb-margin-right-mobile,var(--ctpvdb-margin-right,0px))); aspect-ratio: var(--ctpvdb-imageRatio-mobile, var(--ctpvdb-imageRatio, auto)); img { object-fit: var(--ctpvdb-objFit-mobile, var(--ctpvdb-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="omnise-0dk60i"] { margin-top: var(--0dk60i-margin-top, 0px); margin-right: var(--0dk60i-margin-right, 0px); margin-bottom: var(--0dk60i-margin-bottom, 0px); margin-left: var(--0dk60i-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--0dk60i-margin-top-tablet, 0px); margin-right: var(--0dk60i-margin-right-tablet, 0px); margin-bottom: var(--0dk60i-margin-bottom-tablet, 0px); margin-left: var(--0dk60i-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--0dk60i-margin-top-mobile, 0px); margin-right: var(--0dk60i-margin-right-mobile, 0px); margin-bottom: var(--0dk60i-margin-bottom-mobile, 0px); margin-left: var(--0dk60i-margin-left-mobile, 0px); } &.omnise-media-wrapper { position: relative; overflow: hidden; display: block; max-width: calc(var(--0dk60i-width,100%) - var(--0dk60i-margin-left,0px) - var(--0dk60i-margin-right,0px)); width: calc(var(--0dk60i-width,100%) - var(--0dk60i-margin-left,0px) - var(--0dk60i-margin-right,0px)); min-height: min-content; border-color: var(--0dk60i-borderColor,var(--omnise-card-media-border-color)); border-style: var(--0dk60i-borderStyle,solid); border-width: var(--0dk60i-borderWidth-tl,var(--omnise-card-border-width)) var(--0dk60i-borderWidth-tr,var(--omnise-card-border-width)) var(--0dk60i-borderWidth-br,var(--omnise-card-border-width)) var(--0dk60i-borderWidth-bl,var(--omnise-card-border-width)); border-radius: var(--0dk60i-borderRadius-tl,var(--omnise-card-border-radius)) var(--0dk60i-borderRadius-tr,var(--omnise-card-border-radius)) var(--0dk60i-borderRadius-br,var(--omnise-card-border-radius)) var(--0dk60i-borderRadius-bl,var(--omnise-card-border-radius)); aspect-ratio: var(--0dk60i-imageRatio, auto); &.omnise-image-lightbox { cursor: zoom-in; } @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--0dk60i-borderWidth-tl-tablet, var(--0dk60i-borderWidth-tl,var(--omnise-card-border-width))) var(--0dk60i-borderWidth-tr-tablet, var(--0dk60i-borderWidth-tr,var(--omnise-card-border-width))) var(--0dk60i-borderWidth-br-tablet, var(--0dk60i-borderWidth-br,var(--omnise-card-border-width))) var(--0dk60i-borderWidth-bl-tablet, var(--0dk60i-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--0dk60i-borderRadius-tl-tablet, var(--0dk60i-borderRadius-tl,var(--omnise-card-border-radius))) var(--0dk60i-borderRadius-tr-tablet, var(--0dk60i-borderRadius-tr,var(--omnise-card-border-radius))) var(--0dk60i-borderRadius-br-tablet, var(--0dk60i-borderRadius-br,var(--omnise-card-border-radius))) var(--0dk60i-borderRadius-bl-tablet, var(--0dk60i-borderRadius-bl,var(--omnise-card-border-radius))); } @media (max-width: 767px) { border-width: var(--0dk60i-borderWidth-tl-mobile, var(--0dk60i-borderWidth-tl,var(--omnise-card-border-width))) var(--0dk60i-borderWidth-tr-mobile, var(--0dk60i-borderWidth-tr,var(--omnise-card-border-width))) var(--0dk60i-borderWidth-br-mobile, var(--0dk60i-borderWidth-br,var(--omnise-card-border-width))) var(--0dk60i-borderWidth-bl-mobile, var(--0dk60i-borderWidth-bl,var(--omnise-card-border-width))); border-radius: var(--0dk60i-borderRadius-tl-mobile, var(--0dk60i-borderRadius-tl,var(--omnise-card-border-radius))) var(--0dk60i-borderRadius-tr-mobile, var(--0dk60i-borderRadius-tr,var(--omnise-card-border-radius))) var(--0dk60i-borderRadius-br-mobile, var(--0dk60i-borderRadius-br,var(--omnise-card-border-radius))) var(--0dk60i-borderRadius-bl-mobile, var(--0dk60i-borderRadius-bl,var(--omnise-card-border-radius))); } box-shadow: var(--0dk60i-shadowHorizontal, var(--omnise-card-shadow-x)) var(--0dk60i-shadowVertical, var(--omnise-card-shadow-y)) var(--0dk60i-shadowBlur, var(--omnise-card-shadow-blur)) 1px color-mix( in srgb, var(--0dk60i-shadowColor, var(--omnise-card-media-shadow-color)) var(--0dk60i-shadowTransparent, var(--omnise-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--0dk60i-overlayColor-color, #000); opacity: var(--0dk60i-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--0dk60i-objFit, cover); object-position: var(--omnise-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--0dk60i-width-tablet,var(--0dk60i-width,100%)) - var(--0dk60i-margin-left-tablet,var(--0dk60i-margin-left,0px)) - var(--0dk60i-margin-right-tablet,var(--0dk60i-margin-right,0px))); width: calc(var(--0dk60i-width-tablet,var(--0dk60i-width,100%)) - var(--0dk60i-margin-left-tablet,var(--0dk60i-margin-left,0px)) - var(--0dk60i-margin-right-tablet,var(--0dk60i-margin-right,0px))); aspect-ratio: var(--0dk60i-imageRatio-tablet, var(--0dk60i-imageRatio, auto)); img { object-fit: var(--0dk60i-objFit-tablet, var(--0dk60i-objFit, cover)); object-position: var(--omnise-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--0dk60i-width-mobile,var(--0dk60i-width,100%)) - var(--0dk60i-margin-left-mobile,var(--0dk60i-margin-left,0px)) - var(--0dk60i-margin-right-mobile,var(--0dk60i-margin-right,0px))); width: calc(var(--0dk60i-width-mobile,var(--0dk60i-width,100%)) - var(--0dk60i-margin-left-mobile,var(--0dk60i-margin-left,0px)) - var(--0dk60i-margin-right-mobile,var(--0dk60i-margin-right,0px))); aspect-ratio: var(--0dk60i-imageRatio-mobile, var(--0dk60i-imageRatio, auto)); img { object-fit: var(--0dk60i-objFit-mobile, var(--0dk60i-objFit, cover)); object-position: var(--omnise-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.omnise-media-wrapper is relative; .omnise-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.omnise-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .omnise-ai-gen-overlay { position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 1; transition: opacity 800ms ease-in-out; background: linear-gradient(110deg, #24243a 8%, #2d2d48 18%, #24243a 33%); background-size: 200% 100%; animation: omnise-ai-gen-shimmer 1.8s linear infinite; } &.omnise-ai-gen-done .omnise-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .omnise-ai-gen-scan { position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, transparent, #8b5cf6, #38bdf8, transparent); box-shadow: 0 0 14px rgba(56, 189, 248, 0.65), 0 0 28px rgba(139, 92, 246, 0.45); animation: omnise-ai-gen-scan 2.6s ease-in-out infinite; } & .omnise-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .omnise-ai-gen-label { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: clamp(12px, 1.4vw, 16px); font-weight: 500; letter-spacing: 0.5px; color: #cdd7ff; text-shadow: 0 0 12px rgba(124, 160, 255, 0.5); white-space: nowrap; animation: omnise-ai-gen-pulse 1.8s ease-in-out infinite; } /* Image starts hidden + slightly scaled, then settles in once loaded. Gated behind the generating classes so non-generating images are untouched. */ &.omnise-ai-generating .omnise-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.omnise-ai-gen-done .omnise-image { opacity: 1; transform: scale(1); } } @keyframes omnise-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes omnise-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes omnise-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }