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

.beae-slider-nav-left,
.beae-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;
  }
}

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

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

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

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

.beae-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;
    }
  }
  .beae-slider-pagination-wrp {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    .beae-slider-pagination-wrapper,
    .beae-slider-pagination-total,
    .beae-slider-pagination-progress {
      display: none;
      position: relative;
      line-height: 1;
    }
  }
}

.beae-slider-wrapper {
  &[data-pagination="dots"],
  &[data-pagination="dynamic-dots"],
  &[data-pagination="numbers"] {
    & + .beae-slider-controls .beae-slider-pagination-wrapper {
      display: flex;
      gap: 8px;
      align-items: center;
      justify-content: center;
      .pagination-bullets-dynamic{
        gap: 8px;
        width: 100%;
      }
    }
  }
  &[data-pagination="dots"] + .beae-slider-controls .beae-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"] + .beae-slider-controls  .beae-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"] + .beae-slider-controls .beae-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"]
    + .beae-slider-controls
    .beae-slider-pagination-total {
    display: flex;
    color: #181818;
  }

  &[data-pagination="progress"]
    + .beae-slider-controls
    .beae-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 ========== */
.beae-slider-wrapper[data-effect="fade"] {
  .beae-slider-items {
    scroll-behavior: auto;
  }
  .beae-slide-item {
    flex: 0 0 100%;
  }
}
[data-bnode="beae-739pth"] { --739pth-width: 1920px; --739pth-width-tablet: 100%; --739pth-width-mobile: 100%; --739pth-height: fit-content; --739pth-height-tablet: fit-content; --739pth-height-mobile: fit-content; --739pth-direction: row; --739pth-direction-tablet: row; --739pth-direction-mobile: column; --739pth-structure: columns; --739pth-structure-tablet: columns; --739pth-structure-mobile: columns; --739pth-columns: 67.42,32.58; --739pth-columns-tablet: 50.00,50.00; --739pth-columns-mobile: 50.00,50.00; --739pth-grow-1-child: 67.42; --739pth-grow-1-child-tablet: 67.42; --739pth-grow-1-child-mobile: 67.42; --739pth-grow-2-child: 32.58; --739pth-grow-2-child-tablet: 32.58; --739pth-grow-2-child-mobile: 32.58; --739pth-align-items: stretch; --739pth-align-items-tablet: stretch; --739pth-align-items-mobile: stretch; --739pth-surface: light; --739pth-surface-tablet: light; --739pth-surface-mobile: light; --739pth-columnsPresetId-tablet: 50.00,50.00; --739pth-columnsPresetId-mobile: 50.00,50.00; }[data-bnode="beae-739pth"] { padding-top: var(--739pth-padding-top, var(--beae-section-padding-y, 0px)); padding-right: var(--739pth-padding-right, var(--beae-section-padding-x, 0px)); padding-bottom: var(--739pth-padding-bottom, var(--beae-section-padding-y, 0px)); padding-left: var(--739pth-padding-left, var(--beae-section-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--739pth-padding-top-tablet, var(--739pth-padding-top, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-right: var(--739pth-padding-right-tablet, var(--739pth-padding-right, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); padding-bottom: var(--739pth-padding-bottom-tablet, var(--739pth-padding-bottom, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-left: var(--739pth-padding-left-tablet, var(--739pth-padding-left, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--739pth-padding-top-mobile, var(--739pth-padding-top-tablet, var(--739pth-padding-top, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-right: var(--739pth-padding-right-mobile, var(--739pth-padding-right-tablet, var(--739pth-padding-right, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); padding-bottom: var(--739pth-padding-bottom-mobile, var(--739pth-padding-bottom-tablet, var(--739pth-padding-bottom, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-left: var(--739pth-padding-left-mobile, var(--739pth-padding-left-tablet, var(--739pth-padding-left, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); } &.beae-section { background: var(--739pth-background-color, var(--beae-background-color)); max-width: 100%; position: relative; .beae-section-container { height: var(--739pth-height); width: 100%; max-width: var(--739pth-width,var(--beae-section-width)); margin: 0 auto; > *:not(.beae-slot) { position: relative; z-index: 1; } > .beae-bg-image{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; img{ width: 100%; height: 100%; } } > .beae-video-background{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; object-fit: cover; background: #000000; } } } @media (min-width: 767.79px) and (max-width: 1180px) { &.beae-section { & .beae-section-container { height: var(--739pth-height-tablet, auto); width: 100%; max-width: var(--739pth-width-tablet, 100%); } } } @media (max-width: 767px) { &.beae-section { & .beae-section-container { height: var(--739pth-height-mobile, auto); width: 100%; max-width: var(--739pth-width-mobile, 100%); } } } }[data-bnode="beae-739pth"] > .beae-section-container{     display: flex;     flex-direction: var(--739pth-direction, column);     flex-wrap: nowrap;     justify-content: var(--739pth-justify-content);     align-items: var(--739pth-align-items);     gap: var(--739pth-gap, var(--beae-grid-gap, 4px));            &>.beae-slot {         flex: 1 1 0;         min-width: 0;        }                &>.beae-slot[data-bnode-index="1"] {          flex-basis: calc(67.42% - var(--739pth-padding-right, 0px) - var(--739pth-padding-right, 0px));         }         &>.beae-slot[data-bnode-index="2"] {          flex-basis: calc(32.58% - var(--739pth-padding-right, 0px) - var(--739pth-padding-right, 0px));         }         &>.beae-slot[data-bnode-index="3"] {          flex-basis: calc(100% - var(--739pth-padding-right, 0px) - var(--739pth-padding-right, 0px));         }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-739pth"] > .beae-section-container{      flex-direction: var(--739pth-direction-tablet, column);                 align-items: var(--739pth-align-items-tablet, inherit);      gap: var(--beae-grid-gap-tablet, 4px);               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                  &>.beae-slot[data-bnode-index="1"] {           flex-basis: calc(50.00% - var(--739pth-padding-right-tablet, 0px) - var(--739pth-padding-right-tablet, 0px));          }          &>.beae-slot[data-bnode-index="2"] {           flex-basis: calc(50.00% - var(--739pth-padding-right-tablet, 0px) - var(--739pth-padding-right-tablet, 0px));          }          &>.beae-slot[data-bnode-index="3"] {           flex-basis: calc(100% - var(--739pth-padding-right-tablet, 0px) - var(--739pth-padding-right-tablet, 0px));          }            }    }    @media (max-width: 767px) {     [data-bnode="beae-739pth"] > .beae-section-container{      flex-direction: var(--739pth-direction-mobile, column);                      gap: var(--beae-grid-gap-mobile, 4px);             &>.beae-slot[data-bnode-index] {                }           }    }[data-bnode="beae-o5hwb3"] { --o5hwb3-direction: row; --o5hwb3-direction-tablet: row; --o5hwb3-direction-mobile: row; --o5hwb3-align-items: stretch; --o5hwb3-align-items-tablet: stretch; --o5hwb3-align-items-mobile: stretch; }[data-bnode="beae-o5hwb3"] { padding-top: var(--o5hwb3-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--o5hwb3-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--o5hwb3-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--o5hwb3-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--o5hwb3-padding-top-tablet, var(--o5hwb3-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--o5hwb3-padding-right-tablet, var(--o5hwb3-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--o5hwb3-padding-bottom-tablet, var(--o5hwb3-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--o5hwb3-padding-left-tablet, var(--o5hwb3-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--o5hwb3-padding-top-mobile, var(--o5hwb3-padding-top-tablet, var(--o5hwb3-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--o5hwb3-padding-right-mobile, var(--o5hwb3-padding-right-tablet, var(--o5hwb3-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--o5hwb3-padding-bottom-mobile, var(--o5hwb3-padding-bottom-tablet, var(--o5hwb3-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--o5hwb3-padding-left-mobile, var(--o5hwb3-padding-left-tablet, var(--o5hwb3-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--o5hwb3-position, relative); top: var(--o5hwb3-top, auto); right: var(--o5hwb3-right, auto); bottom: var(--o5hwb3-bottom, auto); left: var(--o5hwb3-left, auto); transform: var(--o5hwb3-transform, none); z-index: var(--o5hwb3-z-index, 10); aspect-ratio: var(--o5hwb3-background-imageRatio, auto); background: var(--o5hwb3-background-color,transparent); border-style: var(--o5hwb3-borderStyle,solid); border-color: var(--o5hwb3-borderColor,#000000); border-width: var(--o5hwb3-borderWidth-tl,0px) var(--o5hwb3-borderWidth-tr,0px) var(--o5hwb3-borderWidth-br,0px) var(--o5hwb3-borderWidth-bl,0px); border-radius: var(--o5hwb3-borderRadius-tl,0px) var(--o5hwb3-borderRadius-tr,0px) var(--o5hwb3-borderRadius-br,0px) var(--o5hwb3-borderRadius-bl,0px); box-shadow: var(--o5hwb3-shadowHorizontal, 0px) var(--o5hwb3-shadowVertical, 0px) var(--o5hwb3-shadowBlur, 0px) 1px color-mix( in srgb, var(--o5hwb3-shadowColor, #000000) var(--o5hwb3-shadowTransparent, 0%), transparent ); max-width: var(--o5hwb3-max-width, 100%); width: 100%; height: if(style(--o5hwb3-position: absolute): var(--o5hwb3-height,100%); else: unset ); backdrop-filter:blur(var(--o5hwb3-background-blur, none)) saturate(var(--o5hwb3-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--o5hwb3-position-tablet, var(--o5hwb3-position, relative)); top: var(--o5hwb3-top-tablet, var(--o5hwb3-top, auto)); right: var(--o5hwb3-right-tablet, var(--o5hwb3-right, auto)); bottom: var(--o5hwb3-bottom-tablet, var(--o5hwb3-bottom, auto)); left: var(--o5hwb3-left-tablet, var(--o5hwb3-left, auto)); transform: var(--o5hwb3-transform-tablet, var(--o5hwb3-transform, none)); z-index: var(--o5hwb3-z-index-tablet, var(--o5hwb3-z-index, 10)); aspect-ratio: var(--o5hwb3-background-imageRatio-tablet, var(--o5hwb3-background-imageRatio, auto)); border-width: var(--o5hwb3-borderWidth-tl-tablet, var(--o5hwb3-borderWidth-tl,0px)) var(--o5hwb3-borderWidth-tr-tablet,var(--o5hwb3-borderWidth-tr,0px)) var(--o5hwb3-borderWidth-br-tablet,var(--o5hwb3-borderWidth-br,0px)) var(--o5hwb3-borderWidth-bl-tablet,var(--o5hwb3-borderWidth-bl,0px)); border-radius: var(--o5hwb3-borderRadius-tl-tablet,var(--o5hwb3-borderRadius-tl,0px)) var(--o5hwb3-borderRadius-tr-tablet,var(--o5hwb3-borderRadius-tr,0px)) var(--o5hwb3-borderRadius-br-tablet,var(--o5hwb3-borderRadius-br,0px)) var(--o5hwb3-borderRadius-bl-tablet,var(--o5hwb3-borderRadius-bl,0px)); max-width: var(--o5hwb3-max-width-tablet, var(--o5hwb3-max-width, 100%)); height: if(style(--o5hwb3-position-tablet: absolute): var(--o5hwb3-height-tablet,var(--o5hwb3-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--o5hwb3-position-mobile, var(--o5hwb3-position-tablet, var(--o5hwb3-position, relative))); top: var(--o5hwb3-top-mobile, var(--o5hwb3-top-tablet, var(--o5hwb3-top, auto))); right: var(--o5hwb3-right-mobile, var(--o5hwb3-right-tablet, var(--o5hwb3-right, auto))); bottom: var(--o5hwb3-bottom-mobile, var(--o5hwb3-bottom-tablet, var(--o5hwb3-bottom, auto))); left: var(--o5hwb3-left-mobile, var(--o5hwb3-left-tablet, var(--o5hwb3-left, auto))); transform: var(--o5hwb3-transform-mobile, var(--o5hwb3-transform-tablet, var(--o5hwb3-transform, none))); z-index: var(--o5hwb3-z-index-mobile, var(--o5hwb3-z-index-tablet, var(--o5hwb3-z-index, 10))); aspect-ratio: var(--o5hwb3-background-imageRatio-mobile, var(--o5hwb3-background-imageRatio, auto)); border-width: var(--o5hwb3-borderWidth-tl-mobile, var(--o5hwb3-borderWidth-tl,0px)) var(--o5hwb3-borderWidth-tr-mobile,var(--o5hwb3-borderWidth-tr,0px)) var(--o5hwb3-borderWidth-br-mobile,var(--o5hwb3-borderWidth-br,0px)) var(--o5hwb3-borderWidth-bl-mobile,var(--o5hwb3-borderWidth-bl,0px)); border-radius: var(--o5hwb3-borderRadius-tl-mobile,var(--o5hwb3-borderRadius-tl,0px)) var(--o5hwb3-borderRadius-tr-mobile,var(--o5hwb3-borderRadius-tr,0px)) var(--o5hwb3-borderRadius-br-mobile,var(--o5hwb3-borderRadius-br,0px)) var(--o5hwb3-borderRadius-bl-mobile,var(--o5hwb3-borderRadius-bl,0px)); max-width: var(--o5hwb3-max-width-mobile, var(--o5hwb3-max-width, 100%)); height: if(style(--o5hwb3-position-mobile: absolute): var(--o5hwb3-height-mobile,var(--o5hwb3-height-tablet,,var(--o5hwb3-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--o5hwb3-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--o5hwb3-gap,var(--beae-card-gap)); padding-top: var(--o5hwb3-padding-top,var(--beae-card-padding)); padding-right: var(--o5hwb3-padding-right,var(--beae-card-padding)); padding-bottom: var(--o5hwb3-padding-bottom,var(--beae-card-padding)); padding-left: var(--o5hwb3-padding-left,var(--beae-card-padding)); border-width: var(--o5hwb3-borderWidth-tl,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-tr,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-br,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--o5hwb3-borderRadius-tl,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-tr,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-br,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--o5hwb3-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--o5hwb3-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--o5hwb3-gap-tablet,var(--beae-card-gap)); padding-top: var(--o5hwb3-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--o5hwb3-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--o5hwb3-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--o5hwb3-padding-left-tablet,var(--beae-card-padding)); border-width: var(--o5hwb3-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-br-desktop,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--o5hwb3-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--o5hwb3-gap-mobile,var(--beae-card-gap)); padding-top: var(--o5hwb3-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--o5hwb3-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--o5hwb3-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--o5hwb3-padding-left-mobile,var(--beae-card-padding)); border-width: var(--o5hwb3-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-br-mobile,var(--beae-card-border-width)) var(--o5hwb3-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--o5hwb3-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--o5hwb3-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--o5hwb3-background-color,var(--beae-card-featured-background)); border-color: var(--o5hwb3-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--o5hwb3-shadowHorizontal, var(--beae-card-shadow-x)) var(--o5hwb3-shadowVertical, var(--beae-card-shadow-y)) var(--o5hwb3-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--o5hwb3-shadowColor, var(--beae-card-featured-shadow-color)) var(--o5hwb3-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--o5hwb3-background-color,var(--beae-card-prod-background)); border-color: var(--o5hwb3-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--o5hwb3-shadowHorizontal, var(--beae-card-shadow-x)) var(--o5hwb3-shadowVertical, var(--beae-card-shadow-y)) var(--o5hwb3-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--o5hwb3-shadowColor, var(--beae-card-prod-shadow-color)) var(--o5hwb3-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--o5hwb3-background-color,var(--beae-card-pricing-background)); border-color: var(--o5hwb3-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--o5hwb3-shadowHorizontal, var(--beae-card-shadow-x)) var(--o5hwb3-shadowVertical, var(--beae-card-shadow-y)) var(--o5hwb3-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--o5hwb3-shadowColor, var(--beae-card-pricing-shadow-color)) var(--o5hwb3-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--o5hwb3-background-color,var(--beae-card-cta-background)); border-color: var(--o5hwb3-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--o5hwb3-shadowHorizontal, var(--beae-card-shadow-x)) var(--o5hwb3-shadowVertical, var(--beae-card-shadow-y)) var(--o5hwb3-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--o5hwb3-shadowColor, var(--beae-card-cta-shadow-color)) var(--o5hwb3-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-o5hwb3"] {     display: flex;     flex-direction: var(--o5hwb3-direction, column);     flex-wrap: nowrap;     justify-content: var(--o5hwb3-justify-content);     align-items: var(--o5hwb3-align-items);     gap: var(--o5hwb3-gap, var(--o5hwb3-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-o5hwb3"] {                            gap: var(--o5hwb3-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--o5hwb3-padding-right-tablet, 0px) - var(--o5hwb3-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-o5hwb3"] {                            gap: var(--o5hwb3-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--o5hwb3-padding-right-mobile, 0px) - var(--o5hwb3-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-2x7m01"] { --2x7m01-width: 100%; --2x7m01-width-tablet: 100%; --2x7m01-width-mobile: 100%; --2x7m01-imageRatio: 3/2; --2x7m01-imageRatio-tablet: 4/5; --2x7m01-imageRatio-mobile: 1/1; --2x7m01-objFit: cover; --2x7m01-objFit-tablet: cover; --2x7m01-objFit-mobile: cover; --2x7m01-borderColor: #000000; --2x7m01-borderColor-tablet: #000000; --2x7m01-borderColor-mobile: #000000; --2x7m01-shadowColor: #000000; --2x7m01-shadowColor-tablet: #000000; --2x7m01-shadowColor-mobile: #000000; --2x7m01-borderStyle: none; --2x7m01-borderStyle-tablet: none; --2x7m01-borderStyle-mobile: none; --2x7m01-enableShadow: false; --2x7m01-enableShadow-tablet: false; --2x7m01-enableShadow-mobile: false; --2x7m01-borderRadius-tl: 24px; --2x7m01-borderRadius-tl-tablet: 24px; --2x7m01-borderRadius-tl-mobile: 24px; --2x7m01-borderRadius-tr: 24px; --2x7m01-borderRadius-tr-tablet: 24px; --2x7m01-borderRadius-tr-mobile: 24px; --2x7m01-borderRadius-bl: 24px; --2x7m01-borderRadius-bl-tablet: 24px; --2x7m01-borderRadius-bl-mobile: 24px; --2x7m01-borderRadius-br: 24px; --2x7m01-borderRadius-br-tablet: 24px; --2x7m01-borderRadius-br-mobile: 24px; }[data-bnode="beae-2x7m01"] { margin-top: var(--2x7m01-margin-top, 0px); margin-right: var(--2x7m01-margin-right, 0px); margin-bottom: var(--2x7m01-margin-bottom, 0px); margin-left: var(--2x7m01-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--2x7m01-margin-top-tablet, 0px); margin-right: var(--2x7m01-margin-right-tablet, 0px); margin-bottom: var(--2x7m01-margin-bottom-tablet, 0px); margin-left: var(--2x7m01-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--2x7m01-margin-top-mobile, 0px); margin-right: var(--2x7m01-margin-right-mobile, 0px); margin-bottom: var(--2x7m01-margin-bottom-mobile, 0px); margin-left: var(--2x7m01-margin-left-mobile, 0px); } &.beae-media-wrapper { position: relative; overflow: hidden; display: block; width: 100%; max-width: calc(var(--2x7m01-width,100%) - var(--2x7m01-margin-left,0px) - var(--2x7m01-margin-right,0px)); min-height: min-content; border-color: var(--2x7m01-borderColor,var(--beae-card-media-border-color)); border-style: var(--2x7m01-borderStyle,solid); border-width: var(--2x7m01-borderWidth-tl,var(--beae-card-border-width)) var(--2x7m01-borderWidth-tr,var(--beae-card-border-width)) var(--2x7m01-borderWidth-br,var(--beae-card-border-width)) var(--2x7m01-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--2x7m01-borderRadius-tl,var(--beae-card-border-radius)) var(--2x7m01-borderRadius-tr,var(--beae-card-border-radius)) var(--2x7m01-borderRadius-br,var(--beae-card-border-radius)) var(--2x7m01-borderRadius-bl,var(--beae-card-border-radius)); aspect-ratio: var(--2x7m01-imageRatio, auto); @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--2x7m01-borderWidth-tl-tablet, var(--2x7m01-borderWidth-tl,var(--beae-card-border-width))) var(--2x7m01-borderWidth-tr-tablet, var(--2x7m01-borderWidth-tr,var(--beae-card-border-width))) var(--2x7m01-borderWidth-br-tablet, var(--2x7m01-borderWidth-br,var(--beae-card-border-width))) var(--2x7m01-borderWidth-bl-tablet, var(--2x7m01-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--2x7m01-borderRadius-tl-tablet, var(--2x7m01-borderRadius-tl,var(--beae-card-border-radius))) var(--2x7m01-borderRadius-tr-tablet, var(--2x7m01-borderRadius-tr,var(--beae-card-border-radius))) var(--2x7m01-borderRadius-br-tablet, var(--2x7m01-borderRadius-br,var(--beae-card-border-radius))) var(--2x7m01-borderRadius-bl-tablet, var(--2x7m01-borderRadius-bl,var(--beae-card-border-radius))); } @media (max-width: 767px) { border-width: var(--2x7m01-borderWidth-tl-mobile, var(--2x7m01-borderWidth-tl,var(--beae-card-border-width))) var(--2x7m01-borderWidth-tr-mobile, var(--2x7m01-borderWidth-tr,var(--beae-card-border-width))) var(--2x7m01-borderWidth-br-mobile, var(--2x7m01-borderWidth-br,var(--beae-card-border-width))) var(--2x7m01-borderWidth-bl-mobile, var(--2x7m01-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--2x7m01-borderRadius-tl-mobile, var(--2x7m01-borderRadius-tl,var(--beae-card-border-radius))) var(--2x7m01-borderRadius-tr-mobile, var(--2x7m01-borderRadius-tr,var(--beae-card-border-radius))) var(--2x7m01-borderRadius-br-mobile, var(--2x7m01-borderRadius-br,var(--beae-card-border-radius))) var(--2x7m01-borderRadius-bl-mobile, var(--2x7m01-borderRadius-bl,var(--beae-card-border-radius))); } box-shadow: var(--2x7m01-shadowHorizontal, var(--beae-card-shadow-x)) var(--2x7m01-shadowVertical, var(--beae-card-shadow-y)) var(--2x7m01-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--2x7m01-shadowColor, var(--beae-card-media-shadow-color)) var(--2x7m01-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--2x7m01-overlayColor-color, #000); opacity: var(--2x7m01-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--2x7m01-objFit, cover); object-position: var(--beae-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--2x7m01-width-tablet,var(--2x7m01-width,100%)) - var(--2x7m01-margin-left-tablet,var(--2x7m01-margin-left,0px)) - var(--2x7m01-margin-right-tablet,var(--2x7m01-margin-right,0px))); aspect-ratio: var(--2x7m01-imageRatio-tablet, var(--2x7m01-imageRatio, auto)); img { object-fit: var(--2x7m01-objFit-tablet, var(--2x7m01-objFit, cover)); object-position: var(--beae-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--2x7m01-width-mobile,var(--2x7m01-width,100%)) - var(--2x7m01-margin-left-mobile,var(--2x7m01-margin-left,0px)) - var(--2x7m01-margin-right-mobile,var(--2x7m01-margin-right,0px))); aspect-ratio: var(--2x7m01-imageRatio-mobile, var(--2x7m01-imageRatio, auto)); img { object-fit: var(--2x7m01-objFit-mobile, var(--2x7m01-objFit, cover)); object-position: var(--beae-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.beae-media-wrapper is relative; .beae-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.beae-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .beae-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: beae-ai-gen-shimmer 1.8s linear infinite; } &.beae-ai-gen-done .beae-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .beae-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: beae-ai-gen-scan 2.6s ease-in-out infinite; } & .beae-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .beae-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: beae-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. */ &.beae-ai-generating .beae-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.beae-ai-gen-done .beae-image { opacity: 1; transform: scale(1); } } @keyframes beae-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes beae-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes beae-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="beae-ot3epy"] { --ot3epy-padding-top: 80px; --ot3epy-padding-top-tablet: 40px; --ot3epy-padding-top-mobile: 40px; --ot3epy-padding-bottom: 80px; --ot3epy-padding-bottom-tablet: 40px; --ot3epy-padding-bottom-mobile: 40px; --ot3epy-padding-left: 56px; --ot3epy-padding-left-tablet: 40px; --ot3epy-padding-left-mobile: 32px; --ot3epy-padding-right: 56px; --ot3epy-padding-right-tablet: 40px; --ot3epy-padding-right-mobile: 32px; --ot3epy-direction: column; --ot3epy-direction-tablet: column; --ot3epy-direction-mobile: column; --ot3epy-justify-content: flex-end; --ot3epy-justify-content-tablet: space-evenly; --ot3epy-justify-content-mobile: space-evenly; --ot3epy-align-items: flex-start; --ot3epy-align-items-tablet: flex-start; --ot3epy-align-items-mobile: flex-start; --ot3epy-gap: 16px; --ot3epy-gap-tablet: 16px; --ot3epy-gap-mobile: 16px; --ot3epy-borderRadius-tl: 24px; --ot3epy-borderRadius-tl-tablet: 24px; --ot3epy-borderRadius-tl-mobile: 24px; --ot3epy-borderRadius-tr: 24px; --ot3epy-borderRadius-tr-tablet: 24px; --ot3epy-borderRadius-tr-mobile: 24px; --ot3epy-borderRadius-bl: 24px; --ot3epy-borderRadius-bl-tablet: 24px; --ot3epy-borderRadius-bl-mobile: 24px; --ot3epy-borderRadius-br: 24px; --ot3epy-borderRadius-br-tablet: 24px; --ot3epy-borderRadius-br-mobile: 24px; --ot3epy-backgroundColor: #F3EDE2; --ot3epy-backgroundColor-tablet: #F3EDE2; --ot3epy-backgroundColor-mobile: #F3EDE2; --ot3epy-background-type: color; --ot3epy-background-type-tablet: color; --ot3epy-background-type-mobile: color; --ot3epy-cardStyle: none; --ot3epy-cardStyle-tablet: none; --ot3epy-cardStyle-mobile: none; --ot3epy-surface: muted; --ot3epy-surface-tablet: muted; --ot3epy-surface-mobile: muted; --ot3epy-structure-tablet: auto; --ot3epy-structure-mobile: auto; }[data-bnode="beae-ot3epy"] { padding-top: var(--ot3epy-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--ot3epy-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--ot3epy-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--ot3epy-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--ot3epy-padding-top-tablet, var(--ot3epy-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--ot3epy-padding-right-tablet, var(--ot3epy-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--ot3epy-padding-bottom-tablet, var(--ot3epy-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--ot3epy-padding-left-tablet, var(--ot3epy-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--ot3epy-padding-top-mobile, var(--ot3epy-padding-top-tablet, var(--ot3epy-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--ot3epy-padding-right-mobile, var(--ot3epy-padding-right-tablet, var(--ot3epy-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--ot3epy-padding-bottom-mobile, var(--ot3epy-padding-bottom-tablet, var(--ot3epy-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--ot3epy-padding-left-mobile, var(--ot3epy-padding-left-tablet, var(--ot3epy-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--ot3epy-position, relative); top: var(--ot3epy-top, auto); right: var(--ot3epy-right, auto); bottom: var(--ot3epy-bottom, auto); left: var(--ot3epy-left, auto); transform: var(--ot3epy-transform, none); z-index: var(--ot3epy-z-index, 10); aspect-ratio: var(--ot3epy-background-imageRatio, auto); background: var(--ot3epy-background-color,transparent); border-style: var(--ot3epy-borderStyle,solid); border-color: var(--ot3epy-borderColor,#000000); border-width: var(--ot3epy-borderWidth-tl,0px) var(--ot3epy-borderWidth-tr,0px) var(--ot3epy-borderWidth-br,0px) var(--ot3epy-borderWidth-bl,0px); border-radius: var(--ot3epy-borderRadius-tl,0px) var(--ot3epy-borderRadius-tr,0px) var(--ot3epy-borderRadius-br,0px) var(--ot3epy-borderRadius-bl,0px); box-shadow: var(--ot3epy-shadowHorizontal, 0px) var(--ot3epy-shadowVertical, 0px) var(--ot3epy-shadowBlur, 0px) 1px color-mix( in srgb, var(--ot3epy-shadowColor, #000000) var(--ot3epy-shadowTransparent, 0%), transparent ); max-width: var(--ot3epy-max-width, 100%); width: 100%; height: if(style(--ot3epy-position: absolute): var(--ot3epy-height,100%); else: unset ); backdrop-filter:blur(var(--ot3epy-background-blur, none)) saturate(var(--ot3epy-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--ot3epy-position-tablet, var(--ot3epy-position, relative)); top: var(--ot3epy-top-tablet, var(--ot3epy-top, auto)); right: var(--ot3epy-right-tablet, var(--ot3epy-right, auto)); bottom: var(--ot3epy-bottom-tablet, var(--ot3epy-bottom, auto)); left: var(--ot3epy-left-tablet, var(--ot3epy-left, auto)); transform: var(--ot3epy-transform-tablet, var(--ot3epy-transform, none)); z-index: var(--ot3epy-z-index-tablet, var(--ot3epy-z-index, 10)); aspect-ratio: var(--ot3epy-background-imageRatio-tablet, var(--ot3epy-background-imageRatio, auto)); border-width: var(--ot3epy-borderWidth-tl-tablet, var(--ot3epy-borderWidth-tl,0px)) var(--ot3epy-borderWidth-tr-tablet,var(--ot3epy-borderWidth-tr,0px)) var(--ot3epy-borderWidth-br-tablet,var(--ot3epy-borderWidth-br,0px)) var(--ot3epy-borderWidth-bl-tablet,var(--ot3epy-borderWidth-bl,0px)); border-radius: var(--ot3epy-borderRadius-tl-tablet,var(--ot3epy-borderRadius-tl,0px)) var(--ot3epy-borderRadius-tr-tablet,var(--ot3epy-borderRadius-tr,0px)) var(--ot3epy-borderRadius-br-tablet,var(--ot3epy-borderRadius-br,0px)) var(--ot3epy-borderRadius-bl-tablet,var(--ot3epy-borderRadius-bl,0px)); max-width: var(--ot3epy-max-width-tablet, var(--ot3epy-max-width, 100%)); height: if(style(--ot3epy-position-tablet: absolute): var(--ot3epy-height-tablet,var(--ot3epy-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--ot3epy-position-mobile, var(--ot3epy-position-tablet, var(--ot3epy-position, relative))); top: var(--ot3epy-top-mobile, var(--ot3epy-top-tablet, var(--ot3epy-top, auto))); right: var(--ot3epy-right-mobile, var(--ot3epy-right-tablet, var(--ot3epy-right, auto))); bottom: var(--ot3epy-bottom-mobile, var(--ot3epy-bottom-tablet, var(--ot3epy-bottom, auto))); left: var(--ot3epy-left-mobile, var(--ot3epy-left-tablet, var(--ot3epy-left, auto))); transform: var(--ot3epy-transform-mobile, var(--ot3epy-transform-tablet, var(--ot3epy-transform, none))); z-index: var(--ot3epy-z-index-mobile, var(--ot3epy-z-index-tablet, var(--ot3epy-z-index, 10))); aspect-ratio: var(--ot3epy-background-imageRatio-mobile, var(--ot3epy-background-imageRatio, auto)); border-width: var(--ot3epy-borderWidth-tl-mobile, var(--ot3epy-borderWidth-tl,0px)) var(--ot3epy-borderWidth-tr-mobile,var(--ot3epy-borderWidth-tr,0px)) var(--ot3epy-borderWidth-br-mobile,var(--ot3epy-borderWidth-br,0px)) var(--ot3epy-borderWidth-bl-mobile,var(--ot3epy-borderWidth-bl,0px)); border-radius: var(--ot3epy-borderRadius-tl-mobile,var(--ot3epy-borderRadius-tl,0px)) var(--ot3epy-borderRadius-tr-mobile,var(--ot3epy-borderRadius-tr,0px)) var(--ot3epy-borderRadius-br-mobile,var(--ot3epy-borderRadius-br,0px)) var(--ot3epy-borderRadius-bl-mobile,var(--ot3epy-borderRadius-bl,0px)); max-width: var(--ot3epy-max-width-mobile, var(--ot3epy-max-width, 100%)); height: if(style(--ot3epy-position-mobile: absolute): var(--ot3epy-height-mobile,var(--ot3epy-height-tablet,,var(--ot3epy-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--ot3epy-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--ot3epy-gap,var(--beae-card-gap)); padding-top: var(--ot3epy-padding-top,var(--beae-card-padding)); padding-right: var(--ot3epy-padding-right,var(--beae-card-padding)); padding-bottom: var(--ot3epy-padding-bottom,var(--beae-card-padding)); padding-left: var(--ot3epy-padding-left,var(--beae-card-padding)); border-width: var(--ot3epy-borderWidth-tl,var(--beae-card-border-width)) var(--ot3epy-borderWidth-tr,var(--beae-card-border-width)) var(--ot3epy-borderWidth-br,var(--beae-card-border-width)) var(--ot3epy-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--ot3epy-borderRadius-tl,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-tr,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-br,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--ot3epy-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--ot3epy-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--ot3epy-gap-tablet,var(--beae-card-gap)); padding-top: var(--ot3epy-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--ot3epy-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--ot3epy-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--ot3epy-padding-left-tablet,var(--beae-card-padding)); border-width: var(--ot3epy-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--ot3epy-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--ot3epy-borderWidth-br-desktop,var(--beae-card-border-width)) var(--ot3epy-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--ot3epy-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--ot3epy-gap-mobile,var(--beae-card-gap)); padding-top: var(--ot3epy-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--ot3epy-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--ot3epy-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--ot3epy-padding-left-mobile,var(--beae-card-padding)); border-width: var(--ot3epy-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--ot3epy-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--ot3epy-borderWidth-br-mobile,var(--beae-card-border-width)) var(--ot3epy-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--ot3epy-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--ot3epy-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--ot3epy-background-color,var(--beae-card-featured-background)); border-color: var(--ot3epy-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--ot3epy-shadowHorizontal, var(--beae-card-shadow-x)) var(--ot3epy-shadowVertical, var(--beae-card-shadow-y)) var(--ot3epy-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ot3epy-shadowColor, var(--beae-card-featured-shadow-color)) var(--ot3epy-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--ot3epy-background-color,var(--beae-card-prod-background)); border-color: var(--ot3epy-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--ot3epy-shadowHorizontal, var(--beae-card-shadow-x)) var(--ot3epy-shadowVertical, var(--beae-card-shadow-y)) var(--ot3epy-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ot3epy-shadowColor, var(--beae-card-prod-shadow-color)) var(--ot3epy-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--ot3epy-background-color,var(--beae-card-pricing-background)); border-color: var(--ot3epy-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--ot3epy-shadowHorizontal, var(--beae-card-shadow-x)) var(--ot3epy-shadowVertical, var(--beae-card-shadow-y)) var(--ot3epy-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ot3epy-shadowColor, var(--beae-card-pricing-shadow-color)) var(--ot3epy-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--ot3epy-background-color,var(--beae-card-cta-background)); border-color: var(--ot3epy-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--ot3epy-shadowHorizontal, var(--beae-card-shadow-x)) var(--ot3epy-shadowVertical, var(--beae-card-shadow-y)) var(--ot3epy-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ot3epy-shadowColor, var(--beae-card-cta-shadow-color)) var(--ot3epy-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-ot3epy"] {     display: flex;     flex-direction: var(--ot3epy-direction, column);     flex-wrap: nowrap;     justify-content: var(--ot3epy-justify-content);     align-items: var(--ot3epy-align-items);     gap: var(--ot3epy-gap, var(--ot3epy-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-ot3epy"] {      flex-direction: var(--ot3epy-direction-tablet, column);           justify-content: var(--ot3epy-justify-content-tablet, inherit);      align-items: var(--ot3epy-align-items-tablet, inherit);      gap: var(--ot3epy-gap-tablet, var(--beae-slot-gap-tablet));              &>.beae-slot[data-bnode-index] {          min-height: 0;        }           }    }    @media (max-width: 767px) {     [data-bnode="beae-ot3epy"] {                            gap: var(--ot3epy-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(25.00% - var(--ot3epy-padding-right-mobile, 0px) - var(--ot3epy-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-j4brug"] { --j4brug-direction: row; --j4brug-direction-tablet: row; --j4brug-direction-mobile: row; --j4brug-structure: columns; --j4brug-structure-tablet: auto; --j4brug-structure-mobile: auto; --j4brug-max-width: fit-content; --j4brug-align-items-tablet: flex-start; --j4brug-align-items-mobile: flex-start; --j4brug-position-tablet: relative; --j4brug-position-mobile: relative; --j4brug-height-tablet: fit-content; --j4brug-height-mobile: fit-content; }[data-bnode="beae-j4brug"] { padding-top: var(--j4brug-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--j4brug-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--j4brug-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--j4brug-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--j4brug-padding-top-tablet, var(--j4brug-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--j4brug-padding-right-tablet, var(--j4brug-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--j4brug-padding-bottom-tablet, var(--j4brug-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--j4brug-padding-left-tablet, var(--j4brug-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--j4brug-padding-top-mobile, var(--j4brug-padding-top-tablet, var(--j4brug-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--j4brug-padding-right-mobile, var(--j4brug-padding-right-tablet, var(--j4brug-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--j4brug-padding-bottom-mobile, var(--j4brug-padding-bottom-tablet, var(--j4brug-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--j4brug-padding-left-mobile, var(--j4brug-padding-left-tablet, var(--j4brug-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--j4brug-position, relative); top: var(--j4brug-top, auto); right: var(--j4brug-right, auto); bottom: var(--j4brug-bottom, auto); left: var(--j4brug-left, auto); transform: var(--j4brug-transform, none); z-index: var(--j4brug-z-index, 10); aspect-ratio: var(--j4brug-background-imageRatio, auto); background: var(--j4brug-background-color,transparent); border-style: var(--j4brug-borderStyle,solid); border-color: var(--j4brug-borderColor,#000000); border-width: var(--j4brug-borderWidth-tl,0px) var(--j4brug-borderWidth-tr,0px) var(--j4brug-borderWidth-br,0px) var(--j4brug-borderWidth-bl,0px); border-radius: var(--j4brug-borderRadius-tl,0px) var(--j4brug-borderRadius-tr,0px) var(--j4brug-borderRadius-br,0px) var(--j4brug-borderRadius-bl,0px); box-shadow: var(--j4brug-shadowHorizontal, 0px) var(--j4brug-shadowVertical, 0px) var(--j4brug-shadowBlur, 0px) 1px color-mix( in srgb, var(--j4brug-shadowColor, #000000) var(--j4brug-shadowTransparent, 0%), transparent ); max-width: var(--j4brug-max-width, 100%); width: 100%; height: if(style(--j4brug-position: absolute): var(--j4brug-height,100%); else: unset ); backdrop-filter:blur(var(--j4brug-background-blur, none)) saturate(var(--j4brug-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--j4brug-position-tablet, var(--j4brug-position, relative)); top: var(--j4brug-top-tablet, var(--j4brug-top, auto)); right: var(--j4brug-right-tablet, var(--j4brug-right, auto)); bottom: var(--j4brug-bottom-tablet, var(--j4brug-bottom, auto)); left: var(--j4brug-left-tablet, var(--j4brug-left, auto)); transform: var(--j4brug-transform-tablet, var(--j4brug-transform, none)); z-index: var(--j4brug-z-index-tablet, var(--j4brug-z-index, 10)); aspect-ratio: var(--j4brug-background-imageRatio-tablet, var(--j4brug-background-imageRatio, auto)); border-width: var(--j4brug-borderWidth-tl-tablet, var(--j4brug-borderWidth-tl,0px)) var(--j4brug-borderWidth-tr-tablet,var(--j4brug-borderWidth-tr,0px)) var(--j4brug-borderWidth-br-tablet,var(--j4brug-borderWidth-br,0px)) var(--j4brug-borderWidth-bl-tablet,var(--j4brug-borderWidth-bl,0px)); border-radius: var(--j4brug-borderRadius-tl-tablet,var(--j4brug-borderRadius-tl,0px)) var(--j4brug-borderRadius-tr-tablet,var(--j4brug-borderRadius-tr,0px)) var(--j4brug-borderRadius-br-tablet,var(--j4brug-borderRadius-br,0px)) var(--j4brug-borderRadius-bl-tablet,var(--j4brug-borderRadius-bl,0px)); max-width: var(--j4brug-max-width-tablet, var(--j4brug-max-width, 100%)); height: if(style(--j4brug-position-tablet: absolute): var(--j4brug-height-tablet,var(--j4brug-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--j4brug-position-mobile, var(--j4brug-position-tablet, var(--j4brug-position, relative))); top: var(--j4brug-top-mobile, var(--j4brug-top-tablet, var(--j4brug-top, auto))); right: var(--j4brug-right-mobile, var(--j4brug-right-tablet, var(--j4brug-right, auto))); bottom: var(--j4brug-bottom-mobile, var(--j4brug-bottom-tablet, var(--j4brug-bottom, auto))); left: var(--j4brug-left-mobile, var(--j4brug-left-tablet, var(--j4brug-left, auto))); transform: var(--j4brug-transform-mobile, var(--j4brug-transform-tablet, var(--j4brug-transform, none))); z-index: var(--j4brug-z-index-mobile, var(--j4brug-z-index-tablet, var(--j4brug-z-index, 10))); aspect-ratio: var(--j4brug-background-imageRatio-mobile, var(--j4brug-background-imageRatio, auto)); border-width: var(--j4brug-borderWidth-tl-mobile, var(--j4brug-borderWidth-tl,0px)) var(--j4brug-borderWidth-tr-mobile,var(--j4brug-borderWidth-tr,0px)) var(--j4brug-borderWidth-br-mobile,var(--j4brug-borderWidth-br,0px)) var(--j4brug-borderWidth-bl-mobile,var(--j4brug-borderWidth-bl,0px)); border-radius: var(--j4brug-borderRadius-tl-mobile,var(--j4brug-borderRadius-tl,0px)) var(--j4brug-borderRadius-tr-mobile,var(--j4brug-borderRadius-tr,0px)) var(--j4brug-borderRadius-br-mobile,var(--j4brug-borderRadius-br,0px)) var(--j4brug-borderRadius-bl-mobile,var(--j4brug-borderRadius-bl,0px)); max-width: var(--j4brug-max-width-mobile, var(--j4brug-max-width, 100%)); height: if(style(--j4brug-position-mobile: absolute): var(--j4brug-height-mobile,var(--j4brug-height-tablet,,var(--j4brug-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--j4brug-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--j4brug-gap,var(--beae-card-gap)); padding-top: var(--j4brug-padding-top,var(--beae-card-padding)); padding-right: var(--j4brug-padding-right,var(--beae-card-padding)); padding-bottom: var(--j4brug-padding-bottom,var(--beae-card-padding)); padding-left: var(--j4brug-padding-left,var(--beae-card-padding)); border-width: var(--j4brug-borderWidth-tl,var(--beae-card-border-width)) var(--j4brug-borderWidth-tr,var(--beae-card-border-width)) var(--j4brug-borderWidth-br,var(--beae-card-border-width)) var(--j4brug-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--j4brug-borderRadius-tl,var(--beae-card-border-radius)) var(--j4brug-borderRadius-tr,var(--beae-card-border-radius)) var(--j4brug-borderRadius-br,var(--beae-card-border-radius)) var(--j4brug-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--j4brug-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--j4brug-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--j4brug-gap-tablet,var(--beae-card-gap)); padding-top: var(--j4brug-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--j4brug-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--j4brug-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--j4brug-padding-left-tablet,var(--beae-card-padding)); border-width: var(--j4brug-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--j4brug-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--j4brug-borderWidth-br-desktop,var(--beae-card-border-width)) var(--j4brug-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--j4brug-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--j4brug-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--j4brug-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--j4brug-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--j4brug-gap-mobile,var(--beae-card-gap)); padding-top: var(--j4brug-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--j4brug-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--j4brug-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--j4brug-padding-left-mobile,var(--beae-card-padding)); border-width: var(--j4brug-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--j4brug-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--j4brug-borderWidth-br-mobile,var(--beae-card-border-width)) var(--j4brug-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--j4brug-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--j4brug-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--j4brug-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--j4brug-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--j4brug-background-color,var(--beae-card-featured-background)); border-color: var(--j4brug-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--j4brug-shadowHorizontal, var(--beae-card-shadow-x)) var(--j4brug-shadowVertical, var(--beae-card-shadow-y)) var(--j4brug-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--j4brug-shadowColor, var(--beae-card-featured-shadow-color)) var(--j4brug-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--j4brug-background-color,var(--beae-card-prod-background)); border-color: var(--j4brug-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--j4brug-shadowHorizontal, var(--beae-card-shadow-x)) var(--j4brug-shadowVertical, var(--beae-card-shadow-y)) var(--j4brug-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--j4brug-shadowColor, var(--beae-card-prod-shadow-color)) var(--j4brug-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--j4brug-background-color,var(--beae-card-pricing-background)); border-color: var(--j4brug-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--j4brug-shadowHorizontal, var(--beae-card-shadow-x)) var(--j4brug-shadowVertical, var(--beae-card-shadow-y)) var(--j4brug-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--j4brug-shadowColor, var(--beae-card-pricing-shadow-color)) var(--j4brug-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--j4brug-background-color,var(--beae-card-cta-background)); border-color: var(--j4brug-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--j4brug-shadowHorizontal, var(--beae-card-shadow-x)) var(--j4brug-shadowVertical, var(--beae-card-shadow-y)) var(--j4brug-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--j4brug-shadowColor, var(--beae-card-cta-shadow-color)) var(--j4brug-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-j4brug"] {     display: flex;     flex-direction: var(--j4brug-direction, column);     flex-wrap: nowrap;     justify-content: var(--j4brug-justify-content);     align-items: var(--j4brug-align-items);     gap: var(--j4brug-gap, var(--j4brug-gap, var(--beae-slot-gap)));            &>.beae-slot {         flex: 1 1 0;         min-width: 0;        }                 &>.beae-slot[data-bnode-index] {           flex-basis: calc(100.00% - var(--j4brug-padding-right, 0px) - var(--j4brug-padding-right, 0px));          }                   }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-j4brug"] {      flex-direction: var(--j4brug-direction-tablet, column);                 align-items: var(--j4brug-align-items-tablet, inherit);      gap: var(--j4brug-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot[data-bnode-index] {          flex: 1;         }            }    }    @media (max-width: 767px) {     [data-bnode="beae-j4brug"] {                            gap: var(--j4brug-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--j4brug-padding-right-mobile, 0px) - var(--j4brug-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-mnno2q"] { --mnno2q-width: 40px; --mnno2q-width-tablet: 40px; --mnno2q-width-mobile: 40px; --mnno2q-imageRatio: 1/1; --mnno2q-imageRatio-tablet: 1/1; --mnno2q-imageRatio-mobile: 1/1; --mnno2q-objFit: cover; --mnno2q-objFit-tablet: cover; --mnno2q-objFit-mobile: cover; --mnno2q-borderColor: #000000; --mnno2q-borderColor-tablet: #000000; --mnno2q-borderColor-mobile: #000000; --mnno2q-shadowColor: #000000; --mnno2q-shadowColor-tablet: #000000; --mnno2q-shadowColor-mobile: #000000; --mnno2q-borderStyle: none; --mnno2q-borderStyle-tablet: none; --mnno2q-borderStyle-mobile: none; --mnno2q-enableShadow: false; --mnno2q-enableShadow-tablet: false; --mnno2q-enableShadow-mobile: false; }[data-bnode="beae-mnno2q"] { margin-top: var(--mnno2q-margin-top, 0px); margin-right: var(--mnno2q-margin-right, 0px); margin-bottom: var(--mnno2q-margin-bottom, 0px); margin-left: var(--mnno2q-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--mnno2q-margin-top-tablet, 0px); margin-right: var(--mnno2q-margin-right-tablet, 0px); margin-bottom: var(--mnno2q-margin-bottom-tablet, 0px); margin-left: var(--mnno2q-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--mnno2q-margin-top-mobile, 0px); margin-right: var(--mnno2q-margin-right-mobile, 0px); margin-bottom: var(--mnno2q-margin-bottom-mobile, 0px); margin-left: var(--mnno2q-margin-left-mobile, 0px); } &.beae-media-wrapper { position: relative; overflow: hidden; display: block; width: 100%; max-width: calc(var(--mnno2q-width,100%) - var(--mnno2q-margin-left,0px) - var(--mnno2q-margin-right,0px)); min-height: min-content; border-color: var(--mnno2q-borderColor,var(--beae-card-media-border-color)); border-style: var(--mnno2q-borderStyle,solid); border-width: var(--mnno2q-borderWidth-tl,var(--beae-card-border-width)) var(--mnno2q-borderWidth-tr,var(--beae-card-border-width)) var(--mnno2q-borderWidth-br,var(--beae-card-border-width)) var(--mnno2q-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--mnno2q-borderRadius-tl,var(--beae-card-border-radius)) var(--mnno2q-borderRadius-tr,var(--beae-card-border-radius)) var(--mnno2q-borderRadius-br,var(--beae-card-border-radius)) var(--mnno2q-borderRadius-bl,var(--beae-card-border-radius)); aspect-ratio: var(--mnno2q-imageRatio, auto); @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--mnno2q-borderWidth-tl-tablet, var(--mnno2q-borderWidth-tl,var(--beae-card-border-width))) var(--mnno2q-borderWidth-tr-tablet, var(--mnno2q-borderWidth-tr,var(--beae-card-border-width))) var(--mnno2q-borderWidth-br-tablet, var(--mnno2q-borderWidth-br,var(--beae-card-border-width))) var(--mnno2q-borderWidth-bl-tablet, var(--mnno2q-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--mnno2q-borderRadius-tl-tablet, var(--mnno2q-borderRadius-tl,var(--beae-card-border-radius))) var(--mnno2q-borderRadius-tr-tablet, var(--mnno2q-borderRadius-tr,var(--beae-card-border-radius))) var(--mnno2q-borderRadius-br-tablet, var(--mnno2q-borderRadius-br,var(--beae-card-border-radius))) var(--mnno2q-borderRadius-bl-tablet, var(--mnno2q-borderRadius-bl,var(--beae-card-border-radius))); } @media (max-width: 767px) { border-width: var(--mnno2q-borderWidth-tl-mobile, var(--mnno2q-borderWidth-tl,var(--beae-card-border-width))) var(--mnno2q-borderWidth-tr-mobile, var(--mnno2q-borderWidth-tr,var(--beae-card-border-width))) var(--mnno2q-borderWidth-br-mobile, var(--mnno2q-borderWidth-br,var(--beae-card-border-width))) var(--mnno2q-borderWidth-bl-mobile, var(--mnno2q-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--mnno2q-borderRadius-tl-mobile, var(--mnno2q-borderRadius-tl,var(--beae-card-border-radius))) var(--mnno2q-borderRadius-tr-mobile, var(--mnno2q-borderRadius-tr,var(--beae-card-border-radius))) var(--mnno2q-borderRadius-br-mobile, var(--mnno2q-borderRadius-br,var(--beae-card-border-radius))) var(--mnno2q-borderRadius-bl-mobile, var(--mnno2q-borderRadius-bl,var(--beae-card-border-radius))); } box-shadow: var(--mnno2q-shadowHorizontal, var(--beae-card-shadow-x)) var(--mnno2q-shadowVertical, var(--beae-card-shadow-y)) var(--mnno2q-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--mnno2q-shadowColor, var(--beae-card-media-shadow-color)) var(--mnno2q-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--mnno2q-overlayColor-color, #000); opacity: var(--mnno2q-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--mnno2q-objFit, cover); object-position: var(--beae-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--mnno2q-width-tablet,var(--mnno2q-width,100%)) - var(--mnno2q-margin-left-tablet,var(--mnno2q-margin-left,0px)) - var(--mnno2q-margin-right-tablet,var(--mnno2q-margin-right,0px))); aspect-ratio: var(--mnno2q-imageRatio-tablet, var(--mnno2q-imageRatio, auto)); img { object-fit: var(--mnno2q-objFit-tablet, var(--mnno2q-objFit, cover)); object-position: var(--beae-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--mnno2q-width-mobile,var(--mnno2q-width,100%)) - var(--mnno2q-margin-left-mobile,var(--mnno2q-margin-left,0px)) - var(--mnno2q-margin-right-mobile,var(--mnno2q-margin-right,0px))); aspect-ratio: var(--mnno2q-imageRatio-mobile, var(--mnno2q-imageRatio, auto)); img { object-fit: var(--mnno2q-objFit-mobile, var(--mnno2q-objFit, cover)); object-position: var(--beae-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.beae-media-wrapper is relative; .beae-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.beae-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .beae-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: beae-ai-gen-shimmer 1.8s linear infinite; } &.beae-ai-gen-done .beae-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .beae-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: beae-ai-gen-scan 2.6s ease-in-out infinite; } & .beae-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .beae-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: beae-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. */ &.beae-ai-generating .beae-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.beae-ai-gen-done .beae-image { opacity: 1; transform: scale(1); } } @keyframes beae-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes beae-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes beae-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="beae-pnj4lw"] { --pnj4lw-typography: h1; --pnj4lw-typography-tablet: h1; --pnj4lw-typography-mobile: h1; --beae-h1-text-align: start; }[data-bnode="beae-pnj4lw"] { margin-top: var(--pnj4lw-margin-top, 0px); margin-right: var(--pnj4lw-margin-right, 0px); margin-bottom: var(--pnj4lw-margin-bottom, 0px); margin-left: var(--pnj4lw-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--pnj4lw-margin-top-tablet, 0px); margin-right: var(--pnj4lw-margin-right-tablet, 0px); margin-bottom: var(--pnj4lw-margin-bottom-tablet, 0px); margin-left: var(--pnj4lw-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--pnj4lw-margin-top-mobile, 0px); margin-right: var(--pnj4lw-margin-right-mobile, 0px); margin-bottom: var(--pnj4lw-margin-bottom-mobile, 0px); margin-left: var(--pnj4lw-margin-left-mobile, 0px); } & .beae-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--pnj4lw-highlightColor,var(--beae-p-color)); top: var(--pnj4lw-highlightTop, 100%); } }[data-bnode="beae-vyu05c"] { --vyu05c-typography: p2; --vyu05c-typography-tablet: p2; --vyu05c-typography-mobile: p2; --beae-p2-text-align: start; }[data-bnode="beae-vyu05c"] { margin-top: var(--vyu05c-margin-top, 0px); margin-right: var(--vyu05c-margin-right, 0px); margin-bottom: var(--vyu05c-margin-bottom, 0px); margin-left: var(--vyu05c-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--vyu05c-margin-top-tablet, 0px); margin-right: var(--vyu05c-margin-right-tablet, 0px); margin-bottom: var(--vyu05c-margin-bottom-tablet, 0px); margin-left: var(--vyu05c-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--vyu05c-margin-top-mobile, 0px); margin-right: var(--vyu05c-margin-right-mobile, 0px); margin-bottom: var(--vyu05c-margin-bottom-mobile, 0px); margin-left: var(--vyu05c-margin-left-mobile, 0px); } }[data-bnode="beae-xiwxbx"] { --xiwxbx-iconWidth: 20px; --xiwxbx-iconWidth-tablet: 20px; --xiwxbx-iconWidth-mobile: 20px; --xiwxbx-iconGap: 5px; --xiwxbx-iconGap-tablet: 5px; --xiwxbx-iconGap-mobile: 5px; --xiwxbx-stylePreset: pr; --xiwxbx-stylePreset-tablet: pr; --xiwxbx-stylePreset-mobile: pr; --xiwxbx-transform: none; --xiwxbx-transform-tablet: none; --xiwxbx-transform-mobile: none; --xiwxbx-width: fill; --xiwxbx-width-tablet: fill; --xiwxbx-width-mobile: fill; --xiwxbx-button: pr; --xiwxbx-button-tablet: pr; --xiwxbx-button-mobile: pr; --beae-btn-se-label-color: #121212; --beae-btn-se-background-color: #ececec; --beae-btn-font-size-tablet: 15px; --beae-btn-height-tablet: 45px; --beae-btn-padding-tablet: 30px; }[data-bnode="beae-xiwxbx"] { margin-top: var(--xiwxbx-margin-top, 0px); margin-right: var(--xiwxbx-margin-right, 0px); margin-bottom: var(--xiwxbx-margin-bottom, 0px); margin-left: var(--xiwxbx-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--xiwxbx-margin-top-tablet, 0px); margin-right: var(--xiwxbx-margin-right-tablet, 0px); margin-bottom: var(--xiwxbx-margin-bottom-tablet, 0px); margin-left: var(--xiwxbx-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--xiwxbx-margin-top-mobile, 0px); margin-right: var(--xiwxbx-margin-right-mobile, 0px); margin-bottom: var(--xiwxbx-margin-bottom-mobile, 0px); margin-left: var(--xiwxbx-margin-left-mobile, 0px); } &{ gap:var(--xiwxbx-iconGap,5px); &.beae-btn-pr:hover{ background-color: if( style(--xiwxbx-bgBtnHover < 0): color-mix(in srgb, var(--beae-btn-pr-background-color), white calc(abs(var(--xiwxbx-bgBtnHover)) * 1%)); style(--xiwxbx-bgBtnHover > 0): color-mix(in srgb, var(--beae-btn-pr-background-color), black calc(abs(var(--xiwxbx-bgBtnHover)) * 1%)); else: var(--beae-btn-pr-background-hover) ); color: if( style(--xiwxbx-labelBtnHover < 0): color-mix(in srgb, var(--beae-btn-pr-label-color), white calc(abs(var(--xiwxbx-labelBtnHover)) * 1%)); style(--xiwxbx-labelBtnHover > 0): color-mix(in srgb, var(--beae-btn-pr-label-color), black calc(abs(var(--xiwxbx-labelBtnHover)) * 1%)); else: var(--beae-btn-pr-label-hover) ); outline-color: if( style(--xiwxbx-borderBtnHover < 0): color-mix(in srgb, var(--beae-btn-pr-borde-color), white calc(abs(var(--xiwxbx-borderBtnHover)) * 1%)); style(--xiwxbx-borderBtnHover > 0): color-mix(in srgb, var(--beae-btn-pr-border-color), black calc(abs(var(--xiwxbx-borderBtnHover)) * 1%)); else: var(--beae-btn-pr-border-hover) ); } &.beae-btn-se:hover{ background-color: if( style(--xiwxbx-bgBtnHover < 0): color-mix(in srgb, var(--beae-btn-se-background-color), white calc(abs(var(--xiwxbx-bgBtnHover)) * 1%)); style(--xiwxbx-bgBtnHover > 0): color-mix(in srgb, var(--beae-btn-se-background-color), black calc(abs(var(--xiwxbx-bgBtnHover)) * 1%)); else: var(--beae-btn-se-background-hover) ); color: if( style(--xiwxbx-labelBtnHover < 0): color-mix(in srgb, var(--beae-btn-se-label-color), white calc(abs(var(--xiwxbx-labelBtnHover)) * 1%)); style(--xiwxbx-labelBtnHover > 0): color-mix(in srgb, var(--beae-btn-se-label-color), black calc(abs(var(--xiwxbx-labelBtnHover)) * 1%)); else: var(--beae-btn-se-label-hover) ); outline-color: if( style(--xiwxbx-borderBtnHover < 0): color-mix(in srgb, var(--beae-btn-se-borde-color), white calc(abs(var(--xiwxbx-borderBtnHover)) * 1%)); style(--xiwxbx-borderBtnHover > 0): color-mix(in srgb, var(--beae-btn-se-border-color), black calc(abs(var(--xiwxbx-borderBtnHover)) * 1%)); else: var(--beae-btn-se-border-hover) ); } &.beae-btn-te:hover{ color: if( style(--xiwxbx-labelBtnHover < 0): color-mix(in srgb, var(--beae-btn-te-label-color), white calc(abs(var(--xiwxbx-labelBtnHover)) * 1%)); style(--xiwxbx-labelBtnHover > 0): color-mix(in srgb, var(--beae-btn-te-label-color), black calc(abs(var(--xiwxbx-labelBtnHover)) * 1%)); else: var(--beae-btn-te-label-hover) ); } span{ display: flex; font-size: var(--xiwxbx-iconWidth); } svg { width: var(--xiwxbx-iconWidth,20px); min-width: var(--xiwxbx-iconWidth,20px); height: 100%; } @media(min-width: 767.79px) and (max-width: 1180px){ gap: var(--xiwxbx-iconGap-tablet); &:not(.beae-btn-te){ height: var(--beae-btn-height-tablet, var(--beae-btn-height)); } span{ font-size: var(--xiwxbx-iconWidth-tablet, var(--xiwxbx-iconWidth)); } svg { width: var(--xiwxbx-iconWidth-tablet, var(--xiwxbx-iconWidth)); min-width: var(--xiwxbx-iconWidth-tablet, var(--xiwxbx-iconWidth)); height: 100%; } } @media(max-width: 767px){ gap: var(--xiwxbx-iconGap-mobile); &:not(.beae-btn-te){ height: var(--beae-btn-height-mobile, var(--beae-btn-height)); } span{ font-size: var(--xiwxbx-iconWidth-mobile, var(--xiwxbx-iconWidth)); } svg { width: var(--xiwxbx-iconWidth-mobile, var(--xiwxbx-iconWidth)); min-width: var(--xiwxbx-iconWidth-mobile, var(--xiwxbx-iconWidth)); height: 100%; } } } &[beae-btn-po="right"] { flex-direction: row-reverse; svg{ margin-right:0; } } }[data-bnode="beae-o671qq"] { --o671qq-width: var(--beae-section-width); --o671qq-width-tablet: var(--beae-section-width); --o671qq-width-mobile: var(--beae-section-width); --o671qq-height: fit-content; --o671qq-height-tablet: fit-content; --o671qq-height-mobile: fit-content; --o671qq-direction: row; --o671qq-direction-tablet: column; --o671qq-direction-mobile: column; --o671qq-structure: columns; --o671qq-structure-tablet: columns; --o671qq-structure-mobile: columns; --o671qq-padding-top: 40px; --o671qq-padding-top-tablet: 40px; --o671qq-padding-top-mobile: 40px; --o671qq-padding-bottom: 40px; --o671qq-padding-bottom-tablet: 40px; --o671qq-padding-bottom-mobile: 40px; --o671qq-gap: 80px; --o671qq-gap-tablet: 64px; --o671qq-gap-mobile: 48px; --o671qq-columns: 60.00,40.00; --o671qq-columns-tablet: 60.00,40.00; --o671qq-columns-mobile: 60.00,40.00; --o671qq-columnsPresetId: 60.00,40.00; --o671qq-columnsPresetId-tablet: 60.00,40.00; --o671qq-columnsPresetId-mobile: 60.00,40.00; --o671qq-surface: light; --o671qq-surface-tablet: light; --o671qq-surface-mobile: light; --o671qq-background-type: color; --o671qq-background-type-tablet: color; --o671qq-background-type-mobile: color; }[data-bnode="beae-o671qq"] { padding-top: var(--o671qq-padding-top, var(--beae-section-padding-y, 0px)); padding-right: var(--o671qq-padding-right, var(--beae-section-padding-x, 0px)); padding-bottom: var(--o671qq-padding-bottom, var(--beae-section-padding-y, 0px)); padding-left: var(--o671qq-padding-left, var(--beae-section-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--o671qq-padding-top-tablet, var(--o671qq-padding-top, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-right: var(--o671qq-padding-right-tablet, var(--o671qq-padding-right, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); padding-bottom: var(--o671qq-padding-bottom-tablet, var(--o671qq-padding-bottom, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-left: var(--o671qq-padding-left-tablet, var(--o671qq-padding-left, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--o671qq-padding-top-mobile, var(--o671qq-padding-top-tablet, var(--o671qq-padding-top, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-right: var(--o671qq-padding-right-mobile, var(--o671qq-padding-right-tablet, var(--o671qq-padding-right, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); padding-bottom: var(--o671qq-padding-bottom-mobile, var(--o671qq-padding-bottom-tablet, var(--o671qq-padding-bottom, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-left: var(--o671qq-padding-left-mobile, var(--o671qq-padding-left-tablet, var(--o671qq-padding-left, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); } &.beae-section { background: var(--o671qq-background-color, var(--beae-background-color)); max-width: 100%; position: relative; .beae-section-container { height: var(--o671qq-height); width: 100%; max-width: var(--o671qq-width,var(--beae-section-width)); margin: 0 auto; > *:not(.beae-slot) { position: relative; z-index: 1; } > .beae-bg-image{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; img{ width: 100%; height: 100%; } } > .beae-video-background{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; object-fit: cover; background: #000000; } } } @media (min-width: 767.79px) and (max-width: 1180px) { &.beae-section { & .beae-section-container { height: var(--o671qq-height-tablet, auto); width: 100%; max-width: var(--o671qq-width-tablet, 100%); } } } @media (max-width: 767px) { &.beae-section { & .beae-section-container { height: var(--o671qq-height-mobile, auto); width: 100%; max-width: var(--o671qq-width-mobile, 100%); } } } }[data-bnode="beae-o671qq"] > .beae-section-container{     display: flex;     flex-direction: var(--o671qq-direction, column);     flex-wrap: nowrap;     justify-content: var(--o671qq-justify-content);     align-items: var(--o671qq-align-items);     gap: var(--o671qq-gap, var(--beae-grid-gap, 4px));            &>.beae-slot {         flex: 1 1 0;         min-width: 0;        }                &>.beae-slot[data-bnode-index="1"] {          flex-basis: calc(60.00% - var(--o671qq-padding-right, 0px) - var(--o671qq-padding-right, 0px));         }         &>.beae-slot[data-bnode-index="2"] {          flex-basis: calc(40.00% - var(--o671qq-padding-right, 0px) - var(--o671qq-padding-right, 0px));         }         &>.beae-slot[data-bnode-index="3"] {          flex-basis: calc(100% - var(--o671qq-padding-right, 0px) - var(--o671qq-padding-right, 0px));         }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-o671qq"] > .beae-section-container{      flex-direction: var(--o671qq-direction-tablet, column);                      gap: var(--o671qq-gap-tablet, var(--beae-grid-gap-tablet, 4px));              &>.beae-slot[data-bnode-index] {          min-height: 0;        }           }    }    @media (max-width: 767px) {     [data-bnode="beae-o671qq"] > .beae-section-container{      flex-direction: var(--o671qq-direction-mobile, column);                      gap: var(--o671qq-gap-mobile, var(--beae-grid-gap-mobile, 4px));             &>.beae-slot[data-bnode-index] {                }           }    }[data-bnode="beae-ci1hvx"] { padding-top: var(--ci1hvx-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--ci1hvx-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--ci1hvx-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--ci1hvx-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--ci1hvx-padding-top-tablet, var(--ci1hvx-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--ci1hvx-padding-right-tablet, var(--ci1hvx-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--ci1hvx-padding-bottom-tablet, var(--ci1hvx-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--ci1hvx-padding-left-tablet, var(--ci1hvx-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--ci1hvx-padding-top-mobile, var(--ci1hvx-padding-top-tablet, var(--ci1hvx-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--ci1hvx-padding-right-mobile, var(--ci1hvx-padding-right-tablet, var(--ci1hvx-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--ci1hvx-padding-bottom-mobile, var(--ci1hvx-padding-bottom-tablet, var(--ci1hvx-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--ci1hvx-padding-left-mobile, var(--ci1hvx-padding-left-tablet, var(--ci1hvx-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--ci1hvx-position, relative); top: var(--ci1hvx-top, auto); right: var(--ci1hvx-right, auto); bottom: var(--ci1hvx-bottom, auto); left: var(--ci1hvx-left, auto); transform: var(--ci1hvx-transform, none); z-index: var(--ci1hvx-z-index, 10); aspect-ratio: var(--ci1hvx-background-imageRatio, auto); background: var(--ci1hvx-background-color,transparent); border-style: var(--ci1hvx-borderStyle,solid); border-color: var(--ci1hvx-borderColor,#000000); border-width: var(--ci1hvx-borderWidth-tl,0px) var(--ci1hvx-borderWidth-tr,0px) var(--ci1hvx-borderWidth-br,0px) var(--ci1hvx-borderWidth-bl,0px); border-radius: var(--ci1hvx-borderRadius-tl,0px) var(--ci1hvx-borderRadius-tr,0px) var(--ci1hvx-borderRadius-br,0px) var(--ci1hvx-borderRadius-bl,0px); box-shadow: var(--ci1hvx-shadowHorizontal, 0px) var(--ci1hvx-shadowVertical, 0px) var(--ci1hvx-shadowBlur, 0px) 1px color-mix( in srgb, var(--ci1hvx-shadowColor, #000000) var(--ci1hvx-shadowTransparent, 0%), transparent ); max-width: var(--ci1hvx-max-width, 100%); width: 100%; height: if(style(--ci1hvx-position: absolute): var(--ci1hvx-height,100%); else: unset ); backdrop-filter:blur(var(--ci1hvx-background-blur, none)) saturate(var(--ci1hvx-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--ci1hvx-position-tablet, var(--ci1hvx-position, relative)); top: var(--ci1hvx-top-tablet, var(--ci1hvx-top, auto)); right: var(--ci1hvx-right-tablet, var(--ci1hvx-right, auto)); bottom: var(--ci1hvx-bottom-tablet, var(--ci1hvx-bottom, auto)); left: var(--ci1hvx-left-tablet, var(--ci1hvx-left, auto)); transform: var(--ci1hvx-transform-tablet, var(--ci1hvx-transform, none)); z-index: var(--ci1hvx-z-index-tablet, var(--ci1hvx-z-index, 10)); aspect-ratio: var(--ci1hvx-background-imageRatio-tablet, var(--ci1hvx-background-imageRatio, auto)); border-width: var(--ci1hvx-borderWidth-tl-tablet, var(--ci1hvx-borderWidth-tl,0px)) var(--ci1hvx-borderWidth-tr-tablet,var(--ci1hvx-borderWidth-tr,0px)) var(--ci1hvx-borderWidth-br-tablet,var(--ci1hvx-borderWidth-br,0px)) var(--ci1hvx-borderWidth-bl-tablet,var(--ci1hvx-borderWidth-bl,0px)); border-radius: var(--ci1hvx-borderRadius-tl-tablet,var(--ci1hvx-borderRadius-tl,0px)) var(--ci1hvx-borderRadius-tr-tablet,var(--ci1hvx-borderRadius-tr,0px)) var(--ci1hvx-borderRadius-br-tablet,var(--ci1hvx-borderRadius-br,0px)) var(--ci1hvx-borderRadius-bl-tablet,var(--ci1hvx-borderRadius-bl,0px)); max-width: var(--ci1hvx-max-width-tablet, var(--ci1hvx-max-width, 100%)); height: if(style(--ci1hvx-position-tablet: absolute): var(--ci1hvx-height-tablet,var(--ci1hvx-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--ci1hvx-position-mobile, var(--ci1hvx-position-tablet, var(--ci1hvx-position, relative))); top: var(--ci1hvx-top-mobile, var(--ci1hvx-top-tablet, var(--ci1hvx-top, auto))); right: var(--ci1hvx-right-mobile, var(--ci1hvx-right-tablet, var(--ci1hvx-right, auto))); bottom: var(--ci1hvx-bottom-mobile, var(--ci1hvx-bottom-tablet, var(--ci1hvx-bottom, auto))); left: var(--ci1hvx-left-mobile, var(--ci1hvx-left-tablet, var(--ci1hvx-left, auto))); transform: var(--ci1hvx-transform-mobile, var(--ci1hvx-transform-tablet, var(--ci1hvx-transform, none))); z-index: var(--ci1hvx-z-index-mobile, var(--ci1hvx-z-index-tablet, var(--ci1hvx-z-index, 10))); aspect-ratio: var(--ci1hvx-background-imageRatio-mobile, var(--ci1hvx-background-imageRatio, auto)); border-width: var(--ci1hvx-borderWidth-tl-mobile, var(--ci1hvx-borderWidth-tl,0px)) var(--ci1hvx-borderWidth-tr-mobile,var(--ci1hvx-borderWidth-tr,0px)) var(--ci1hvx-borderWidth-br-mobile,var(--ci1hvx-borderWidth-br,0px)) var(--ci1hvx-borderWidth-bl-mobile,var(--ci1hvx-borderWidth-bl,0px)); border-radius: var(--ci1hvx-borderRadius-tl-mobile,var(--ci1hvx-borderRadius-tl,0px)) var(--ci1hvx-borderRadius-tr-mobile,var(--ci1hvx-borderRadius-tr,0px)) var(--ci1hvx-borderRadius-br-mobile,var(--ci1hvx-borderRadius-br,0px)) var(--ci1hvx-borderRadius-bl-mobile,var(--ci1hvx-borderRadius-bl,0px)); max-width: var(--ci1hvx-max-width-mobile, var(--ci1hvx-max-width, 100%)); height: if(style(--ci1hvx-position-mobile: absolute): var(--ci1hvx-height-mobile,var(--ci1hvx-height-tablet,,var(--ci1hvx-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--ci1hvx-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--ci1hvx-gap,var(--beae-card-gap)); padding-top: var(--ci1hvx-padding-top,var(--beae-card-padding)); padding-right: var(--ci1hvx-padding-right,var(--beae-card-padding)); padding-bottom: var(--ci1hvx-padding-bottom,var(--beae-card-padding)); padding-left: var(--ci1hvx-padding-left,var(--beae-card-padding)); border-width: var(--ci1hvx-borderWidth-tl,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-tr,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-br,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--ci1hvx-borderRadius-tl,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-tr,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-br,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--ci1hvx-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--ci1hvx-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--ci1hvx-gap-tablet,var(--beae-card-gap)); padding-top: var(--ci1hvx-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--ci1hvx-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--ci1hvx-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--ci1hvx-padding-left-tablet,var(--beae-card-padding)); border-width: var(--ci1hvx-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-br-desktop,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--ci1hvx-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--ci1hvx-gap-mobile,var(--beae-card-gap)); padding-top: var(--ci1hvx-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--ci1hvx-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--ci1hvx-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--ci1hvx-padding-left-mobile,var(--beae-card-padding)); border-width: var(--ci1hvx-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-br-mobile,var(--beae-card-border-width)) var(--ci1hvx-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--ci1hvx-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--ci1hvx-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--ci1hvx-background-color,var(--beae-card-featured-background)); border-color: var(--ci1hvx-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--ci1hvx-shadowHorizontal, var(--beae-card-shadow-x)) var(--ci1hvx-shadowVertical, var(--beae-card-shadow-y)) var(--ci1hvx-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ci1hvx-shadowColor, var(--beae-card-featured-shadow-color)) var(--ci1hvx-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--ci1hvx-background-color,var(--beae-card-prod-background)); border-color: var(--ci1hvx-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--ci1hvx-shadowHorizontal, var(--beae-card-shadow-x)) var(--ci1hvx-shadowVertical, var(--beae-card-shadow-y)) var(--ci1hvx-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ci1hvx-shadowColor, var(--beae-card-prod-shadow-color)) var(--ci1hvx-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--ci1hvx-background-color,var(--beae-card-pricing-background)); border-color: var(--ci1hvx-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--ci1hvx-shadowHorizontal, var(--beae-card-shadow-x)) var(--ci1hvx-shadowVertical, var(--beae-card-shadow-y)) var(--ci1hvx-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ci1hvx-shadowColor, var(--beae-card-pricing-shadow-color)) var(--ci1hvx-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--ci1hvx-background-color,var(--beae-card-cta-background)); border-color: var(--ci1hvx-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--ci1hvx-shadowHorizontal, var(--beae-card-shadow-x)) var(--ci1hvx-shadowVertical, var(--beae-card-shadow-y)) var(--ci1hvx-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ci1hvx-shadowColor, var(--beae-card-cta-shadow-color)) var(--ci1hvx-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-ci1hvx"] {     display: flex;     flex-direction: var(--ci1hvx-direction, column);     flex-wrap: nowrap;     justify-content: var(--ci1hvx-justify-content);     align-items: var(--ci1hvx-align-items);     gap: var(--ci1hvx-gap, var(--ci1hvx-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-ci1hvx"] {                            gap: var(--ci1hvx-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--ci1hvx-padding-right-tablet, 0px) - var(--ci1hvx-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-ci1hvx"] {                            gap: var(--ci1hvx-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--ci1hvx-padding-right-mobile, 0px) - var(--ci1hvx-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-dg23b2"] { --dg23b2-width: 100%; --dg23b2-width-tablet: 100%; --dg23b2-width-mobile: 100%; --dg23b2-imageRatio: 7/6; --dg23b2-imageRatio-tablet: 7/6; --dg23b2-imageRatio-mobile: 7/6; --dg23b2-objFit: cover; --dg23b2-objFit-tablet: cover; --dg23b2-objFit-mobile: cover; --dg23b2-borderColor: #000000; --dg23b2-borderColor-tablet: #000000; --dg23b2-borderColor-mobile: #000000; --dg23b2-shadowColor: #000000; --dg23b2-shadowColor-tablet: #000000; --dg23b2-shadowColor-mobile: #000000; --dg23b2-borderStyle: none; --dg23b2-borderStyle-tablet: none; --dg23b2-borderStyle-mobile: none; --dg23b2-enableShadow: false; --dg23b2-enableShadow-tablet: false; --dg23b2-enableShadow-mobile: false; --dg23b2-borderRadius-tl: 12px; --dg23b2-borderRadius-tl-tablet: 12px; --dg23b2-borderRadius-tl-mobile: 12px; --dg23b2-borderRadius-tr: 12px; --dg23b2-borderRadius-tr-tablet: 12px; --dg23b2-borderRadius-tr-mobile: 12px; --dg23b2-borderRadius-bl: 12px; --dg23b2-borderRadius-bl-tablet: 12px; --dg23b2-borderRadius-bl-mobile: 12px; --dg23b2-borderRadius-br: 12px; --dg23b2-borderRadius-br-tablet: 12px; --dg23b2-borderRadius-br-mobile: 12px; }[data-bnode="beae-dg23b2"] { margin-top: var(--dg23b2-margin-top, 0px); margin-right: var(--dg23b2-margin-right, 0px); margin-bottom: var(--dg23b2-margin-bottom, 0px); margin-left: var(--dg23b2-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--dg23b2-margin-top-tablet, 0px); margin-right: var(--dg23b2-margin-right-tablet, 0px); margin-bottom: var(--dg23b2-margin-bottom-tablet, 0px); margin-left: var(--dg23b2-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--dg23b2-margin-top-mobile, 0px); margin-right: var(--dg23b2-margin-right-mobile, 0px); margin-bottom: var(--dg23b2-margin-bottom-mobile, 0px); margin-left: var(--dg23b2-margin-left-mobile, 0px); } &.beae-media-wrapper { position: relative; overflow: hidden; display: block; width: 100%; max-width: calc(var(--dg23b2-width,100%) - var(--dg23b2-margin-left,0px) - var(--dg23b2-margin-right,0px)); min-height: min-content; border-color: var(--dg23b2-borderColor,var(--beae-card-media-border-color)); border-style: var(--dg23b2-borderStyle,solid); border-width: var(--dg23b2-borderWidth-tl,var(--beae-card-border-width)) var(--dg23b2-borderWidth-tr,var(--beae-card-border-width)) var(--dg23b2-borderWidth-br,var(--beae-card-border-width)) var(--dg23b2-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--dg23b2-borderRadius-tl,var(--beae-card-border-radius)) var(--dg23b2-borderRadius-tr,var(--beae-card-border-radius)) var(--dg23b2-borderRadius-br,var(--beae-card-border-radius)) var(--dg23b2-borderRadius-bl,var(--beae-card-border-radius)); aspect-ratio: var(--dg23b2-imageRatio, auto); @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--dg23b2-borderWidth-tl-tablet, var(--dg23b2-borderWidth-tl,var(--beae-card-border-width))) var(--dg23b2-borderWidth-tr-tablet, var(--dg23b2-borderWidth-tr,var(--beae-card-border-width))) var(--dg23b2-borderWidth-br-tablet, var(--dg23b2-borderWidth-br,var(--beae-card-border-width))) var(--dg23b2-borderWidth-bl-tablet, var(--dg23b2-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--dg23b2-borderRadius-tl-tablet, var(--dg23b2-borderRadius-tl,var(--beae-card-border-radius))) var(--dg23b2-borderRadius-tr-tablet, var(--dg23b2-borderRadius-tr,var(--beae-card-border-radius))) var(--dg23b2-borderRadius-br-tablet, var(--dg23b2-borderRadius-br,var(--beae-card-border-radius))) var(--dg23b2-borderRadius-bl-tablet, var(--dg23b2-borderRadius-bl,var(--beae-card-border-radius))); } @media (max-width: 767px) { border-width: var(--dg23b2-borderWidth-tl-mobile, var(--dg23b2-borderWidth-tl,var(--beae-card-border-width))) var(--dg23b2-borderWidth-tr-mobile, var(--dg23b2-borderWidth-tr,var(--beae-card-border-width))) var(--dg23b2-borderWidth-br-mobile, var(--dg23b2-borderWidth-br,var(--beae-card-border-width))) var(--dg23b2-borderWidth-bl-mobile, var(--dg23b2-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--dg23b2-borderRadius-tl-mobile, var(--dg23b2-borderRadius-tl,var(--beae-card-border-radius))) var(--dg23b2-borderRadius-tr-mobile, var(--dg23b2-borderRadius-tr,var(--beae-card-border-radius))) var(--dg23b2-borderRadius-br-mobile, var(--dg23b2-borderRadius-br,var(--beae-card-border-radius))) var(--dg23b2-borderRadius-bl-mobile, var(--dg23b2-borderRadius-bl,var(--beae-card-border-radius))); } box-shadow: var(--dg23b2-shadowHorizontal, var(--beae-card-shadow-x)) var(--dg23b2-shadowVertical, var(--beae-card-shadow-y)) var(--dg23b2-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--dg23b2-shadowColor, var(--beae-card-media-shadow-color)) var(--dg23b2-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--dg23b2-overlayColor-color, #000); opacity: var(--dg23b2-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--dg23b2-objFit, cover); object-position: var(--beae-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--dg23b2-width-tablet,var(--dg23b2-width,100%)) - var(--dg23b2-margin-left-tablet,var(--dg23b2-margin-left,0px)) - var(--dg23b2-margin-right-tablet,var(--dg23b2-margin-right,0px))); aspect-ratio: var(--dg23b2-imageRatio-tablet, var(--dg23b2-imageRatio, auto)); img { object-fit: var(--dg23b2-objFit-tablet, var(--dg23b2-objFit, cover)); object-position: var(--beae-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--dg23b2-width-mobile,var(--dg23b2-width,100%)) - var(--dg23b2-margin-left-mobile,var(--dg23b2-margin-left,0px)) - var(--dg23b2-margin-right-mobile,var(--dg23b2-margin-right,0px))); aspect-ratio: var(--dg23b2-imageRatio-mobile, var(--dg23b2-imageRatio, auto)); img { object-fit: var(--dg23b2-objFit-mobile, var(--dg23b2-objFit, cover)); object-position: var(--beae-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.beae-media-wrapper is relative; .beae-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.beae-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .beae-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: beae-ai-gen-shimmer 1.8s linear infinite; } &.beae-ai-gen-done .beae-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .beae-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: beae-ai-gen-scan 2.6s ease-in-out infinite; } & .beae-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .beae-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: beae-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. */ &.beae-ai-generating .beae-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.beae-ai-gen-done .beae-image { opacity: 1; transform: scale(1); } } @keyframes beae-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes beae-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes beae-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="beae-b7kh1t"] { --b7kh1t-direction: column; --b7kh1t-direction-tablet: column; --b7kh1t-direction-mobile: column; --b7kh1t-structure: columns; --b7kh1t-structure-tablet: columns; --b7kh1t-structure-mobile: columns; --b7kh1t-gap: 32px; --b7kh1t-gap-tablet: 40px; --b7kh1t-gap-mobile: 32px; --b7kh1t-align-items-mobile: center; }[data-bnode="beae-b7kh1t"] { padding-top: var(--b7kh1t-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--b7kh1t-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--b7kh1t-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--b7kh1t-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--b7kh1t-padding-top-tablet, var(--b7kh1t-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--b7kh1t-padding-right-tablet, var(--b7kh1t-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--b7kh1t-padding-bottom-tablet, var(--b7kh1t-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--b7kh1t-padding-left-tablet, var(--b7kh1t-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--b7kh1t-padding-top-mobile, var(--b7kh1t-padding-top-tablet, var(--b7kh1t-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--b7kh1t-padding-right-mobile, var(--b7kh1t-padding-right-tablet, var(--b7kh1t-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--b7kh1t-padding-bottom-mobile, var(--b7kh1t-padding-bottom-tablet, var(--b7kh1t-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--b7kh1t-padding-left-mobile, var(--b7kh1t-padding-left-tablet, var(--b7kh1t-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--b7kh1t-position, relative); top: var(--b7kh1t-top, auto); right: var(--b7kh1t-right, auto); bottom: var(--b7kh1t-bottom, auto); left: var(--b7kh1t-left, auto); transform: var(--b7kh1t-transform, none); z-index: var(--b7kh1t-z-index, 10); aspect-ratio: var(--b7kh1t-background-imageRatio, auto); background: var(--b7kh1t-background-color,transparent); border-style: var(--b7kh1t-borderStyle,solid); border-color: var(--b7kh1t-borderColor,#000000); border-width: var(--b7kh1t-borderWidth-tl,0px) var(--b7kh1t-borderWidth-tr,0px) var(--b7kh1t-borderWidth-br,0px) var(--b7kh1t-borderWidth-bl,0px); border-radius: var(--b7kh1t-borderRadius-tl,0px) var(--b7kh1t-borderRadius-tr,0px) var(--b7kh1t-borderRadius-br,0px) var(--b7kh1t-borderRadius-bl,0px); box-shadow: var(--b7kh1t-shadowHorizontal, 0px) var(--b7kh1t-shadowVertical, 0px) var(--b7kh1t-shadowBlur, 0px) 1px color-mix( in srgb, var(--b7kh1t-shadowColor, #000000) var(--b7kh1t-shadowTransparent, 0%), transparent ); max-width: var(--b7kh1t-max-width, 100%); width: 100%; height: if(style(--b7kh1t-position: absolute): var(--b7kh1t-height,100%); else: unset ); backdrop-filter:blur(var(--b7kh1t-background-blur, none)) saturate(var(--b7kh1t-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--b7kh1t-position-tablet, var(--b7kh1t-position, relative)); top: var(--b7kh1t-top-tablet, var(--b7kh1t-top, auto)); right: var(--b7kh1t-right-tablet, var(--b7kh1t-right, auto)); bottom: var(--b7kh1t-bottom-tablet, var(--b7kh1t-bottom, auto)); left: var(--b7kh1t-left-tablet, var(--b7kh1t-left, auto)); transform: var(--b7kh1t-transform-tablet, var(--b7kh1t-transform, none)); z-index: var(--b7kh1t-z-index-tablet, var(--b7kh1t-z-index, 10)); aspect-ratio: var(--b7kh1t-background-imageRatio-tablet, var(--b7kh1t-background-imageRatio, auto)); border-width: var(--b7kh1t-borderWidth-tl-tablet, var(--b7kh1t-borderWidth-tl,0px)) var(--b7kh1t-borderWidth-tr-tablet,var(--b7kh1t-borderWidth-tr,0px)) var(--b7kh1t-borderWidth-br-tablet,var(--b7kh1t-borderWidth-br,0px)) var(--b7kh1t-borderWidth-bl-tablet,var(--b7kh1t-borderWidth-bl,0px)); border-radius: var(--b7kh1t-borderRadius-tl-tablet,var(--b7kh1t-borderRadius-tl,0px)) var(--b7kh1t-borderRadius-tr-tablet,var(--b7kh1t-borderRadius-tr,0px)) var(--b7kh1t-borderRadius-br-tablet,var(--b7kh1t-borderRadius-br,0px)) var(--b7kh1t-borderRadius-bl-tablet,var(--b7kh1t-borderRadius-bl,0px)); max-width: var(--b7kh1t-max-width-tablet, var(--b7kh1t-max-width, 100%)); height: if(style(--b7kh1t-position-tablet: absolute): var(--b7kh1t-height-tablet,var(--b7kh1t-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--b7kh1t-position-mobile, var(--b7kh1t-position-tablet, var(--b7kh1t-position, relative))); top: var(--b7kh1t-top-mobile, var(--b7kh1t-top-tablet, var(--b7kh1t-top, auto))); right: var(--b7kh1t-right-mobile, var(--b7kh1t-right-tablet, var(--b7kh1t-right, auto))); bottom: var(--b7kh1t-bottom-mobile, var(--b7kh1t-bottom-tablet, var(--b7kh1t-bottom, auto))); left: var(--b7kh1t-left-mobile, var(--b7kh1t-left-tablet, var(--b7kh1t-left, auto))); transform: var(--b7kh1t-transform-mobile, var(--b7kh1t-transform-tablet, var(--b7kh1t-transform, none))); z-index: var(--b7kh1t-z-index-mobile, var(--b7kh1t-z-index-tablet, var(--b7kh1t-z-index, 10))); aspect-ratio: var(--b7kh1t-background-imageRatio-mobile, var(--b7kh1t-background-imageRatio, auto)); border-width: var(--b7kh1t-borderWidth-tl-mobile, var(--b7kh1t-borderWidth-tl,0px)) var(--b7kh1t-borderWidth-tr-mobile,var(--b7kh1t-borderWidth-tr,0px)) var(--b7kh1t-borderWidth-br-mobile,var(--b7kh1t-borderWidth-br,0px)) var(--b7kh1t-borderWidth-bl-mobile,var(--b7kh1t-borderWidth-bl,0px)); border-radius: var(--b7kh1t-borderRadius-tl-mobile,var(--b7kh1t-borderRadius-tl,0px)) var(--b7kh1t-borderRadius-tr-mobile,var(--b7kh1t-borderRadius-tr,0px)) var(--b7kh1t-borderRadius-br-mobile,var(--b7kh1t-borderRadius-br,0px)) var(--b7kh1t-borderRadius-bl-mobile,var(--b7kh1t-borderRadius-bl,0px)); max-width: var(--b7kh1t-max-width-mobile, var(--b7kh1t-max-width, 100%)); height: if(style(--b7kh1t-position-mobile: absolute): var(--b7kh1t-height-mobile,var(--b7kh1t-height-tablet,,var(--b7kh1t-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--b7kh1t-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--b7kh1t-gap,var(--beae-card-gap)); padding-top: var(--b7kh1t-padding-top,var(--beae-card-padding)); padding-right: var(--b7kh1t-padding-right,var(--beae-card-padding)); padding-bottom: var(--b7kh1t-padding-bottom,var(--beae-card-padding)); padding-left: var(--b7kh1t-padding-left,var(--beae-card-padding)); border-width: var(--b7kh1t-borderWidth-tl,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-tr,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-br,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--b7kh1t-borderRadius-tl,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-tr,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-br,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--b7kh1t-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--b7kh1t-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--b7kh1t-gap-tablet,var(--beae-card-gap)); padding-top: var(--b7kh1t-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--b7kh1t-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--b7kh1t-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--b7kh1t-padding-left-tablet,var(--beae-card-padding)); border-width: var(--b7kh1t-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-br-desktop,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--b7kh1t-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--b7kh1t-gap-mobile,var(--beae-card-gap)); padding-top: var(--b7kh1t-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--b7kh1t-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--b7kh1t-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--b7kh1t-padding-left-mobile,var(--beae-card-padding)); border-width: var(--b7kh1t-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-br-mobile,var(--beae-card-border-width)) var(--b7kh1t-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--b7kh1t-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--b7kh1t-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--b7kh1t-background-color,var(--beae-card-featured-background)); border-color: var(--b7kh1t-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--b7kh1t-shadowHorizontal, var(--beae-card-shadow-x)) var(--b7kh1t-shadowVertical, var(--beae-card-shadow-y)) var(--b7kh1t-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--b7kh1t-shadowColor, var(--beae-card-featured-shadow-color)) var(--b7kh1t-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--b7kh1t-background-color,var(--beae-card-prod-background)); border-color: var(--b7kh1t-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--b7kh1t-shadowHorizontal, var(--beae-card-shadow-x)) var(--b7kh1t-shadowVertical, var(--beae-card-shadow-y)) var(--b7kh1t-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--b7kh1t-shadowColor, var(--beae-card-prod-shadow-color)) var(--b7kh1t-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--b7kh1t-background-color,var(--beae-card-pricing-background)); border-color: var(--b7kh1t-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--b7kh1t-shadowHorizontal, var(--beae-card-shadow-x)) var(--b7kh1t-shadowVertical, var(--beae-card-shadow-y)) var(--b7kh1t-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--b7kh1t-shadowColor, var(--beae-card-pricing-shadow-color)) var(--b7kh1t-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--b7kh1t-background-color,var(--beae-card-cta-background)); border-color: var(--b7kh1t-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--b7kh1t-shadowHorizontal, var(--beae-card-shadow-x)) var(--b7kh1t-shadowVertical, var(--beae-card-shadow-y)) var(--b7kh1t-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--b7kh1t-shadowColor, var(--beae-card-cta-shadow-color)) var(--b7kh1t-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-b7kh1t"] {     display: flex;     flex-direction: var(--b7kh1t-direction, column);     flex-wrap: nowrap;     justify-content: var(--b7kh1t-justify-content);     align-items: var(--b7kh1t-align-items);     gap: var(--b7kh1t-gap, var(--b7kh1t-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-b7kh1t"] {                            gap: var(--b7kh1t-gap-tablet, var(--b7kh1t-gap-tablet, var(--beae-slot-gap-tablet)));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--b7kh1t-padding-right-tablet, 0px) - var(--b7kh1t-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-b7kh1t"] {                      align-items: var(--b7kh1t-align-items-mobile, inherit);      gap: var(--b7kh1t-gap-mobile, var(--b7kh1t-gap-mobile, var(--beae-slot-gap-mobile)));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--b7kh1t-padding-right-mobile, 0px) - var(--b7kh1t-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-bhrwas"] { --bhrwas-direction: column; --bhrwas-direction-tablet: column; --bhrwas-direction-mobile: column; --bhrwas-gap: 12px; --bhrwas-gap-tablet: 12px; --bhrwas-gap-mobile: 12px; --bhrwas-align-items: flex-start; --bhrwas-align-items-tablet: flex-start; --bhrwas-align-items-mobile: flex-start; }[data-bnode="beae-bhrwas"] { padding-top: var(--bhrwas-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--bhrwas-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--bhrwas-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--bhrwas-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--bhrwas-padding-top-tablet, var(--bhrwas-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--bhrwas-padding-right-tablet, var(--bhrwas-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--bhrwas-padding-bottom-tablet, var(--bhrwas-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--bhrwas-padding-left-tablet, var(--bhrwas-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--bhrwas-padding-top-mobile, var(--bhrwas-padding-top-tablet, var(--bhrwas-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--bhrwas-padding-right-mobile, var(--bhrwas-padding-right-tablet, var(--bhrwas-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--bhrwas-padding-bottom-mobile, var(--bhrwas-padding-bottom-tablet, var(--bhrwas-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--bhrwas-padding-left-mobile, var(--bhrwas-padding-left-tablet, var(--bhrwas-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--bhrwas-position, relative); top: var(--bhrwas-top, auto); right: var(--bhrwas-right, auto); bottom: var(--bhrwas-bottom, auto); left: var(--bhrwas-left, auto); transform: var(--bhrwas-transform, none); z-index: var(--bhrwas-z-index, 10); aspect-ratio: var(--bhrwas-background-imageRatio, auto); background: var(--bhrwas-background-color,transparent); border-style: var(--bhrwas-borderStyle,solid); border-color: var(--bhrwas-borderColor,#000000); border-width: var(--bhrwas-borderWidth-tl,0px) var(--bhrwas-borderWidth-tr,0px) var(--bhrwas-borderWidth-br,0px) var(--bhrwas-borderWidth-bl,0px); border-radius: var(--bhrwas-borderRadius-tl,0px) var(--bhrwas-borderRadius-tr,0px) var(--bhrwas-borderRadius-br,0px) var(--bhrwas-borderRadius-bl,0px); box-shadow: var(--bhrwas-shadowHorizontal, 0px) var(--bhrwas-shadowVertical, 0px) var(--bhrwas-shadowBlur, 0px) 1px color-mix( in srgb, var(--bhrwas-shadowColor, #000000) var(--bhrwas-shadowTransparent, 0%), transparent ); max-width: var(--bhrwas-max-width, 100%); width: 100%; height: if(style(--bhrwas-position: absolute): var(--bhrwas-height,100%); else: unset ); backdrop-filter:blur(var(--bhrwas-background-blur, none)) saturate(var(--bhrwas-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--bhrwas-position-tablet, var(--bhrwas-position, relative)); top: var(--bhrwas-top-tablet, var(--bhrwas-top, auto)); right: var(--bhrwas-right-tablet, var(--bhrwas-right, auto)); bottom: var(--bhrwas-bottom-tablet, var(--bhrwas-bottom, auto)); left: var(--bhrwas-left-tablet, var(--bhrwas-left, auto)); transform: var(--bhrwas-transform-tablet, var(--bhrwas-transform, none)); z-index: var(--bhrwas-z-index-tablet, var(--bhrwas-z-index, 10)); aspect-ratio: var(--bhrwas-background-imageRatio-tablet, var(--bhrwas-background-imageRatio, auto)); border-width: var(--bhrwas-borderWidth-tl-tablet, var(--bhrwas-borderWidth-tl,0px)) var(--bhrwas-borderWidth-tr-tablet,var(--bhrwas-borderWidth-tr,0px)) var(--bhrwas-borderWidth-br-tablet,var(--bhrwas-borderWidth-br,0px)) var(--bhrwas-borderWidth-bl-tablet,var(--bhrwas-borderWidth-bl,0px)); border-radius: var(--bhrwas-borderRadius-tl-tablet,var(--bhrwas-borderRadius-tl,0px)) var(--bhrwas-borderRadius-tr-tablet,var(--bhrwas-borderRadius-tr,0px)) var(--bhrwas-borderRadius-br-tablet,var(--bhrwas-borderRadius-br,0px)) var(--bhrwas-borderRadius-bl-tablet,var(--bhrwas-borderRadius-bl,0px)); max-width: var(--bhrwas-max-width-tablet, var(--bhrwas-max-width, 100%)); height: if(style(--bhrwas-position-tablet: absolute): var(--bhrwas-height-tablet,var(--bhrwas-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--bhrwas-position-mobile, var(--bhrwas-position-tablet, var(--bhrwas-position, relative))); top: var(--bhrwas-top-mobile, var(--bhrwas-top-tablet, var(--bhrwas-top, auto))); right: var(--bhrwas-right-mobile, var(--bhrwas-right-tablet, var(--bhrwas-right, auto))); bottom: var(--bhrwas-bottom-mobile, var(--bhrwas-bottom-tablet, var(--bhrwas-bottom, auto))); left: var(--bhrwas-left-mobile, var(--bhrwas-left-tablet, var(--bhrwas-left, auto))); transform: var(--bhrwas-transform-mobile, var(--bhrwas-transform-tablet, var(--bhrwas-transform, none))); z-index: var(--bhrwas-z-index-mobile, var(--bhrwas-z-index-tablet, var(--bhrwas-z-index, 10))); aspect-ratio: var(--bhrwas-background-imageRatio-mobile, var(--bhrwas-background-imageRatio, auto)); border-width: var(--bhrwas-borderWidth-tl-mobile, var(--bhrwas-borderWidth-tl,0px)) var(--bhrwas-borderWidth-tr-mobile,var(--bhrwas-borderWidth-tr,0px)) var(--bhrwas-borderWidth-br-mobile,var(--bhrwas-borderWidth-br,0px)) var(--bhrwas-borderWidth-bl-mobile,var(--bhrwas-borderWidth-bl,0px)); border-radius: var(--bhrwas-borderRadius-tl-mobile,var(--bhrwas-borderRadius-tl,0px)) var(--bhrwas-borderRadius-tr-mobile,var(--bhrwas-borderRadius-tr,0px)) var(--bhrwas-borderRadius-br-mobile,var(--bhrwas-borderRadius-br,0px)) var(--bhrwas-borderRadius-bl-mobile,var(--bhrwas-borderRadius-bl,0px)); max-width: var(--bhrwas-max-width-mobile, var(--bhrwas-max-width, 100%)); height: if(style(--bhrwas-position-mobile: absolute): var(--bhrwas-height-mobile,var(--bhrwas-height-tablet,,var(--bhrwas-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--bhrwas-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--bhrwas-gap,var(--beae-card-gap)); padding-top: var(--bhrwas-padding-top,var(--beae-card-padding)); padding-right: var(--bhrwas-padding-right,var(--beae-card-padding)); padding-bottom: var(--bhrwas-padding-bottom,var(--beae-card-padding)); padding-left: var(--bhrwas-padding-left,var(--beae-card-padding)); border-width: var(--bhrwas-borderWidth-tl,var(--beae-card-border-width)) var(--bhrwas-borderWidth-tr,var(--beae-card-border-width)) var(--bhrwas-borderWidth-br,var(--beae-card-border-width)) var(--bhrwas-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--bhrwas-borderRadius-tl,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-tr,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-br,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--bhrwas-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--bhrwas-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--bhrwas-gap-tablet,var(--beae-card-gap)); padding-top: var(--bhrwas-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--bhrwas-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--bhrwas-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--bhrwas-padding-left-tablet,var(--beae-card-padding)); border-width: var(--bhrwas-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--bhrwas-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--bhrwas-borderWidth-br-desktop,var(--beae-card-border-width)) var(--bhrwas-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--bhrwas-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--bhrwas-gap-mobile,var(--beae-card-gap)); padding-top: var(--bhrwas-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--bhrwas-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--bhrwas-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--bhrwas-padding-left-mobile,var(--beae-card-padding)); border-width: var(--bhrwas-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--bhrwas-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--bhrwas-borderWidth-br-mobile,var(--beae-card-border-width)) var(--bhrwas-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--bhrwas-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--bhrwas-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--bhrwas-background-color,var(--beae-card-featured-background)); border-color: var(--bhrwas-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--bhrwas-shadowHorizontal, var(--beae-card-shadow-x)) var(--bhrwas-shadowVertical, var(--beae-card-shadow-y)) var(--bhrwas-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--bhrwas-shadowColor, var(--beae-card-featured-shadow-color)) var(--bhrwas-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--bhrwas-background-color,var(--beae-card-prod-background)); border-color: var(--bhrwas-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--bhrwas-shadowHorizontal, var(--beae-card-shadow-x)) var(--bhrwas-shadowVertical, var(--beae-card-shadow-y)) var(--bhrwas-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--bhrwas-shadowColor, var(--beae-card-prod-shadow-color)) var(--bhrwas-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--bhrwas-background-color,var(--beae-card-pricing-background)); border-color: var(--bhrwas-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--bhrwas-shadowHorizontal, var(--beae-card-shadow-x)) var(--bhrwas-shadowVertical, var(--beae-card-shadow-y)) var(--bhrwas-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--bhrwas-shadowColor, var(--beae-card-pricing-shadow-color)) var(--bhrwas-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--bhrwas-background-color,var(--beae-card-cta-background)); border-color: var(--bhrwas-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--bhrwas-shadowHorizontal, var(--beae-card-shadow-x)) var(--bhrwas-shadowVertical, var(--beae-card-shadow-y)) var(--bhrwas-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--bhrwas-shadowColor, var(--beae-card-cta-shadow-color)) var(--bhrwas-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-bhrwas"] {     display: flex;     flex-direction: var(--bhrwas-direction, column);     flex-wrap: nowrap;     justify-content: var(--bhrwas-justify-content);     align-items: var(--bhrwas-align-items);     gap: var(--bhrwas-gap, var(--bhrwas-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-bhrwas"] {                            gap: var(--bhrwas-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--bhrwas-padding-right-tablet, 0px) - var(--bhrwas-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-bhrwas"] {                            gap: var(--bhrwas-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--bhrwas-padding-right-mobile, 0px) - var(--bhrwas-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-nf86et"] { --nf86et-typography: eyebrow; --nf86et-typography-tablet: eyebrow; --nf86et-typography-mobile: eyebrow; --beae-eyebrow-text-align: start; --beae-eyebrow-font-size-tablet: 13px; --beae-eyebrow-line-height-tablet: 1.4; --beae-eyebrow-letter-spacing-tablet: 2px; }[data-bnode="beae-nf86et"] { margin-top: var(--nf86et-margin-top, 0px); margin-right: var(--nf86et-margin-right, 0px); margin-bottom: var(--nf86et-margin-bottom, 0px); margin-left: var(--nf86et-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--nf86et-margin-top-tablet, 0px); margin-right: var(--nf86et-margin-right-tablet, 0px); margin-bottom: var(--nf86et-margin-bottom-tablet, 0px); margin-left: var(--nf86et-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--nf86et-margin-top-mobile, 0px); margin-right: var(--nf86et-margin-right-mobile, 0px); margin-bottom: var(--nf86et-margin-bottom-mobile, 0px); margin-left: var(--nf86et-margin-left-mobile, 0px); } }[data-bnode="beae-kolq8x"] { --kolq8x-typography: h2; --kolq8x-typography-tablet: h2; --kolq8x-typography-mobile: h2; }[data-bnode="beae-kolq8x"] { margin-top: var(--kolq8x-margin-top, 0px); margin-right: var(--kolq8x-margin-right, 0px); margin-bottom: var(--kolq8x-margin-bottom, 0px); margin-left: var(--kolq8x-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--kolq8x-margin-top-tablet, 0px); margin-right: var(--kolq8x-margin-right-tablet, 0px); margin-bottom: var(--kolq8x-margin-bottom-tablet, 0px); margin-left: var(--kolq8x-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--kolq8x-margin-top-mobile, 0px); margin-right: var(--kolq8x-margin-right-mobile, 0px); margin-bottom: var(--kolq8x-margin-bottom-mobile, 0px); margin-left: var(--kolq8x-margin-left-mobile, 0px); } & .beae-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--kolq8x-highlightColor,var(--beae-p-color)); top: var(--kolq8x-highlightTop, 100%); } }[data-bnode="beae-gjhgnl"] { --gjhgnl-columns: 1; --gjhgnl-columns-tablet: 1; --gjhgnl-columns-mobile: 1; --gjhgnl-navType: true; --gjhgnl-navType-tablet: true; --gjhgnl-navType-mobile: true; --gjhgnl-pagiType: false; --gjhgnl-pagiType-tablet: false; --gjhgnl-pagiType-mobile: false; --gjhgnl-listType: grid; --gjhgnl-listType-tablet: grid; --gjhgnl-listType-mobile: grid; --gjhgnl-stateNavigation: normal; --gjhgnl-stateNavigation-tablet: normal; --gjhgnl-stateNavigation-mobile: normal; --gjhgnl-statePagination: normal; --gjhgnl-statePagination-tablet: normal; --gjhgnl-statePagination-mobile: normal; --gjhgnl-stateNavigtion: normal; --gjhgnl-stateNavigtion-tablet: normal; --gjhgnl-stateNavigtion-mobile: normal; --gjhgnl-gap: 40px; --gjhgnl-gap-tablet: 40px; --gjhgnl-gap-mobile: 32px; --gjhgnl-columnsMobile-mobile: 1; } [data-bnode="beae-gjhgnl"] [data-bnode="beae-contlp"] { --beae-p-text-align: justify; } [data-bnode="beae-gjhgnl"] [data-bnode="beae-item2a"] { --item2a-direction: row; } [data-bnode="beae-gjhgnl"] [data-bnode="beae-ude16f"] { --ude16f-typography: h3; } [data-bnode="beae-gjhgnl"] [data-bnode="beae-5ydduw"] { --5ydduw-typography: p; } [data-bnode="beae-gjhgnl"] [data-bnode="beae-7i2w9v"] { --7i2w9v-direction: column; --7i2w9v-structure: columns; } [data-bnode="beae-gjhgnl"] [data-bnode="beae-z38osg"] { --z38osg-width: 36px; --z38osg-imageRatio: 1/1; --z38osg-objFit: cover; --z38osg-borderColor: #000000; --z38osg-borderStyle: none; --z38osg-enableShadow: false; --z38osg-shadowHorizontal: 0px; --z38osg-shadowTransparent: 0%; --z38osg-margin-top: 0px; --z38osg-margin-right: 0px; --z38osg-margin-bottom: 0px; --z38osg-margin-left: 0px; } [data-bnode="beae-gjhgnl"] [data-bnode="beae-mfw41h"] { --mfw41h-typography: h5; --beae-h5-font-size-mobile: 18px; --beae-h5-line-height-mobile: 1.4; --beae-h5-letter-spacing-mobile: 0px; } [data-bnode="beae-gjhgnl"] [data-bnode="beae-13pn6a"] { --13pn6a-typography: p; } [data-bnode="beae-gjhgnl"] [data-bnode="be-ctl-item"] { --be-ctl-item-direction: row; --be-ctl-item-direction-tablet: row; --be-ctl-item-direction-mobile: row; --be-ctl-item-gap: 16px; --be-ctl-item-gap-tablet: 16px; --be-ctl-item-gap-mobile: 16px; --be-ctl-item-structure: auto; --be-ctl-item-structure-tablet: auto; --be-ctl-item-structure-mobile: auto; --be-ctl-item-align-items: flex-start; --be-ctl-item-align-items-tablet: flex-start; --be-ctl-item-align-items-mobile: flex-start; --be-ctl-item-padding-top: 40px; --be-ctl-item-padding-top-tablet: 40px; --be-ctl-item-padding-top-mobile: 40px; --be-ctl-item-padding-right: 0px; --be-ctl-item-padding-right-tablet: 0px; --be-ctl-item-padding-right-mobile: 0px; --be-ctl-item-padding-bottom: 0px; --be-ctl-item-padding-bottom-tablet: 0px; --be-ctl-item-padding-bottom-mobile: 0px; --be-ctl-item-padding-left: 0px; --be-ctl-item-padding-left-tablet: 0px; --be-ctl-item-padding-left-mobile: 0px; --be-ctl-item-borderStyle: solid; --be-ctl-item-borderStyle-tablet: solid; --be-ctl-item-borderStyle-mobile: solid; --be-ctl-item-borderWidth-tl: 1px; --be-ctl-item-borderWidth-tl-tablet: 1px; --be-ctl-item-borderWidth-tl-mobile: 1px; --be-ctl-item-borderWidth-tr: 0px; --be-ctl-item-borderWidth-tr-tablet: 0px; --be-ctl-item-borderWidth-tr-mobile: 0px; --be-ctl-item-borderWidth-bl: 0px; --be-ctl-item-borderWidth-bl-tablet: 0px; --be-ctl-item-borderWidth-bl-mobile: 0px; --be-ctl-item-borderWidth-br: 0px; --be-ctl-item-borderWidth-br-tablet: 0px; --be-ctl-item-borderWidth-br-mobile: 0px; --be-ctl-item-borderColor: #e5e5e5; --be-ctl-item-borderColor-tablet: #e5e5e5; --be-ctl-item-borderColor-mobile: #e5e5e5; }[data-bnode="beae-gjhgnl"] { margin-top: var(--gjhgnl-margin-top, 0px); margin-right: var(--gjhgnl-margin-right, 0px); margin-bottom: var(--gjhgnl-margin-bottom, 0px); margin-left: var(--gjhgnl-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--gjhgnl-margin-top-tablet, 0px); margin-right: var(--gjhgnl-margin-right-tablet, 0px); margin-bottom: var(--gjhgnl-margin-bottom-tablet, 0px); margin-left: var(--gjhgnl-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--gjhgnl-margin-top-mobile, 0px); margin-right: var(--gjhgnl-margin-right-mobile, 0px); margin-bottom: var(--gjhgnl-margin-bottom-mobile, 0px); margin-left: var(--gjhgnl-margin-left-mobile, 0px); } &.beae-content-list { .beae-slider-item{ > .beae-slot[data-bnode="be-ctl-item"]{ height: 100%; } } @media (min-width: 1180px) { & .beae-slider-wrapper[data-desktop-layout="slider"]{ .beae-slider-items { gap: var(--gjhgnl-gap,var(--beae-grid-gap, 20px)); .beae-slider-item{ flex: 0 0 calc((100% - var(--gjhgnl-gap,var(--beae-grid-gap, 20px)) * (var(--gjhgnl-columns, 3) - 1)) / var(--gjhgnl-columns, 3)); &:last-child{ margin-right: var(--gjhgnl-gap,var(--beae-grid-gap, 20px)); } } } } & .beae-slider-wrapper[data-desktop-layout="grid"]{ &[data-item="1"]{ .beae-slider-items { flex-direction: column; flex-wrap: nowrap; } } .beae-slider-items { flex-wrap: wrap; gap: var(--gjhgnl-gap,var(--beae-grid-gap, 20px)); .beae-slider-item { flex: 0 0 calc( (100% - (var(--gjhgnl-columns) - 1) * var(--gjhgnl-gap,var(--beae-grid-gap, 20px))) / var(--gjhgnl-columns) ); } } } } @media (min-width: 767.79px) and (max-width: 1180px) { & .beae-slider-wrapper[data-tablet-layout="slider"]{ .beae-slider-items { gap: var(--gjhgnl-gap-tablet,var(--beae-grid-gap-tablet, 20px)); .beae-slider-item{ flex: 0 0 calc((100% - var(--gjhgnl-gap-tablet,var(--beae-grid-gap-tablet, 16px)) * (var(--gjhgnl-columns-tablet, 3) - 1)) / var(--gjhgnl-columns-tablet, 3)); &:last-child{ margin-right: var(--gjhgnl-gap-tablet,var(--beae-grid-gap-tablet, 16px)); } } } } & .beae-slider-wrapper[data-tablet-layout="grid"]{ &[data-item-tablet="1"]{ .beae-slider-items { flex-direction: column; flex-wrap: nowrap; } } .beae-slider-items { flex-wrap: wrap; gap: var(--gjhgnl-gap-tablet,var(--beae-grid-gap-tablet, 16px)); .beae-slider-item { flex: 0 0 calc( (100% - (var(--gjhgnl-columns-tablet) - 1) * var(--gjhgnl-gap-tablet,var(--beae-grid-gap-tablet, 16px))) / var(--gjhgnl-columns-tablet) ); } } } } @media (max-width: 767px) { & .beae-slider-wrapper[data-mobile-layout="slider"]{ .beae-slider-items { gap: var(--gjhgnl-gap-mobile,var(--beae-grid-gap-mobile, 10px)); .beae-slider-item{ flex: 0 0 calc((100% - var(--gjhgnl-gap-mobile,var(--beae-grid-gap-mobile, 10px)) * (var(--gjhgnl-columnsMobile-mobile, 1) - 1)) / var(--gjhgnl-columnsMobile-mobile, 1)); &:last-child{ margin-right: var(--gjhgnl-gap-mobile,var(--beae-grid-gap-mobile, 10px)); } } } } & .beae-slider-wrapper[data-mobile-layout="grid"]{ &[data-item-mobile="1"]{ .beae-slider-items { flex-direction: column; flex-wrap: nowrap; } } .beae-slider-items { flex-wrap: wrap; gap: var(--gjhgnl-gap-mobile,var(--beae-grid-gap-mobile, 10px)); .beae-slider-item { flex: 0 0 calc( (100% - (var(--gjhgnl-columnsMobile-mobile) - 1) * var(--gjhgnl-gap-mobile,var(--beae-grid-gap-mobile, 10px))) / var(--gjhgnl-columnsMobile-mobile) ); } } } } /* Navigation & Pagination */ .beae-slider-nav-left, .beae-slider-nav-right { padding: var(--gjhgnl-navPadding,12px); background:var(--gjhgnl-navBg,#F5F5F5); color: var(--gjhgnl-navColor,var(--beae-text-color)); cursor: pointer; border-radius: var(--gjhgnl-navRadius,50%); &:hover { background:var(--gjhgnl-navBgHover,#CCCCCC); color: var(--gjhgnl-navColorHover,var(--beae-text-color)); } svg { width: var(--gjhgnl-navIconSize,20px); height: var(--gjhgnl-navIconSize,20px); } } & .beae-slider-wrapper[data-pagination="dots"] + .beae-slider-controls .beae-slider-pagination { background: var(--gjhgnl-pagiBg,#E6E6E6); &.active { background:var(--gjhgnl-pagiBgActive,#181818); } &:not(.active):hover { background:var(--gjhgnl-pagiBgHover,#CCCCCC); } } & .beae-slider-wrapper[data-pagination="numbers"] + .beae-slider-controls .beae-slider-pagination { color: var(--gjhgnl-pagiColor,#e6e6e6); &.active { color:var(--gjhgnl-pagiColorActive,#181818); } &:not(.active):hover { color: var(--gjhgnl-pagiColorHover,#181818); } } & .beae-slider-wrapper[data-pagination="counter"] + .beae-slider-controls .beae-slider-pagination-total { color: var(--gjhgnl-pagiColor,#e6e6e6); } & .beae-slider-wrapper[data-pagination="dynamic-dots"] + .beae-slider-controls .beae-slider-pagination { background: var(--gjhgnl-pagiBg,#E6E6E6); &.active { background: var(--gjhgnl-pagiBgActive,#181818); opacity: 1; } &:not(.active):hover { background: var(--gjhgnl-pagiBgHover,#CCCCCC); } } .beae-slider-pagination-wrp{ margin-top: 20px; } } & .beae-content-list-empty { min-height: 80px; display: flex; align-items: center; justify-content: center; background-color: #f0f0f0; color: #666; } & .beae-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="beae-gjhgnl"] [data-bnode="beae-z38osg"] { margin-top: var(--z38osg-margin-top, 0px); margin-right: var(--z38osg-margin-right, 0px); margin-bottom: var(--z38osg-margin-bottom, 0px); margin-left: var(--z38osg-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--z38osg-margin-top-tablet, 0px); margin-right: var(--z38osg-margin-right-tablet, 0px); margin-bottom: var(--z38osg-margin-bottom-tablet, 0px); margin-left: var(--z38osg-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--z38osg-margin-top-mobile, 0px); margin-right: var(--z38osg-margin-right-mobile, 0px); margin-bottom: var(--z38osg-margin-bottom-mobile, 0px); margin-left: var(--z38osg-margin-left-mobile, 0px); } &.beae-media-wrapper { position: relative; overflow: hidden; display: block; width: 100%; max-width: calc(var(--z38osg-width,100%) - var(--z38osg-margin-left,0px) - var(--z38osg-margin-right,0px)); min-height: min-content; border-color: var(--z38osg-borderColor,var(--beae-card-media-border-color)); border-style: var(--z38osg-borderStyle,solid); border-width: var(--z38osg-borderWidth-tl,var(--beae-card-border-width)) var(--z38osg-borderWidth-tr,var(--beae-card-border-width)) var(--z38osg-borderWidth-br,var(--beae-card-border-width)) var(--z38osg-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--z38osg-borderRadius-tl,var(--beae-card-border-radius)) var(--z38osg-borderRadius-tr,var(--beae-card-border-radius)) var(--z38osg-borderRadius-br,var(--beae-card-border-radius)) var(--z38osg-borderRadius-bl,var(--beae-card-border-radius)); aspect-ratio: var(--z38osg-imageRatio, auto); @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--z38osg-borderWidth-tl-tablet, var(--z38osg-borderWidth-tl,var(--beae-card-border-width))) var(--z38osg-borderWidth-tr-tablet, var(--z38osg-borderWidth-tr,var(--beae-card-border-width))) var(--z38osg-borderWidth-br-tablet, var(--z38osg-borderWidth-br,var(--beae-card-border-width))) var(--z38osg-borderWidth-bl-tablet, var(--z38osg-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--z38osg-borderRadius-tl-tablet, var(--z38osg-borderRadius-tl,var(--beae-card-border-radius))) var(--z38osg-borderRadius-tr-tablet, var(--z38osg-borderRadius-tr,var(--beae-card-border-radius))) var(--z38osg-borderRadius-br-tablet, var(--z38osg-borderRadius-br,var(--beae-card-border-radius))) var(--z38osg-borderRadius-bl-tablet, var(--z38osg-borderRadius-bl,var(--beae-card-border-radius))); } @media (max-width: 767px) { border-width: var(--z38osg-borderWidth-tl-mobile, var(--z38osg-borderWidth-tl,var(--beae-card-border-width))) var(--z38osg-borderWidth-tr-mobile, var(--z38osg-borderWidth-tr,var(--beae-card-border-width))) var(--z38osg-borderWidth-br-mobile, var(--z38osg-borderWidth-br,var(--beae-card-border-width))) var(--z38osg-borderWidth-bl-mobile, var(--z38osg-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--z38osg-borderRadius-tl-mobile, var(--z38osg-borderRadius-tl,var(--beae-card-border-radius))) var(--z38osg-borderRadius-tr-mobile, var(--z38osg-borderRadius-tr,var(--beae-card-border-radius))) var(--z38osg-borderRadius-br-mobile, var(--z38osg-borderRadius-br,var(--beae-card-border-radius))) var(--z38osg-borderRadius-bl-mobile, var(--z38osg-borderRadius-bl,var(--beae-card-border-radius))); } box-shadow: var(--z38osg-shadowHorizontal, var(--beae-card-shadow-x)) var(--z38osg-shadowVertical, var(--beae-card-shadow-y)) var(--z38osg-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--z38osg-shadowColor, var(--beae-card-media-shadow-color)) var(--z38osg-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--z38osg-overlayColor-color, #000); opacity: var(--z38osg-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--z38osg-objFit, cover); object-position: var(--beae-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--z38osg-width-tablet,var(--z38osg-width,100%)) - var(--z38osg-margin-left-tablet,var(--z38osg-margin-left,0px)) - var(--z38osg-margin-right-tablet,var(--z38osg-margin-right,0px))); aspect-ratio: var(--z38osg-imageRatio-tablet, var(--z38osg-imageRatio, auto)); img { object-fit: var(--z38osg-objFit-tablet, var(--z38osg-objFit, cover)); object-position: var(--beae-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--z38osg-width-mobile,var(--z38osg-width,100%)) - var(--z38osg-margin-left-mobile,var(--z38osg-margin-left,0px)) - var(--z38osg-margin-right-mobile,var(--z38osg-margin-right,0px))); aspect-ratio: var(--z38osg-imageRatio-mobile, var(--z38osg-imageRatio, auto)); img { object-fit: var(--z38osg-objFit-mobile, var(--z38osg-objFit, cover)); object-position: var(--beae-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.beae-media-wrapper is relative; .beae-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.beae-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .beae-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: beae-ai-gen-shimmer 1.8s linear infinite; } &.beae-ai-gen-done .beae-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .beae-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: beae-ai-gen-scan 2.6s ease-in-out infinite; } & .beae-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .beae-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: beae-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. */ &.beae-ai-generating .beae-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.beae-ai-gen-done .beae-image { opacity: 1; transform: scale(1); } } @keyframes beae-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes beae-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes beae-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } } [data-bnode="beae-gjhgnl"] [data-bnode="beae-7i2w9v"] { padding-top: var(--7i2w9v-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--7i2w9v-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--7i2w9v-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--7i2w9v-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--7i2w9v-padding-top-tablet, var(--7i2w9v-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--7i2w9v-padding-right-tablet, var(--7i2w9v-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--7i2w9v-padding-bottom-tablet, var(--7i2w9v-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--7i2w9v-padding-left-tablet, var(--7i2w9v-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--7i2w9v-padding-top-mobile, var(--7i2w9v-padding-top-tablet, var(--7i2w9v-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--7i2w9v-padding-right-mobile, var(--7i2w9v-padding-right-tablet, var(--7i2w9v-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--7i2w9v-padding-bottom-mobile, var(--7i2w9v-padding-bottom-tablet, var(--7i2w9v-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--7i2w9v-padding-left-mobile, var(--7i2w9v-padding-left-tablet, var(--7i2w9v-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--7i2w9v-position, relative); top: var(--7i2w9v-top, auto); right: var(--7i2w9v-right, auto); bottom: var(--7i2w9v-bottom, auto); left: var(--7i2w9v-left, auto); transform: var(--7i2w9v-transform, none); z-index: var(--7i2w9v-z-index, 10); aspect-ratio: var(--7i2w9v-background-imageRatio, auto); background: var(--7i2w9v-background-color,transparent); border-style: var(--7i2w9v-borderStyle,solid); border-color: var(--7i2w9v-borderColor,#000000); border-width: var(--7i2w9v-borderWidth-tl,0px) var(--7i2w9v-borderWidth-tr,0px) var(--7i2w9v-borderWidth-br,0px) var(--7i2w9v-borderWidth-bl,0px); border-radius: var(--7i2w9v-borderRadius-tl,0px) var(--7i2w9v-borderRadius-tr,0px) var(--7i2w9v-borderRadius-br,0px) var(--7i2w9v-borderRadius-bl,0px); box-shadow: var(--7i2w9v-shadowHorizontal, 0px) var(--7i2w9v-shadowVertical, 0px) var(--7i2w9v-shadowBlur, 0px) 1px color-mix( in srgb, var(--7i2w9v-shadowColor, #000000) var(--7i2w9v-shadowTransparent, 0%), transparent ); max-width: var(--7i2w9v-max-width, 100%); width: 100%; height: if(style(--7i2w9v-position: absolute): var(--7i2w9v-height,100%); else: unset ); backdrop-filter:blur(var(--7i2w9v-background-blur, none)) saturate(var(--7i2w9v-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--7i2w9v-position-tablet, var(--7i2w9v-position, relative)); top: var(--7i2w9v-top-tablet, var(--7i2w9v-top, auto)); right: var(--7i2w9v-right-tablet, var(--7i2w9v-right, auto)); bottom: var(--7i2w9v-bottom-tablet, var(--7i2w9v-bottom, auto)); left: var(--7i2w9v-left-tablet, var(--7i2w9v-left, auto)); transform: var(--7i2w9v-transform-tablet, var(--7i2w9v-transform, none)); z-index: var(--7i2w9v-z-index-tablet, var(--7i2w9v-z-index, 10)); aspect-ratio: var(--7i2w9v-background-imageRatio-tablet, var(--7i2w9v-background-imageRatio, auto)); border-width: var(--7i2w9v-borderWidth-tl-tablet, var(--7i2w9v-borderWidth-tl,0px)) var(--7i2w9v-borderWidth-tr-tablet,var(--7i2w9v-borderWidth-tr,0px)) var(--7i2w9v-borderWidth-br-tablet,var(--7i2w9v-borderWidth-br,0px)) var(--7i2w9v-borderWidth-bl-tablet,var(--7i2w9v-borderWidth-bl,0px)); border-radius: var(--7i2w9v-borderRadius-tl-tablet,var(--7i2w9v-borderRadius-tl,0px)) var(--7i2w9v-borderRadius-tr-tablet,var(--7i2w9v-borderRadius-tr,0px)) var(--7i2w9v-borderRadius-br-tablet,var(--7i2w9v-borderRadius-br,0px)) var(--7i2w9v-borderRadius-bl-tablet,var(--7i2w9v-borderRadius-bl,0px)); max-width: var(--7i2w9v-max-width-tablet, var(--7i2w9v-max-width, 100%)); height: if(style(--7i2w9v-position-tablet: absolute): var(--7i2w9v-height-tablet,var(--7i2w9v-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--7i2w9v-position-mobile, var(--7i2w9v-position-tablet, var(--7i2w9v-position, relative))); top: var(--7i2w9v-top-mobile, var(--7i2w9v-top-tablet, var(--7i2w9v-top, auto))); right: var(--7i2w9v-right-mobile, var(--7i2w9v-right-tablet, var(--7i2w9v-right, auto))); bottom: var(--7i2w9v-bottom-mobile, var(--7i2w9v-bottom-tablet, var(--7i2w9v-bottom, auto))); left: var(--7i2w9v-left-mobile, var(--7i2w9v-left-tablet, var(--7i2w9v-left, auto))); transform: var(--7i2w9v-transform-mobile, var(--7i2w9v-transform-tablet, var(--7i2w9v-transform, none))); z-index: var(--7i2w9v-z-index-mobile, var(--7i2w9v-z-index-tablet, var(--7i2w9v-z-index, 10))); aspect-ratio: var(--7i2w9v-background-imageRatio-mobile, var(--7i2w9v-background-imageRatio, auto)); border-width: var(--7i2w9v-borderWidth-tl-mobile, var(--7i2w9v-borderWidth-tl,0px)) var(--7i2w9v-borderWidth-tr-mobile,var(--7i2w9v-borderWidth-tr,0px)) var(--7i2w9v-borderWidth-br-mobile,var(--7i2w9v-borderWidth-br,0px)) var(--7i2w9v-borderWidth-bl-mobile,var(--7i2w9v-borderWidth-bl,0px)); border-radius: var(--7i2w9v-borderRadius-tl-mobile,var(--7i2w9v-borderRadius-tl,0px)) var(--7i2w9v-borderRadius-tr-mobile,var(--7i2w9v-borderRadius-tr,0px)) var(--7i2w9v-borderRadius-br-mobile,var(--7i2w9v-borderRadius-br,0px)) var(--7i2w9v-borderRadius-bl-mobile,var(--7i2w9v-borderRadius-bl,0px)); max-width: var(--7i2w9v-max-width-mobile, var(--7i2w9v-max-width, 100%)); height: if(style(--7i2w9v-position-mobile: absolute): var(--7i2w9v-height-mobile,var(--7i2w9v-height-tablet,,var(--7i2w9v-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--7i2w9v-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--7i2w9v-gap,var(--beae-card-gap)); padding-top: var(--7i2w9v-padding-top,var(--beae-card-padding)); padding-right: var(--7i2w9v-padding-right,var(--beae-card-padding)); padding-bottom: var(--7i2w9v-padding-bottom,var(--beae-card-padding)); padding-left: var(--7i2w9v-padding-left,var(--beae-card-padding)); border-width: var(--7i2w9v-borderWidth-tl,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-tr,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-br,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--7i2w9v-borderRadius-tl,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-tr,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-br,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--7i2w9v-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--7i2w9v-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--7i2w9v-gap-tablet,var(--beae-card-gap)); padding-top: var(--7i2w9v-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--7i2w9v-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--7i2w9v-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--7i2w9v-padding-left-tablet,var(--beae-card-padding)); border-width: var(--7i2w9v-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-br-desktop,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--7i2w9v-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--7i2w9v-gap-mobile,var(--beae-card-gap)); padding-top: var(--7i2w9v-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--7i2w9v-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--7i2w9v-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--7i2w9v-padding-left-mobile,var(--beae-card-padding)); border-width: var(--7i2w9v-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-br-mobile,var(--beae-card-border-width)) var(--7i2w9v-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--7i2w9v-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--7i2w9v-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--7i2w9v-background-color,var(--beae-card-featured-background)); border-color: var(--7i2w9v-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--7i2w9v-shadowHorizontal, var(--beae-card-shadow-x)) var(--7i2w9v-shadowVertical, var(--beae-card-shadow-y)) var(--7i2w9v-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--7i2w9v-shadowColor, var(--beae-card-featured-shadow-color)) var(--7i2w9v-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--7i2w9v-background-color,var(--beae-card-prod-background)); border-color: var(--7i2w9v-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--7i2w9v-shadowHorizontal, var(--beae-card-shadow-x)) var(--7i2w9v-shadowVertical, var(--beae-card-shadow-y)) var(--7i2w9v-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--7i2w9v-shadowColor, var(--beae-card-prod-shadow-color)) var(--7i2w9v-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--7i2w9v-background-color,var(--beae-card-pricing-background)); border-color: var(--7i2w9v-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--7i2w9v-shadowHorizontal, var(--beae-card-shadow-x)) var(--7i2w9v-shadowVertical, var(--beae-card-shadow-y)) var(--7i2w9v-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--7i2w9v-shadowColor, var(--beae-card-pricing-shadow-color)) var(--7i2w9v-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--7i2w9v-background-color,var(--beae-card-cta-background)); border-color: var(--7i2w9v-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--7i2w9v-shadowHorizontal, var(--beae-card-shadow-x)) var(--7i2w9v-shadowVertical, var(--beae-card-shadow-y)) var(--7i2w9v-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--7i2w9v-shadowColor, var(--beae-card-cta-shadow-color)) var(--7i2w9v-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } } [data-bnode="beae-gjhgnl"] [data-bnode="beae-mfw41h"] { margin-top: var(--mfw41h-margin-top, 0px); margin-right: var(--mfw41h-margin-right, 0px); margin-bottom: var(--mfw41h-margin-bottom, 0px); margin-left: var(--mfw41h-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--mfw41h-margin-top-tablet, 0px); margin-right: var(--mfw41h-margin-right-tablet, 0px); margin-bottom: var(--mfw41h-margin-bottom-tablet, 0px); margin-left: var(--mfw41h-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--mfw41h-margin-top-mobile, 0px); margin-right: var(--mfw41h-margin-right-mobile, 0px); margin-bottom: var(--mfw41h-margin-bottom-mobile, 0px); margin-left: var(--mfw41h-margin-left-mobile, 0px); } & .beae-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--mfw41h-highlightColor,var(--beae-p-color)); top: var(--mfw41h-highlightTop, 100%); } } [data-bnode="beae-gjhgnl"] [data-bnode="beae-13pn6a"] { margin-top: var(--13pn6a-margin-top, 0px); margin-right: var(--13pn6a-margin-right, 0px); margin-bottom: var(--13pn6a-margin-bottom, 0px); margin-left: var(--13pn6a-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--13pn6a-margin-top-tablet, 0px); margin-right: var(--13pn6a-margin-right-tablet, 0px); margin-bottom: var(--13pn6a-margin-bottom-tablet, 0px); margin-left: var(--13pn6a-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--13pn6a-margin-top-mobile, 0px); margin-right: var(--13pn6a-margin-right-mobile, 0px); margin-bottom: var(--13pn6a-margin-bottom-mobile, 0px); margin-left: var(--13pn6a-margin-left-mobile, 0px); } } [data-bnode="beae-gjhgnl"] [data-bnode="be-ctl-item"] { padding-top: var(--be-ctl-item-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--be-ctl-item-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--be-ctl-item-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--be-ctl-item-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--be-ctl-item-padding-top-tablet, var(--be-ctl-item-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--be-ctl-item-padding-right-tablet, var(--be-ctl-item-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--be-ctl-item-padding-bottom-tablet, var(--be-ctl-item-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--be-ctl-item-padding-left-tablet, var(--be-ctl-item-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--be-ctl-item-padding-top-mobile, var(--be-ctl-item-padding-top-tablet, var(--be-ctl-item-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--be-ctl-item-padding-right-mobile, var(--be-ctl-item-padding-right-tablet, var(--be-ctl-item-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--be-ctl-item-padding-bottom-mobile, var(--be-ctl-item-padding-bottom-tablet, var(--be-ctl-item-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--be-ctl-item-padding-left-mobile, var(--be-ctl-item-padding-left-tablet, var(--be-ctl-item-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--be-ctl-item-position, relative); top: var(--be-ctl-item-top, auto); right: var(--be-ctl-item-right, auto); bottom: var(--be-ctl-item-bottom, auto); left: var(--be-ctl-item-left, auto); transform: var(--be-ctl-item-transform, none); z-index: var(--be-ctl-item-z-index, 10); aspect-ratio: var(--be-ctl-item-background-imageRatio, auto); background: var(--be-ctl-item-background-color,transparent); border-style: var(--be-ctl-item-borderStyle,solid); border-color: var(--be-ctl-item-borderColor,#000000); border-width: var(--be-ctl-item-borderWidth-tl,0px) var(--be-ctl-item-borderWidth-tr,0px) var(--be-ctl-item-borderWidth-br,0px) var(--be-ctl-item-borderWidth-bl,0px); border-radius: var(--be-ctl-item-borderRadius-tl,0px) var(--be-ctl-item-borderRadius-tr,0px) var(--be-ctl-item-borderRadius-br,0px) var(--be-ctl-item-borderRadius-bl,0px); box-shadow: var(--be-ctl-item-shadowHorizontal, 0px) var(--be-ctl-item-shadowVertical, 0px) var(--be-ctl-item-shadowBlur, 0px) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, #000000) var(--be-ctl-item-shadowTransparent, 0%), transparent ); max-width: var(--be-ctl-item-max-width, 100%); width: 100%; height: if(style(--be-ctl-item-position: absolute): var(--be-ctl-item-height,100%); else: unset ); backdrop-filter:blur(var(--be-ctl-item-background-blur, none)) saturate(var(--be-ctl-item-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--be-ctl-item-position-tablet, var(--be-ctl-item-position, relative)); top: var(--be-ctl-item-top-tablet, var(--be-ctl-item-top, auto)); right: var(--be-ctl-item-right-tablet, var(--be-ctl-item-right, auto)); bottom: var(--be-ctl-item-bottom-tablet, var(--be-ctl-item-bottom, auto)); left: var(--be-ctl-item-left-tablet, var(--be-ctl-item-left, auto)); transform: var(--be-ctl-item-transform-tablet, var(--be-ctl-item-transform, none)); z-index: var(--be-ctl-item-z-index-tablet, var(--be-ctl-item-z-index, 10)); aspect-ratio: var(--be-ctl-item-background-imageRatio-tablet, var(--be-ctl-item-background-imageRatio, auto)); border-width: var(--be-ctl-item-borderWidth-tl-tablet, var(--be-ctl-item-borderWidth-tl,0px)) var(--be-ctl-item-borderWidth-tr-tablet,var(--be-ctl-item-borderWidth-tr,0px)) var(--be-ctl-item-borderWidth-br-tablet,var(--be-ctl-item-borderWidth-br,0px)) var(--be-ctl-item-borderWidth-bl-tablet,var(--be-ctl-item-borderWidth-bl,0px)); border-radius: var(--be-ctl-item-borderRadius-tl-tablet,var(--be-ctl-item-borderRadius-tl,0px)) var(--be-ctl-item-borderRadius-tr-tablet,var(--be-ctl-item-borderRadius-tr,0px)) var(--be-ctl-item-borderRadius-br-tablet,var(--be-ctl-item-borderRadius-br,0px)) var(--be-ctl-item-borderRadius-bl-tablet,var(--be-ctl-item-borderRadius-bl,0px)); max-width: var(--be-ctl-item-max-width-tablet, var(--be-ctl-item-max-width, 100%)); height: if(style(--be-ctl-item-position-tablet: absolute): var(--be-ctl-item-height-tablet,var(--be-ctl-item-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--be-ctl-item-position-mobile, var(--be-ctl-item-position-tablet, var(--be-ctl-item-position, relative))); top: var(--be-ctl-item-top-mobile, var(--be-ctl-item-top-tablet, var(--be-ctl-item-top, auto))); right: var(--be-ctl-item-right-mobile, var(--be-ctl-item-right-tablet, var(--be-ctl-item-right, auto))); bottom: var(--be-ctl-item-bottom-mobile, var(--be-ctl-item-bottom-tablet, var(--be-ctl-item-bottom, auto))); left: var(--be-ctl-item-left-mobile, var(--be-ctl-item-left-tablet, var(--be-ctl-item-left, auto))); transform: var(--be-ctl-item-transform-mobile, var(--be-ctl-item-transform-tablet, var(--be-ctl-item-transform, none))); z-index: var(--be-ctl-item-z-index-mobile, var(--be-ctl-item-z-index-tablet, var(--be-ctl-item-z-index, 10))); aspect-ratio: var(--be-ctl-item-background-imageRatio-mobile, var(--be-ctl-item-background-imageRatio, auto)); border-width: var(--be-ctl-item-borderWidth-tl-mobile, var(--be-ctl-item-borderWidth-tl,0px)) var(--be-ctl-item-borderWidth-tr-mobile,var(--be-ctl-item-borderWidth-tr,0px)) var(--be-ctl-item-borderWidth-br-mobile,var(--be-ctl-item-borderWidth-br,0px)) var(--be-ctl-item-borderWidth-bl-mobile,var(--be-ctl-item-borderWidth-bl,0px)); border-radius: var(--be-ctl-item-borderRadius-tl-mobile,var(--be-ctl-item-borderRadius-tl,0px)) var(--be-ctl-item-borderRadius-tr-mobile,var(--be-ctl-item-borderRadius-tr,0px)) var(--be-ctl-item-borderRadius-br-mobile,var(--be-ctl-item-borderRadius-br,0px)) var(--be-ctl-item-borderRadius-bl-mobile,var(--be-ctl-item-borderRadius-bl,0px)); max-width: var(--be-ctl-item-max-width-mobile, var(--be-ctl-item-max-width, 100%)); height: if(style(--be-ctl-item-position-mobile: absolute): var(--be-ctl-item-height-mobile,var(--be-ctl-item-height-tablet,,var(--be-ctl-item-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--be-ctl-item-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--be-ctl-item-gap,var(--beae-card-gap)); padding-top: var(--be-ctl-item-padding-top,var(--beae-card-padding)); padding-right: var(--be-ctl-item-padding-right,var(--beae-card-padding)); padding-bottom: var(--be-ctl-item-padding-bottom,var(--beae-card-padding)); padding-left: var(--be-ctl-item-padding-left,var(--beae-card-padding)); border-width: var(--be-ctl-item-borderWidth-tl,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-tr,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-br,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--be-ctl-item-borderRadius-tl,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-tr,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-br,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--be-ctl-item-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--be-ctl-item-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--be-ctl-item-gap-tablet,var(--beae-card-gap)); padding-top: var(--be-ctl-item-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--be-ctl-item-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--be-ctl-item-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--be-ctl-item-padding-left-tablet,var(--beae-card-padding)); border-width: var(--be-ctl-item-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-br-desktop,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--be-ctl-item-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--be-ctl-item-gap-mobile,var(--beae-card-gap)); padding-top: var(--be-ctl-item-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--be-ctl-item-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--be-ctl-item-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--be-ctl-item-padding-left-mobile,var(--beae-card-padding)); border-width: var(--be-ctl-item-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-br-mobile,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--be-ctl-item-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--be-ctl-item-background-color,var(--beae-card-featured-background)); border-color: var(--be-ctl-item-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--be-ctl-item-shadowHorizontal, var(--beae-card-shadow-x)) var(--be-ctl-item-shadowVertical, var(--beae-card-shadow-y)) var(--be-ctl-item-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, var(--beae-card-featured-shadow-color)) var(--be-ctl-item-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--be-ctl-item-background-color,var(--beae-card-prod-background)); border-color: var(--be-ctl-item-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--be-ctl-item-shadowHorizontal, var(--beae-card-shadow-x)) var(--be-ctl-item-shadowVertical, var(--beae-card-shadow-y)) var(--be-ctl-item-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, var(--beae-card-prod-shadow-color)) var(--be-ctl-item-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--be-ctl-item-background-color,var(--beae-card-pricing-background)); border-color: var(--be-ctl-item-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--be-ctl-item-shadowHorizontal, var(--beae-card-shadow-x)) var(--be-ctl-item-shadowVertical, var(--beae-card-shadow-y)) var(--be-ctl-item-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, var(--beae-card-pricing-shadow-color)) var(--be-ctl-item-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--be-ctl-item-background-color,var(--beae-card-cta-background)); border-color: var(--be-ctl-item-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--be-ctl-item-shadowHorizontal, var(--beae-card-shadow-x)) var(--be-ctl-item-shadowVertical, var(--beae-card-shadow-y)) var(--be-ctl-item-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, var(--beae-card-cta-shadow-color)) var(--be-ctl-item-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-gjhgnl"] [data-bnode="be-ctl-item"] {     display: flex;     flex-direction: var(--be-ctl-item-direction, column);     flex-wrap: nowrap;     justify-content: var(--be-ctl-item-justify-content);     align-items: var(--be-ctl-item-align-items);     gap: var(--be-ctl-item-gap, var(--be-ctl-item-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-gjhgnl"] [data-bnode="be-ctl-item"] {                            gap: var(--be-ctl-item-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--be-ctl-item-padding-right-tablet, 0px) - var(--be-ctl-item-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-gjhgnl"] [data-bnode="be-ctl-item"] {                            gap: var(--be-ctl-item-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--be-ctl-item-padding-right-mobile, 0px) - var(--be-ctl-item-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-7i2w9v"] {     display: flex;     flex-direction: var(--7i2w9v-direction, column);     flex-wrap: nowrap;     justify-content: var(--7i2w9v-justify-content);     align-items: var(--7i2w9v-align-items);     gap: var(--7i2w9v-gap, var(--7i2w9v-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-7i2w9v"] {                            gap: var(--7i2w9v-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--7i2w9v-padding-right-tablet, 0px) - var(--7i2w9v-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-7i2w9v"] {                            gap: var(--7i2w9v-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--7i2w9v-padding-right-mobile, 0px) - var(--7i2w9v-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-ma35ib"] { --ma35ib-width: var(--beae-section-width); --ma35ib-width-tablet: var(--beae-section-width); --ma35ib-width-mobile: var(--beae-section-width); --ma35ib-height: fit-content; --ma35ib-height-tablet: fit-content; --ma35ib-height-mobile: fit-content; --ma35ib-direction: row; --ma35ib-direction-tablet: row; --ma35ib-direction-mobile: row; --ma35ib-structure: columns; --ma35ib-structure-tablet: columns; --ma35ib-structure-mobile: columns; --ma35ib-padding-top: 40px; --ma35ib-padding-top-tablet: 40px; --ma35ib-padding-top-mobile: 40px; --ma35ib-padding-bottom: 40px; --ma35ib-padding-bottom-tablet: 40px; --ma35ib-padding-bottom-mobile: 40px; --ma35ib-surface: light; --ma35ib-surface-tablet: light; --ma35ib-surface-mobile: light; }[data-bnode="beae-ma35ib"] { padding-top: var(--ma35ib-padding-top, var(--beae-section-padding-y, 0px)); padding-right: var(--ma35ib-padding-right, var(--beae-section-padding-x, 0px)); padding-bottom: var(--ma35ib-padding-bottom, var(--beae-section-padding-y, 0px)); padding-left: var(--ma35ib-padding-left, var(--beae-section-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--ma35ib-padding-top-tablet, var(--ma35ib-padding-top, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-right: var(--ma35ib-padding-right-tablet, var(--ma35ib-padding-right, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); padding-bottom: var(--ma35ib-padding-bottom-tablet, var(--ma35ib-padding-bottom, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-left: var(--ma35ib-padding-left-tablet, var(--ma35ib-padding-left, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--ma35ib-padding-top-mobile, var(--ma35ib-padding-top-tablet, var(--ma35ib-padding-top, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-right: var(--ma35ib-padding-right-mobile, var(--ma35ib-padding-right-tablet, var(--ma35ib-padding-right, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); padding-bottom: var(--ma35ib-padding-bottom-mobile, var(--ma35ib-padding-bottom-tablet, var(--ma35ib-padding-bottom, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-left: var(--ma35ib-padding-left-mobile, var(--ma35ib-padding-left-tablet, var(--ma35ib-padding-left, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); } &.beae-section { background: var(--ma35ib-background-color, var(--beae-background-color)); max-width: 100%; position: relative; .beae-section-container { height: var(--ma35ib-height); width: 100%; max-width: var(--ma35ib-width,var(--beae-section-width)); margin: 0 auto; > *:not(.beae-slot) { position: relative; z-index: 1; } > .beae-bg-image{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; img{ width: 100%; height: 100%; } } > .beae-video-background{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; object-fit: cover; background: #000000; } } } @media (min-width: 767.79px) and (max-width: 1180px) { &.beae-section { & .beae-section-container { height: var(--ma35ib-height-tablet, auto); width: 100%; max-width: var(--ma35ib-width-tablet, 100%); } } } @media (max-width: 767px) { &.beae-section { & .beae-section-container { height: var(--ma35ib-height-mobile, auto); width: 100%; max-width: var(--ma35ib-width-mobile, 100%); } } } }[data-bnode="beae-ma35ib"] > .beae-section-container{     display: flex;     flex-direction: var(--ma35ib-direction, column);     flex-wrap: nowrap;     justify-content: var(--ma35ib-justify-content);     align-items: var(--ma35ib-align-items);     gap: var(--ma35ib-gap, var(--beae-grid-gap, 4px));            &>.beae-slot {         flex: 1 1 0;         min-width: 0;        }                 &>.beae-slot[data-bnode-index] {           flex-basis: calc(100.00% - var(--ma35ib-padding-right, 0px) - var(--ma35ib-padding-right, 0px));          }                   }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-ma35ib"] > .beae-section-container{                            gap: var(--beae-grid-gap-tablet, 4px);               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--ma35ib-padding-right-tablet, 0px) - var(--ma35ib-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-ma35ib"] > .beae-section-container{                            gap: var(--beae-grid-gap-mobile, 4px);              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--ma35ib-padding-right-mobile, 0px) - var(--ma35ib-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-3hlt9e"] { --3hlt9e-direction: row; --3hlt9e-direction-tablet: row; --3hlt9e-direction-mobile: column; --3hlt9e-structure: columns; --3hlt9e-structure-tablet: columns; --3hlt9e-structure-mobile: columns; --3hlt9e-gap: 20px; --3hlt9e-gap-tablet: 20px; --3hlt9e-gap-mobile: 20px; --3hlt9e-columns: 60.00,40.00; --3hlt9e-columns-tablet: 60.00,40.00; --3hlt9e-columns-mobile: 60.00,40.00; --3hlt9e-columnsPresetId: 60.00,40.00; --3hlt9e-columnsPresetId-tablet: 60.00,40.00; --3hlt9e-columnsPresetId-mobile: 60.00,40.00; }[data-bnode="beae-3hlt9e"] { padding-top: var(--3hlt9e-padding-top, 0px); padding-right: var(--3hlt9e-padding-right, 0px); padding-bottom: var(--3hlt9e-padding-bottom, 0px); padding-left: var(--3hlt9e-padding-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--3hlt9e-padding-top-tablet, var(--3hlt9e-padding-top, 0px)); padding-right: var(--3hlt9e-padding-right-tablet, var(--3hlt9e-padding-right, 0px)); padding-bottom: var(--3hlt9e-padding-bottom-tablet, var(--3hlt9e-padding-bottom, 0px)); padding-left: var(--3hlt9e-padding-left-tablet, var(--3hlt9e-padding-left, 0px)); } @media (max-width: 767px) { padding-top: var(--3hlt9e-padding-top-mobile, var(--3hlt9e-padding-top-tablet, var(--3hlt9e-padding-top, 0px))); padding-right: var(--3hlt9e-padding-right-mobile, var(--3hlt9e-padding-right-tablet, var(--3hlt9e-padding-right, 0px))); padding-bottom: var(--3hlt9e-padding-bottom-mobile, var(--3hlt9e-padding-bottom-tablet, var(--3hlt9e-padding-bottom, 0px))); padding-left: var(--3hlt9e-padding-left-mobile, var(--3hlt9e-padding-left-tablet, var(--3hlt9e-padding-left, 0px))); } &.beae-slot { position: relative; overflow:hidden; background: var(--3hlt9e-background-color); border-style: var(--3hlt9e-borderStyle,solid); border-color: var(--3hlt9e-borderColor,#000000); border-width: var(--3hlt9e-borderWidth-tl,0px) var(--3hlt9e-borderWidth-tr,0px) var(--3hlt9e-borderWidth-br,0px) var(--3hlt9e-borderWidth-bl,0px); border-radius: var(--3hlt9e-borderRadius-tl,0px) var(--3hlt9e-borderRadius-tr,0px) var(--3hlt9e-borderRadius-br,0px) var(--3hlt9e-borderRadius-bl,0px); box-shadow: var(--3hlt9e-shadowHorizontal, 0px) var(--3hlt9e-shadowVertical, 0px) var(--3hlt9e-shadowBlur, 0px) 1px color-mix( in srgb, var(--3hlt9e-shadowColor, #000000) var(--3hlt9e-shadowTransparent, 0%), transparent ); max-width: var(--3hlt9e-max-width, 100%); @media(min-width: 767.79px) and (max-width: 1180px){ border-width: var(--3hlt9e-borderWidth-tl-tablet,0px) var(--3hlt9e-borderWidth-tr-tablet,0px) var(--3hlt9e-borderWidth-br-tablet,0px) var(--3hlt9e-borderWidth-bl-tablet,0px); border-radius: var(--3hlt9e-borderRadius-tl-tablet,0px) var(--3hlt9e-borderRadius-tr-tablet,0px) var(--3hlt9e-borderRadius-br-tablet,0px) var(--3hlt9e-borderRadius-bl-tablet,0px); max-width: var(--3hlt9e-max-width-tablet, var(--3hlt9e-max-width, 100%)); } @media(max-width: 767px){ border-width: var(--3hlt9e-borderWidth-tl-mobile,0px) var(--3hlt9e-borderWidth-tr-mobile,0px) var(--3hlt9e-borderWidth-br-mobile,0px) var(--3hlt9e-borderWidth-bl-mobile,0px); border-radius: var(--3hlt9e-borderRadius-tl-mobile,0px) var(--3hlt9e-borderRadius-tr-mobile,0px) var(--3hlt9e-borderRadius-br-mobile,0px) var(--3hlt9e-borderRadius-bl-mobile,0px); max-width: var(--3hlt9e-max-width-mobile, var(--3hlt9e-max-width, 100%)); } > * { position: relative; z-index: 1; } > .beae-bg-image{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; img{ width: 100%; height: 100%; object-fit: cover; object-position: center; } } } }[data-bnode="beae-3hlt9e"] {     display: flex;     flex-direction: var(--3hlt9e-direction, column);     flex-wrap: nowrap;     justify-content: var(--3hlt9e-justify-content);     align-items: var(--3hlt9e-align-items);     gap: var(--3hlt9e-gap, var(--3hlt9e-gap, var(--beae-slot-gap)));            &>.beae-slot {         flex: 1 1 0;         min-width: 0;        }                &>.beae-slot[data-bnode-index="1"] {          flex-basis: calc(60.00% - var(--3hlt9e-padding-right, 0px) - var(--3hlt9e-padding-right, 0px));         }         &>.beae-slot[data-bnode-index="2"] {          flex-basis: calc(40.00% - var(--3hlt9e-padding-right, 0px) - var(--3hlt9e-padding-right, 0px));         }         &>.beae-slot[data-bnode-index="3"] {          flex-basis: calc(100% - var(--3hlt9e-padding-right, 0px) - var(--3hlt9e-padding-right, 0px));         }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-3hlt9e"] {                            gap: var(--3hlt9e-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                  &>.beae-slot[data-bnode-index="1"] {           flex-basis: calc(60.00% - var(--3hlt9e-padding-right-tablet, 0px) - var(--3hlt9e-padding-right-tablet, 0px));          }          &>.beae-slot[data-bnode-index="2"] {           flex-basis: calc(40.00% - var(--3hlt9e-padding-right-tablet, 0px) - var(--3hlt9e-padding-right-tablet, 0px));          }          &>.beae-slot[data-bnode-index="3"] {           flex-basis: calc(100% - var(--3hlt9e-padding-right-tablet, 0px) - var(--3hlt9e-padding-right-tablet, 0px));          }            }    }    @media (max-width: 767px) {     [data-bnode="beae-3hlt9e"] {      flex-direction: var(--3hlt9e-direction-mobile, column);                      gap: var(--3hlt9e-gap-mobile, var(--3hlt9e-gap-mobile, var(--beae-slot-gap-mobile)));             &>.beae-slot[data-bnode-index] {                }           }    }[data-bnode="beae-ploocs"] { --ploocs-media: main; --ploocs-media-tablet: main; --ploocs-media-mobile: main; --ploocs-effect: slide; --ploocs-effect-tablet: slide; --ploocs-effect-mobile: slide; --ploocs-imageRatioMain: auto; --ploocs-imageRatioMain-tablet: auto; --ploocs-imageRatioMain-mobile: auto; --ploocs-positionThumb: left; --ploocs-positionThumb-tablet: left; --ploocs-positionThumb-mobile: left; --ploocs-widthItemThumbs: 97px; --ploocs-widthItemThumbs-tablet: 80px; --ploocs-widthItemThumbs-mobile: 64px; --ploocs-imageRatioThumbs: 1/1; --ploocs-imageRatioThumbs-tablet: 1/1; --ploocs-imageRatioThumbs-mobile: 1/1; --ploocs-borderStyleThumbs: solid; --ploocs-borderStyleThumbs-tablet: solid; --ploocs-borderStyleThumbs-mobile: solid; --ploocs-borderColorThumbs: #000000; --ploocs-borderColorThumbs-tablet: #000000; --ploocs-borderColorThumbs-mobile: #000000; --ploocs-borderWidthThumbs: 1px; --ploocs-borderWidthThumbs-tablet: 1px; --ploocs-borderWidthThumbs-mobile: 1px; --ploocs-objFit: contain; --ploocs-objFit-tablet: contain; --ploocs-objFit-mobile: contain; --ploocs-show_thumbs: false; --ploocs-show_thumbs-tablet: false; --ploocs-show_thumbs-mobile: false; --ploocs-borderRadiusMain: 0px; --ploocs-borderRadiusMain-tablet: 0px; --ploocs-borderRadiusMain-mobile: 0px; --ploocs-borderStyleMain: none; --ploocs-borderStyleMain-tablet: none; --ploocs-borderStyleMain-mobile: none; }[data-bnode="beae-ploocs"] { margin-top: var(--ploocs-margin-top, 0px); margin-right: var(--ploocs-margin-right, 0px); margin-bottom: var(--ploocs-margin-bottom, 0px); margin-left: var(--ploocs-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--ploocs-margin-top-tablet, 0px); margin-right: var(--ploocs-margin-right-tablet, 0px); margin-bottom: var(--ploocs-margin-bottom-tablet, 0px); margin-left: var(--ploocs-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--ploocs-margin-top-mobile, 0px); margin-right: var(--ploocs-margin-right-mobile, 0px); margin-bottom: var(--ploocs-margin-bottom-mobile, 0px); margin-left: var(--ploocs-margin-left-mobile, 0px); } & { .beae-media-product { display: flex; gap: var(--ploocs-gap, 16px); width: 100%; .beae-main-slider-wrap { width: 100%; height: fit-content; } } .beae-product-media-main[data-effect="fade"] { position: relative; border-radius: var(--ploocs-borderRadiusMain); box-shadow: if(style(--ploocs-enableShadowMain: true): var(--ploocs-shadowHorizontalMain, 0) var(--ploocs-shadowVerticalMain, 0) var(--ploocs-shadowBlurMain, 0) 1px var(--ploocs-shadowColorMain, #000000); else: none); overflow: hidden; } .beae-product-media-main[data-effect="fade"]::before { content: ""; position: absolute; inset: 0; border: var(--ploocs-borderWidthMain) var(--ploocs-borderStyleMain) var(--ploocs-borderColorMain, #000000); z-index: 1; } .beae-product-media-main[data-effect="slide"] { overflow: hidden; .beae-slider-item { position: relative; border-radius: var(--ploocs-borderRadiusMain); box-shadow: if(style(--ploocs-enableShadowMain: true): var(--ploocs-shadowHorizontalMain, 0) var(--ploocs-shadowVerticalMain, 0) var(--ploocs-shadowBlurMain, 0) 1px var(--ploocs-shadowColorMain, #000000); else: none); overflow: hidden; } .beae-slider-item::before { content: ""; position: absolute; inset: 0; border: var(--ploocs-borderWidthMain) var(--ploocs-borderStyleMain) var(--ploocs-borderColorMain, #000000); z-index: 1; } } .beae-product-picture { display: block; height: auto; aspect-ratio: var(--ploocs-imageRatioMain); overflow: hidden; .beae-product-image { width: 100%; height: 100%; object-fit: var(--ploocs-objFit, cover); object-position: var(--beae-image-position, 0% 50%); vertical-align: middle; } } .beae-product-thumb-slide { .beae-slider-items { gap: 16px; } .beae-slider-item { flex: 1 0 var(--ploocs-widthItemThumbs, 100px) !important; max-width: var(--ploocs-widthItemThumbs, 100px); } .beae-slider-item.is-active .beae-thumb-image { box-shadow: if(style(--ploocs-enableShadowThumbs: true): var(--ploocs-shadowHorizontalThumbs, 0) var(--ploocs-shadowVerticalThumbs, 0) var(--ploocs-shadowBlurThumbs, 0) 1px var(--ploocs-shadowColorThumbs, #000000); else: none); } .beae-slider-item.is-active .beae-thumb-image::after { content: ""; position: absolute; inset: 0; border: var(--ploocs-borderWidthThumbs) var(--ploocs-borderStyleThumbs) var(--ploocs-borderColorThumbs, #000000); border-radius: inherit; z-index: 1; } } .beae-thumb-image { position: relative; width: 100%; max-width: 100%; height: auto; aspect-ratio: var(--ploocs-imageRatioThumbs); border-radius: var(--ploocs-borderRadiusThumbs); overflow: hidden; .beae-thumb-img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; } } } @media (min-width: 1181px) { & { .beae-media-product { &[data-position-thumbs='bottom'] { flex-direction: column; .beae-thumb-wrapper { max-width: 100%; width: 100%; overflow: hidden; } } &:not([data-position-thumbs='bottom']) { .beae-main-slider-wrap { flex: 1; min-width: 0; } .beae-thumb-wrapper { width: fit-content; height: 100%; overflow: hidden; } .beae-product-thumb-slide { height: 100%; } .beae-product-thumb-slide .beae-slider-items { flex-direction: column; } .beae-product-thumb-slide .beae-slider-item { flex: 1 0 0 !important; } } &[data-position-thumbs='left'] { flex-direction: row-reverse; } } } } @media (min-width: 768px) and (max-width: 1180px) { & { .beae-media-product { gap: var(--ploocs-gap-tablet, 16px); &[data-position-thumbs-tablet='bottom'] { flex-direction: column; .beae-thumb-wrapper { max-width: 100%; width: 100%; overflow: hidden; } } &:not([data-position-thumbs-tablet='bottom']) { .beae-main-slider-wrap { flex: 1; min-width: 0; } .beae-thumb-wrapper { width: fit-content; height: 100%; overflow: hidden; } .beae-product-thumb-slide { height: 100%; } .beae-product-thumb-slide .beae-slider-items { flex-direction: column; } .beae-product-thumb-slide .beae-slider-item { flex: 1 0 0 !important; } } &[data-position-thumbs-tablet='left'] { flex-direction: row-reverse; } } .beae-product-thumb-slide { .beae-slider-items { gap: 8px; } .beae-slider-item { flex: 1 0 var(--ploocs-widthItemThumbs-tablet, 80px) !important; max-width: var(--ploocs-widthItemThumbs-tablet, 80px); } } .beae-product-picture { aspect-ratio: var(--ploocs-imageRatioMain-tablet); border-radius: var(--ploocs-borderRadiusMedia-tablet); .beae-product-image { object-fit: var(--ploocs-objFit-tablet, var(--ploocs-objFit, cover)); } } .beae-thumb-image { aspect-ratio: var(--ploocs-imageRatioThumbs-tablet); border-radius: var(--ploocs-borderRadiusThumbs-tablet); } } } @media (max-width: 767px) { & { .beae-media-product { gap: var(--ploocs-gap-mobile, 16px); &[data-position-thumbs-mobile='bottom'] { flex-direction: column; .beae-thumb-wrapper { max-width: 100%; width: 100%; overflow: hidden; } } } .beae-product-thumb-slide { .beae-slider-items { gap: 8px; } .beae-slider-item { flex: 1 0 var(--ploocs-widthItemThumbs-mobile, 64px) !important; max-width: var(--ploocs-widthItemThumbs-mobile, 64px); } } .beae-product-picture { aspect-ratio: var(--ploocs-imageRatioMain-mobile); border-radius: var(--ploocs-borderRadiusMedia-mobile); .beae-product-image { object-fit: var(--ploocs-objFit-mobile, var(--ploocs-objFit, cover)); } } .beae-thumb-image { aspect-ratio: var(--ploocs-imageRatioThumbs-mobile); border-radius: var(--ploocs-borderRadiusThumbs-mobile); } } } & .beae-main-slider-wrap { @media (min-width: 1024px) { & .beae-slider-wrapper[data-desktop-layout="slider"] { .beae-slider-items { gap: var(--ploocs-gap, 20px); .beae-slider-item { flex: 0 0 calc((100% - var(--ploocs-gap, 20px) * (1 - 1)) / 1.458); } } } & .beae-slider-wrapper[data-desktop-layout="grid"] { .beae-slider-items { flex-wrap: wrap; gap: var(--ploocs-gap, 20px); .beae-slider-item { flex: 0 0 calc((100% - (1 - 1) * var(--ploocs-gap, 20px)) / 1); } } } } @media (min-width: 768px) and (max-width: 1180px) { & .beae-slider-wrapper[data-tablet-layout="slider"] { .beae-slider-items { gap: var(--ploocs-gap-tablet, 20px); .beae-slider-item { flex: 0 0 calc((100% - var(--ploocs-gap-tablet, 20px) * (1 - 1)) / 1); } } } & .beae-slider-wrapper[data-tablet-layout="grid"] { .beae-slider-items { flex-wrap: wrap; gap: var(--ploocs-gap-tablet, 20px); .beae-slider-item { flex: 0 0 calc((100% - (1 - 1) * var(--ploocs-gap-tablet, 20px)) / 1); } } } } @media (max-width: 767px) { & .beae-slider-wrapper[data-mobile-layout="slider"] { .beae-slider-items { gap: var(--ploocs-gap-mobile, 20px); .beae-slider-item { flex: 0 0 calc((100% - var(--ploocs-gap-mobile, 20px) * (1 - 1)) / 1); } } } & .beae-slider-wrapper[data-mobile-layout="grid"] { .beae-slider-items { flex-wrap: wrap; gap: var(--ploocs-gap-mobile, 20px); .beae-slider-item { flex: 0 0 calc((100% - (1 - 1) * var(--ploocs-gap-mobile, 20px)) / 1); } } } } /* Navigation & Pagination */ .beae-slider-nav-left, .beae-slider-nav-right { padding: var(--ploocs-navPadding, 12px); background: var(--ploocs-navBg, #F5F5F5); color: var(--ploocs-navColor, #333333); cursor: pointer; z-index: 10; &:hover { background: var(--ploocs-navBgHover, #CCCCCC); color: var(--ploocs-navColorHover, #333333); } svg { width: var(--ploocs-navIconSize, 20px); height: var(--ploocs-navIconSize, 20px); } } } }[data-bnode="beae-izc4m3"] { --izc4m3-direction: column; --izc4m3-direction-tablet: column; --izc4m3-direction-mobile: column; --izc4m3-align-items: stretch; --izc4m3-align-items-tablet: stretch; --izc4m3-align-items-mobile: stretch; --izc4m3-gap: 14px; --izc4m3-gap-tablet: 14px; --izc4m3-gap-mobile: 14px; }[data-bnode="beae-izc4m3"] { padding-top: var(--izc4m3-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--izc4m3-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--izc4m3-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--izc4m3-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--izc4m3-padding-top-tablet, var(--izc4m3-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--izc4m3-padding-right-tablet, var(--izc4m3-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--izc4m3-padding-bottom-tablet, var(--izc4m3-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--izc4m3-padding-left-tablet, var(--izc4m3-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--izc4m3-padding-top-mobile, var(--izc4m3-padding-top-tablet, var(--izc4m3-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--izc4m3-padding-right-mobile, var(--izc4m3-padding-right-tablet, var(--izc4m3-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--izc4m3-padding-bottom-mobile, var(--izc4m3-padding-bottom-tablet, var(--izc4m3-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--izc4m3-padding-left-mobile, var(--izc4m3-padding-left-tablet, var(--izc4m3-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--izc4m3-position, relative); top: var(--izc4m3-top, auto); right: var(--izc4m3-right, auto); bottom: var(--izc4m3-bottom, auto); left: var(--izc4m3-left, auto); transform: var(--izc4m3-transform, none); z-index: var(--izc4m3-z-index, 10); aspect-ratio: var(--izc4m3-background-imageRatio, auto); background: var(--izc4m3-background-color,transparent); border-style: var(--izc4m3-borderStyle,solid); border-color: var(--izc4m3-borderColor,#000000); border-width: var(--izc4m3-borderWidth-tl,0px) var(--izc4m3-borderWidth-tr,0px) var(--izc4m3-borderWidth-br,0px) var(--izc4m3-borderWidth-bl,0px); border-radius: var(--izc4m3-borderRadius-tl,0px) var(--izc4m3-borderRadius-tr,0px) var(--izc4m3-borderRadius-br,0px) var(--izc4m3-borderRadius-bl,0px); box-shadow: var(--izc4m3-shadowHorizontal, 0px) var(--izc4m3-shadowVertical, 0px) var(--izc4m3-shadowBlur, 0px) 1px color-mix( in srgb, var(--izc4m3-shadowColor, #000000) var(--izc4m3-shadowTransparent, 0%), transparent ); max-width: var(--izc4m3-max-width, 100%); width: 100%; height: if(style(--izc4m3-position: absolute): var(--izc4m3-height,100%); else: unset ); backdrop-filter:blur(var(--izc4m3-background-blur, none)) saturate(var(--izc4m3-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--izc4m3-position-tablet, var(--izc4m3-position, relative)); top: var(--izc4m3-top-tablet, var(--izc4m3-top, auto)); right: var(--izc4m3-right-tablet, var(--izc4m3-right, auto)); bottom: var(--izc4m3-bottom-tablet, var(--izc4m3-bottom, auto)); left: var(--izc4m3-left-tablet, var(--izc4m3-left, auto)); transform: var(--izc4m3-transform-tablet, var(--izc4m3-transform, none)); z-index: var(--izc4m3-z-index-tablet, var(--izc4m3-z-index, 10)); aspect-ratio: var(--izc4m3-background-imageRatio-tablet, var(--izc4m3-background-imageRatio, auto)); border-width: var(--izc4m3-borderWidth-tl-tablet, var(--izc4m3-borderWidth-tl,0px)) var(--izc4m3-borderWidth-tr-tablet,var(--izc4m3-borderWidth-tr,0px)) var(--izc4m3-borderWidth-br-tablet,var(--izc4m3-borderWidth-br,0px)) var(--izc4m3-borderWidth-bl-tablet,var(--izc4m3-borderWidth-bl,0px)); border-radius: var(--izc4m3-borderRadius-tl-tablet,var(--izc4m3-borderRadius-tl,0px)) var(--izc4m3-borderRadius-tr-tablet,var(--izc4m3-borderRadius-tr,0px)) var(--izc4m3-borderRadius-br-tablet,var(--izc4m3-borderRadius-br,0px)) var(--izc4m3-borderRadius-bl-tablet,var(--izc4m3-borderRadius-bl,0px)); max-width: var(--izc4m3-max-width-tablet, var(--izc4m3-max-width, 100%)); height: if(style(--izc4m3-position-tablet: absolute): var(--izc4m3-height-tablet,var(--izc4m3-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--izc4m3-position-mobile, var(--izc4m3-position-tablet, var(--izc4m3-position, relative))); top: var(--izc4m3-top-mobile, var(--izc4m3-top-tablet, var(--izc4m3-top, auto))); right: var(--izc4m3-right-mobile, var(--izc4m3-right-tablet, var(--izc4m3-right, auto))); bottom: var(--izc4m3-bottom-mobile, var(--izc4m3-bottom-tablet, var(--izc4m3-bottom, auto))); left: var(--izc4m3-left-mobile, var(--izc4m3-left-tablet, var(--izc4m3-left, auto))); transform: var(--izc4m3-transform-mobile, var(--izc4m3-transform-tablet, var(--izc4m3-transform, none))); z-index: var(--izc4m3-z-index-mobile, var(--izc4m3-z-index-tablet, var(--izc4m3-z-index, 10))); aspect-ratio: var(--izc4m3-background-imageRatio-mobile, var(--izc4m3-background-imageRatio, auto)); border-width: var(--izc4m3-borderWidth-tl-mobile, var(--izc4m3-borderWidth-tl,0px)) var(--izc4m3-borderWidth-tr-mobile,var(--izc4m3-borderWidth-tr,0px)) var(--izc4m3-borderWidth-br-mobile,var(--izc4m3-borderWidth-br,0px)) var(--izc4m3-borderWidth-bl-mobile,var(--izc4m3-borderWidth-bl,0px)); border-radius: var(--izc4m3-borderRadius-tl-mobile,var(--izc4m3-borderRadius-tl,0px)) var(--izc4m3-borderRadius-tr-mobile,var(--izc4m3-borderRadius-tr,0px)) var(--izc4m3-borderRadius-br-mobile,var(--izc4m3-borderRadius-br,0px)) var(--izc4m3-borderRadius-bl-mobile,var(--izc4m3-borderRadius-bl,0px)); max-width: var(--izc4m3-max-width-mobile, var(--izc4m3-max-width, 100%)); height: if(style(--izc4m3-position-mobile: absolute): var(--izc4m3-height-mobile,var(--izc4m3-height-tablet,,var(--izc4m3-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--izc4m3-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--izc4m3-gap,var(--beae-card-gap)); padding-top: var(--izc4m3-padding-top,var(--beae-card-padding)); padding-right: var(--izc4m3-padding-right,var(--beae-card-padding)); padding-bottom: var(--izc4m3-padding-bottom,var(--beae-card-padding)); padding-left: var(--izc4m3-padding-left,var(--beae-card-padding)); border-width: var(--izc4m3-borderWidth-tl,var(--beae-card-border-width)) var(--izc4m3-borderWidth-tr,var(--beae-card-border-width)) var(--izc4m3-borderWidth-br,var(--beae-card-border-width)) var(--izc4m3-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--izc4m3-borderRadius-tl,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-tr,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-br,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--izc4m3-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--izc4m3-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--izc4m3-gap-tablet,var(--beae-card-gap)); padding-top: var(--izc4m3-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--izc4m3-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--izc4m3-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--izc4m3-padding-left-tablet,var(--beae-card-padding)); border-width: var(--izc4m3-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--izc4m3-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--izc4m3-borderWidth-br-desktop,var(--beae-card-border-width)) var(--izc4m3-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--izc4m3-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--izc4m3-gap-mobile,var(--beae-card-gap)); padding-top: var(--izc4m3-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--izc4m3-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--izc4m3-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--izc4m3-padding-left-mobile,var(--beae-card-padding)); border-width: var(--izc4m3-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--izc4m3-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--izc4m3-borderWidth-br-mobile,var(--beae-card-border-width)) var(--izc4m3-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--izc4m3-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--izc4m3-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--izc4m3-background-color,var(--beae-card-featured-background)); border-color: var(--izc4m3-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--izc4m3-shadowHorizontal, var(--beae-card-shadow-x)) var(--izc4m3-shadowVertical, var(--beae-card-shadow-y)) var(--izc4m3-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--izc4m3-shadowColor, var(--beae-card-featured-shadow-color)) var(--izc4m3-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--izc4m3-background-color,var(--beae-card-prod-background)); border-color: var(--izc4m3-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--izc4m3-shadowHorizontal, var(--beae-card-shadow-x)) var(--izc4m3-shadowVertical, var(--beae-card-shadow-y)) var(--izc4m3-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--izc4m3-shadowColor, var(--beae-card-prod-shadow-color)) var(--izc4m3-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--izc4m3-background-color,var(--beae-card-pricing-background)); border-color: var(--izc4m3-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--izc4m3-shadowHorizontal, var(--beae-card-shadow-x)) var(--izc4m3-shadowVertical, var(--beae-card-shadow-y)) var(--izc4m3-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--izc4m3-shadowColor, var(--beae-card-pricing-shadow-color)) var(--izc4m3-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--izc4m3-background-color,var(--beae-card-cta-background)); border-color: var(--izc4m3-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--izc4m3-shadowHorizontal, var(--beae-card-shadow-x)) var(--izc4m3-shadowVertical, var(--beae-card-shadow-y)) var(--izc4m3-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--izc4m3-shadowColor, var(--beae-card-cta-shadow-color)) var(--izc4m3-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-izc4m3"] {     display: flex;     flex-direction: var(--izc4m3-direction, column);     flex-wrap: nowrap;     justify-content: var(--izc4m3-justify-content);     align-items: var(--izc4m3-align-items);     gap: var(--izc4m3-gap, var(--izc4m3-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-izc4m3"] {                            gap: var(--izc4m3-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(12.50% - var(--izc4m3-padding-right-tablet, 0px) - var(--izc4m3-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-izc4m3"] {                            gap: var(--izc4m3-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(12.50% - var(--izc4m3-padding-right-mobile, 0px) - var(--izc4m3-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-yqsfth"] { --yqsfth-typography: h2; --yqsfth-typography-tablet: h2; --yqsfth-typography-mobile: h2; --beae-h2-text-align: start; }[data-bnode="beae-yqsfth"] { margin-top: var(--yqsfth-margin-top, 0px); margin-right: var(--yqsfth-margin-right, 0px); margin-bottom: var(--yqsfth-margin-bottom, 0px); margin-left: var(--yqsfth-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--yqsfth-margin-top-tablet, 0px); margin-right: var(--yqsfth-margin-right-tablet, 0px); margin-bottom: var(--yqsfth-margin-bottom-tablet, 0px); margin-left: var(--yqsfth-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--yqsfth-margin-top-mobile, 0px); margin-right: var(--yqsfth-margin-right-mobile, 0px); margin-bottom: var(--yqsfth-margin-bottom-mobile, 0px); margin-left: var(--yqsfth-margin-left-mobile, 0px); } }[data-bnode="beae-6cs08x"] { --6cs08x-typography: p; --6cs08x-typography-tablet: p; --6cs08x-typography-mobile: p; --beae-p-text-align: start; }[data-bnode="beae-6cs08x"] { margin-top: var(--6cs08x-margin-top, 0px); margin-right: var(--6cs08x-margin-right, 0px); margin-bottom: var(--6cs08x-margin-bottom, 0px); margin-left: var(--6cs08x-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--6cs08x-margin-top-tablet, 0px); margin-right: var(--6cs08x-margin-right-tablet, 0px); margin-bottom: var(--6cs08x-margin-bottom-tablet, 0px); margin-left: var(--6cs08x-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--6cs08x-margin-top-mobile, 0px); margin-right: var(--6cs08x-margin-right-mobile, 0px); margin-bottom: var(--6cs08x-margin-bottom-mobile, 0px); margin-left: var(--6cs08x-margin-left-mobile, 0px); } & .beae-description { p:only-child { margin: 0; } } }[data-bnode="beae-amlo4p"] { --amlo4p-priceType: comparePrice; --amlo4p-priceType-tablet: comparePrice; --amlo4p-priceType-mobile: comparePrice; --amlo4p-decoration: line-through; --amlo4p-decoration-tablet: line-through; --amlo4p-decoration-mobile: line-through; --beae-p-text-align: start; --beae-p-text-align-tablet: start; --beae-p-font-size-mobile: 16px; --beae-p-line-height-mobile: 1.5; --beae-p-letter-spacing-mobile: 0px; --beae-p-text-align-mobile: start; --amlo4p-comparePriceColor: #666; --amlo4p-comparePriceColor-tablet: #666; --amlo4p-comparePriceColor-mobile: #666; --amlo4p-scale: 0.8; --amlo4p-scale-tablet: 0.8; --amlo4p-scale-mobile: 0.8; --beae-p-font-size: 24px; --beae-p-font-weight: 600; }[data-bnode="beae-amlo4p"] { margin-top: var(--amlo4p-margin-top, 0px); margin-right: var(--amlo4p-margin-right, 0px); margin-bottom: var(--amlo4p-margin-bottom, 0px); margin-left: var(--amlo4p-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--amlo4p-margin-top-tablet, 0px); margin-right: var(--amlo4p-margin-right-tablet, 0px); margin-bottom: var(--amlo4p-margin-bottom-tablet, 0px); margin-left: var(--amlo4p-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--amlo4p-margin-top-mobile, 0px); margin-right: var(--amlo4p-margin-right-mobile, 0px); margin-bottom: var(--amlo4p-margin-bottom-mobile, 0px); margin-left: var(--amlo4p-margin-left-mobile, 0px); } &.beae-product-price-unsupported{ background: antiquewhite; padding: 0px 10px; font-weight: 500; } .beae-product-price-compare{ color: var(--amlo4p-comparePriceColor); text-decoration: var(--amlo4p-decoration,none); font-size: calc(var(--amlo4p-scale, 1) * 1em); display: inline-block; margin-left:7px; } &.beae-on-sale .beae-price-sale{ color: var(--amlo4p-salePriceColor,var(--beae-other-sale-price-color)); } }[data-bnode="beae-ghyjtb"] { --ghyjtb-variantType: options; --ghyjtb-variantType-tablet: options; --ghyjtb-variantType-mobile: options; --ghyjtb-headerState: normal; --ghyjtb-headerState-tablet: normal; --ghyjtb-headerState-mobile: normal; --ghyjtb-borderStyle: solid; --ghyjtb-borderStyle-tablet: solid; --ghyjtb-borderStyle-mobile: solid; --ghyjtb-borderWidth: 1px; --ghyjtb-borderWidth-tablet: 1px; --ghyjtb-borderWidth-mobile: 1px; --ghyjtb-borderRadius: 10px; --ghyjtb-borderRadius-tablet: 10px; --ghyjtb-borderRadius-mobile: 10px; --ghyjtb-btnTypo: p; --ghyjtb-btnTypo-tablet: p; --ghyjtb-btnTypo-mobile: p; --beae-p-text-align: start; --ghyjtb-labelTypo: p; --ghyjtb-labelTypo-tablet: p; --ghyjtb-labelTypo-mobile: p; --ghyjtb-tabBg: transparent; --ghyjtb-tabBg-tablet: transparent; --ghyjtb-tabBg-mobile: transparent; --ghyjtb-borderColorHover: transparent; --ghyjtb-borderColorHover-tablet: transparent; --ghyjtb-borderColorHover-mobile: transparent; --ghyjtb-tabBgHover: transparent; --ghyjtb-tabBgHover-tablet: transparent; --ghyjtb-tabBgHover-mobile: transparent; --ghyjtb-borderColorActive: var(--beae-heading-color); --ghyjtb-borderColorActive-tablet: var(--beae-heading-color); --ghyjtb-borderColorActive-mobile: var(--beae-heading-color); --ghyjtb-tabBgActive: var(--beae-heading-color); --ghyjtb-tabBgActive-tablet: var(--beae-heading-color); --ghyjtb-tabBgActive-mobile: var(--beae-heading-color); --ghyjtb-colorActive: var(--beae-background-color); --ghyjtb-colorActive-tablet: var(--beae-background-color); --ghyjtb-colorActive-mobile: var(--beae-background-color); --ghyjtb-colorHover: var(--beae-heading-color); --ghyjtb-colorHover-tablet: var(--beae-heading-color); --ghyjtb-colorHover-mobile: var(--beae-heading-color); --beae-p-color: var(--beae-heading-color); }[data-bnode="beae-ghyjtb"] { margin-top: var(--ghyjtb-margin-top, 0px); margin-right: var(--ghyjtb-margin-right, 0px); margin-bottom: var(--ghyjtb-margin-bottom, 0px); margin-left: var(--ghyjtb-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--ghyjtb-margin-top-tablet, 0px); margin-right: var(--ghyjtb-margin-right-tablet, 0px); margin-bottom: var(--ghyjtb-margin-bottom-tablet, 0px); margin-left: var(--ghyjtb-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--ghyjtb-margin-top-mobile, 0px); margin-right: var(--ghyjtb-margin-right-mobile, 0px); margin-bottom: var(--ghyjtb-margin-bottom-mobile, 0px); margin-left: var(--ghyjtb-margin-left-mobile, 0px); } &.beae-variant-box { display: flex; flex-direction: column; gap: 12px; width: 100%; /* ===== OPTION ===== */ .beae-option { display: flex; flex-direction: column; gap: 6px; } /* ===== SWATCH WRAP ===== */ .beae-swatch { display: flex; flex-wrap: wrap; gap: 6px; &.beae-p{ justify-content: var(--beae-p-text-align, start); } &.beae-p2{ justify-content: var(--beae-p2-text-align, start); } &.beae-p3{ justify-content: var(--beae-p3-text-align, start); } @media (min-width: 767.79px) and (max-width: 1180px) { &.beae-p{ justify-content: var(--beae-p-text-align-tablet, var(--beae-p-text-align, start)); } &.beae-p2{ justify-content: var(--beae-p2-text-align-tablet, var(--beae-p2-text-align, start)); } &.beae-p3{ justify-content: var(--beae-p3-text-align-tablet, var(--beae-p3-text-align, start)); } } @media (max-width: 767px) { &.beae-p{ justify-content: var(--beae-p-text-align-mobile, var(--beae-p-text-align, start)); } &.beae-p2{ justify-content: var(--beae-p2-text-align-mobile, var(--beae-p2-text-align, start)); } &.beae-p3{ justify-content: var(--beae-p3-text-align-mobile, var(--beae-p3-text-align, start)); } } } /* ===== RADIO ===== */ .beae-radio-wrap { display: inline-flex; align-items: center; cursor: pointer; margin: 0; position: relative; transition: all 0.2s; } .beae-radio { position: absolute; opacity: 0; pointer-events: none; } .beae-radio-lb { display: inline-block; padding-inline: var(--ghyjtb-paddingX, 20px); padding-block: var(--ghyjtb-paddingY, 12px); background-color: var(--ghyjtb-tabBg, #F5F5F5); cursor: pointer; border-style: var(--ghyjtb-borderStyle, none); border-color: var(--ghyjtb-borderColor, #D1D1D1); border-width: var(--ghyjtb-borderWidth,0px); border-radius: var(--ghyjtb-borderRadius, 0px); box-shadow: var(--ghyjtb-shadowHorizontal, 0px) var(--ghyjtb-shadowVertical, 0px) var(--ghyjtb-shadowBlur, 0px) 1px color-mix( in srgb, var(--ghyjtb-shadowColor, #000000) var(--ghyjtb-shadowTransparent, 0%), transparent ); transition: all 0.2s; } /* ===== HOVER ===== */ .beae-radio-wrap:hover .beae-radio-lb { background-color: var(--ghyjtb-tabBgHover,#cccccc); color: var(--ghyjtb-colorHover,#333333); border-color: var(--ghyjtb-borderColorHover, var(--ghyjtb-borderColor, #D1D1D1)); } /* ===== ACTIVE ===== */ .beae-radio:checked + .beae-radio-lb { background-color: var(--ghyjtb-tabBgActive, #000); color: var(--ghyjtb-colorActive, #fff); border-color: var(--ghyjtb-borderColorActive, var(--ghyjtb-borderColor, #D1D1D1)); } /* ===== DISABLED ===== */ .beae-variant-disabled { opacity: 0.3 !important; pointer-events: none !important; cursor: not-allowed !important; } /* ===== COLOR SWATCH ===== */ .beae-swatch-color { width: var(--ghyjtb-sizeColor,40px); height: var(--ghyjtb-sizeColor,40px); padding: 0; border-radius: if(style(--ghyjtb-styleColor : true ): 50%; else: var(--ghyjtb-borderRadius,0px)); border: var(--ghyjtb-borderWidth,0) solid color-mix(in srgb, var(--ghyjtb-borderColor,#D1D1D1) 30%, transparent); background-color: #eee; background-clip: content-box; transition: all 0.2s; box-shadow: var(--ghyjtb-shadowHorizontal, 0px) var(--ghyjtb-shadowVertical, 0px) var(--ghyjtb-shadowBlur, 0px) 1px color-mix( in srgb, var(--ghyjtb-shadowColor, #000000) var(--ghyjtb-shadowTransparent, 0%), transparent ); overflow: hidden; .beae-radio-lb { display: none; } &:hover { border-color: var(--ghyjtb-borderColorHover,#000000); } &:has(.beae-radio:checked) { border-color: var(--ghyjtb-borderColorActive,#000000); padding: 2px !important; } &.beae-variant-disabled { position: relative; &::after { content: ""; position: absolute; inset: 0; border-radius: var(--ghyjtb-borderRadius, 4px); mask-image: linear-gradient( to bottom left, transparent calc(50% - 1px), black 50%, transparent calc(50% + 1px) ); mask-mode: alpha; background-color: #000; z-index: 2; pointer-events: none; } } } /* ===== DROPDOWN ===== */ .beae-swatch-sel { display: inline-block; padding-inline: var(--ghyjtb-paddingX, 20px); padding-block: var(--ghyjtb-paddingY, 12px); background-color: var(--ghyjtb-tabBg, #F5F5F5); cursor: pointer; border-style: var(--ghyjtb-borderStyle, none); border-color: var(--ghyjtb-borderColor, #D1D1D1); border-width: var(--ghyjtb-borderWidth,0px); border-radius: var(--ghyjtb-borderRadius, 0px); box-shadow: var(--ghyjtb-shadowHorizontal, 0px) var(--ghyjtb-shadowVertical, 0px) var(--ghyjtb-shadowBlur, 0px) 1px color-mix( in srgb, var(--ghyjtb-shadowColor, #000000) var(--ghyjtb-shadowTransparent, 0%), transparent ); transition: all 0.2s; } .beae-swatch-sel:hover { color: var(--ghyjtb-colorHover, #333333); background-color: var(--ghyjtb-tabBgHover, #cccccc); border-color: var(--ghyjtb-borderColorHover, #000000); } .beae-swatch-sel:disabled { opacity: 0.5; cursor: not-allowed; } } }[data-bnode="beae-6do2zp"] { --6do2zp-direction: row; --6do2zp-direction-tablet: row; --6do2zp-direction-mobile: row; --6do2zp-structure: auto; --6do2zp-structure-tablet: auto; --6do2zp-structure-mobile: auto; --6do2zp-align-items: center; --6do2zp-align-items-tablet: center; --6do2zp-align-items-mobile: center; --6do2zp-justify-content: flex-start; --6do2zp-justify-content-tablet: flex-start; --6do2zp-justify-content-mobile: flex-start; --6do2zp-padding-top: 6px; --6do2zp-padding-top-tablet: 6px; --6do2zp-padding-top-mobile: 6px; --6do2zp-padding-right: 0px; --6do2zp-padding-right-tablet: 0px; --6do2zp-padding-right-mobile: 0px; --6do2zp-padding-bottom: 6px; --6do2zp-padding-bottom-tablet: 6px; --6do2zp-padding-bottom-mobile: 6px; --6do2zp-padding-left: 0px; --6do2zp-padding-left-tablet: 0px; --6do2zp-padding-left-mobile: 0px; --6do2zp-gap: 10px; --6do2zp-gap-tablet: 10px; --6do2zp-gap-mobile: 10px; }[data-bnode="beae-6do2zp"] { padding-top: var(--6do2zp-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--6do2zp-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--6do2zp-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--6do2zp-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--6do2zp-padding-top-tablet, var(--6do2zp-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--6do2zp-padding-right-tablet, var(--6do2zp-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--6do2zp-padding-bottom-tablet, var(--6do2zp-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--6do2zp-padding-left-tablet, var(--6do2zp-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--6do2zp-padding-top-mobile, var(--6do2zp-padding-top-tablet, var(--6do2zp-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--6do2zp-padding-right-mobile, var(--6do2zp-padding-right-tablet, var(--6do2zp-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--6do2zp-padding-bottom-mobile, var(--6do2zp-padding-bottom-tablet, var(--6do2zp-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--6do2zp-padding-left-mobile, var(--6do2zp-padding-left-tablet, var(--6do2zp-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot-inventory { position: relative; aspect-ratio: var(--6do2zp-background-imageRatio, auto); background: var(--6do2zp-background-color); border-style: var(--6do2zp-borderStyle, solid); border-color: var(--6do2zp-borderColor, #000000); border-width: var(--6do2zp-borderWidth-tl, 0px) var(--6do2zp-borderWidth-tr, 0px) var(--6do2zp-borderWidth-br, 0px) var(--6do2zp-borderWidth-bl, 0px); border-radius: var(--6do2zp-borderRadius-tl, 0px) var(--6do2zp-borderRadius-tr, 0px) var(--6do2zp-borderRadius-br, 0px) var(--6do2zp-borderRadius-bl, 0px); box-shadow: if(style(--6do2zp-enableShadow: true): var(--6do2zp-shadowHorizontal, 0) var(--6do2zp-shadowVertical, 0) var(--6do2zp-shadowBlur, 0) 1px var(--6do2zp-shadowColor, #000000); else: none); max-width: var(--6do2zp-max-width, 100%); @media(min-width: 767.79px) and (max-width: 1180px) { aspect-ratio: var(--6do2zp-background-imageRatio-tablet, var(--6do2zp-background-imageRatio, auto)); border-width: var(--6do2zp-borderWidth-tl-tablet, 0px) var(--6do2zp-borderWidth-tr-tablet, 0px) var(--6do2zp-borderWidth-br-tablet, 0px) var(--6do2zp-borderWidth-bl-tablet, 0px); border-radius: var(--6do2zp-borderRadius-tl-tablet, 0px) var(--6do2zp-borderRadius-tr-tablet, 0px) var(--6do2zp-borderRadius-br-tablet, 0px) var(--6do2zp-borderRadius-bl-tablet, 0px); max-width: var(--6do2zp-max-width-tablet, var(--6do2zp-max-width, 100%)); } @media(max-width: 767px) { aspect-ratio: var(--6do2zp-background-imageRatio-mobile, var(--6do2zp-background-imageRatio, auto)); border-width: var(--6do2zp-borderWidth-tl-mobile, 0px) var(--6do2zp-borderWidth-tr-mobile, 0px) var(--6do2zp-borderWidth-br-mobile, 0px) var(--6do2zp-borderWidth-bl-mobile, 0px); border-radius: var(--6do2zp-borderRadius-tl-mobile, 0px) var(--6do2zp-borderRadius-tr-mobile, 0px) var(--6do2zp-borderRadius-br-mobile, 0px) var(--6do2zp-borderRadius-bl-mobile, 0px); max-width: var(--6do2zp-max-width-mobile, var(--6do2zp-max-width, 100%)); } >* { position: relative; z-index: 1; } >.beae-bg-image { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); border-radius: inherit; overflow: hidden; z-index: 0; img { width: 100%; height: 100%; object-fit: cover; object-position: center; } } } }[data-bnode="beae-6do2zp"] {     display: flex;     flex-direction: var(--6do2zp-direction, column);     flex-wrap: nowrap;     justify-content: var(--6do2zp-justify-content);     align-items: var(--6do2zp-align-items);     gap: var(--6do2zp-gap, var(--6do2zp-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-6do2zp"] {                            gap: var(--6do2zp-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--6do2zp-padding-right-tablet, 0px) - var(--6do2zp-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-6do2zp"] {                            gap: var(--6do2zp-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--6do2zp-padding-right-mobile, 0px) - var(--6do2zp-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-3rvq7c"] { --3rvq7c-size: 20px; --3rvq7c-size-tablet: 20px; --3rvq7c-size-mobile: 20px; --3rvq7c-iconColor: #AA2826; --3rvq7c-iconColor-tablet: #AA2826; --3rvq7c-iconColor-mobile: #AA2826; --3rvq7c-backgroundColor: #FFFFFF00; --3rvq7c-backgroundColor-tablet: #FFFFFF00; --3rvq7c-backgroundColor-mobile: #FFFFFF00; --3rvq7c-padding: 0px; --3rvq7c-padding-tablet: 0px; --3rvq7c-padding-mobile: 0px; --3rvq7c-enableShadow: false; --3rvq7c-enableShadow-tablet: false; --3rvq7c-enableShadow-mobile: false; }[data-bnode="beae-3rvq7c"] { margin-top: var(--3rvq7c-margin-top, 0px); margin-right: var(--3rvq7c-margin-right, 0px); margin-bottom: var(--3rvq7c-margin-bottom, 0px); margin-left: var(--3rvq7c-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--3rvq7c-margin-top-tablet, 0px); margin-right: var(--3rvq7c-margin-right-tablet, 0px); margin-bottom: var(--3rvq7c-margin-bottom-tablet, 0px); margin-left: var(--3rvq7c-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--3rvq7c-margin-top-mobile, 0px); margin-right: var(--3rvq7c-margin-right-mobile, 0px); margin-bottom: var(--3rvq7c-margin-bottom-mobile, 0px); margin-left: var(--3rvq7c-margin-left-mobile, 0px); } & { display: block; padding: var(--3rvq7c-padding, 4px); border-style: var(--3rvq7c-borderStyle,solid); border-color: var(--3rvq7c-borderColor,#000000); border-width: var(--3rvq7c-borderWidth-tl,0px) var(--3rvq7c-borderWidth-tr,0px) var(--3rvq7c-borderWidth-br,0px) var(--3rvq7c-borderWidth-bl,0px); border-radius: var(--3rvq7c-borderRadius-tl,0px) var(--3rvq7c-borderRadius-tr,0px) var(--3rvq7c-borderRadius-br,0px) var(--3rvq7c-borderRadius-bl,0px); box-shadow: if( style(--3rvq7c-enableShadow: true): var(--3rvq7c-shadowHorizontal, 0) var(--3rvq7c-shadowVertical, 0) var(--3rvq7c-shadowBlur, 0) 1px var(--3rvq7c-shadowColor, #000000); else: none ); color: var(--3rvq7c-iconColor,var(--beae-text-color)); background-color: var(--3rvq7c-backgroundColor); overflow: hidden; width: var(--3rvq7c-size, 28px); min-width: var(--3rvq7c-size, 28px); height: fit-content; max-width: var(--3rvq7c-size, 28px); width: var(--3rvq7c-size-tablet, 28px); @media(min-width: 767.79px) and (max-width: 1180px){ border-width: var(--3rvq7c-borderWidth-tl-tablet,0px) var(--3rvq7c-borderWidth-tr-tablet,0px) var(--3rvq7c-borderWidth-br-tablet,0px) var(--3rvq7c-borderWidth-bl-tablet,0px); border-radius: var(--3rvq7c-borderRadius-tl-tablet,0px) var(--3rvq7c-borderRadius-tr-tablet,0px) var(--3rvq7c-borderRadius-br-tablet,0px) var(--3rvq7c-borderRadius-bl-tablet,0px); min-width: var(--3rvq7c-size-tablet, var(--3rvq7c-size, 28px)); max-width: var(--3rvq7c-size-tablet, var(--3rvq7c-size, 28px)); } @media(max-width: 767px){ width: var(--3rvq7c-size-mobile, var(--3rvq7c-size-tablet, var(--3rvq7c-size, 28px))); min-width: var(--3rvq7c-size-mobile, var(--3rvq7c-size-tablet, var(--3rvq7c-size, 28px))); max-width: var(--3rvq7c-size-mobile, var(--3rvq7c-size-tablet, var(--3rvq7c-size, 28px))); border-width: var(--3rvq7c-borderWidth-tl-mobile,0px) var(--3rvq7c-borderWidth-tr-mobile,0px) var(--3rvq7c-borderWidth-br-mobile,0px) var(--3rvq7c-borderWidth-bl-mobile,0px); border-radius: var(--3rvq7c-borderRadius-tl-mobile,0px) var(--3rvq7c-borderRadius-tr-mobile,0px) var(--3rvq7c-borderRadius-br-mobile,0px) var(--3rvq7c-borderRadius-bl-mobile,0px); } svg { width: 100%; height: 100%; } } }[data-bnode="beae-6hncrm"] { --6hncrm-typography: p; --6hncrm-typography-tablet: p; --6hncrm-typography-mobile: p; --6hncrm-veryLowColor: #c13c18; --6hncrm-veryLowColor-tablet: #c13c18; --6hncrm-veryLowColor-mobile: #c13c18; --6hncrm-lowColor: #f1c40f; --6hncrm-lowColor-tablet: #f1c40f; --6hncrm-lowColor-mobile: #f1c40f; --6hncrm-progressHeight: 4px; --6hncrm-progressHeight-tablet: 4px; --6hncrm-progressHeight-mobile: 4px; --6hncrm-margin-top: 0px; --6hncrm-margin-top-tablet: 0px; --6hncrm-margin-top-mobile: 0px; --6hncrm-margin-right: 0px; --6hncrm-margin-right-tablet: 0px; --6hncrm-margin-right-mobile: 0px; --6hncrm-margin-bottom: 0px; --6hncrm-margin-bottom-tablet: 0px; --6hncrm-margin-bottom-mobile: 0px; --6hncrm-margin-left: 0px; --6hncrm-margin-left-tablet: 0px; --6hncrm-margin-left-mobile: 0px; --6hncrm-color: #08823B; --6hncrm-color-tablet: #08823B; --6hncrm-color-mobile: #08823B; --beae-p-text-align: start; }[data-bnode="beae-6hncrm"] { margin-top: var(--6hncrm-margin-top, 0px); margin-right: var(--6hncrm-margin-right, 0px); margin-bottom: var(--6hncrm-margin-bottom, 0px); margin-left: var(--6hncrm-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--6hncrm-margin-top-tablet, 0px); margin-right: var(--6hncrm-margin-right-tablet, 0px); margin-bottom: var(--6hncrm-margin-bottom-tablet, 0px); margin-left: var(--6hncrm-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--6hncrm-margin-top-mobile, 0px); margin-right: var(--6hncrm-margin-right-mobile, 0px); margin-bottom: var(--6hncrm-margin-bottom-mobile, 0px); margin-left: var(--6hncrm-margin-left-mobile, 0px); } &.beae-inventory { width: 100%; } &.beae-inventory-low { color: var(--6hncrm-lowColor); } &.beae-inventory-critical, &.beae-inventory-out { color: var(--6hncrm-veryLowColor); } & .beae-inventory-text { display: none; &.beae-show { display: block; } } & .beae-inventory-progress { width: 100%; height: var(--6hncrm-progressHeight, 4px); background: rgba(0, 0, 0, 0.08); border-radius: 999px; overflow: hidden; margin-top: 6px; & .beae-inventory-progress-bar { display: block; height: 100%; width: 0%; background: var(--6hncrm-lowColor); border-radius: 999px; transition: width 0.3s ease; } } &.beae-inventory-critical .beae-inventory-progress-bar { background: var(--6hncrm-veryLowColor); } &.beae-inventory-out .beae-inventory-progress-bar { background: var(--6hncrm-veryLowColor); width: 0% !important; } }[data-bnode="beae-hel3cf"] { --hel3cf-borderStyle: none; --hel3cf-borderStyle-tablet: none; --hel3cf-borderStyle-mobile: none; --hel3cf-borderRadius-tl: 8px; --hel3cf-borderRadius-tl-tablet: 8px; --hel3cf-borderRadius-tl-mobile: 8px; --hel3cf-borderRadius-tr: 8px; --hel3cf-borderRadius-tr-tablet: 8px; --hel3cf-borderRadius-tr-mobile: 8px; --hel3cf-borderRadius-bl: 8px; --hel3cf-borderRadius-bl-tablet: 8px; --hel3cf-borderRadius-bl-mobile: 8px; --hel3cf-borderRadius-br: 8px; --hel3cf-borderRadius-br-tablet: 8px; --hel3cf-borderRadius-br-mobile: 8px; --hel3cf-margin-top: 0px; --hel3cf-margin-top-tablet: 0px; --hel3cf-margin-top-mobile: 0px; --hel3cf-margin-right: 0px; --hel3cf-margin-right-tablet: 0px; --hel3cf-margin-right-mobile: 0px; --hel3cf-margin-bottom: 0px; --hel3cf-margin-bottom-tablet: 0px; --hel3cf-margin-bottom-mobile: 0px; --hel3cf-margin-left: 0px; --hel3cf-margin-left-tablet: 0px; --hel3cf-margin-left-mobile: 0px; --hel3cf-enableShadow: false; --hel3cf-enableShadow-tablet: false; --hel3cf-enableShadow-mobile: false; --hel3cf-typography: p; --hel3cf-typography-tablet: p; --hel3cf-typography-mobile: p; --hel3cf-inputWidth: 60px; --hel3cf-inputWidth-tablet: 60px; --hel3cf-inputWidth-mobile: 60px; --hel3cf-btnWidth: 52px; --hel3cf-btnWidth-tablet: 52px; --hel3cf-btnWidth-mobile: 52px; --beae-p-font-size-tablet: 16px; --beae-p-font-size-mobile: 16px; --beae-p-line-height-tablet: 1.5; --beae-p-line-height-mobile: 1.5; --beae-p-letter-spacing-tablet: -0.3px; --beae-p-letter-spacing-mobile: -0.3px; --hel3cf-btnColor: var(--beae-heading-color); --hel3cf-btnColor-tablet: var(--beae-heading-color); --hel3cf-btnColor-mobile: var(--beae-heading-color); --hel3cf-btnBg: #ece6dfff; --hel3cf-btnBg-tablet: #ece6dfff; --hel3cf-btnBg-mobile: #ece6dfff; --hel3cf-inputColor: var(--beae-heading-color); --hel3cf-inputColor-tablet: var(--beae-heading-color); --hel3cf-inputColor-mobile: var(--beae-heading-color); --hel3cf-inputBg: transparent; --hel3cf-inputBg-tablet: transparent; --hel3cf-inputBg-mobile: transparent; }[data-bnode="beae-hel3cf"] { margin-top: var(--hel3cf-margin-top, 0px); margin-right: var(--hel3cf-margin-right, 0px); margin-bottom: var(--hel3cf-margin-bottom, 0px); margin-left: var(--hel3cf-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--hel3cf-margin-top-tablet, 0px); margin-right: var(--hel3cf-margin-right-tablet, 0px); margin-bottom: var(--hel3cf-margin-bottom-tablet, 0px); margin-left: var(--hel3cf-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--hel3cf-margin-top-mobile, 0px); margin-right: var(--hel3cf-margin-right-mobile, 0px); margin-bottom: var(--hel3cf-margin-bottom-mobile, 0px); margin-left: var(--hel3cf-margin-left-mobile, 0px); } &.beae-qty { display: flex; flex-direction: column; gap: var(--hel3cf-gap, 16px); @media(min-width: 767.79px) and (max-width: 1180px) { gap: var(--hel3cf-gap-tablet, 16px); } @media(max-width: 767px) { gap: var(--hel3cf-gap-mobile, 16px); } .beae-qty-wrap { gap: 10px; display: flex; align-items: stretch; width: if(style(--hel3cf-inputWidth: 100%): 100%; else: fit-content); border-style: var(--hel3cf-borderStyle,solid); border-color: var(--hel3cf-borderColor,#000000); border-width: var(--hel3cf-borderWidth-tl,0px) var(--hel3cf-borderWidth-tr,0px) var(--hel3cf-borderWidth-br,0px) var(--hel3cf-borderWidth-bl,0px); border-radius: var(--hel3cf-borderRadius-tl,0px) var(--hel3cf-borderRadius-tr,0px) var(--hel3cf-borderRadius-br,0px) var(--hel3cf-borderRadius-bl,0px); box-shadow: var(--hel3cf-shadowHorizontal, 0) var(--hel3cf-shadowVertical, 0) var(--hel3cf-shadowBlur, 0) 0 var(--hel3cf-shadowColor, #000000); overflow: hidden; @media(min-width: 767.79px) and (max-width: 1180px) { width: if(style(--hel3cf-inputWidth-tablet: 100%): 100%; else: fit-content); border-width: var(--hel3cf-borderWidth-tl-tablet, 0px) var(--hel3cf-borderWidth-tr-tablet, 0px) var(--hel3cf-borderWidth-br-tablet, 0px) var(--hel3cf-borderWidth-bl-tablet, 0px); border-radius: var(--hel3cf-borderRadius-tl-tablet, 0px) var(--hel3cf-borderRadius-tr-tablet, 0px) var(--hel3cf-borderRadius-br-tablet, 0px) var(--hel3cf-borderRadius-bl-tablet, 0px); } @media(max-width: 767px) { width: if(style(--hel3cf-inputWidth-mobile: 100%): 100%; else: fit-content); border-width: var(--hel3cf-borderWidth-tl-mobile, 0px) var(--hel3cf-borderWidth-tr-mobile, 0px) var(--hel3cf-borderWidth-br-mobile, 0px) var(--hel3cf-borderWidth-bl-mobile, 0px); border-radius: var(--hel3cf-borderRadius-tl-mobile, 0px) var(--hel3cf-borderRadius-tr-mobile, 0px) var(--hel3cf-borderRadius-br-mobile, 0px) var(--hel3cf-borderRadius-bl-mobile, 0px); } } .beae-qty-btn { display: flex; align-items: center; justify-content: center; width: var(--hel3cf-btnWidth, 40px); height: var(--hel3cf-btnWidth, 40px); padding: 0; border: none; border-radius: 8px; background: var(--hel3cf-btnBg, #f5f5f5); color: var(--hel3cf-btnColor, #333); cursor: pointer; transition: opacity 0.2s; @media(min-width: 767.79px) and (max-width: 1180px) { width: var(--hel3cf-btnWidth-tablet, 40px); height: var(--hel3cf-btnWidth-tablet, 40px); } @media(max-width: 767px) { width: var(--hel3cf-btnWidth-mobile, 40px); height: var(--hel3cf-btnWidth-mobile, 40px); } } .beae-qty-input { flex: 1; min-width: 0; width: var(--hel3cf-inputWidth, 40px); border: 1px solid #ccc; border-radius: 8px; text-align: center; color: var(--hel3cf-inputColor, #333); background: var(--hel3cf-inputBg, #ffffff); font-size: 16px; @media(min-width: 767.79px) and (max-width: 1180px) { width: var(--hel3cf-inputWidth-tablet, 40px); } @media(max-width: 767px) { width: var(--hel3cf-inputWidth-mobile, 40px); } } .beae-qty-input::-webkit-outer-spin-button, .beae-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .beae-qty-input:focus { outline: none; } .beae-qty-warning { color: #f59e0b; } } }[data-bnode="beae-1obenr"] { --1obenr-width: fill; --1obenr-width-tablet: fill; --1obenr-width-mobile: fill; --1obenr-transform: none; --1obenr-transform-tablet: none; --1obenr-transform-mobile: none; --1obenr-iconWidth: 20px; --1obenr-iconWidth-tablet: 20px; --1obenr-iconWidth-mobile: 20px; --1obenr-iconGap: 5px; --1obenr-iconGap-tablet: 5px; --1obenr-iconGap-mobile: 5px; --1obenr-button: pr; --1obenr-button-tablet: pr; --1obenr-button-mobile: pr; --beae-btn-te-label-color: #2A2A2A; --beae-btn-height-tablet: 45px; }[data-bnode="beae-1obenr"] { margin-top: var(--1obenr-margin-top, 0px); margin-right: var(--1obenr-margin-right, 0px); margin-bottom: var(--1obenr-margin-bottom, 0px); margin-left: var(--1obenr-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--1obenr-margin-top-tablet, 0px); margin-right: var(--1obenr-margin-right-tablet, 0px); margin-bottom: var(--1obenr-margin-bottom-tablet, 0px); margin-left: var(--1obenr-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--1obenr-margin-top-mobile, 0px); margin-right: var(--1obenr-margin-right-mobile, 0px); margin-bottom: var(--1obenr-margin-bottom-mobile, 0px); margin-left: var(--1obenr-margin-left-mobile, 0px); } &.beae-co-btn { gap: var(--1obenr-iconGap); &.beae-btn-pr:hover{ background-color: if( style(--1obenr-bgBtnHover < 0): color-mix(in srgb, var(--beae-btn-pr-background-color), white calc(abs(var(--1obenr-bgBtnHover)) * 1%)); style(--1obenr-bgBtnHover > 0): color-mix(in srgb, var(--beae-btn-pr-background-color), black calc(abs(var(--1obenr-bgBtnHover)) * 1%)); else: var(--beae-btn-pr-background-hover) ); color: if( style(--1obenr-labelBtnHover < 0): color-mix(in srgb, var(--beae-btn-pr-label-color), white calc(abs(var(--1obenr-labelBtnHover)) * 1%)); style(--1obenr-labelBtnHover > 0): color-mix(in srgb, var(--beae-btn-pr-label-color), black calc(abs(var(--1obenr-labelBtnHover)) * 1%)); else: var(--beae-btn-pr-label-hover) ); outline-color: if( style(--1obenr-borderBtnHover < 0): color-mix(in srgb, var(--beae-btn-pr-borde-color), white calc(abs(var(--1obenr-borderBtnHover)) * 1%)); style(--1obenr-borderBtnHover > 0): color-mix(in srgb, var(--beae-btn-pr-border-color), black calc(abs(var(--1obenr-borderBtnHover)) * 1%)); else: var(--beae-btn-pr-border-hover) ); } &.beae-btn-se:hover{ background-color: if( style(--1obenr-bgBtnHover < 0): color-mix(in srgb, var(--beae-btn-se-background-color), white calc(abs(var(--1obenr-bgBtnHover)) * 1%)); style(--1obenr-bgBtnHover > 0): color-mix(in srgb, var(--beae-btn-se-background-color), black calc(abs(var(--1obenr-bgBtnHover)) * 1%)); else: var(--beae-btn-se-background-hover) ); color: if( style(--1obenr-labelBtnHover < 0): color-mix(in srgb, var(--beae-btn-se-label-color), white calc(abs(var(--1obenr-labelBtnHover)) * 1%)); style(--1obenr-labelBtnHover > 0): color-mix(in srgb, var(--beae-btn-se-label-color), black calc(abs(var(--1obenr-labelBtnHover)) * 1%)); else: var(--beae-btn-se-label-hover) ); outline-color: if( style(--1obenr-borderBtnHover < 0): color-mix(in srgb, var(--beae-btn-se-borde-color), white calc(abs(var(--1obenr-borderBtnHover)) * 1%)); style(--1obenr-borderBtnHover > 0): color-mix(in srgb, var(--beae-btn-se-border-color), black calc(abs(var(--1obenr-borderBtnHover)) * 1%)); else: var(--beae-btn-se-border-hover) ); } &.beae-btn-te:hover{ color: if( style(--1obenr-labelBtnHover < 0): color-mix(in srgb, var(--beae-btn-te-label-color), white calc(abs(var(--1obenr-labelBtnHover)) * 1%)); style(--1obenr-labelBtnHover > 0): color-mix(in srgb, var(--beae-btn-te-label-color), black calc(abs(var(--1obenr-labelBtnHover)) * 1%)); else: var(--beae-btn-te-label-hover) ); } &:disabled { opacity: 0.5; pointer-events: none; } span{ display: flex; } svg { width: var(--1obenr-iconWidth,20px); min-width: var(--1obenr-iconWidth,-20px); height: 100%; } &[beae-btn-po="right"] { flex-direction: row-reverse; svg { margin-right: 0; } } @media (min-width: 768px) and (max-width: 1180px) { gap: var(--1obenr-iconGap-tablet); &:not(.beae-btn-te){ height: var(--beae-btn-height-tablet); } svg { width: var(--1obenr-iconWidth-tablet, var(--1obenr-iconWidth,20px)); min-width: var(--1obenr-iconWidth-tablet,var(--1obenr-iconWidth,20px)); } } @media(max-width: 767px){ gap: var(--1obenr-iconGap-mobile); &:not(.beae-btn-te){ height: var(--beae-btn-height-mobile, var(--beae-btn-height)); } svg { width: var(--1obenr-iconWidth-mobile,var(--1obenr-iconWidth,20px)); min-width: var(--1obenr-iconWidth-mobile,var(--1obenr-iconWidth,20px)); } } } }[data-bnode="beae-0ni0w8"] { --0ni0w8-direction: row; --0ni0w8-direction-tablet: row; --0ni0w8-direction-mobile: column; --0ni0w8-structure: auto; --0ni0w8-structure-tablet: auto; --0ni0w8-structure-mobile: auto; --0ni0w8-gap: 12px; --0ni0w8-gap-tablet: 12px; --0ni0w8-gap-mobile: 12px; --0ni0w8-padding-top: 20px; --0ni0w8-padding-top-tablet: 20px; --0ni0w8-padding-top-mobile: 20px; --0ni0w8-padding-right: 0px; --0ni0w8-padding-right-tablet: 0px; --0ni0w8-padding-right-mobile: 0px; --0ni0w8-padding-bottom: 12px; --0ni0w8-padding-bottom-tablet: 12px; --0ni0w8-padding-bottom-mobile: 12px; --0ni0w8-padding-left: 0px; --0ni0w8-padding-left-tablet: 0px; --0ni0w8-padding-left-mobile: 0px; }[data-bnode="beae-0ni0w8"] { padding-top: var(--0ni0w8-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--0ni0w8-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--0ni0w8-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--0ni0w8-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--0ni0w8-padding-top-tablet, var(--0ni0w8-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--0ni0w8-padding-right-tablet, var(--0ni0w8-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--0ni0w8-padding-bottom-tablet, var(--0ni0w8-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--0ni0w8-padding-left-tablet, var(--0ni0w8-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--0ni0w8-padding-top-mobile, var(--0ni0w8-padding-top-tablet, var(--0ni0w8-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--0ni0w8-padding-right-mobile, var(--0ni0w8-padding-right-tablet, var(--0ni0w8-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--0ni0w8-padding-bottom-mobile, var(--0ni0w8-padding-bottom-tablet, var(--0ni0w8-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--0ni0w8-padding-left-mobile, var(--0ni0w8-padding-left-tablet, var(--0ni0w8-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot-payment { position: relative; aspect-ratio: var(--0ni0w8-background-imageRatio, auto); background: var(--0ni0w8-background-color); border-style: var(--0ni0w8-borderStyle, solid); border-color: var(--0ni0w8-borderColor, #000000); border-width: var(--0ni0w8-borderWidth-tl, 0px) var(--0ni0w8-borderWidth-tr, 0px) var(--0ni0w8-borderWidth-br, 0px) var(--0ni0w8-borderWidth-bl, 0px); border-radius: var(--0ni0w8-borderRadius-tl, 0px) var(--0ni0w8-borderRadius-tr, 0px) var(--0ni0w8-borderRadius-br, 0px) var(--0ni0w8-borderRadius-bl, 0px); box-shadow: if(style(--0ni0w8-enableShadow: true): var(--0ni0w8-shadowHorizontal, 0) var(--0ni0w8-shadowVertical, 0) var(--0ni0w8-shadowBlur, 0) 1px var(--0ni0w8-shadowColor, #000000); else: none); max-width: var(--0ni0w8-max-width, 100%); @media(min-width: 767.79px) and (max-width: 1180px) { aspect-ratio: var(--0ni0w8-background-imageRatio-tablet, var(--0ni0w8-background-imageRatio, auto)); border-width: var(--0ni0w8-borderWidth-tl-tablet, 0px) var(--0ni0w8-borderWidth-tr-tablet, 0px) var(--0ni0w8-borderWidth-br-tablet, 0px) var(--0ni0w8-borderWidth-bl-tablet, 0px); border-radius: var(--0ni0w8-borderRadius-tl-tablet, 0px) var(--0ni0w8-borderRadius-tr-tablet, 0px) var(--0ni0w8-borderRadius-br-tablet, 0px) var(--0ni0w8-borderRadius-bl-tablet, 0px); max-width: var(--0ni0w8-max-width-tablet, var(--0ni0w8-max-width, 100%)); } @media(max-width: 767px) { aspect-ratio: var(--0ni0w8-background-imageRatio-mobile, var(--0ni0w8-background-imageRatio, auto)); border-width: var(--0ni0w8-borderWidth-tl-mobile, 0px) var(--0ni0w8-borderWidth-tr-mobile, 0px) var(--0ni0w8-borderWidth-br-mobile, 0px) var(--0ni0w8-borderWidth-bl-mobile, 0px); border-radius: var(--0ni0w8-borderRadius-tl-mobile, 0px) var(--0ni0w8-borderRadius-tr-mobile, 0px) var(--0ni0w8-borderRadius-br-mobile, 0px) var(--0ni0w8-borderRadius-bl-mobile, 0px); max-width: var(--0ni0w8-max-width-mobile, var(--0ni0w8-max-width, 100%)); } >* { position: relative; z-index: 1; } >.beae-bg-image { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); border-radius: inherit; overflow: hidden; z-index: 0; img { width: 100%; height: 100%; object-fit: cover; object-position: center; } } } }[data-bnode="beae-0ni0w8"] {     display: flex;     flex-direction: var(--0ni0w8-direction, column);     flex-wrap: nowrap;     justify-content: var(--0ni0w8-justify-content);     align-items: var(--0ni0w8-align-items);     gap: var(--0ni0w8-gap, var(--0ni0w8-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-0ni0w8"] {                            gap: var(--0ni0w8-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--0ni0w8-padding-right-tablet, 0px) - var(--0ni0w8-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-0ni0w8"] {      flex-direction: var(--0ni0w8-direction-mobile, column);                      gap: var(--0ni0w8-gap-mobile, var(--beae-slot-gap-mobile));             &>.beae-slot[data-bnode-index] {                }           }    }[data-bnode="beae-w32r0x"] { --w32r0x-typography: p2; --w32r0x-typography-tablet: p2; --w32r0x-typography-mobile: p2; --beae-p2-text-align: start; }[data-bnode="beae-w32r0x"] { margin-top: var(--w32r0x-margin-top, 0px); margin-right: var(--w32r0x-margin-right, 0px); margin-bottom: var(--w32r0x-margin-bottom, 0px); margin-left: var(--w32r0x-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--w32r0x-margin-top-tablet, 0px); margin-right: var(--w32r0x-margin-right-tablet, 0px); margin-bottom: var(--w32r0x-margin-bottom-tablet, 0px); margin-left: var(--w32r0x-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--w32r0x-margin-top-mobile, 0px); margin-right: var(--w32r0x-margin-right-mobile, 0px); margin-bottom: var(--w32r0x-margin-bottom-mobile, 0px); margin-left: var(--w32r0x-margin-left-mobile, 0px); } }[data-bnode="beae-zz881r"] { --zz881r-typography: p; --zz881r-typography-tablet: p; --zz881r-typography-mobile: p; --zz881r-iconSize: 38; --zz881r-iconSize-tablet: 38; --zz881r-iconSize-mobile: 38; --zz881r-maxWidth: auto; --zz881r-maxWidth-tablet: auto; --zz881r-maxWidth-mobile: auto; }[data-bnode="beae-zz881r"] { margin-top: var(--zz881r-margin-top, 0px); margin-right: var(--zz881r-margin-right, 0px); margin-bottom: var(--zz881r-margin-bottom, 0px); margin-left: var(--zz881r-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--zz881r-margin-top-tablet, 0px); margin-right: var(--zz881r-margin-right-tablet, 0px); margin-bottom: var(--zz881r-margin-bottom-tablet, 0px); margin-left: var(--zz881r-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--zz881r-margin-top-mobile, 0px); margin-right: var(--zz881r-margin-right-mobile, 0px); margin-bottom: var(--zz881r-margin-bottom-mobile, 0px); margin-left: var(--zz881r-margin-left-mobile, 0px); } & { display: flex; list-style: none; padding: 0; } }[data-bnode="beae-xslkxl"] { --xslkxl-width: var(--beae-section-width); --xslkxl-width-tablet: var(--beae-section-width); --xslkxl-width-mobile: var(--beae-section-width); --xslkxl-height: fit-content; --xslkxl-height-tablet: fit-content; --xslkxl-height-mobile: fit-content; --xslkxl-direction: column; --xslkxl-direction-tablet: column; --xslkxl-direction-mobile: column; --xslkxl-structure: columns; --xslkxl-structure-tablet: columns; --xslkxl-structure-mobile: columns; --xslkxl-surface: light; --xslkxl-surface-tablet: light; --xslkxl-surface-mobile: light; }[data-bnode="beae-xslkxl"] { padding-top: var(--xslkxl-padding-top, var(--beae-section-padding-y, 0px)); padding-right: var(--xslkxl-padding-right, var(--beae-section-padding-x, 0px)); padding-bottom: var(--xslkxl-padding-bottom, var(--beae-section-padding-y, 0px)); padding-left: var(--xslkxl-padding-left, var(--beae-section-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--xslkxl-padding-top-tablet, var(--xslkxl-padding-top, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-right: var(--xslkxl-padding-right-tablet, var(--xslkxl-padding-right, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); padding-bottom: var(--xslkxl-padding-bottom-tablet, var(--xslkxl-padding-bottom, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-left: var(--xslkxl-padding-left-tablet, var(--xslkxl-padding-left, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--xslkxl-padding-top-mobile, var(--xslkxl-padding-top-tablet, var(--xslkxl-padding-top, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-right: var(--xslkxl-padding-right-mobile, var(--xslkxl-padding-right-tablet, var(--xslkxl-padding-right, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); padding-bottom: var(--xslkxl-padding-bottom-mobile, var(--xslkxl-padding-bottom-tablet, var(--xslkxl-padding-bottom, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-left: var(--xslkxl-padding-left-mobile, var(--xslkxl-padding-left-tablet, var(--xslkxl-padding-left, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); } &.beae-section { background: var(--xslkxl-background-color, var(--beae-background-color)); max-width: 100%; position: relative; .beae-section-container { height: var(--xslkxl-height); width: 100%; max-width: var(--xslkxl-width,var(--beae-section-width)); margin: 0 auto; > *:not(.beae-slot) { position: relative; z-index: 1; } > .beae-bg-image{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; img{ width: 100%; height: 100%; } } > .beae-video-background{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; object-fit: cover; background: #000000; } } } @media (min-width: 767.79px) and (max-width: 1180px) { &.beae-section { & .beae-section-container { height: var(--xslkxl-height-tablet, auto); width: 100%; max-width: var(--xslkxl-width-tablet, 100%); } } } @media (max-width: 767px) { &.beae-section { & .beae-section-container { height: var(--xslkxl-height-mobile, auto); width: 100%; max-width: var(--xslkxl-width-mobile, 100%); } } } }[data-bnode="beae-xslkxl"] > .beae-section-container{     display: flex;     flex-direction: var(--xslkxl-direction, column);     flex-wrap: nowrap;     justify-content: var(--xslkxl-justify-content);     align-items: var(--xslkxl-align-items);     gap: var(--xslkxl-gap, var(--beae-grid-gap, 4px));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-xslkxl"] > .beae-section-container{                            gap: var(--beae-grid-gap-tablet, 4px);               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--xslkxl-padding-right-tablet, 0px) - var(--xslkxl-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-xslkxl"] > .beae-section-container{                            gap: var(--beae-grid-gap-mobile, 4px);              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--xslkxl-padding-right-mobile, 0px) - var(--xslkxl-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-0dhuxn"] { padding-top: var(--0dhuxn-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--0dhuxn-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--0dhuxn-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--0dhuxn-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--0dhuxn-padding-top-tablet, var(--0dhuxn-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--0dhuxn-padding-right-tablet, var(--0dhuxn-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--0dhuxn-padding-bottom-tablet, var(--0dhuxn-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--0dhuxn-padding-left-tablet, var(--0dhuxn-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--0dhuxn-padding-top-mobile, var(--0dhuxn-padding-top-tablet, var(--0dhuxn-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--0dhuxn-padding-right-mobile, var(--0dhuxn-padding-right-tablet, var(--0dhuxn-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--0dhuxn-padding-bottom-mobile, var(--0dhuxn-padding-bottom-tablet, var(--0dhuxn-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--0dhuxn-padding-left-mobile, var(--0dhuxn-padding-left-tablet, var(--0dhuxn-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--0dhuxn-position, relative); top: var(--0dhuxn-top, auto); right: var(--0dhuxn-right, auto); bottom: var(--0dhuxn-bottom, auto); left: var(--0dhuxn-left, auto); transform: var(--0dhuxn-transform, none); z-index: var(--0dhuxn-z-index, 10); aspect-ratio: var(--0dhuxn-background-imageRatio, auto); background: var(--0dhuxn-background-color,transparent); border-style: var(--0dhuxn-borderStyle,solid); border-color: var(--0dhuxn-borderColor,#000000); border-width: var(--0dhuxn-borderWidth-tl,0px) var(--0dhuxn-borderWidth-tr,0px) var(--0dhuxn-borderWidth-br,0px) var(--0dhuxn-borderWidth-bl,0px); border-radius: var(--0dhuxn-borderRadius-tl,0px) var(--0dhuxn-borderRadius-tr,0px) var(--0dhuxn-borderRadius-br,0px) var(--0dhuxn-borderRadius-bl,0px); box-shadow: var(--0dhuxn-shadowHorizontal, 0px) var(--0dhuxn-shadowVertical, 0px) var(--0dhuxn-shadowBlur, 0px) 1px color-mix( in srgb, var(--0dhuxn-shadowColor, #000000) var(--0dhuxn-shadowTransparent, 0%), transparent ); max-width: var(--0dhuxn-max-width, 100%); width: 100%; height: if(style(--0dhuxn-position: absolute): var(--0dhuxn-height,100%); else: unset ); backdrop-filter:blur(var(--0dhuxn-background-blur, none)) saturate(var(--0dhuxn-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--0dhuxn-position-tablet, var(--0dhuxn-position, relative)); top: var(--0dhuxn-top-tablet, var(--0dhuxn-top, auto)); right: var(--0dhuxn-right-tablet, var(--0dhuxn-right, auto)); bottom: var(--0dhuxn-bottom-tablet, var(--0dhuxn-bottom, auto)); left: var(--0dhuxn-left-tablet, var(--0dhuxn-left, auto)); transform: var(--0dhuxn-transform-tablet, var(--0dhuxn-transform, none)); z-index: var(--0dhuxn-z-index-tablet, var(--0dhuxn-z-index, 10)); aspect-ratio: var(--0dhuxn-background-imageRatio-tablet, var(--0dhuxn-background-imageRatio, auto)); border-width: var(--0dhuxn-borderWidth-tl-tablet, var(--0dhuxn-borderWidth-tl,0px)) var(--0dhuxn-borderWidth-tr-tablet,var(--0dhuxn-borderWidth-tr,0px)) var(--0dhuxn-borderWidth-br-tablet,var(--0dhuxn-borderWidth-br,0px)) var(--0dhuxn-borderWidth-bl-tablet,var(--0dhuxn-borderWidth-bl,0px)); border-radius: var(--0dhuxn-borderRadius-tl-tablet,var(--0dhuxn-borderRadius-tl,0px)) var(--0dhuxn-borderRadius-tr-tablet,var(--0dhuxn-borderRadius-tr,0px)) var(--0dhuxn-borderRadius-br-tablet,var(--0dhuxn-borderRadius-br,0px)) var(--0dhuxn-borderRadius-bl-tablet,var(--0dhuxn-borderRadius-bl,0px)); max-width: var(--0dhuxn-max-width-tablet, var(--0dhuxn-max-width, 100%)); height: if(style(--0dhuxn-position-tablet: absolute): var(--0dhuxn-height-tablet,var(--0dhuxn-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--0dhuxn-position-mobile, var(--0dhuxn-position-tablet, var(--0dhuxn-position, relative))); top: var(--0dhuxn-top-mobile, var(--0dhuxn-top-tablet, var(--0dhuxn-top, auto))); right: var(--0dhuxn-right-mobile, var(--0dhuxn-right-tablet, var(--0dhuxn-right, auto))); bottom: var(--0dhuxn-bottom-mobile, var(--0dhuxn-bottom-tablet, var(--0dhuxn-bottom, auto))); left: var(--0dhuxn-left-mobile, var(--0dhuxn-left-tablet, var(--0dhuxn-left, auto))); transform: var(--0dhuxn-transform-mobile, var(--0dhuxn-transform-tablet, var(--0dhuxn-transform, none))); z-index: var(--0dhuxn-z-index-mobile, var(--0dhuxn-z-index-tablet, var(--0dhuxn-z-index, 10))); aspect-ratio: var(--0dhuxn-background-imageRatio-mobile, var(--0dhuxn-background-imageRatio, auto)); border-width: var(--0dhuxn-borderWidth-tl-mobile, var(--0dhuxn-borderWidth-tl,0px)) var(--0dhuxn-borderWidth-tr-mobile,var(--0dhuxn-borderWidth-tr,0px)) var(--0dhuxn-borderWidth-br-mobile,var(--0dhuxn-borderWidth-br,0px)) var(--0dhuxn-borderWidth-bl-mobile,var(--0dhuxn-borderWidth-bl,0px)); border-radius: var(--0dhuxn-borderRadius-tl-mobile,var(--0dhuxn-borderRadius-tl,0px)) var(--0dhuxn-borderRadius-tr-mobile,var(--0dhuxn-borderRadius-tr,0px)) var(--0dhuxn-borderRadius-br-mobile,var(--0dhuxn-borderRadius-br,0px)) var(--0dhuxn-borderRadius-bl-mobile,var(--0dhuxn-borderRadius-bl,0px)); max-width: var(--0dhuxn-max-width-mobile, var(--0dhuxn-max-width, 100%)); height: if(style(--0dhuxn-position-mobile: absolute): var(--0dhuxn-height-mobile,var(--0dhuxn-height-tablet,,var(--0dhuxn-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--0dhuxn-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--0dhuxn-gap,var(--beae-card-gap)); padding-top: var(--0dhuxn-padding-top,var(--beae-card-padding)); padding-right: var(--0dhuxn-padding-right,var(--beae-card-padding)); padding-bottom: var(--0dhuxn-padding-bottom,var(--beae-card-padding)); padding-left: var(--0dhuxn-padding-left,var(--beae-card-padding)); border-width: var(--0dhuxn-borderWidth-tl,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-tr,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-br,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--0dhuxn-borderRadius-tl,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-tr,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-br,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--0dhuxn-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--0dhuxn-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--0dhuxn-gap-tablet,var(--beae-card-gap)); padding-top: var(--0dhuxn-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--0dhuxn-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--0dhuxn-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--0dhuxn-padding-left-tablet,var(--beae-card-padding)); border-width: var(--0dhuxn-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-br-desktop,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--0dhuxn-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--0dhuxn-gap-mobile,var(--beae-card-gap)); padding-top: var(--0dhuxn-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--0dhuxn-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--0dhuxn-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--0dhuxn-padding-left-mobile,var(--beae-card-padding)); border-width: var(--0dhuxn-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-br-mobile,var(--beae-card-border-width)) var(--0dhuxn-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--0dhuxn-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--0dhuxn-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--0dhuxn-background-color,var(--beae-card-featured-background)); border-color: var(--0dhuxn-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--0dhuxn-shadowHorizontal, var(--beae-card-shadow-x)) var(--0dhuxn-shadowVertical, var(--beae-card-shadow-y)) var(--0dhuxn-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--0dhuxn-shadowColor, var(--beae-card-featured-shadow-color)) var(--0dhuxn-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--0dhuxn-background-color,var(--beae-card-prod-background)); border-color: var(--0dhuxn-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--0dhuxn-shadowHorizontal, var(--beae-card-shadow-x)) var(--0dhuxn-shadowVertical, var(--beae-card-shadow-y)) var(--0dhuxn-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--0dhuxn-shadowColor, var(--beae-card-prod-shadow-color)) var(--0dhuxn-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--0dhuxn-background-color,var(--beae-card-pricing-background)); border-color: var(--0dhuxn-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--0dhuxn-shadowHorizontal, var(--beae-card-shadow-x)) var(--0dhuxn-shadowVertical, var(--beae-card-shadow-y)) var(--0dhuxn-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--0dhuxn-shadowColor, var(--beae-card-pricing-shadow-color)) var(--0dhuxn-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--0dhuxn-background-color,var(--beae-card-cta-background)); border-color: var(--0dhuxn-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--0dhuxn-shadowHorizontal, var(--beae-card-shadow-x)) var(--0dhuxn-shadowVertical, var(--beae-card-shadow-y)) var(--0dhuxn-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--0dhuxn-shadowColor, var(--beae-card-cta-shadow-color)) var(--0dhuxn-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-0dhuxn"] {     display: flex;     flex-direction: var(--0dhuxn-direction, column);     flex-wrap: nowrap;     justify-content: var(--0dhuxn-justify-content);     align-items: var(--0dhuxn-align-items);     gap: var(--0dhuxn-gap, var(--0dhuxn-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-0dhuxn"] {                            gap: var(--0dhuxn-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--0dhuxn-padding-right-tablet, 0px) - var(--0dhuxn-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-0dhuxn"] {                            gap: var(--0dhuxn-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--0dhuxn-padding-right-mobile, 0px) - var(--0dhuxn-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-y3remy"] { --y3remy-typography: h2; --y3remy-typography-tablet: h2; --y3remy-typography-mobile: h2; --beae-h2-text-align: center; --beae-h2-text-align-mobile: start; --beae-h2-font-size-mobile: 32px; --beae-h2-line-height-mobile: 1.2; --beae-h2-letter-spacing-mobile: -0.02px; }[data-bnode="beae-y3remy"] { margin-top: var(--y3remy-margin-top, 0px); margin-right: var(--y3remy-margin-right, 0px); margin-bottom: var(--y3remy-margin-bottom, 0px); margin-left: var(--y3remy-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--y3remy-margin-top-tablet, 0px); margin-right: var(--y3remy-margin-right-tablet, 0px); margin-bottom: var(--y3remy-margin-bottom-tablet, 0px); margin-left: var(--y3remy-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--y3remy-margin-top-mobile, 0px); margin-right: var(--y3remy-margin-right-mobile, 0px); margin-bottom: var(--y3remy-margin-bottom-mobile, 0px); margin-left: var(--y3remy-margin-left-mobile, 0px); } & .beae-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--y3remy-highlightColor,var(--beae-p-color)); top: var(--y3remy-highlightTop, 100%); } }[data-bnode="beae-t9uyt2"] { --t9uyt2-columns: 3; --t9uyt2-columns-tablet: 1.3; --t9uyt2-columns-mobile: 1; --t9uyt2-gap: 20px; --t9uyt2-gap-tablet: 16px; --t9uyt2-gap-mobile: 16px; --t9uyt2-navType: true; --t9uyt2-navType-tablet: true; --t9uyt2-navType-mobile: true; --t9uyt2-pagiType: false; --t9uyt2-pagiType-tablet: false; --t9uyt2-pagiType-mobile: false; --t9uyt2-listType: slider; --t9uyt2-listType-tablet: slider; --t9uyt2-listType-mobile: slider; --t9uyt2-stateNavigation: normal; --t9uyt2-stateNavigation-tablet: normal; --t9uyt2-stateNavigation-mobile: normal; --t9uyt2-statePagination: normal; --t9uyt2-statePagination-tablet: normal; --t9uyt2-statePagination-mobile: normal; --t9uyt2-stateNavigtion: normal; --t9uyt2-stateNavigtion-tablet: normal; --t9uyt2-stateNavigtion-mobile: normal; --t9uyt2-columnsMobile-mobile: 1; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-contlt"] { --beae-h4-color: #A65959; --beae-h4-text-align: center; --beae-h4-font-weight: 700; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-contlp"] { --beae-p-text-align: justify; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-item2a"] { --item2a-direction: row; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-52mwkd"] { --52mwkd-width: 100%; --52mwkd-imageRatio: auto; --52mwkd-objFit: cover; --52mwkd-borderColor: #000000; --52mwkd-shadowColor: #000000; --52mwkd-borderStyle: none; --52mwkd-enableShadow: false; --52mwkd-borderRadius-tl: 12px; --52mwkd-borderRadius-tr: 12px; --52mwkd-borderRadius-bl: 12px; --52mwkd-borderRadius-br: 12px; --52mwkd-imageRatio-mobile: 7/6; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-syejcl"] { --syejcl-typography: h3; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-roswvz"] { --roswvz-typography: p; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-si0ubs"] { --si0ubs-direction: column; --si0ubs-gap: 16px; --si0ubs-padding-top: 24px; --si0ubs-padding-right: 24px; --si0ubs-padding-bottom: 24px; --si0ubs-padding-left: 24px; --si0ubs-padding-top-tablet: 32px; --si0ubs-padding-right-tablet: 32px; --si0ubs-padding-bottom-tablet: 32px; --si0ubs-padding-left-tablet: 32px; --si0ubs-padding-top-mobile: 32px; --si0ubs-padding-right-mobile: 32px; --si0ubs-padding-bottom-mobile: 32px; --si0ubs-padding-left-mobile: 32px; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-wz140i"] { --beae-p-font-weight: 600; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-8eizvt"] { --8eizvt-typography: p2; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-v2fjar"] { --v2fjar-typography: h4; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-2c7f7w"] { --2c7f7w-direction: row; --2c7f7w-structure: columns; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-v2fjar"] { --v2fjar-typography: h3; --v2fjar-typography-tablet: h3; --v2fjar-typography-mobile: h3; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-8eizvt"] { --8eizvt-typography: p; --8eizvt-typography-tablet: p; --8eizvt-typography-mobile: p; } [data-bnode="beae-t9uyt2"] [data-bnode="beae-wz140i"] { --wz140i-typography: p; --wz140i-typography-tablet: p; --wz140i-typography-mobile: p; } [data-bnode="beae-t9uyt2"] [data-bnode="be-ctl-item"] { --be-ctl-item-direction: row; --be-ctl-item-direction-tablet: row; --be-ctl-item-direction-mobile: column-reverse; --be-ctl-item-gap: 8px; --be-ctl-item-gap-tablet: 8px; --be-ctl-item-gap-mobile: 0px; --be-ctl-item-structure: auto; --be-ctl-item-structure-tablet: auto; --be-ctl-item-structure-mobile: auto; --be-ctl-item-columns: 66.66,33.33; --be-ctl-item-columns-tablet: 66.66,33.33; --be-ctl-item-columns-mobile: 66.66,33.33; --be-ctl-item-columnsPresetId: 66.66,33.33; --be-ctl-item-columnsPresetId-tablet: 66.66,33.33; --be-ctl-item-columnsPresetId-mobile: 66.66,33.33; --be-ctl-item-background-0: c; --be-ctl-item-background-0-tablet: c; --be-ctl-item-background-0-mobile: c; --be-ctl-item-background-1: o; --be-ctl-item-background-1-tablet: o; --be-ctl-item-background-1-mobile: o; --be-ctl-item-background-2: l; --be-ctl-item-background-2-tablet: l; --be-ctl-item-background-2-mobile: l; --be-ctl-item-background-3: o; --be-ctl-item-background-3-tablet: o; --be-ctl-item-background-3-mobile: o; --be-ctl-item-background-4: r; --be-ctl-item-background-4-tablet: r; --be-ctl-item-background-4-mobile: r; --be-ctl-item-background-type: color; --be-ctl-item-background-type-tablet: color; --be-ctl-item-background-type-mobile: color; --be-ctl-item-background-color: #fffaf4; --be-ctl-item-background-color-tablet: #fffaf4; --be-ctl-item-background-color-mobile: #fffaf4; --be-ctl-item-borderRadius-tl: 12px; --be-ctl-item-borderRadius-tl-tablet: 12px; --be-ctl-item-borderRadius-tl-mobile: 12px; --be-ctl-item-borderRadius-tr: 12px; --be-ctl-item-borderRadius-tr-tablet: 12px; --be-ctl-item-borderRadius-tr-mobile: 12px; --be-ctl-item-borderRadius-bl: 12px; --be-ctl-item-borderRadius-bl-tablet: 12px; --be-ctl-item-borderRadius-bl-mobile: 12px; --be-ctl-item-borderRadius-br: 12px; --be-ctl-item-borderRadius-br-tablet: 12px; --be-ctl-item-borderRadius-br-mobile: 12px; --be-ctl-item-align-items: stretch; --be-ctl-item-align-items-tablet: stretch; --be-ctl-item-align-items-mobile: stretch; --be-ctl-item-cardStyle: beae-media-card; --be-ctl-item-cardStyle-tablet: beae-media-card; --be-ctl-item-cardStyle-mobile: beae-media-card; --be-ctl-item-padding-top: 0px; --be-ctl-item-padding-top-tablet: 0px; --be-ctl-item-padding-top-mobile: 0px; --be-ctl-item-padding-right: 0px; --be-ctl-item-padding-right-tablet: 0px; --be-ctl-item-padding-right-mobile: 0px; --be-ctl-item-padding-bottom: 0px; --be-ctl-item-padding-bottom-tablet: 0px; --be-ctl-item-padding-bottom-mobile: 0px; --be-ctl-item-padding-left: 0px; --be-ctl-item-padding-left-tablet: 0px; --be-ctl-item-padding-left-mobile: 0px; --be-ctl-item-surface: muted; --be-ctl-item-surface-tablet: muted; --be-ctl-item-surface-mobile: muted; }[data-bnode="beae-t9uyt2"] { margin-top: var(--t9uyt2-margin-top, 0px); margin-right: var(--t9uyt2-margin-right, 0px); margin-bottom: var(--t9uyt2-margin-bottom, 0px); margin-left: var(--t9uyt2-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--t9uyt2-margin-top-tablet, 0px); margin-right: var(--t9uyt2-margin-right-tablet, 0px); margin-bottom: var(--t9uyt2-margin-bottom-tablet, 0px); margin-left: var(--t9uyt2-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--t9uyt2-margin-top-mobile, 0px); margin-right: var(--t9uyt2-margin-right-mobile, 0px); margin-bottom: var(--t9uyt2-margin-bottom-mobile, 0px); margin-left: var(--t9uyt2-margin-left-mobile, 0px); } &.beae-content-list { .beae-slider-item{ > .beae-slot[data-bnode="be-ctl-item"]{ height: 100%; } } @media (min-width: 1180px) { & .beae-slider-wrapper[data-desktop-layout="slider"]{ .beae-slider-items { gap: var(--t9uyt2-gap,var(--beae-grid-gap, 20px)); .beae-slider-item{ flex: 0 0 calc((100% - var(--t9uyt2-gap,var(--beae-grid-gap, 20px)) * (var(--t9uyt2-columns, 3) - 1)) / var(--t9uyt2-columns, 3)); &:last-child{ margin-right: var(--t9uyt2-gap,var(--beae-grid-gap, 20px)); } } } } & .beae-slider-wrapper[data-desktop-layout="grid"]{ &[data-item="1"]{ .beae-slider-items { flex-direction: column; flex-wrap: nowrap; } } .beae-slider-items { flex-wrap: wrap; gap: var(--t9uyt2-gap,var(--beae-grid-gap, 20px)); .beae-slider-item { flex: 0 0 calc( (100% - (var(--t9uyt2-columns) - 1) * var(--t9uyt2-gap,var(--beae-grid-gap, 20px))) / var(--t9uyt2-columns) ); } } } } @media (min-width: 767.79px) and (max-width: 1180px) { & .beae-slider-wrapper[data-tablet-layout="slider"]{ .beae-slider-items { gap: var(--t9uyt2-gap-tablet,var(--beae-grid-gap-tablet, 20px)); .beae-slider-item{ flex: 0 0 calc((100% - var(--t9uyt2-gap-tablet,var(--beae-grid-gap-tablet, 16px)) * (var(--t9uyt2-columns-tablet, 3) - 1)) / var(--t9uyt2-columns-tablet, 3)); &:last-child{ margin-right: var(--t9uyt2-gap-tablet,var(--beae-grid-gap-tablet, 16px)); } } } } & .beae-slider-wrapper[data-tablet-layout="grid"]{ &[data-item-tablet="1"]{ .beae-slider-items { flex-direction: column; flex-wrap: nowrap; } } .beae-slider-items { flex-wrap: wrap; gap: var(--t9uyt2-gap-tablet,var(--beae-grid-gap-tablet, 16px)); .beae-slider-item { flex: 0 0 calc( (100% - (var(--t9uyt2-columns-tablet) - 1) * var(--t9uyt2-gap-tablet,var(--beae-grid-gap-tablet, 16px))) / var(--t9uyt2-columns-tablet) ); } } } } @media (max-width: 767px) { & .beae-slider-wrapper[data-mobile-layout="slider"]{ .beae-slider-items { gap: var(--t9uyt2-gap-mobile,var(--beae-grid-gap-mobile, 10px)); .beae-slider-item{ flex: 0 0 calc((100% - var(--t9uyt2-gap-mobile,var(--beae-grid-gap-mobile, 10px)) * (var(--t9uyt2-columnsMobile-mobile, 1) - 1)) / var(--t9uyt2-columnsMobile-mobile, 1)); &:last-child{ margin-right: var(--t9uyt2-gap-mobile,var(--beae-grid-gap-mobile, 10px)); } } } } & .beae-slider-wrapper[data-mobile-layout="grid"]{ &[data-item-mobile="1"]{ .beae-slider-items { flex-direction: column; flex-wrap: nowrap; } } .beae-slider-items { flex-wrap: wrap; gap: var(--t9uyt2-gap-mobile,var(--beae-grid-gap-mobile, 10px)); .beae-slider-item { flex: 0 0 calc( (100% - (var(--t9uyt2-columnsMobile-mobile) - 1) * var(--t9uyt2-gap-mobile,var(--beae-grid-gap-mobile, 10px))) / var(--t9uyt2-columnsMobile-mobile) ); } } } } /* Navigation & Pagination */ .beae-slider-nav-left, .beae-slider-nav-right { padding: var(--t9uyt2-navPadding,12px); background:var(--t9uyt2-navBg,#F5F5F5); color: var(--t9uyt2-navColor,var(--beae-text-color)); cursor: pointer; border-radius: var(--t9uyt2-navRadius,50%); &:hover { background:var(--t9uyt2-navBgHover,#CCCCCC); color: var(--t9uyt2-navColorHover,var(--beae-text-color)); } svg { width: var(--t9uyt2-navIconSize,20px); height: var(--t9uyt2-navIconSize,20px); } } & .beae-slider-wrapper[data-pagination="dots"] + .beae-slider-controls .beae-slider-pagination { background: var(--t9uyt2-pagiBg,#E6E6E6); &.active { background:var(--t9uyt2-pagiBgActive,#181818); } &:not(.active):hover { background:var(--t9uyt2-pagiBgHover,#CCCCCC); } } & .beae-slider-wrapper[data-pagination="numbers"] + .beae-slider-controls .beae-slider-pagination { color: var(--t9uyt2-pagiColor,#e6e6e6); &.active { color:var(--t9uyt2-pagiColorActive,#181818); } &:not(.active):hover { color: var(--t9uyt2-pagiColorHover,#181818); } } & .beae-slider-wrapper[data-pagination="counter"] + .beae-slider-controls .beae-slider-pagination-total { color: var(--t9uyt2-pagiColor,#e6e6e6); } & .beae-slider-wrapper[data-pagination="dynamic-dots"] + .beae-slider-controls .beae-slider-pagination { background: var(--t9uyt2-pagiBg,#E6E6E6); &.active { background: var(--t9uyt2-pagiBgActive,#181818); opacity: 1; } &:not(.active):hover { background: var(--t9uyt2-pagiBgHover,#CCCCCC); } } .beae-slider-pagination-wrp{ margin-top: 20px; } } & .beae-content-list-empty { min-height: 80px; display: flex; align-items: center; justify-content: center; background-color: #f0f0f0; color: #666; } & .beae-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="beae-t9uyt2"] [data-bnode="beae-si0ubs"] { padding-top: var(--si0ubs-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--si0ubs-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--si0ubs-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--si0ubs-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--si0ubs-padding-top-tablet, var(--si0ubs-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--si0ubs-padding-right-tablet, var(--si0ubs-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--si0ubs-padding-bottom-tablet, var(--si0ubs-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--si0ubs-padding-left-tablet, var(--si0ubs-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--si0ubs-padding-top-mobile, var(--si0ubs-padding-top-tablet, var(--si0ubs-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--si0ubs-padding-right-mobile, var(--si0ubs-padding-right-tablet, var(--si0ubs-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--si0ubs-padding-bottom-mobile, var(--si0ubs-padding-bottom-tablet, var(--si0ubs-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--si0ubs-padding-left-mobile, var(--si0ubs-padding-left-tablet, var(--si0ubs-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--si0ubs-position, relative); top: var(--si0ubs-top, auto); right: var(--si0ubs-right, auto); bottom: var(--si0ubs-bottom, auto); left: var(--si0ubs-left, auto); transform: var(--si0ubs-transform, none); z-index: var(--si0ubs-z-index, 10); aspect-ratio: var(--si0ubs-background-imageRatio, auto); background: var(--si0ubs-background-color,transparent); border-style: var(--si0ubs-borderStyle,solid); border-color: var(--si0ubs-borderColor,#000000); border-width: var(--si0ubs-borderWidth-tl,0px) var(--si0ubs-borderWidth-tr,0px) var(--si0ubs-borderWidth-br,0px) var(--si0ubs-borderWidth-bl,0px); border-radius: var(--si0ubs-borderRadius-tl,0px) var(--si0ubs-borderRadius-tr,0px) var(--si0ubs-borderRadius-br,0px) var(--si0ubs-borderRadius-bl,0px); box-shadow: var(--si0ubs-shadowHorizontal, 0px) var(--si0ubs-shadowVertical, 0px) var(--si0ubs-shadowBlur, 0px) 1px color-mix( in srgb, var(--si0ubs-shadowColor, #000000) var(--si0ubs-shadowTransparent, 0%), transparent ); max-width: var(--si0ubs-max-width, 100%); width: 100%; height: if(style(--si0ubs-position: absolute): var(--si0ubs-height,100%); else: unset ); backdrop-filter:blur(var(--si0ubs-background-blur, none)) saturate(var(--si0ubs-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--si0ubs-position-tablet, var(--si0ubs-position, relative)); top: var(--si0ubs-top-tablet, var(--si0ubs-top, auto)); right: var(--si0ubs-right-tablet, var(--si0ubs-right, auto)); bottom: var(--si0ubs-bottom-tablet, var(--si0ubs-bottom, auto)); left: var(--si0ubs-left-tablet, var(--si0ubs-left, auto)); transform: var(--si0ubs-transform-tablet, var(--si0ubs-transform, none)); z-index: var(--si0ubs-z-index-tablet, var(--si0ubs-z-index, 10)); aspect-ratio: var(--si0ubs-background-imageRatio-tablet, var(--si0ubs-background-imageRatio, auto)); border-width: var(--si0ubs-borderWidth-tl-tablet, var(--si0ubs-borderWidth-tl,0px)) var(--si0ubs-borderWidth-tr-tablet,var(--si0ubs-borderWidth-tr,0px)) var(--si0ubs-borderWidth-br-tablet,var(--si0ubs-borderWidth-br,0px)) var(--si0ubs-borderWidth-bl-tablet,var(--si0ubs-borderWidth-bl,0px)); border-radius: var(--si0ubs-borderRadius-tl-tablet,var(--si0ubs-borderRadius-tl,0px)) var(--si0ubs-borderRadius-tr-tablet,var(--si0ubs-borderRadius-tr,0px)) var(--si0ubs-borderRadius-br-tablet,var(--si0ubs-borderRadius-br,0px)) var(--si0ubs-borderRadius-bl-tablet,var(--si0ubs-borderRadius-bl,0px)); max-width: var(--si0ubs-max-width-tablet, var(--si0ubs-max-width, 100%)); height: if(style(--si0ubs-position-tablet: absolute): var(--si0ubs-height-tablet,var(--si0ubs-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--si0ubs-position-mobile, var(--si0ubs-position-tablet, var(--si0ubs-position, relative))); top: var(--si0ubs-top-mobile, var(--si0ubs-top-tablet, var(--si0ubs-top, auto))); right: var(--si0ubs-right-mobile, var(--si0ubs-right-tablet, var(--si0ubs-right, auto))); bottom: var(--si0ubs-bottom-mobile, var(--si0ubs-bottom-tablet, var(--si0ubs-bottom, auto))); left: var(--si0ubs-left-mobile, var(--si0ubs-left-tablet, var(--si0ubs-left, auto))); transform: var(--si0ubs-transform-mobile, var(--si0ubs-transform-tablet, var(--si0ubs-transform, none))); z-index: var(--si0ubs-z-index-mobile, var(--si0ubs-z-index-tablet, var(--si0ubs-z-index, 10))); aspect-ratio: var(--si0ubs-background-imageRatio-mobile, var(--si0ubs-background-imageRatio, auto)); border-width: var(--si0ubs-borderWidth-tl-mobile, var(--si0ubs-borderWidth-tl,0px)) var(--si0ubs-borderWidth-tr-mobile,var(--si0ubs-borderWidth-tr,0px)) var(--si0ubs-borderWidth-br-mobile,var(--si0ubs-borderWidth-br,0px)) var(--si0ubs-borderWidth-bl-mobile,var(--si0ubs-borderWidth-bl,0px)); border-radius: var(--si0ubs-borderRadius-tl-mobile,var(--si0ubs-borderRadius-tl,0px)) var(--si0ubs-borderRadius-tr-mobile,var(--si0ubs-borderRadius-tr,0px)) var(--si0ubs-borderRadius-br-mobile,var(--si0ubs-borderRadius-br,0px)) var(--si0ubs-borderRadius-bl-mobile,var(--si0ubs-borderRadius-bl,0px)); max-width: var(--si0ubs-max-width-mobile, var(--si0ubs-max-width, 100%)); height: if(style(--si0ubs-position-mobile: absolute): var(--si0ubs-height-mobile,var(--si0ubs-height-tablet,,var(--si0ubs-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--si0ubs-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--si0ubs-gap,var(--beae-card-gap)); padding-top: var(--si0ubs-padding-top,var(--beae-card-padding)); padding-right: var(--si0ubs-padding-right,var(--beae-card-padding)); padding-bottom: var(--si0ubs-padding-bottom,var(--beae-card-padding)); padding-left: var(--si0ubs-padding-left,var(--beae-card-padding)); border-width: var(--si0ubs-borderWidth-tl,var(--beae-card-border-width)) var(--si0ubs-borderWidth-tr,var(--beae-card-border-width)) var(--si0ubs-borderWidth-br,var(--beae-card-border-width)) var(--si0ubs-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--si0ubs-borderRadius-tl,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-tr,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-br,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--si0ubs-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--si0ubs-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--si0ubs-gap-tablet,var(--beae-card-gap)); padding-top: var(--si0ubs-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--si0ubs-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--si0ubs-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--si0ubs-padding-left-tablet,var(--beae-card-padding)); border-width: var(--si0ubs-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--si0ubs-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--si0ubs-borderWidth-br-desktop,var(--beae-card-border-width)) var(--si0ubs-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--si0ubs-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--si0ubs-gap-mobile,var(--beae-card-gap)); padding-top: var(--si0ubs-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--si0ubs-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--si0ubs-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--si0ubs-padding-left-mobile,var(--beae-card-padding)); border-width: var(--si0ubs-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--si0ubs-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--si0ubs-borderWidth-br-mobile,var(--beae-card-border-width)) var(--si0ubs-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--si0ubs-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--si0ubs-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--si0ubs-background-color,var(--beae-card-featured-background)); border-color: var(--si0ubs-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--si0ubs-shadowHorizontal, var(--beae-card-shadow-x)) var(--si0ubs-shadowVertical, var(--beae-card-shadow-y)) var(--si0ubs-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--si0ubs-shadowColor, var(--beae-card-featured-shadow-color)) var(--si0ubs-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--si0ubs-background-color,var(--beae-card-prod-background)); border-color: var(--si0ubs-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--si0ubs-shadowHorizontal, var(--beae-card-shadow-x)) var(--si0ubs-shadowVertical, var(--beae-card-shadow-y)) var(--si0ubs-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--si0ubs-shadowColor, var(--beae-card-prod-shadow-color)) var(--si0ubs-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--si0ubs-background-color,var(--beae-card-pricing-background)); border-color: var(--si0ubs-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--si0ubs-shadowHorizontal, var(--beae-card-shadow-x)) var(--si0ubs-shadowVertical, var(--beae-card-shadow-y)) var(--si0ubs-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--si0ubs-shadowColor, var(--beae-card-pricing-shadow-color)) var(--si0ubs-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--si0ubs-background-color,var(--beae-card-cta-background)); border-color: var(--si0ubs-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--si0ubs-shadowHorizontal, var(--beae-card-shadow-x)) var(--si0ubs-shadowVertical, var(--beae-card-shadow-y)) var(--si0ubs-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--si0ubs-shadowColor, var(--beae-card-cta-shadow-color)) var(--si0ubs-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } } [data-bnode="beae-t9uyt2"] [data-bnode="beae-v2fjar"] { margin-top: var(--v2fjar-margin-top, 0px); margin-right: var(--v2fjar-margin-right, 0px); margin-bottom: var(--v2fjar-margin-bottom, 0px); margin-left: var(--v2fjar-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--v2fjar-margin-top-tablet, 0px); margin-right: var(--v2fjar-margin-right-tablet, 0px); margin-bottom: var(--v2fjar-margin-bottom-tablet, 0px); margin-left: var(--v2fjar-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--v2fjar-margin-top-mobile, 0px); margin-right: var(--v2fjar-margin-right-mobile, 0px); margin-bottom: var(--v2fjar-margin-bottom-mobile, 0px); margin-left: var(--v2fjar-margin-left-mobile, 0px); } & .beae-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--v2fjar-highlightColor,var(--beae-p-color)); top: var(--v2fjar-highlightTop, 100%); } } [data-bnode="beae-t9uyt2"] [data-bnode="beae-8eizvt"] { margin-top: var(--8eizvt-margin-top, 0px); margin-right: var(--8eizvt-margin-right, 0px); margin-bottom: var(--8eizvt-margin-bottom, 0px); margin-left: var(--8eizvt-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--8eizvt-margin-top-tablet, 0px); margin-right: var(--8eizvt-margin-right-tablet, 0px); margin-bottom: var(--8eizvt-margin-bottom-tablet, 0px); margin-left: var(--8eizvt-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--8eizvt-margin-top-mobile, 0px); margin-right: var(--8eizvt-margin-right-mobile, 0px); margin-bottom: var(--8eizvt-margin-bottom-mobile, 0px); margin-left: var(--8eizvt-margin-left-mobile, 0px); } } [data-bnode="beae-t9uyt2"] [data-bnode="beae-wz140i"] { margin-top: var(--wz140i-margin-top, 0px); margin-right: var(--wz140i-margin-right, 0px); margin-bottom: var(--wz140i-margin-bottom, 0px); margin-left: var(--wz140i-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--wz140i-margin-top-tablet, 0px); margin-right: var(--wz140i-margin-right-tablet, 0px); margin-bottom: var(--wz140i-margin-bottom-tablet, 0px); margin-left: var(--wz140i-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--wz140i-margin-top-mobile, 0px); margin-right: var(--wz140i-margin-right-mobile, 0px); margin-bottom: var(--wz140i-margin-bottom-mobile, 0px); margin-left: var(--wz140i-margin-left-mobile, 0px); } } [data-bnode="beae-t9uyt2"] [data-bnode="beae-2c7f7w"] { padding-top: var(--2c7f7w-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--2c7f7w-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--2c7f7w-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--2c7f7w-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--2c7f7w-padding-top-tablet, var(--2c7f7w-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--2c7f7w-padding-right-tablet, var(--2c7f7w-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--2c7f7w-padding-bottom-tablet, var(--2c7f7w-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--2c7f7w-padding-left-tablet, var(--2c7f7w-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--2c7f7w-padding-top-mobile, var(--2c7f7w-padding-top-tablet, var(--2c7f7w-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--2c7f7w-padding-right-mobile, var(--2c7f7w-padding-right-tablet, var(--2c7f7w-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--2c7f7w-padding-bottom-mobile, var(--2c7f7w-padding-bottom-tablet, var(--2c7f7w-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--2c7f7w-padding-left-mobile, var(--2c7f7w-padding-left-tablet, var(--2c7f7w-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--2c7f7w-position, relative); top: var(--2c7f7w-top, auto); right: var(--2c7f7w-right, auto); bottom: var(--2c7f7w-bottom, auto); left: var(--2c7f7w-left, auto); transform: var(--2c7f7w-transform, none); z-index: var(--2c7f7w-z-index, 10); aspect-ratio: var(--2c7f7w-background-imageRatio, auto); background: var(--2c7f7w-background-color,transparent); border-style: var(--2c7f7w-borderStyle,solid); border-color: var(--2c7f7w-borderColor,#000000); border-width: var(--2c7f7w-borderWidth-tl,0px) var(--2c7f7w-borderWidth-tr,0px) var(--2c7f7w-borderWidth-br,0px) var(--2c7f7w-borderWidth-bl,0px); border-radius: var(--2c7f7w-borderRadius-tl,0px) var(--2c7f7w-borderRadius-tr,0px) var(--2c7f7w-borderRadius-br,0px) var(--2c7f7w-borderRadius-bl,0px); box-shadow: var(--2c7f7w-shadowHorizontal, 0px) var(--2c7f7w-shadowVertical, 0px) var(--2c7f7w-shadowBlur, 0px) 1px color-mix( in srgb, var(--2c7f7w-shadowColor, #000000) var(--2c7f7w-shadowTransparent, 0%), transparent ); max-width: var(--2c7f7w-max-width, 100%); width: 100%; height: if(style(--2c7f7w-position: absolute): var(--2c7f7w-height,100%); else: unset ); backdrop-filter:blur(var(--2c7f7w-background-blur, none)) saturate(var(--2c7f7w-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--2c7f7w-position-tablet, var(--2c7f7w-position, relative)); top: var(--2c7f7w-top-tablet, var(--2c7f7w-top, auto)); right: var(--2c7f7w-right-tablet, var(--2c7f7w-right, auto)); bottom: var(--2c7f7w-bottom-tablet, var(--2c7f7w-bottom, auto)); left: var(--2c7f7w-left-tablet, var(--2c7f7w-left, auto)); transform: var(--2c7f7w-transform-tablet, var(--2c7f7w-transform, none)); z-index: var(--2c7f7w-z-index-tablet, var(--2c7f7w-z-index, 10)); aspect-ratio: var(--2c7f7w-background-imageRatio-tablet, var(--2c7f7w-background-imageRatio, auto)); border-width: var(--2c7f7w-borderWidth-tl-tablet, var(--2c7f7w-borderWidth-tl,0px)) var(--2c7f7w-borderWidth-tr-tablet,var(--2c7f7w-borderWidth-tr,0px)) var(--2c7f7w-borderWidth-br-tablet,var(--2c7f7w-borderWidth-br,0px)) var(--2c7f7w-borderWidth-bl-tablet,var(--2c7f7w-borderWidth-bl,0px)); border-radius: var(--2c7f7w-borderRadius-tl-tablet,var(--2c7f7w-borderRadius-tl,0px)) var(--2c7f7w-borderRadius-tr-tablet,var(--2c7f7w-borderRadius-tr,0px)) var(--2c7f7w-borderRadius-br-tablet,var(--2c7f7w-borderRadius-br,0px)) var(--2c7f7w-borderRadius-bl-tablet,var(--2c7f7w-borderRadius-bl,0px)); max-width: var(--2c7f7w-max-width-tablet, var(--2c7f7w-max-width, 100%)); height: if(style(--2c7f7w-position-tablet: absolute): var(--2c7f7w-height-tablet,var(--2c7f7w-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--2c7f7w-position-mobile, var(--2c7f7w-position-tablet, var(--2c7f7w-position, relative))); top: var(--2c7f7w-top-mobile, var(--2c7f7w-top-tablet, var(--2c7f7w-top, auto))); right: var(--2c7f7w-right-mobile, var(--2c7f7w-right-tablet, var(--2c7f7w-right, auto))); bottom: var(--2c7f7w-bottom-mobile, var(--2c7f7w-bottom-tablet, var(--2c7f7w-bottom, auto))); left: var(--2c7f7w-left-mobile, var(--2c7f7w-left-tablet, var(--2c7f7w-left, auto))); transform: var(--2c7f7w-transform-mobile, var(--2c7f7w-transform-tablet, var(--2c7f7w-transform, none))); z-index: var(--2c7f7w-z-index-mobile, var(--2c7f7w-z-index-tablet, var(--2c7f7w-z-index, 10))); aspect-ratio: var(--2c7f7w-background-imageRatio-mobile, var(--2c7f7w-background-imageRatio, auto)); border-width: var(--2c7f7w-borderWidth-tl-mobile, var(--2c7f7w-borderWidth-tl,0px)) var(--2c7f7w-borderWidth-tr-mobile,var(--2c7f7w-borderWidth-tr,0px)) var(--2c7f7w-borderWidth-br-mobile,var(--2c7f7w-borderWidth-br,0px)) var(--2c7f7w-borderWidth-bl-mobile,var(--2c7f7w-borderWidth-bl,0px)); border-radius: var(--2c7f7w-borderRadius-tl-mobile,var(--2c7f7w-borderRadius-tl,0px)) var(--2c7f7w-borderRadius-tr-mobile,var(--2c7f7w-borderRadius-tr,0px)) var(--2c7f7w-borderRadius-br-mobile,var(--2c7f7w-borderRadius-br,0px)) var(--2c7f7w-borderRadius-bl-mobile,var(--2c7f7w-borderRadius-bl,0px)); max-width: var(--2c7f7w-max-width-mobile, var(--2c7f7w-max-width, 100%)); height: if(style(--2c7f7w-position-mobile: absolute): var(--2c7f7w-height-mobile,var(--2c7f7w-height-tablet,,var(--2c7f7w-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--2c7f7w-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--2c7f7w-gap,var(--beae-card-gap)); padding-top: var(--2c7f7w-padding-top,var(--beae-card-padding)); padding-right: var(--2c7f7w-padding-right,var(--beae-card-padding)); padding-bottom: var(--2c7f7w-padding-bottom,var(--beae-card-padding)); padding-left: var(--2c7f7w-padding-left,var(--beae-card-padding)); border-width: var(--2c7f7w-borderWidth-tl,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-tr,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-br,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--2c7f7w-borderRadius-tl,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-tr,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-br,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--2c7f7w-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--2c7f7w-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--2c7f7w-gap-tablet,var(--beae-card-gap)); padding-top: var(--2c7f7w-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--2c7f7w-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--2c7f7w-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--2c7f7w-padding-left-tablet,var(--beae-card-padding)); border-width: var(--2c7f7w-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-br-desktop,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--2c7f7w-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--2c7f7w-gap-mobile,var(--beae-card-gap)); padding-top: var(--2c7f7w-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--2c7f7w-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--2c7f7w-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--2c7f7w-padding-left-mobile,var(--beae-card-padding)); border-width: var(--2c7f7w-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-br-mobile,var(--beae-card-border-width)) var(--2c7f7w-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--2c7f7w-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--2c7f7w-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--2c7f7w-background-color,var(--beae-card-featured-background)); border-color: var(--2c7f7w-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--2c7f7w-shadowHorizontal, var(--beae-card-shadow-x)) var(--2c7f7w-shadowVertical, var(--beae-card-shadow-y)) var(--2c7f7w-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--2c7f7w-shadowColor, var(--beae-card-featured-shadow-color)) var(--2c7f7w-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--2c7f7w-background-color,var(--beae-card-prod-background)); border-color: var(--2c7f7w-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--2c7f7w-shadowHorizontal, var(--beae-card-shadow-x)) var(--2c7f7w-shadowVertical, var(--beae-card-shadow-y)) var(--2c7f7w-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--2c7f7w-shadowColor, var(--beae-card-prod-shadow-color)) var(--2c7f7w-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--2c7f7w-background-color,var(--beae-card-pricing-background)); border-color: var(--2c7f7w-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--2c7f7w-shadowHorizontal, var(--beae-card-shadow-x)) var(--2c7f7w-shadowVertical, var(--beae-card-shadow-y)) var(--2c7f7w-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--2c7f7w-shadowColor, var(--beae-card-pricing-shadow-color)) var(--2c7f7w-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--2c7f7w-background-color,var(--beae-card-cta-background)); border-color: var(--2c7f7w-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--2c7f7w-shadowHorizontal, var(--beae-card-shadow-x)) var(--2c7f7w-shadowVertical, var(--beae-card-shadow-y)) var(--2c7f7w-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--2c7f7w-shadowColor, var(--beae-card-cta-shadow-color)) var(--2c7f7w-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } } [data-bnode="beae-t9uyt2"] [data-bnode="beae-52mwkd"] { margin-top: var(--52mwkd-margin-top, 0px); margin-right: var(--52mwkd-margin-right, 0px); margin-bottom: var(--52mwkd-margin-bottom, 0px); margin-left: var(--52mwkd-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--52mwkd-margin-top-tablet, 0px); margin-right: var(--52mwkd-margin-right-tablet, 0px); margin-bottom: var(--52mwkd-margin-bottom-tablet, 0px); margin-left: var(--52mwkd-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--52mwkd-margin-top-mobile, 0px); margin-right: var(--52mwkd-margin-right-mobile, 0px); margin-bottom: var(--52mwkd-margin-bottom-mobile, 0px); margin-left: var(--52mwkd-margin-left-mobile, 0px); } &.beae-media-wrapper { position: relative; overflow: hidden; display: block; width: 100%; max-width: calc(var(--52mwkd-width,100%) - var(--52mwkd-margin-left,0px) - var(--52mwkd-margin-right,0px)); min-height: min-content; border-color: var(--52mwkd-borderColor,var(--beae-card-media-border-color)); border-style: var(--52mwkd-borderStyle,solid); border-width: var(--52mwkd-borderWidth-tl,var(--beae-card-border-width)) var(--52mwkd-borderWidth-tr,var(--beae-card-border-width)) var(--52mwkd-borderWidth-br,var(--beae-card-border-width)) var(--52mwkd-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--52mwkd-borderRadius-tl,var(--beae-card-border-radius)) var(--52mwkd-borderRadius-tr,var(--beae-card-border-radius)) var(--52mwkd-borderRadius-br,var(--beae-card-border-radius)) var(--52mwkd-borderRadius-bl,var(--beae-card-border-radius)); aspect-ratio: var(--52mwkd-imageRatio, auto); @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--52mwkd-borderWidth-tl-tablet, var(--52mwkd-borderWidth-tl,var(--beae-card-border-width))) var(--52mwkd-borderWidth-tr-tablet, var(--52mwkd-borderWidth-tr,var(--beae-card-border-width))) var(--52mwkd-borderWidth-br-tablet, var(--52mwkd-borderWidth-br,var(--beae-card-border-width))) var(--52mwkd-borderWidth-bl-tablet, var(--52mwkd-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--52mwkd-borderRadius-tl-tablet, var(--52mwkd-borderRadius-tl,var(--beae-card-border-radius))) var(--52mwkd-borderRadius-tr-tablet, var(--52mwkd-borderRadius-tr,var(--beae-card-border-radius))) var(--52mwkd-borderRadius-br-tablet, var(--52mwkd-borderRadius-br,var(--beae-card-border-radius))) var(--52mwkd-borderRadius-bl-tablet, var(--52mwkd-borderRadius-bl,var(--beae-card-border-radius))); } @media (max-width: 767px) { border-width: var(--52mwkd-borderWidth-tl-mobile, var(--52mwkd-borderWidth-tl,var(--beae-card-border-width))) var(--52mwkd-borderWidth-tr-mobile, var(--52mwkd-borderWidth-tr,var(--beae-card-border-width))) var(--52mwkd-borderWidth-br-mobile, var(--52mwkd-borderWidth-br,var(--beae-card-border-width))) var(--52mwkd-borderWidth-bl-mobile, var(--52mwkd-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--52mwkd-borderRadius-tl-mobile, var(--52mwkd-borderRadius-tl,var(--beae-card-border-radius))) var(--52mwkd-borderRadius-tr-mobile, var(--52mwkd-borderRadius-tr,var(--beae-card-border-radius))) var(--52mwkd-borderRadius-br-mobile, var(--52mwkd-borderRadius-br,var(--beae-card-border-radius))) var(--52mwkd-borderRadius-bl-mobile, var(--52mwkd-borderRadius-bl,var(--beae-card-border-radius))); } box-shadow: var(--52mwkd-shadowHorizontal, var(--beae-card-shadow-x)) var(--52mwkd-shadowVertical, var(--beae-card-shadow-y)) var(--52mwkd-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--52mwkd-shadowColor, var(--beae-card-media-shadow-color)) var(--52mwkd-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--52mwkd-overlayColor-color, #000); opacity: var(--52mwkd-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--52mwkd-objFit, cover); object-position: var(--beae-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--52mwkd-width-tablet,var(--52mwkd-width,100%)) - var(--52mwkd-margin-left-tablet,var(--52mwkd-margin-left,0px)) - var(--52mwkd-margin-right-tablet,var(--52mwkd-margin-right,0px))); aspect-ratio: var(--52mwkd-imageRatio-tablet, var(--52mwkd-imageRatio, auto)); img { object-fit: var(--52mwkd-objFit-tablet, var(--52mwkd-objFit, cover)); object-position: var(--beae-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--52mwkd-width-mobile,var(--52mwkd-width,100%)) - var(--52mwkd-margin-left-mobile,var(--52mwkd-margin-left,0px)) - var(--52mwkd-margin-right-mobile,var(--52mwkd-margin-right,0px))); aspect-ratio: var(--52mwkd-imageRatio-mobile, var(--52mwkd-imageRatio, auto)); img { object-fit: var(--52mwkd-objFit-mobile, var(--52mwkd-objFit, cover)); object-position: var(--beae-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.beae-media-wrapper is relative; .beae-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.beae-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .beae-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: beae-ai-gen-shimmer 1.8s linear infinite; } &.beae-ai-gen-done .beae-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .beae-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: beae-ai-gen-scan 2.6s ease-in-out infinite; } & .beae-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .beae-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: beae-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. */ &.beae-ai-generating .beae-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.beae-ai-gen-done .beae-image { opacity: 1; transform: scale(1); } } @keyframes beae-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes beae-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes beae-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } } [data-bnode="beae-t9uyt2"] [data-bnode="be-ctl-item"] { padding-top: var(--be-ctl-item-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--be-ctl-item-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--be-ctl-item-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--be-ctl-item-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--be-ctl-item-padding-top-tablet, var(--be-ctl-item-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--be-ctl-item-padding-right-tablet, var(--be-ctl-item-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--be-ctl-item-padding-bottom-tablet, var(--be-ctl-item-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--be-ctl-item-padding-left-tablet, var(--be-ctl-item-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--be-ctl-item-padding-top-mobile, var(--be-ctl-item-padding-top-tablet, var(--be-ctl-item-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--be-ctl-item-padding-right-mobile, var(--be-ctl-item-padding-right-tablet, var(--be-ctl-item-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--be-ctl-item-padding-bottom-mobile, var(--be-ctl-item-padding-bottom-tablet, var(--be-ctl-item-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--be-ctl-item-padding-left-mobile, var(--be-ctl-item-padding-left-tablet, var(--be-ctl-item-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--be-ctl-item-position, relative); top: var(--be-ctl-item-top, auto); right: var(--be-ctl-item-right, auto); bottom: var(--be-ctl-item-bottom, auto); left: var(--be-ctl-item-left, auto); transform: var(--be-ctl-item-transform, none); z-index: var(--be-ctl-item-z-index, 10); aspect-ratio: var(--be-ctl-item-background-imageRatio, auto); background: var(--be-ctl-item-background-color,transparent); border-style: var(--be-ctl-item-borderStyle,solid); border-color: var(--be-ctl-item-borderColor,#000000); border-width: var(--be-ctl-item-borderWidth-tl,0px) var(--be-ctl-item-borderWidth-tr,0px) var(--be-ctl-item-borderWidth-br,0px) var(--be-ctl-item-borderWidth-bl,0px); border-radius: var(--be-ctl-item-borderRadius-tl,0px) var(--be-ctl-item-borderRadius-tr,0px) var(--be-ctl-item-borderRadius-br,0px) var(--be-ctl-item-borderRadius-bl,0px); box-shadow: var(--be-ctl-item-shadowHorizontal, 0px) var(--be-ctl-item-shadowVertical, 0px) var(--be-ctl-item-shadowBlur, 0px) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, #000000) var(--be-ctl-item-shadowTransparent, 0%), transparent ); max-width: var(--be-ctl-item-max-width, 100%); width: 100%; height: if(style(--be-ctl-item-position: absolute): var(--be-ctl-item-height,100%); else: unset ); backdrop-filter:blur(var(--be-ctl-item-background-blur, none)) saturate(var(--be-ctl-item-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--be-ctl-item-position-tablet, var(--be-ctl-item-position, relative)); top: var(--be-ctl-item-top-tablet, var(--be-ctl-item-top, auto)); right: var(--be-ctl-item-right-tablet, var(--be-ctl-item-right, auto)); bottom: var(--be-ctl-item-bottom-tablet, var(--be-ctl-item-bottom, auto)); left: var(--be-ctl-item-left-tablet, var(--be-ctl-item-left, auto)); transform: var(--be-ctl-item-transform-tablet, var(--be-ctl-item-transform, none)); z-index: var(--be-ctl-item-z-index-tablet, var(--be-ctl-item-z-index, 10)); aspect-ratio: var(--be-ctl-item-background-imageRatio-tablet, var(--be-ctl-item-background-imageRatio, auto)); border-width: var(--be-ctl-item-borderWidth-tl-tablet, var(--be-ctl-item-borderWidth-tl,0px)) var(--be-ctl-item-borderWidth-tr-tablet,var(--be-ctl-item-borderWidth-tr,0px)) var(--be-ctl-item-borderWidth-br-tablet,var(--be-ctl-item-borderWidth-br,0px)) var(--be-ctl-item-borderWidth-bl-tablet,var(--be-ctl-item-borderWidth-bl,0px)); border-radius: var(--be-ctl-item-borderRadius-tl-tablet,var(--be-ctl-item-borderRadius-tl,0px)) var(--be-ctl-item-borderRadius-tr-tablet,var(--be-ctl-item-borderRadius-tr,0px)) var(--be-ctl-item-borderRadius-br-tablet,var(--be-ctl-item-borderRadius-br,0px)) var(--be-ctl-item-borderRadius-bl-tablet,var(--be-ctl-item-borderRadius-bl,0px)); max-width: var(--be-ctl-item-max-width-tablet, var(--be-ctl-item-max-width, 100%)); height: if(style(--be-ctl-item-position-tablet: absolute): var(--be-ctl-item-height-tablet,var(--be-ctl-item-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--be-ctl-item-position-mobile, var(--be-ctl-item-position-tablet, var(--be-ctl-item-position, relative))); top: var(--be-ctl-item-top-mobile, var(--be-ctl-item-top-tablet, var(--be-ctl-item-top, auto))); right: var(--be-ctl-item-right-mobile, var(--be-ctl-item-right-tablet, var(--be-ctl-item-right, auto))); bottom: var(--be-ctl-item-bottom-mobile, var(--be-ctl-item-bottom-tablet, var(--be-ctl-item-bottom, auto))); left: var(--be-ctl-item-left-mobile, var(--be-ctl-item-left-tablet, var(--be-ctl-item-left, auto))); transform: var(--be-ctl-item-transform-mobile, var(--be-ctl-item-transform-tablet, var(--be-ctl-item-transform, none))); z-index: var(--be-ctl-item-z-index-mobile, var(--be-ctl-item-z-index-tablet, var(--be-ctl-item-z-index, 10))); aspect-ratio: var(--be-ctl-item-background-imageRatio-mobile, var(--be-ctl-item-background-imageRatio, auto)); border-width: var(--be-ctl-item-borderWidth-tl-mobile, var(--be-ctl-item-borderWidth-tl,0px)) var(--be-ctl-item-borderWidth-tr-mobile,var(--be-ctl-item-borderWidth-tr,0px)) var(--be-ctl-item-borderWidth-br-mobile,var(--be-ctl-item-borderWidth-br,0px)) var(--be-ctl-item-borderWidth-bl-mobile,var(--be-ctl-item-borderWidth-bl,0px)); border-radius: var(--be-ctl-item-borderRadius-tl-mobile,var(--be-ctl-item-borderRadius-tl,0px)) var(--be-ctl-item-borderRadius-tr-mobile,var(--be-ctl-item-borderRadius-tr,0px)) var(--be-ctl-item-borderRadius-br-mobile,var(--be-ctl-item-borderRadius-br,0px)) var(--be-ctl-item-borderRadius-bl-mobile,var(--be-ctl-item-borderRadius-bl,0px)); max-width: var(--be-ctl-item-max-width-mobile, var(--be-ctl-item-max-width, 100%)); height: if(style(--be-ctl-item-position-mobile: absolute): var(--be-ctl-item-height-mobile,var(--be-ctl-item-height-tablet,,var(--be-ctl-item-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--be-ctl-item-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--be-ctl-item-gap,var(--beae-card-gap)); padding-top: var(--be-ctl-item-padding-top,var(--beae-card-padding)); padding-right: var(--be-ctl-item-padding-right,var(--beae-card-padding)); padding-bottom: var(--be-ctl-item-padding-bottom,var(--beae-card-padding)); padding-left: var(--be-ctl-item-padding-left,var(--beae-card-padding)); border-width: var(--be-ctl-item-borderWidth-tl,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-tr,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-br,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--be-ctl-item-borderRadius-tl,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-tr,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-br,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--be-ctl-item-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--be-ctl-item-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--be-ctl-item-gap-tablet,var(--beae-card-gap)); padding-top: var(--be-ctl-item-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--be-ctl-item-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--be-ctl-item-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--be-ctl-item-padding-left-tablet,var(--beae-card-padding)); border-width: var(--be-ctl-item-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-br-desktop,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--be-ctl-item-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--be-ctl-item-gap-mobile,var(--beae-card-gap)); padding-top: var(--be-ctl-item-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--be-ctl-item-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--be-ctl-item-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--be-ctl-item-padding-left-mobile,var(--beae-card-padding)); border-width: var(--be-ctl-item-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-br-mobile,var(--beae-card-border-width)) var(--be-ctl-item-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--be-ctl-item-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--be-ctl-item-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--be-ctl-item-background-color,var(--beae-card-featured-background)); border-color: var(--be-ctl-item-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--be-ctl-item-shadowHorizontal, var(--beae-card-shadow-x)) var(--be-ctl-item-shadowVertical, var(--beae-card-shadow-y)) var(--be-ctl-item-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, var(--beae-card-featured-shadow-color)) var(--be-ctl-item-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--be-ctl-item-background-color,var(--beae-card-prod-background)); border-color: var(--be-ctl-item-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--be-ctl-item-shadowHorizontal, var(--beae-card-shadow-x)) var(--be-ctl-item-shadowVertical, var(--beae-card-shadow-y)) var(--be-ctl-item-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, var(--beae-card-prod-shadow-color)) var(--be-ctl-item-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--be-ctl-item-background-color,var(--beae-card-pricing-background)); border-color: var(--be-ctl-item-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--be-ctl-item-shadowHorizontal, var(--beae-card-shadow-x)) var(--be-ctl-item-shadowVertical, var(--beae-card-shadow-y)) var(--be-ctl-item-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, var(--beae-card-pricing-shadow-color)) var(--be-ctl-item-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--be-ctl-item-background-color,var(--beae-card-cta-background)); border-color: var(--be-ctl-item-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--be-ctl-item-shadowHorizontal, var(--beae-card-shadow-x)) var(--be-ctl-item-shadowVertical, var(--beae-card-shadow-y)) var(--be-ctl-item-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--be-ctl-item-shadowColor, var(--beae-card-cta-shadow-color)) var(--be-ctl-item-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-t9uyt2"] [data-bnode="be-ctl-item"] {     display: flex;     flex-direction: var(--be-ctl-item-direction, column);     flex-wrap: nowrap;     justify-content: var(--be-ctl-item-justify-content);     align-items: var(--be-ctl-item-align-items);     gap: var(--be-ctl-item-gap, var(--be-ctl-item-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-t9uyt2"] [data-bnode="be-ctl-item"] {      flex-direction: var(--be-ctl-item-direction-tablet, column);                      gap: var(--be-ctl-item-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                  &>.beae-slot[data-bnode-index="1"] {           flex-basis: calc(66.66% - var(--be-ctl-item-padding-right-tablet, 0px) - var(--be-ctl-item-padding-right-tablet, 0px));          }          &>.beae-slot[data-bnode-index="2"] {           flex-basis: calc(33.33% - var(--be-ctl-item-padding-right-tablet, 0px) - var(--be-ctl-item-padding-right-tablet, 0px));          }          &>.beae-slot[data-bnode-index="3"] {           flex-basis: calc(100% - var(--be-ctl-item-padding-right-tablet, 0px) - var(--be-ctl-item-padding-right-tablet, 0px));          }            }    }    @media (max-width: 767px) {     [data-bnode="beae-t9uyt2"] [data-bnode="be-ctl-item"] {      flex-direction: var(--be-ctl-item-direction-mobile, column);                      gap: var(--be-ctl-item-gap-mobile, var(--be-ctl-item-gap-mobile, var(--beae-slot-gap-mobile)));             &>.beae-slot[data-bnode-index] {                }           }    }[data-bnode="beae-si0ubs"] {     display: flex;     flex-direction: var(--si0ubs-direction, column);     flex-wrap: nowrap;     justify-content: var(--si0ubs-justify-content);     align-items: var(--si0ubs-align-items);     gap: var(--si0ubs-gap, var(--si0ubs-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-si0ubs"] {                            gap: var(--si0ubs-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(33.33% - var(--si0ubs-padding-right-tablet, 0px) - var(--si0ubs-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-si0ubs"] {                            gap: var(--si0ubs-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(33.33% - var(--si0ubs-padding-right-mobile, 0px) - var(--si0ubs-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-2c7f7w"] {     display: flex;     flex-direction: var(--2c7f7w-direction, column);     flex-wrap: nowrap;     justify-content: var(--2c7f7w-justify-content);     align-items: var(--2c7f7w-align-items);     gap: var(--2c7f7w-gap, var(--2c7f7w-gap, var(--beae-slot-gap)));            &>.beae-slot {         flex: 1 1 0;         min-width: 0;        }                 &>.beae-slot[data-bnode-index] {           flex-basis: calc(100.00% - var(--2c7f7w-padding-right, 0px) - var(--2c7f7w-padding-right, 0px));          }                   }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-2c7f7w"] {                            gap: var(--2c7f7w-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--2c7f7w-padding-right-tablet, 0px) - var(--2c7f7w-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-2c7f7w"] {                            gap: var(--2c7f7w-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--2c7f7w-padding-right-mobile, 0px) - var(--2c7f7w-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-r2vno6"] { --r2vno6-height: fit-content; --r2vno6-height-tablet: fit-content; --r2vno6-height-mobile: fit-content; --r2vno6-direction: row; --r2vno6-direction-tablet: row; --r2vno6-direction-mobile: row; --r2vno6-structure: columns; --r2vno6-structure-tablet: columns; --r2vno6-structure-mobile: columns; --r2vno6-align-items: stretch; --r2vno6-align-items-tablet: stretch; --r2vno6-align-items-mobile: stretch; --r2vno6-surface: light; --r2vno6-surface-tablet: light; --r2vno6-surface-mobile: light; }[data-bnode="beae-r2vno6"] { padding-top: var(--r2vno6-padding-top, var(--beae-section-padding-y, 0px)); padding-right: var(--r2vno6-padding-right, var(--beae-section-padding-x, 0px)); padding-bottom: var(--r2vno6-padding-bottom, var(--beae-section-padding-y, 0px)); padding-left: var(--r2vno6-padding-left, var(--beae-section-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--r2vno6-padding-top-tablet, var(--r2vno6-padding-top, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-right: var(--r2vno6-padding-right-tablet, var(--r2vno6-padding-right, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); padding-bottom: var(--r2vno6-padding-bottom-tablet, var(--r2vno6-padding-bottom, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-left: var(--r2vno6-padding-left-tablet, var(--r2vno6-padding-left, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--r2vno6-padding-top-mobile, var(--r2vno6-padding-top-tablet, var(--r2vno6-padding-top, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-right: var(--r2vno6-padding-right-mobile, var(--r2vno6-padding-right-tablet, var(--r2vno6-padding-right, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); padding-bottom: var(--r2vno6-padding-bottom-mobile, var(--r2vno6-padding-bottom-tablet, var(--r2vno6-padding-bottom, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-left: var(--r2vno6-padding-left-mobile, var(--r2vno6-padding-left-tablet, var(--r2vno6-padding-left, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); } &.beae-section { background: var(--r2vno6-background-color, var(--beae-background-color)); max-width: 100%; position: relative; .beae-section-container { height: var(--r2vno6-height); width: 100%; max-width: var(--r2vno6-width,var(--beae-section-width)); margin: 0 auto; > *:not(.beae-slot) { position: relative; z-index: 1; } > .beae-bg-image{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; img{ width: 100%; height: 100%; } } > .beae-video-background{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; object-fit: cover; background: #000000; } } } @media (min-width: 767.79px) and (max-width: 1180px) { &.beae-section { & .beae-section-container { height: var(--r2vno6-height-tablet, auto); width: 100%; max-width: var(--r2vno6-width-tablet, 100%); } } } @media (max-width: 767px) { &.beae-section { & .beae-section-container { height: var(--r2vno6-height-mobile, auto); width: 100%; max-width: var(--r2vno6-width-mobile, 100%); } } } }[data-bnode="beae-r2vno6"] > .beae-section-container{     display: flex;     flex-direction: var(--r2vno6-direction, column);     flex-wrap: nowrap;     justify-content: var(--r2vno6-justify-content);     align-items: var(--r2vno6-align-items);     gap: var(--r2vno6-gap, var(--beae-grid-gap, 4px));            &>.beae-slot {         flex: 1 1 0;         min-width: 0;        }                 &>.beae-slot[data-bnode-index] {           flex-basis: calc(100.00% - var(--r2vno6-padding-right, 0px) - var(--r2vno6-padding-right, 0px));          }                   }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-r2vno6"] > .beae-section-container{                            gap: var(--beae-grid-gap-tablet, 4px);               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--r2vno6-padding-right-tablet, 0px) - var(--r2vno6-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-r2vno6"] > .beae-section-container{                            gap: var(--beae-grid-gap-mobile, 4px);              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--r2vno6-padding-right-mobile, 0px) - var(--r2vno6-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-3fijhk"] { --3fijhk-direction: row; --3fijhk-direction-tablet: row; --3fijhk-direction-mobile: column; --3fijhk-structure: columns; --3fijhk-structure-tablet: columns; --3fijhk-structure-mobile: columns; --3fijhk-gap: 0px; --3fijhk-gap-tablet: 40px; --3fijhk-gap-mobile: 32px; --3fijhk-grow-1-child: 33.33; --3fijhk-grow-1-child-tablet: 33.33; --3fijhk-grow-1-child-mobile: 33.33; --3fijhk-grow-2-child: 66.66; --3fijhk-grow-2-child-tablet: 66.66; --3fijhk-grow-2-child-mobile: 66.66; --3fijhk-enableShadow: false; --3fijhk-enableShadow-tablet: false; --3fijhk-enableShadow-mobile: false; --3fijhk-background-0: c; --3fijhk-background-0-tablet: c; --3fijhk-background-0-mobile: c; --3fijhk-background-1: o; --3fijhk-background-1-tablet: o; --3fijhk-background-1-mobile: o; --3fijhk-background-2: l; --3fijhk-background-2-tablet: l; --3fijhk-background-2-mobile: l; --3fijhk-background-3: o; --3fijhk-background-3-tablet: o; --3fijhk-background-3-mobile: o; --3fijhk-background-4: r; --3fijhk-background-4-tablet: r; --3fijhk-background-4-mobile: r; --3fijhk-background-type: color; --3fijhk-background-type-tablet: color; --3fijhk-background-type-mobile: color; --3fijhk-borderRadius: 24px; --3fijhk-borderRadius-tablet: 24px; --3fijhk-borderRadius-mobile: 24px; --3fijhk-surface: muted; --3fijhk-surface-tablet: muted; --3fijhk-surface-mobile: muted; --3fijhk-cardStyle: beae-featured-card; --3fijhk-cardStyle-tablet: beae-featured-card; --3fijhk-cardStyle-mobile: beae-featured-card; --3fijhk-padding-top: 0px; --3fijhk-padding-top-tablet: 0px; --3fijhk-padding-top-mobile: 0px; --3fijhk-padding-right: 0px; --3fijhk-padding-right-tablet: 0px; --3fijhk-padding-right-mobile: 0px; --3fijhk-padding-bottom: 0px; --3fijhk-padding-bottom-tablet: 0px; --3fijhk-padding-bottom-mobile: 0px; --3fijhk-padding-left: 0px; --3fijhk-padding-left-tablet: 0px; --3fijhk-padding-left-mobile: 0px; }[data-bnode="beae-3fijhk"] { padding-top: var(--3fijhk-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--3fijhk-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--3fijhk-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--3fijhk-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--3fijhk-padding-top-tablet, var(--3fijhk-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--3fijhk-padding-right-tablet, var(--3fijhk-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--3fijhk-padding-bottom-tablet, var(--3fijhk-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--3fijhk-padding-left-tablet, var(--3fijhk-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--3fijhk-padding-top-mobile, var(--3fijhk-padding-top-tablet, var(--3fijhk-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--3fijhk-padding-right-mobile, var(--3fijhk-padding-right-tablet, var(--3fijhk-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--3fijhk-padding-bottom-mobile, var(--3fijhk-padding-bottom-tablet, var(--3fijhk-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--3fijhk-padding-left-mobile, var(--3fijhk-padding-left-tablet, var(--3fijhk-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--3fijhk-position, relative); top: var(--3fijhk-top, auto); right: var(--3fijhk-right, auto); bottom: var(--3fijhk-bottom, auto); left: var(--3fijhk-left, auto); transform: var(--3fijhk-transform, none); z-index: var(--3fijhk-z-index, 10); aspect-ratio: var(--3fijhk-background-imageRatio, auto); background: var(--3fijhk-background-color,transparent); border-style: var(--3fijhk-borderStyle,solid); border-color: var(--3fijhk-borderColor,#000000); border-width: var(--3fijhk-borderWidth-tl,0px) var(--3fijhk-borderWidth-tr,0px) var(--3fijhk-borderWidth-br,0px) var(--3fijhk-borderWidth-bl,0px); border-radius: var(--3fijhk-borderRadius-tl,0px) var(--3fijhk-borderRadius-tr,0px) var(--3fijhk-borderRadius-br,0px) var(--3fijhk-borderRadius-bl,0px); box-shadow: var(--3fijhk-shadowHorizontal, 0px) var(--3fijhk-shadowVertical, 0px) var(--3fijhk-shadowBlur, 0px) 1px color-mix( in srgb, var(--3fijhk-shadowColor, #000000) var(--3fijhk-shadowTransparent, 0%), transparent ); max-width: var(--3fijhk-max-width, 100%); width: 100%; height: if(style(--3fijhk-position: absolute): var(--3fijhk-height,100%); else: unset ); backdrop-filter:blur(var(--3fijhk-background-blur, none)) saturate(var(--3fijhk-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--3fijhk-position-tablet, var(--3fijhk-position, relative)); top: var(--3fijhk-top-tablet, var(--3fijhk-top, auto)); right: var(--3fijhk-right-tablet, var(--3fijhk-right, auto)); bottom: var(--3fijhk-bottom-tablet, var(--3fijhk-bottom, auto)); left: var(--3fijhk-left-tablet, var(--3fijhk-left, auto)); transform: var(--3fijhk-transform-tablet, var(--3fijhk-transform, none)); z-index: var(--3fijhk-z-index-tablet, var(--3fijhk-z-index, 10)); aspect-ratio: var(--3fijhk-background-imageRatio-tablet, var(--3fijhk-background-imageRatio, auto)); border-width: var(--3fijhk-borderWidth-tl-tablet, var(--3fijhk-borderWidth-tl,0px)) var(--3fijhk-borderWidth-tr-tablet,var(--3fijhk-borderWidth-tr,0px)) var(--3fijhk-borderWidth-br-tablet,var(--3fijhk-borderWidth-br,0px)) var(--3fijhk-borderWidth-bl-tablet,var(--3fijhk-borderWidth-bl,0px)); border-radius: var(--3fijhk-borderRadius-tl-tablet,var(--3fijhk-borderRadius-tl,0px)) var(--3fijhk-borderRadius-tr-tablet,var(--3fijhk-borderRadius-tr,0px)) var(--3fijhk-borderRadius-br-tablet,var(--3fijhk-borderRadius-br,0px)) var(--3fijhk-borderRadius-bl-tablet,var(--3fijhk-borderRadius-bl,0px)); max-width: var(--3fijhk-max-width-tablet, var(--3fijhk-max-width, 100%)); height: if(style(--3fijhk-position-tablet: absolute): var(--3fijhk-height-tablet,var(--3fijhk-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--3fijhk-position-mobile, var(--3fijhk-position-tablet, var(--3fijhk-position, relative))); top: var(--3fijhk-top-mobile, var(--3fijhk-top-tablet, var(--3fijhk-top, auto))); right: var(--3fijhk-right-mobile, var(--3fijhk-right-tablet, var(--3fijhk-right, auto))); bottom: var(--3fijhk-bottom-mobile, var(--3fijhk-bottom-tablet, var(--3fijhk-bottom, auto))); left: var(--3fijhk-left-mobile, var(--3fijhk-left-tablet, var(--3fijhk-left, auto))); transform: var(--3fijhk-transform-mobile, var(--3fijhk-transform-tablet, var(--3fijhk-transform, none))); z-index: var(--3fijhk-z-index-mobile, var(--3fijhk-z-index-tablet, var(--3fijhk-z-index, 10))); aspect-ratio: var(--3fijhk-background-imageRatio-mobile, var(--3fijhk-background-imageRatio, auto)); border-width: var(--3fijhk-borderWidth-tl-mobile, var(--3fijhk-borderWidth-tl,0px)) var(--3fijhk-borderWidth-tr-mobile,var(--3fijhk-borderWidth-tr,0px)) var(--3fijhk-borderWidth-br-mobile,var(--3fijhk-borderWidth-br,0px)) var(--3fijhk-borderWidth-bl-mobile,var(--3fijhk-borderWidth-bl,0px)); border-radius: var(--3fijhk-borderRadius-tl-mobile,var(--3fijhk-borderRadius-tl,0px)) var(--3fijhk-borderRadius-tr-mobile,var(--3fijhk-borderRadius-tr,0px)) var(--3fijhk-borderRadius-br-mobile,var(--3fijhk-borderRadius-br,0px)) var(--3fijhk-borderRadius-bl-mobile,var(--3fijhk-borderRadius-bl,0px)); max-width: var(--3fijhk-max-width-mobile, var(--3fijhk-max-width, 100%)); height: if(style(--3fijhk-position-mobile: absolute): var(--3fijhk-height-mobile,var(--3fijhk-height-tablet,,var(--3fijhk-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--3fijhk-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--3fijhk-gap,var(--beae-card-gap)); padding-top: var(--3fijhk-padding-top,var(--beae-card-padding)); padding-right: var(--3fijhk-padding-right,var(--beae-card-padding)); padding-bottom: var(--3fijhk-padding-bottom,var(--beae-card-padding)); padding-left: var(--3fijhk-padding-left,var(--beae-card-padding)); border-width: var(--3fijhk-borderWidth-tl,var(--beae-card-border-width)) var(--3fijhk-borderWidth-tr,var(--beae-card-border-width)) var(--3fijhk-borderWidth-br,var(--beae-card-border-width)) var(--3fijhk-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--3fijhk-borderRadius-tl,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-tr,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-br,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--3fijhk-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--3fijhk-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--3fijhk-gap-tablet,var(--beae-card-gap)); padding-top: var(--3fijhk-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--3fijhk-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--3fijhk-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--3fijhk-padding-left-tablet,var(--beae-card-padding)); border-width: var(--3fijhk-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--3fijhk-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--3fijhk-borderWidth-br-desktop,var(--beae-card-border-width)) var(--3fijhk-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--3fijhk-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--3fijhk-gap-mobile,var(--beae-card-gap)); padding-top: var(--3fijhk-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--3fijhk-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--3fijhk-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--3fijhk-padding-left-mobile,var(--beae-card-padding)); border-width: var(--3fijhk-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--3fijhk-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--3fijhk-borderWidth-br-mobile,var(--beae-card-border-width)) var(--3fijhk-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--3fijhk-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--3fijhk-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--3fijhk-background-color,var(--beae-card-featured-background)); border-color: var(--3fijhk-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--3fijhk-shadowHorizontal, var(--beae-card-shadow-x)) var(--3fijhk-shadowVertical, var(--beae-card-shadow-y)) var(--3fijhk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--3fijhk-shadowColor, var(--beae-card-featured-shadow-color)) var(--3fijhk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--3fijhk-background-color,var(--beae-card-prod-background)); border-color: var(--3fijhk-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--3fijhk-shadowHorizontal, var(--beae-card-shadow-x)) var(--3fijhk-shadowVertical, var(--beae-card-shadow-y)) var(--3fijhk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--3fijhk-shadowColor, var(--beae-card-prod-shadow-color)) var(--3fijhk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--3fijhk-background-color,var(--beae-card-pricing-background)); border-color: var(--3fijhk-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--3fijhk-shadowHorizontal, var(--beae-card-shadow-x)) var(--3fijhk-shadowVertical, var(--beae-card-shadow-y)) var(--3fijhk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--3fijhk-shadowColor, var(--beae-card-pricing-shadow-color)) var(--3fijhk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--3fijhk-background-color,var(--beae-card-cta-background)); border-color: var(--3fijhk-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--3fijhk-shadowHorizontal, var(--beae-card-shadow-x)) var(--3fijhk-shadowVertical, var(--beae-card-shadow-y)) var(--3fijhk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--3fijhk-shadowColor, var(--beae-card-cta-shadow-color)) var(--3fijhk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-3fijhk"] {     display: flex;     flex-direction: var(--3fijhk-direction, column);     flex-wrap: nowrap;     justify-content: var(--3fijhk-justify-content);     align-items: var(--3fijhk-align-items);     gap: var(--3fijhk-gap, var(--3fijhk-gap, var(--beae-slot-gap)));            &>.beae-slot {         flex: 1 1 0;         min-width: 0;        }                 &>.beae-slot[data-bnode-index] {           flex-basis: calc(50.00% - var(--3fijhk-padding-right, 0px) - var(--3fijhk-padding-right, 0px));          }                   }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-3fijhk"] {                            gap: var(--3fijhk-gap-tablet, var(--3fijhk-gap-tablet, var(--beae-slot-gap-tablet)));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--3fijhk-padding-right-tablet, 0px) - var(--3fijhk-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-3fijhk"] {      flex-direction: var(--3fijhk-direction-mobile, column);                      gap: var(--3fijhk-gap-mobile, var(--3fijhk-gap-mobile, var(--beae-slot-gap-mobile)));             &>.beae-slot[data-bnode-index] {                }           }    }[data-bnode="beae-mll4p5"] { --mll4p5-padding-top: 112px; --mll4p5-padding-top-tablet: 40px; --mll4p5-padding-top-mobile: 40px; --mll4p5-padding-right: 112px; --mll4p5-padding-right-tablet: 20px; --mll4p5-padding-right-mobile: 16px; --mll4p5-padding-bottom: 112px; --mll4p5-padding-bottom-tablet: 40px; --mll4p5-padding-bottom-mobile: 40px; --mll4p5-padding-left: 112px; --mll4p5-padding-left-tablet: 20px; --mll4p5-padding-left-mobile: 16px; --mll4p5-cardStyle: none; --mll4p5-cardStyle-tablet: none; --mll4p5-cardStyle-mobile: none; }[data-bnode="beae-mll4p5"] { padding-top: var(--mll4p5-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--mll4p5-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--mll4p5-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--mll4p5-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--mll4p5-padding-top-tablet, var(--mll4p5-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--mll4p5-padding-right-tablet, var(--mll4p5-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--mll4p5-padding-bottom-tablet, var(--mll4p5-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--mll4p5-padding-left-tablet, var(--mll4p5-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--mll4p5-padding-top-mobile, var(--mll4p5-padding-top-tablet, var(--mll4p5-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--mll4p5-padding-right-mobile, var(--mll4p5-padding-right-tablet, var(--mll4p5-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--mll4p5-padding-bottom-mobile, var(--mll4p5-padding-bottom-tablet, var(--mll4p5-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--mll4p5-padding-left-mobile, var(--mll4p5-padding-left-tablet, var(--mll4p5-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--mll4p5-position, relative); top: var(--mll4p5-top, auto); right: var(--mll4p5-right, auto); bottom: var(--mll4p5-bottom, auto); left: var(--mll4p5-left, auto); transform: var(--mll4p5-transform, none); z-index: var(--mll4p5-z-index, 10); aspect-ratio: var(--mll4p5-background-imageRatio, auto); background: var(--mll4p5-background-color,transparent); border-style: var(--mll4p5-borderStyle,solid); border-color: var(--mll4p5-borderColor,#000000); border-width: var(--mll4p5-borderWidth-tl,0px) var(--mll4p5-borderWidth-tr,0px) var(--mll4p5-borderWidth-br,0px) var(--mll4p5-borderWidth-bl,0px); border-radius: var(--mll4p5-borderRadius-tl,0px) var(--mll4p5-borderRadius-tr,0px) var(--mll4p5-borderRadius-br,0px) var(--mll4p5-borderRadius-bl,0px); box-shadow: var(--mll4p5-shadowHorizontal, 0px) var(--mll4p5-shadowVertical, 0px) var(--mll4p5-shadowBlur, 0px) 1px color-mix( in srgb, var(--mll4p5-shadowColor, #000000) var(--mll4p5-shadowTransparent, 0%), transparent ); max-width: var(--mll4p5-max-width, 100%); width: 100%; height: if(style(--mll4p5-position: absolute): var(--mll4p5-height,100%); else: unset ); backdrop-filter:blur(var(--mll4p5-background-blur, none)) saturate(var(--mll4p5-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--mll4p5-position-tablet, var(--mll4p5-position, relative)); top: var(--mll4p5-top-tablet, var(--mll4p5-top, auto)); right: var(--mll4p5-right-tablet, var(--mll4p5-right, auto)); bottom: var(--mll4p5-bottom-tablet, var(--mll4p5-bottom, auto)); left: var(--mll4p5-left-tablet, var(--mll4p5-left, auto)); transform: var(--mll4p5-transform-tablet, var(--mll4p5-transform, none)); z-index: var(--mll4p5-z-index-tablet, var(--mll4p5-z-index, 10)); aspect-ratio: var(--mll4p5-background-imageRatio-tablet, var(--mll4p5-background-imageRatio, auto)); border-width: var(--mll4p5-borderWidth-tl-tablet, var(--mll4p5-borderWidth-tl,0px)) var(--mll4p5-borderWidth-tr-tablet,var(--mll4p5-borderWidth-tr,0px)) var(--mll4p5-borderWidth-br-tablet,var(--mll4p5-borderWidth-br,0px)) var(--mll4p5-borderWidth-bl-tablet,var(--mll4p5-borderWidth-bl,0px)); border-radius: var(--mll4p5-borderRadius-tl-tablet,var(--mll4p5-borderRadius-tl,0px)) var(--mll4p5-borderRadius-tr-tablet,var(--mll4p5-borderRadius-tr,0px)) var(--mll4p5-borderRadius-br-tablet,var(--mll4p5-borderRadius-br,0px)) var(--mll4p5-borderRadius-bl-tablet,var(--mll4p5-borderRadius-bl,0px)); max-width: var(--mll4p5-max-width-tablet, var(--mll4p5-max-width, 100%)); height: if(style(--mll4p5-position-tablet: absolute): var(--mll4p5-height-tablet,var(--mll4p5-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--mll4p5-position-mobile, var(--mll4p5-position-tablet, var(--mll4p5-position, relative))); top: var(--mll4p5-top-mobile, var(--mll4p5-top-tablet, var(--mll4p5-top, auto))); right: var(--mll4p5-right-mobile, var(--mll4p5-right-tablet, var(--mll4p5-right, auto))); bottom: var(--mll4p5-bottom-mobile, var(--mll4p5-bottom-tablet, var(--mll4p5-bottom, auto))); left: var(--mll4p5-left-mobile, var(--mll4p5-left-tablet, var(--mll4p5-left, auto))); transform: var(--mll4p5-transform-mobile, var(--mll4p5-transform-tablet, var(--mll4p5-transform, none))); z-index: var(--mll4p5-z-index-mobile, var(--mll4p5-z-index-tablet, var(--mll4p5-z-index, 10))); aspect-ratio: var(--mll4p5-background-imageRatio-mobile, var(--mll4p5-background-imageRatio, auto)); border-width: var(--mll4p5-borderWidth-tl-mobile, var(--mll4p5-borderWidth-tl,0px)) var(--mll4p5-borderWidth-tr-mobile,var(--mll4p5-borderWidth-tr,0px)) var(--mll4p5-borderWidth-br-mobile,var(--mll4p5-borderWidth-br,0px)) var(--mll4p5-borderWidth-bl-mobile,var(--mll4p5-borderWidth-bl,0px)); border-radius: var(--mll4p5-borderRadius-tl-mobile,var(--mll4p5-borderRadius-tl,0px)) var(--mll4p5-borderRadius-tr-mobile,var(--mll4p5-borderRadius-tr,0px)) var(--mll4p5-borderRadius-br-mobile,var(--mll4p5-borderRadius-br,0px)) var(--mll4p5-borderRadius-bl-mobile,var(--mll4p5-borderRadius-bl,0px)); max-width: var(--mll4p5-max-width-mobile, var(--mll4p5-max-width, 100%)); height: if(style(--mll4p5-position-mobile: absolute): var(--mll4p5-height-mobile,var(--mll4p5-height-tablet,,var(--mll4p5-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--mll4p5-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--mll4p5-gap,var(--beae-card-gap)); padding-top: var(--mll4p5-padding-top,var(--beae-card-padding)); padding-right: var(--mll4p5-padding-right,var(--beae-card-padding)); padding-bottom: var(--mll4p5-padding-bottom,var(--beae-card-padding)); padding-left: var(--mll4p5-padding-left,var(--beae-card-padding)); border-width: var(--mll4p5-borderWidth-tl,var(--beae-card-border-width)) var(--mll4p5-borderWidth-tr,var(--beae-card-border-width)) var(--mll4p5-borderWidth-br,var(--beae-card-border-width)) var(--mll4p5-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--mll4p5-borderRadius-tl,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-tr,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-br,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--mll4p5-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--mll4p5-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--mll4p5-gap-tablet,var(--beae-card-gap)); padding-top: var(--mll4p5-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--mll4p5-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--mll4p5-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--mll4p5-padding-left-tablet,var(--beae-card-padding)); border-width: var(--mll4p5-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--mll4p5-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--mll4p5-borderWidth-br-desktop,var(--beae-card-border-width)) var(--mll4p5-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--mll4p5-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--mll4p5-gap-mobile,var(--beae-card-gap)); padding-top: var(--mll4p5-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--mll4p5-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--mll4p5-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--mll4p5-padding-left-mobile,var(--beae-card-padding)); border-width: var(--mll4p5-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--mll4p5-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--mll4p5-borderWidth-br-mobile,var(--beae-card-border-width)) var(--mll4p5-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--mll4p5-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--mll4p5-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--mll4p5-background-color,var(--beae-card-featured-background)); border-color: var(--mll4p5-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--mll4p5-shadowHorizontal, var(--beae-card-shadow-x)) var(--mll4p5-shadowVertical, var(--beae-card-shadow-y)) var(--mll4p5-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--mll4p5-shadowColor, var(--beae-card-featured-shadow-color)) var(--mll4p5-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--mll4p5-background-color,var(--beae-card-prod-background)); border-color: var(--mll4p5-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--mll4p5-shadowHorizontal, var(--beae-card-shadow-x)) var(--mll4p5-shadowVertical, var(--beae-card-shadow-y)) var(--mll4p5-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--mll4p5-shadowColor, var(--beae-card-prod-shadow-color)) var(--mll4p5-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--mll4p5-background-color,var(--beae-card-pricing-background)); border-color: var(--mll4p5-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--mll4p5-shadowHorizontal, var(--beae-card-shadow-x)) var(--mll4p5-shadowVertical, var(--beae-card-shadow-y)) var(--mll4p5-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--mll4p5-shadowColor, var(--beae-card-pricing-shadow-color)) var(--mll4p5-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--mll4p5-background-color,var(--beae-card-cta-background)); border-color: var(--mll4p5-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--mll4p5-shadowHorizontal, var(--beae-card-shadow-x)) var(--mll4p5-shadowVertical, var(--beae-card-shadow-y)) var(--mll4p5-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--mll4p5-shadowColor, var(--beae-card-cta-shadow-color)) var(--mll4p5-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-mll4p5"] {     display: flex;     flex-direction: var(--mll4p5-direction, column);     flex-wrap: nowrap;     justify-content: var(--mll4p5-justify-content);     align-items: var(--mll4p5-align-items);     gap: var(--mll4p5-gap, var(--mll4p5-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-mll4p5"] {                            gap: var(--mll4p5-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(33.33% - var(--mll4p5-padding-right-tablet, 0px) - var(--mll4p5-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-mll4p5"] {                            gap: var(--mll4p5-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(33.33% - var(--mll4p5-padding-right-mobile, 0px) - var(--mll4p5-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-ettdvb"] { --ettdvb-typography: h2; --ettdvb-typography-tablet: h2; --ettdvb-typography-mobile: h2; --ettdvb-margin-top: 0px; --ettdvb-margin-top-tablet: 0px; --ettdvb-margin-top-mobile: 0px; --ettdvb-margin-right: 0px; --ettdvb-margin-right-tablet: 0px; --ettdvb-margin-right-mobile: 0px; --ettdvb-margin-bottom: 16px; --ettdvb-margin-bottom-tablet: 16px; --ettdvb-margin-bottom-mobile: 16px; --ettdvb-margin-left: 0px; --ettdvb-margin-left-tablet: 0px; --ettdvb-margin-left-mobile: 0px; }[data-bnode="beae-ettdvb"] { margin-top: var(--ettdvb-margin-top, 0px); margin-right: var(--ettdvb-margin-right, 0px); margin-bottom: var(--ettdvb-margin-bottom, 0px); margin-left: var(--ettdvb-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--ettdvb-margin-top-tablet, 0px); margin-right: var(--ettdvb-margin-right-tablet, 0px); margin-bottom: var(--ettdvb-margin-bottom-tablet, 0px); margin-left: var(--ettdvb-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--ettdvb-margin-top-mobile, 0px); margin-right: var(--ettdvb-margin-right-mobile, 0px); margin-bottom: var(--ettdvb-margin-bottom-mobile, 0px); margin-left: var(--ettdvb-margin-left-mobile, 0px); } & .beae-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--ettdvb-highlightColor,var(--beae-p-color)); top: var(--ettdvb-highlightTop, 100%); } }[data-bnode="beae-t361et"] { --t361et-typography: p; --t361et-typography-tablet: p; --t361et-typography-mobile: p; }[data-bnode="beae-t361et"] { margin-top: var(--t361et-margin-top, 0px); margin-right: var(--t361et-margin-right, 0px); margin-bottom: var(--t361et-margin-bottom, 0px); margin-left: var(--t361et-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--t361et-margin-top-tablet, 0px); margin-right: var(--t361et-margin-right-tablet, 0px); margin-bottom: var(--t361et-margin-bottom-tablet, 0px); margin-left: var(--t361et-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--t361et-margin-top-mobile, 0px); margin-right: var(--t361et-margin-right-mobile, 0px); margin-bottom: var(--t361et-margin-bottom-mobile, 0px); margin-left: var(--t361et-margin-left-mobile, 0px); } }[data-bnode="beae-1ng8bi"] { --1ng8bi-paddingX: 20px; --1ng8bi-paddingX-tablet: 20px; --1ng8bi-paddingX-mobile: 20px; --1ng8bi-paddingY: 16px; --1ng8bi-paddingY-tablet: 16px; --1ng8bi-paddingY-mobile: 16px; --1ng8bi-margin-top: 40px; --1ng8bi-margin-top-tablet: 40px; --1ng8bi-margin-top-mobile: 40px; --1ng8bi-margin-right: 0px; --1ng8bi-margin-right-tablet: 0px; --1ng8bi-margin-right-mobile: 0px; --1ng8bi-margin-bottom: 0px; --1ng8bi-margin-bottom-tablet: 0px; --1ng8bi-margin-bottom-mobile: 0px; --1ng8bi-margin-left: 0px; --1ng8bi-margin-left-tablet: 0px; --1ng8bi-margin-left-mobile: 0px; --1ng8bi-headerState: normal; --1ng8bi-headerState-tablet: normal; --1ng8bi-headerState-mobile: normal; --1ng8bi-tabBg: #ffffff; --1ng8bi-tabBg-tablet: #ffffff; --1ng8bi-tabBg-mobile: #ffffff; --1ng8bi-tabBgHover: #ffffff; --1ng8bi-tabBgHover-tablet: #ffffff; --1ng8bi-tabBgHover-mobile: #ffffff; --1ng8bi-tabBgActive: #ffffff; --1ng8bi-tabBgActive-tablet: #ffffff; --1ng8bi-tabBgActive-mobile: #ffffff; --1ng8bi-headingTypo: h5; --1ng8bi-headingTypo-tablet: h5; --1ng8bi-headingTypo-mobile: h5; --1ng8bi-borderRadius-tl: 12px; --1ng8bi-borderRadius-tl-tablet: 12px; --1ng8bi-borderRadius-tl-mobile: 12px; --1ng8bi-borderRadius-tr: 12px; --1ng8bi-borderRadius-tr-tablet: 12px; --1ng8bi-borderRadius-tr-mobile: 12px; --1ng8bi-borderRadius-bl: 12px; --1ng8bi-borderRadius-bl-tablet: 12px; --1ng8bi-borderRadius-bl-mobile: 12px; --1ng8bi-borderRadius-br: 12px; --1ng8bi-borderRadius-br-tablet: 12px; --1ng8bi-borderRadius-br-mobile: 12px; --beae-h5-text-align: start; --1ng8bi-colorHover: #000000; --1ng8bi-colorHover-tablet: #000000; --1ng8bi-colorHover-mobile: #000000; --1ng8bi-colorActive: #0a0a0a; --1ng8bi-colorActive-tablet: #0a0a0a; --1ng8bi-colorActive-mobile: #0a0a0a; --beae-h5-color: #0a0a0a; }[data-bnode="beae-1ng8bi"] { margin-top: var(--1ng8bi-margin-top, 0px); margin-right: var(--1ng8bi-margin-right, 0px); margin-bottom: var(--1ng8bi-margin-bottom, 0px); margin-left: var(--1ng8bi-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--1ng8bi-margin-top-tablet, 0px); margin-right: var(--1ng8bi-margin-right-tablet, 0px); margin-bottom: var(--1ng8bi-margin-bottom-tablet, 0px); margin-left: var(--1ng8bi-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--1ng8bi-margin-top-mobile, 0px); margin-right: var(--1ng8bi-margin-right-mobile, 0px); margin-bottom: var(--1ng8bi-margin-bottom-mobile, 0px); margin-left: var(--1ng8bi-margin-left-mobile, 0px); } &.beae-accordion-root { display: flex; flex-direction: column; width: 100%; gap: var(--1ng8bi-gap, 16px); @media(min-width: 767.79px) and (max-width: 1180px){ gap: var(--1ng8bi-gap-tablet, 16px); } @media(max-width: 767px){ gap: var(--1ng8bi-gap-mobile, 16px); } .beae-accordion-item { border-style: var(--1ng8bi-borderStyle,solid); border-color: var(--1ng8bi-borderColor,#000000); border-width: var(--1ng8bi-borderWidth-tl,0px) var(--1ng8bi-borderWidth-tr,0px) var(--1ng8bi-borderWidth-br,0px) var(--1ng8bi-borderWidth-bl,0px); border-radius: var(--1ng8bi-borderRadius-tl,0px) var(--1ng8bi-borderRadius-tr,0px) var(--1ng8bi-borderRadius-br,0px) var(--1ng8bi-borderRadius-bl,0px); box-shadow: var(--1ng8bi-shadowHorizontal, 0px) var(--1ng8bi-shadowVertical, 0px) var(--1ng8bi-shadowBlur, 0px) 1px color-mix( in srgb, var(--1ng8bi-shadowColor, #000000) var(--1ng8bi-shadowTransparent, 0%), transparent ); overflow: hidden; transition: all 0.3s ease; @media(min-width: 767.79px) and (max-width: 1180px){ border-width: var(--1ng8bi-borderWidth-tl-tablet,0px) var(--1ng8bi-borderWidth-tr-tablet,0px) var(--1ng8bi-borderWidth-br-tablet,0px) var(--1ng8bi-borderWidth-bl-tablet,0px); border-radius: var(--1ng8bi-borderRadius-tl-tablet,0px) var(--1ng8bi-borderRadius-tr-tablet,0px) var(--1ng8bi-borderRadius-br-tablet,0px) var(--1ng8bi-borderRadius-bl-tablet,0px); } @media(max-width: 767px){ border-width: var(--1ng8bi-borderWidth-tl-mobile,0px) var(--1ng8bi-borderWidth-tr-mobile,0px) var(--1ng8bi-borderWidth-br-mobile,0px) var(--1ng8bi-borderWidth-bl-mobile,0px); border-radius: var(--1ng8bi-borderRadius-tl-mobile,0px) var(--1ng8bi-borderRadius-tr-mobile,0px) var(--1ng8bi-borderRadius-br-mobile,0px) var(--1ng8bi-borderRadius-bl-mobile,0px); } svg{ width:20px; height:20px; } .beae-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] { .beae-accordion-summary { color: var(--1ng8bi-colorActive); background: var(--1ng8bi-tabBgActive); } .beae-accordion-content { opacity: 1; } .beae-accordion-icon { .beae-svg-plus{ .stroke-vertical{ transform: rotate(270deg); } } .beae-icon-chevron{ transform: rotate(180deg); } .beae-icon-arrow{ transform: rotate(90deg); } } } } .beae-accordion-title{ flex: auto; cursor: pointer; } .beae-accordion-summary { display: flex; flex-direction: var(--beae-icon-dir); justify-content: space-between; align-items: center; padding-inline: var(--1ng8bi-paddingX, 20px); padding-block: var(--1ng8bi-paddingY, 20px); cursor: pointer; list-style: none; user-select: none; transition: background 0.2s; gap: 10px; background: var(--1ng8bi-tabBg); &:marker { display: none; } &:hover { background: var(--1ng8bi-tabBgHover); color: var(--1ng8bi-colorHover); } @media(min-width: 767.79px) and (max-width: 1180px) { padding-inline: var(--1ng8bi-paddingX-tablet, 20px); padding-block: var(--1ng8bi-paddingY-tablet, 20px); } @media(max-width: 767px) { padding-inline: var(--1ng8bi-paddingX-mobile, 20px); padding-block: var(--1ng8bi-paddingY-mobile, 20px); } } .beae-accordion-icon { display: flex; align-items: center; justify-content: center; transition: transform 0.3s ease; } .beae-accordion-content { opacity: 0; animation: beaeSlideDown 0.3s ease-out; } .beae-icon-plus::before { content: "+"; font-size: 1.2em; } } } @keyframes beaeSlideDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }[data-bnode="beae-4crvqg"] { --4crvqg-direction: column; --4crvqg-direction-tablet: column; --4crvqg-direction-mobile: column; --4crvqg-gap: 16px; --4crvqg-gap-tablet: 16px; --4crvqg-gap-mobile: 16px; --4crvqg-padding-top: 0px; --4crvqg-padding-top-tablet: 0px; --4crvqg-padding-top-mobile: 0px; --4crvqg-padding-bottom: 16px; --4crvqg-padding-bottom-tablet: 16px; --4crvqg-padding-bottom-mobile: 16px; --4crvqg-padding-left: 20px; --4crvqg-padding-left-tablet: 20px; --4crvqg-padding-left-mobile: 20px; --4crvqg-padding-right: 20px; --4crvqg-padding-right-tablet: 20px; --4crvqg-padding-right-mobile: 20px; --4crvqg-background-0: c; --4crvqg-background-0-tablet: c; --4crvqg-background-0-mobile: c; --4crvqg-background-1: o; --4crvqg-background-1-tablet: o; --4crvqg-background-1-mobile: o; --4crvqg-background-2: l; --4crvqg-background-2-tablet: l; --4crvqg-background-2-mobile: l; --4crvqg-background-3: o; --4crvqg-background-3-tablet: o; --4crvqg-background-3-mobile: o; --4crvqg-background-4: r; --4crvqg-background-4-tablet: r; --4crvqg-background-4-mobile: r; --4crvqg-background-type: color; --4crvqg-background-type-tablet: color; --4crvqg-background-type-mobile: color; --4crvqg-background-color: var(--beae-background-color); --4crvqg-background-color-tablet: var(--beae-background-color); --4crvqg-background-color-mobile: var(--beae-background-color); --4crvqg-cardStyle: none; --4crvqg-cardStyle-tablet: none; --4crvqg-cardStyle-mobile: none; --4crvqg-surface: light; --4crvqg-surface-tablet: light; --4crvqg-surface-mobile: light; }[data-bnode="beae-4crvqg"] { padding-top: var(--4crvqg-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--4crvqg-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--4crvqg-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--4crvqg-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--4crvqg-padding-top-tablet, var(--4crvqg-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--4crvqg-padding-right-tablet, var(--4crvqg-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--4crvqg-padding-bottom-tablet, var(--4crvqg-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--4crvqg-padding-left-tablet, var(--4crvqg-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--4crvqg-padding-top-mobile, var(--4crvqg-padding-top-tablet, var(--4crvqg-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--4crvqg-padding-right-mobile, var(--4crvqg-padding-right-tablet, var(--4crvqg-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--4crvqg-padding-bottom-mobile, var(--4crvqg-padding-bottom-tablet, var(--4crvqg-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--4crvqg-padding-left-mobile, var(--4crvqg-padding-left-tablet, var(--4crvqg-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--4crvqg-position, relative); top: var(--4crvqg-top, auto); right: var(--4crvqg-right, auto); bottom: var(--4crvqg-bottom, auto); left: var(--4crvqg-left, auto); transform: var(--4crvqg-transform, none); z-index: var(--4crvqg-z-index, 10); aspect-ratio: var(--4crvqg-background-imageRatio, auto); background: var(--4crvqg-background-color,transparent); border-style: var(--4crvqg-borderStyle,solid); border-color: var(--4crvqg-borderColor,#000000); border-width: var(--4crvqg-borderWidth-tl,0px) var(--4crvqg-borderWidth-tr,0px) var(--4crvqg-borderWidth-br,0px) var(--4crvqg-borderWidth-bl,0px); border-radius: var(--4crvqg-borderRadius-tl,0px) var(--4crvqg-borderRadius-tr,0px) var(--4crvqg-borderRadius-br,0px) var(--4crvqg-borderRadius-bl,0px); box-shadow: var(--4crvqg-shadowHorizontal, 0px) var(--4crvqg-shadowVertical, 0px) var(--4crvqg-shadowBlur, 0px) 1px color-mix( in srgb, var(--4crvqg-shadowColor, #000000) var(--4crvqg-shadowTransparent, 0%), transparent ); max-width: var(--4crvqg-max-width, 100%); width: 100%; height: if(style(--4crvqg-position: absolute): var(--4crvqg-height,100%); else: unset ); backdrop-filter:blur(var(--4crvqg-background-blur, none)) saturate(var(--4crvqg-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--4crvqg-position-tablet, var(--4crvqg-position, relative)); top: var(--4crvqg-top-tablet, var(--4crvqg-top, auto)); right: var(--4crvqg-right-tablet, var(--4crvqg-right, auto)); bottom: var(--4crvqg-bottom-tablet, var(--4crvqg-bottom, auto)); left: var(--4crvqg-left-tablet, var(--4crvqg-left, auto)); transform: var(--4crvqg-transform-tablet, var(--4crvqg-transform, none)); z-index: var(--4crvqg-z-index-tablet, var(--4crvqg-z-index, 10)); aspect-ratio: var(--4crvqg-background-imageRatio-tablet, var(--4crvqg-background-imageRatio, auto)); border-width: var(--4crvqg-borderWidth-tl-tablet, var(--4crvqg-borderWidth-tl,0px)) var(--4crvqg-borderWidth-tr-tablet,var(--4crvqg-borderWidth-tr,0px)) var(--4crvqg-borderWidth-br-tablet,var(--4crvqg-borderWidth-br,0px)) var(--4crvqg-borderWidth-bl-tablet,var(--4crvqg-borderWidth-bl,0px)); border-radius: var(--4crvqg-borderRadius-tl-tablet,var(--4crvqg-borderRadius-tl,0px)) var(--4crvqg-borderRadius-tr-tablet,var(--4crvqg-borderRadius-tr,0px)) var(--4crvqg-borderRadius-br-tablet,var(--4crvqg-borderRadius-br,0px)) var(--4crvqg-borderRadius-bl-tablet,var(--4crvqg-borderRadius-bl,0px)); max-width: var(--4crvqg-max-width-tablet, var(--4crvqg-max-width, 100%)); height: if(style(--4crvqg-position-tablet: absolute): var(--4crvqg-height-tablet,var(--4crvqg-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--4crvqg-position-mobile, var(--4crvqg-position-tablet, var(--4crvqg-position, relative))); top: var(--4crvqg-top-mobile, var(--4crvqg-top-tablet, var(--4crvqg-top, auto))); right: var(--4crvqg-right-mobile, var(--4crvqg-right-tablet, var(--4crvqg-right, auto))); bottom: var(--4crvqg-bottom-mobile, var(--4crvqg-bottom-tablet, var(--4crvqg-bottom, auto))); left: var(--4crvqg-left-mobile, var(--4crvqg-left-tablet, var(--4crvqg-left, auto))); transform: var(--4crvqg-transform-mobile, var(--4crvqg-transform-tablet, var(--4crvqg-transform, none))); z-index: var(--4crvqg-z-index-mobile, var(--4crvqg-z-index-tablet, var(--4crvqg-z-index, 10))); aspect-ratio: var(--4crvqg-background-imageRatio-mobile, var(--4crvqg-background-imageRatio, auto)); border-width: var(--4crvqg-borderWidth-tl-mobile, var(--4crvqg-borderWidth-tl,0px)) var(--4crvqg-borderWidth-tr-mobile,var(--4crvqg-borderWidth-tr,0px)) var(--4crvqg-borderWidth-br-mobile,var(--4crvqg-borderWidth-br,0px)) var(--4crvqg-borderWidth-bl-mobile,var(--4crvqg-borderWidth-bl,0px)); border-radius: var(--4crvqg-borderRadius-tl-mobile,var(--4crvqg-borderRadius-tl,0px)) var(--4crvqg-borderRadius-tr-mobile,var(--4crvqg-borderRadius-tr,0px)) var(--4crvqg-borderRadius-br-mobile,var(--4crvqg-borderRadius-br,0px)) var(--4crvqg-borderRadius-bl-mobile,var(--4crvqg-borderRadius-bl,0px)); max-width: var(--4crvqg-max-width-mobile, var(--4crvqg-max-width, 100%)); height: if(style(--4crvqg-position-mobile: absolute): var(--4crvqg-height-mobile,var(--4crvqg-height-tablet,,var(--4crvqg-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--4crvqg-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--4crvqg-gap,var(--beae-card-gap)); padding-top: var(--4crvqg-padding-top,var(--beae-card-padding)); padding-right: var(--4crvqg-padding-right,var(--beae-card-padding)); padding-bottom: var(--4crvqg-padding-bottom,var(--beae-card-padding)); padding-left: var(--4crvqg-padding-left,var(--beae-card-padding)); border-width: var(--4crvqg-borderWidth-tl,var(--beae-card-border-width)) var(--4crvqg-borderWidth-tr,var(--beae-card-border-width)) var(--4crvqg-borderWidth-br,var(--beae-card-border-width)) var(--4crvqg-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--4crvqg-borderRadius-tl,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-tr,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-br,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--4crvqg-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--4crvqg-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--4crvqg-gap-tablet,var(--beae-card-gap)); padding-top: var(--4crvqg-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--4crvqg-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--4crvqg-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--4crvqg-padding-left-tablet,var(--beae-card-padding)); border-width: var(--4crvqg-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--4crvqg-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--4crvqg-borderWidth-br-desktop,var(--beae-card-border-width)) var(--4crvqg-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--4crvqg-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--4crvqg-gap-mobile,var(--beae-card-gap)); padding-top: var(--4crvqg-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--4crvqg-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--4crvqg-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--4crvqg-padding-left-mobile,var(--beae-card-padding)); border-width: var(--4crvqg-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--4crvqg-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--4crvqg-borderWidth-br-mobile,var(--beae-card-border-width)) var(--4crvqg-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--4crvqg-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--4crvqg-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--4crvqg-background-color,var(--beae-card-featured-background)); border-color: var(--4crvqg-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--4crvqg-shadowHorizontal, var(--beae-card-shadow-x)) var(--4crvqg-shadowVertical, var(--beae-card-shadow-y)) var(--4crvqg-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--4crvqg-shadowColor, var(--beae-card-featured-shadow-color)) var(--4crvqg-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--4crvqg-background-color,var(--beae-card-prod-background)); border-color: var(--4crvqg-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--4crvqg-shadowHorizontal, var(--beae-card-shadow-x)) var(--4crvqg-shadowVertical, var(--beae-card-shadow-y)) var(--4crvqg-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--4crvqg-shadowColor, var(--beae-card-prod-shadow-color)) var(--4crvqg-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--4crvqg-background-color,var(--beae-card-pricing-background)); border-color: var(--4crvqg-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--4crvqg-shadowHorizontal, var(--beae-card-shadow-x)) var(--4crvqg-shadowVertical, var(--beae-card-shadow-y)) var(--4crvqg-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--4crvqg-shadowColor, var(--beae-card-pricing-shadow-color)) var(--4crvqg-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--4crvqg-background-color,var(--beae-card-cta-background)); border-color: var(--4crvqg-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--4crvqg-shadowHorizontal, var(--beae-card-shadow-x)) var(--4crvqg-shadowVertical, var(--beae-card-shadow-y)) var(--4crvqg-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--4crvqg-shadowColor, var(--beae-card-cta-shadow-color)) var(--4crvqg-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-4crvqg"] {     display: flex;     flex-direction: var(--4crvqg-direction, column);     flex-wrap: nowrap;     justify-content: var(--4crvqg-justify-content);     align-items: var(--4crvqg-align-items);     gap: var(--4crvqg-gap, var(--4crvqg-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-4crvqg"] {                            gap: var(--4crvqg-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--4crvqg-padding-right-tablet, 0px) - var(--4crvqg-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-4crvqg"] {                            gap: var(--4crvqg-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--4crvqg-padding-right-mobile, 0px) - var(--4crvqg-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-zqk4m8"] { margin-top: var(--zqk4m8-margin-top, 0px); margin-right: var(--zqk4m8-margin-right, 0px); margin-bottom: var(--zqk4m8-margin-bottom, 0px); margin-left: var(--zqk4m8-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--zqk4m8-margin-top-tablet, 0px); margin-right: var(--zqk4m8-margin-right-tablet, 0px); margin-bottom: var(--zqk4m8-margin-bottom-tablet, 0px); margin-left: var(--zqk4m8-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--zqk4m8-margin-top-mobile, 0px); margin-right: var(--zqk4m8-margin-right-mobile, 0px); margin-bottom: var(--zqk4m8-margin-bottom-mobile, 0px); margin-left: var(--zqk4m8-margin-left-mobile, 0px); } }[data-bnode="beae-gru8cd"] { --gru8cd-direction: column; --gru8cd-direction-tablet: column; --gru8cd-direction-mobile: column; --gru8cd-gap: 16px; --gru8cd-gap-tablet: 16px; --gru8cd-gap-mobile: 16px; --gru8cd-padding-top: 12px; --gru8cd-padding-top-tablet: 12px; --gru8cd-padding-top-mobile: 12px; --gru8cd-padding-bottom: 12px; --gru8cd-padding-bottom-tablet: 12px; --gru8cd-padding-bottom-mobile: 12px; --gru8cd-padding-left: 20px; --gru8cd-padding-left-tablet: 20px; --gru8cd-padding-left-mobile: 20px; --gru8cd-padding-right: 20px; --gru8cd-padding-right-tablet: 20px; --gru8cd-padding-right-mobile: 20px; --gru8cd-background-0: c; --gru8cd-background-0-tablet: c; --gru8cd-background-0-mobile: c; --gru8cd-background-1: o; --gru8cd-background-1-tablet: o; --gru8cd-background-1-mobile: o; --gru8cd-background-2: l; --gru8cd-background-2-tablet: l; --gru8cd-background-2-mobile: l; --gru8cd-background-3: o; --gru8cd-background-3-tablet: o; --gru8cd-background-3-mobile: o; --gru8cd-background-4: r; --gru8cd-background-4-tablet: r; --gru8cd-background-4-mobile: r; --gru8cd-background-type: color; --gru8cd-background-type-tablet: color; --gru8cd-background-type-mobile: color; --gru8cd-background-color: var(--beae-background-color); --gru8cd-background-color-tablet: var(--beae-background-color); --gru8cd-background-color-mobile: var(--beae-background-color); --gru8cd-surface: light; --gru8cd-surface-tablet: light; --gru8cd-surface-mobile: light; }[data-bnode="beae-gru8cd"] { padding-top: var(--gru8cd-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--gru8cd-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--gru8cd-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--gru8cd-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--gru8cd-padding-top-tablet, var(--gru8cd-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--gru8cd-padding-right-tablet, var(--gru8cd-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--gru8cd-padding-bottom-tablet, var(--gru8cd-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--gru8cd-padding-left-tablet, var(--gru8cd-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--gru8cd-padding-top-mobile, var(--gru8cd-padding-top-tablet, var(--gru8cd-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--gru8cd-padding-right-mobile, var(--gru8cd-padding-right-tablet, var(--gru8cd-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--gru8cd-padding-bottom-mobile, var(--gru8cd-padding-bottom-tablet, var(--gru8cd-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--gru8cd-padding-left-mobile, var(--gru8cd-padding-left-tablet, var(--gru8cd-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--gru8cd-position, relative); top: var(--gru8cd-top, auto); right: var(--gru8cd-right, auto); bottom: var(--gru8cd-bottom, auto); left: var(--gru8cd-left, auto); transform: var(--gru8cd-transform, none); z-index: var(--gru8cd-z-index, 10); aspect-ratio: var(--gru8cd-background-imageRatio, auto); background: var(--gru8cd-background-color,transparent); border-style: var(--gru8cd-borderStyle,solid); border-color: var(--gru8cd-borderColor,#000000); border-width: var(--gru8cd-borderWidth-tl,0px) var(--gru8cd-borderWidth-tr,0px) var(--gru8cd-borderWidth-br,0px) var(--gru8cd-borderWidth-bl,0px); border-radius: var(--gru8cd-borderRadius-tl,0px) var(--gru8cd-borderRadius-tr,0px) var(--gru8cd-borderRadius-br,0px) var(--gru8cd-borderRadius-bl,0px); box-shadow: var(--gru8cd-shadowHorizontal, 0px) var(--gru8cd-shadowVertical, 0px) var(--gru8cd-shadowBlur, 0px) 1px color-mix( in srgb, var(--gru8cd-shadowColor, #000000) var(--gru8cd-shadowTransparent, 0%), transparent ); max-width: var(--gru8cd-max-width, 100%); width: 100%; height: if(style(--gru8cd-position: absolute): var(--gru8cd-height,100%); else: unset ); backdrop-filter:blur(var(--gru8cd-background-blur, none)) saturate(var(--gru8cd-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--gru8cd-position-tablet, var(--gru8cd-position, relative)); top: var(--gru8cd-top-tablet, var(--gru8cd-top, auto)); right: var(--gru8cd-right-tablet, var(--gru8cd-right, auto)); bottom: var(--gru8cd-bottom-tablet, var(--gru8cd-bottom, auto)); left: var(--gru8cd-left-tablet, var(--gru8cd-left, auto)); transform: var(--gru8cd-transform-tablet, var(--gru8cd-transform, none)); z-index: var(--gru8cd-z-index-tablet, var(--gru8cd-z-index, 10)); aspect-ratio: var(--gru8cd-background-imageRatio-tablet, var(--gru8cd-background-imageRatio, auto)); border-width: var(--gru8cd-borderWidth-tl-tablet, var(--gru8cd-borderWidth-tl,0px)) var(--gru8cd-borderWidth-tr-tablet,var(--gru8cd-borderWidth-tr,0px)) var(--gru8cd-borderWidth-br-tablet,var(--gru8cd-borderWidth-br,0px)) var(--gru8cd-borderWidth-bl-tablet,var(--gru8cd-borderWidth-bl,0px)); border-radius: var(--gru8cd-borderRadius-tl-tablet,var(--gru8cd-borderRadius-tl,0px)) var(--gru8cd-borderRadius-tr-tablet,var(--gru8cd-borderRadius-tr,0px)) var(--gru8cd-borderRadius-br-tablet,var(--gru8cd-borderRadius-br,0px)) var(--gru8cd-borderRadius-bl-tablet,var(--gru8cd-borderRadius-bl,0px)); max-width: var(--gru8cd-max-width-tablet, var(--gru8cd-max-width, 100%)); height: if(style(--gru8cd-position-tablet: absolute): var(--gru8cd-height-tablet,var(--gru8cd-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--gru8cd-position-mobile, var(--gru8cd-position-tablet, var(--gru8cd-position, relative))); top: var(--gru8cd-top-mobile, var(--gru8cd-top-tablet, var(--gru8cd-top, auto))); right: var(--gru8cd-right-mobile, var(--gru8cd-right-tablet, var(--gru8cd-right, auto))); bottom: var(--gru8cd-bottom-mobile, var(--gru8cd-bottom-tablet, var(--gru8cd-bottom, auto))); left: var(--gru8cd-left-mobile, var(--gru8cd-left-tablet, var(--gru8cd-left, auto))); transform: var(--gru8cd-transform-mobile, var(--gru8cd-transform-tablet, var(--gru8cd-transform, none))); z-index: var(--gru8cd-z-index-mobile, var(--gru8cd-z-index-tablet, var(--gru8cd-z-index, 10))); aspect-ratio: var(--gru8cd-background-imageRatio-mobile, var(--gru8cd-background-imageRatio, auto)); border-width: var(--gru8cd-borderWidth-tl-mobile, var(--gru8cd-borderWidth-tl,0px)) var(--gru8cd-borderWidth-tr-mobile,var(--gru8cd-borderWidth-tr,0px)) var(--gru8cd-borderWidth-br-mobile,var(--gru8cd-borderWidth-br,0px)) var(--gru8cd-borderWidth-bl-mobile,var(--gru8cd-borderWidth-bl,0px)); border-radius: var(--gru8cd-borderRadius-tl-mobile,var(--gru8cd-borderRadius-tl,0px)) var(--gru8cd-borderRadius-tr-mobile,var(--gru8cd-borderRadius-tr,0px)) var(--gru8cd-borderRadius-br-mobile,var(--gru8cd-borderRadius-br,0px)) var(--gru8cd-borderRadius-bl-mobile,var(--gru8cd-borderRadius-bl,0px)); max-width: var(--gru8cd-max-width-mobile, var(--gru8cd-max-width, 100%)); height: if(style(--gru8cd-position-mobile: absolute): var(--gru8cd-height-mobile,var(--gru8cd-height-tablet,,var(--gru8cd-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--gru8cd-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--gru8cd-gap,var(--beae-card-gap)); padding-top: var(--gru8cd-padding-top,var(--beae-card-padding)); padding-right: var(--gru8cd-padding-right,var(--beae-card-padding)); padding-bottom: var(--gru8cd-padding-bottom,var(--beae-card-padding)); padding-left: var(--gru8cd-padding-left,var(--beae-card-padding)); border-width: var(--gru8cd-borderWidth-tl,var(--beae-card-border-width)) var(--gru8cd-borderWidth-tr,var(--beae-card-border-width)) var(--gru8cd-borderWidth-br,var(--beae-card-border-width)) var(--gru8cd-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--gru8cd-borderRadius-tl,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-tr,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-br,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--gru8cd-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--gru8cd-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--gru8cd-gap-tablet,var(--beae-card-gap)); padding-top: var(--gru8cd-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--gru8cd-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--gru8cd-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--gru8cd-padding-left-tablet,var(--beae-card-padding)); border-width: var(--gru8cd-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--gru8cd-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--gru8cd-borderWidth-br-desktop,var(--beae-card-border-width)) var(--gru8cd-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--gru8cd-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--gru8cd-gap-mobile,var(--beae-card-gap)); padding-top: var(--gru8cd-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--gru8cd-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--gru8cd-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--gru8cd-padding-left-mobile,var(--beae-card-padding)); border-width: var(--gru8cd-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--gru8cd-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--gru8cd-borderWidth-br-mobile,var(--beae-card-border-width)) var(--gru8cd-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--gru8cd-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--gru8cd-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--gru8cd-background-color,var(--beae-card-featured-background)); border-color: var(--gru8cd-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--gru8cd-shadowHorizontal, var(--beae-card-shadow-x)) var(--gru8cd-shadowVertical, var(--beae-card-shadow-y)) var(--gru8cd-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--gru8cd-shadowColor, var(--beae-card-featured-shadow-color)) var(--gru8cd-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--gru8cd-background-color,var(--beae-card-prod-background)); border-color: var(--gru8cd-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--gru8cd-shadowHorizontal, var(--beae-card-shadow-x)) var(--gru8cd-shadowVertical, var(--beae-card-shadow-y)) var(--gru8cd-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--gru8cd-shadowColor, var(--beae-card-prod-shadow-color)) var(--gru8cd-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--gru8cd-background-color,var(--beae-card-pricing-background)); border-color: var(--gru8cd-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--gru8cd-shadowHorizontal, var(--beae-card-shadow-x)) var(--gru8cd-shadowVertical, var(--beae-card-shadow-y)) var(--gru8cd-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--gru8cd-shadowColor, var(--beae-card-pricing-shadow-color)) var(--gru8cd-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--gru8cd-background-color,var(--beae-card-cta-background)); border-color: var(--gru8cd-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--gru8cd-shadowHorizontal, var(--beae-card-shadow-x)) var(--gru8cd-shadowVertical, var(--beae-card-shadow-y)) var(--gru8cd-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--gru8cd-shadowColor, var(--beae-card-cta-shadow-color)) var(--gru8cd-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-gru8cd"] {     display: flex;     flex-direction: var(--gru8cd-direction, column);     flex-wrap: nowrap;     justify-content: var(--gru8cd-justify-content);     align-items: var(--gru8cd-align-items);     gap: var(--gru8cd-gap, var(--gru8cd-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-gru8cd"] {                            gap: var(--gru8cd-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--gru8cd-padding-right-tablet, 0px) - var(--gru8cd-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-gru8cd"] {                            gap: var(--gru8cd-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--gru8cd-padding-right-mobile, 0px) - var(--gru8cd-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-2gy8wi"] { margin-top: var(--2gy8wi-margin-top, 0px); margin-right: var(--2gy8wi-margin-right, 0px); margin-bottom: var(--2gy8wi-margin-bottom, 0px); margin-left: var(--2gy8wi-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--2gy8wi-margin-top-tablet, 0px); margin-right: var(--2gy8wi-margin-right-tablet, 0px); margin-bottom: var(--2gy8wi-margin-bottom-tablet, 0px); margin-left: var(--2gy8wi-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--2gy8wi-margin-top-mobile, 0px); margin-right: var(--2gy8wi-margin-right-mobile, 0px); margin-bottom: var(--2gy8wi-margin-bottom-mobile, 0px); margin-left: var(--2gy8wi-margin-left-mobile, 0px); } }[data-bnode="beae-qaccbk"] { --qaccbk-direction: column; --qaccbk-direction-tablet: column; --qaccbk-direction-mobile: column; --qaccbk-gap: 16px; --qaccbk-gap-tablet: 16px; --qaccbk-gap-mobile: 16px; --qaccbk-padding-top: 12px; --qaccbk-padding-top-tablet: 12px; --qaccbk-padding-top-mobile: 12px; --qaccbk-padding-right: 20px; --qaccbk-padding-right-tablet: 20px; --qaccbk-padding-right-mobile: 20px; --qaccbk-padding-bottom: 12px; --qaccbk-padding-bottom-tablet: 12px; --qaccbk-padding-bottom-mobile: 12px; --qaccbk-padding-left: 20px; --qaccbk-padding-left-tablet: 20px; --qaccbk-padding-left-mobile: 20px; --qaccbk-background-0: c; --qaccbk-background-0-tablet: c; --qaccbk-background-0-mobile: c; --qaccbk-background-1: o; --qaccbk-background-1-tablet: o; --qaccbk-background-1-mobile: o; --qaccbk-background-2: l; --qaccbk-background-2-tablet: l; --qaccbk-background-2-mobile: l; --qaccbk-background-3: o; --qaccbk-background-3-tablet: o; --qaccbk-background-3-mobile: o; --qaccbk-background-4: r; --qaccbk-background-4-tablet: r; --qaccbk-background-4-mobile: r; --qaccbk-background-type: color; --qaccbk-background-type-tablet: color; --qaccbk-background-type-mobile: color; --qaccbk-background-color: var(--beae-background-color); --qaccbk-background-color-tablet: var(--beae-background-color); --qaccbk-background-color-mobile: var(--beae-background-color); --qaccbk-surface: light; --qaccbk-surface-tablet: light; --qaccbk-surface-mobile: light; }[data-bnode="beae-qaccbk"] { padding-top: var(--qaccbk-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--qaccbk-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--qaccbk-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--qaccbk-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--qaccbk-padding-top-tablet, var(--qaccbk-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--qaccbk-padding-right-tablet, var(--qaccbk-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--qaccbk-padding-bottom-tablet, var(--qaccbk-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--qaccbk-padding-left-tablet, var(--qaccbk-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--qaccbk-padding-top-mobile, var(--qaccbk-padding-top-tablet, var(--qaccbk-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--qaccbk-padding-right-mobile, var(--qaccbk-padding-right-tablet, var(--qaccbk-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--qaccbk-padding-bottom-mobile, var(--qaccbk-padding-bottom-tablet, var(--qaccbk-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--qaccbk-padding-left-mobile, var(--qaccbk-padding-left-tablet, var(--qaccbk-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--qaccbk-position, relative); top: var(--qaccbk-top, auto); right: var(--qaccbk-right, auto); bottom: var(--qaccbk-bottom, auto); left: var(--qaccbk-left, auto); transform: var(--qaccbk-transform, none); z-index: var(--qaccbk-z-index, 10); aspect-ratio: var(--qaccbk-background-imageRatio, auto); background: var(--qaccbk-background-color,transparent); border-style: var(--qaccbk-borderStyle,solid); border-color: var(--qaccbk-borderColor,#000000); border-width: var(--qaccbk-borderWidth-tl,0px) var(--qaccbk-borderWidth-tr,0px) var(--qaccbk-borderWidth-br,0px) var(--qaccbk-borderWidth-bl,0px); border-radius: var(--qaccbk-borderRadius-tl,0px) var(--qaccbk-borderRadius-tr,0px) var(--qaccbk-borderRadius-br,0px) var(--qaccbk-borderRadius-bl,0px); box-shadow: var(--qaccbk-shadowHorizontal, 0px) var(--qaccbk-shadowVertical, 0px) var(--qaccbk-shadowBlur, 0px) 1px color-mix( in srgb, var(--qaccbk-shadowColor, #000000) var(--qaccbk-shadowTransparent, 0%), transparent ); max-width: var(--qaccbk-max-width, 100%); width: 100%; height: if(style(--qaccbk-position: absolute): var(--qaccbk-height,100%); else: unset ); backdrop-filter:blur(var(--qaccbk-background-blur, none)) saturate(var(--qaccbk-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--qaccbk-position-tablet, var(--qaccbk-position, relative)); top: var(--qaccbk-top-tablet, var(--qaccbk-top, auto)); right: var(--qaccbk-right-tablet, var(--qaccbk-right, auto)); bottom: var(--qaccbk-bottom-tablet, var(--qaccbk-bottom, auto)); left: var(--qaccbk-left-tablet, var(--qaccbk-left, auto)); transform: var(--qaccbk-transform-tablet, var(--qaccbk-transform, none)); z-index: var(--qaccbk-z-index-tablet, var(--qaccbk-z-index, 10)); aspect-ratio: var(--qaccbk-background-imageRatio-tablet, var(--qaccbk-background-imageRatio, auto)); border-width: var(--qaccbk-borderWidth-tl-tablet, var(--qaccbk-borderWidth-tl,0px)) var(--qaccbk-borderWidth-tr-tablet,var(--qaccbk-borderWidth-tr,0px)) var(--qaccbk-borderWidth-br-tablet,var(--qaccbk-borderWidth-br,0px)) var(--qaccbk-borderWidth-bl-tablet,var(--qaccbk-borderWidth-bl,0px)); border-radius: var(--qaccbk-borderRadius-tl-tablet,var(--qaccbk-borderRadius-tl,0px)) var(--qaccbk-borderRadius-tr-tablet,var(--qaccbk-borderRadius-tr,0px)) var(--qaccbk-borderRadius-br-tablet,var(--qaccbk-borderRadius-br,0px)) var(--qaccbk-borderRadius-bl-tablet,var(--qaccbk-borderRadius-bl,0px)); max-width: var(--qaccbk-max-width-tablet, var(--qaccbk-max-width, 100%)); height: if(style(--qaccbk-position-tablet: absolute): var(--qaccbk-height-tablet,var(--qaccbk-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--qaccbk-position-mobile, var(--qaccbk-position-tablet, var(--qaccbk-position, relative))); top: var(--qaccbk-top-mobile, var(--qaccbk-top-tablet, var(--qaccbk-top, auto))); right: var(--qaccbk-right-mobile, var(--qaccbk-right-tablet, var(--qaccbk-right, auto))); bottom: var(--qaccbk-bottom-mobile, var(--qaccbk-bottom-tablet, var(--qaccbk-bottom, auto))); left: var(--qaccbk-left-mobile, var(--qaccbk-left-tablet, var(--qaccbk-left, auto))); transform: var(--qaccbk-transform-mobile, var(--qaccbk-transform-tablet, var(--qaccbk-transform, none))); z-index: var(--qaccbk-z-index-mobile, var(--qaccbk-z-index-tablet, var(--qaccbk-z-index, 10))); aspect-ratio: var(--qaccbk-background-imageRatio-mobile, var(--qaccbk-background-imageRatio, auto)); border-width: var(--qaccbk-borderWidth-tl-mobile, var(--qaccbk-borderWidth-tl,0px)) var(--qaccbk-borderWidth-tr-mobile,var(--qaccbk-borderWidth-tr,0px)) var(--qaccbk-borderWidth-br-mobile,var(--qaccbk-borderWidth-br,0px)) var(--qaccbk-borderWidth-bl-mobile,var(--qaccbk-borderWidth-bl,0px)); border-radius: var(--qaccbk-borderRadius-tl-mobile,var(--qaccbk-borderRadius-tl,0px)) var(--qaccbk-borderRadius-tr-mobile,var(--qaccbk-borderRadius-tr,0px)) var(--qaccbk-borderRadius-br-mobile,var(--qaccbk-borderRadius-br,0px)) var(--qaccbk-borderRadius-bl-mobile,var(--qaccbk-borderRadius-bl,0px)); max-width: var(--qaccbk-max-width-mobile, var(--qaccbk-max-width, 100%)); height: if(style(--qaccbk-position-mobile: absolute): var(--qaccbk-height-mobile,var(--qaccbk-height-tablet,,var(--qaccbk-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--qaccbk-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--qaccbk-gap,var(--beae-card-gap)); padding-top: var(--qaccbk-padding-top,var(--beae-card-padding)); padding-right: var(--qaccbk-padding-right,var(--beae-card-padding)); padding-bottom: var(--qaccbk-padding-bottom,var(--beae-card-padding)); padding-left: var(--qaccbk-padding-left,var(--beae-card-padding)); border-width: var(--qaccbk-borderWidth-tl,var(--beae-card-border-width)) var(--qaccbk-borderWidth-tr,var(--beae-card-border-width)) var(--qaccbk-borderWidth-br,var(--beae-card-border-width)) var(--qaccbk-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--qaccbk-borderRadius-tl,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-tr,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-br,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--qaccbk-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--qaccbk-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--qaccbk-gap-tablet,var(--beae-card-gap)); padding-top: var(--qaccbk-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--qaccbk-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--qaccbk-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--qaccbk-padding-left-tablet,var(--beae-card-padding)); border-width: var(--qaccbk-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--qaccbk-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--qaccbk-borderWidth-br-desktop,var(--beae-card-border-width)) var(--qaccbk-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--qaccbk-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--qaccbk-gap-mobile,var(--beae-card-gap)); padding-top: var(--qaccbk-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--qaccbk-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--qaccbk-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--qaccbk-padding-left-mobile,var(--beae-card-padding)); border-width: var(--qaccbk-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--qaccbk-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--qaccbk-borderWidth-br-mobile,var(--beae-card-border-width)) var(--qaccbk-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--qaccbk-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--qaccbk-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--qaccbk-background-color,var(--beae-card-featured-background)); border-color: var(--qaccbk-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--qaccbk-shadowHorizontal, var(--beae-card-shadow-x)) var(--qaccbk-shadowVertical, var(--beae-card-shadow-y)) var(--qaccbk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--qaccbk-shadowColor, var(--beae-card-featured-shadow-color)) var(--qaccbk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--qaccbk-background-color,var(--beae-card-prod-background)); border-color: var(--qaccbk-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--qaccbk-shadowHorizontal, var(--beae-card-shadow-x)) var(--qaccbk-shadowVertical, var(--beae-card-shadow-y)) var(--qaccbk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--qaccbk-shadowColor, var(--beae-card-prod-shadow-color)) var(--qaccbk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--qaccbk-background-color,var(--beae-card-pricing-background)); border-color: var(--qaccbk-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--qaccbk-shadowHorizontal, var(--beae-card-shadow-x)) var(--qaccbk-shadowVertical, var(--beae-card-shadow-y)) var(--qaccbk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--qaccbk-shadowColor, var(--beae-card-pricing-shadow-color)) var(--qaccbk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--qaccbk-background-color,var(--beae-card-cta-background)); border-color: var(--qaccbk-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--qaccbk-shadowHorizontal, var(--beae-card-shadow-x)) var(--qaccbk-shadowVertical, var(--beae-card-shadow-y)) var(--qaccbk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--qaccbk-shadowColor, var(--beae-card-cta-shadow-color)) var(--qaccbk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-qaccbk"] {     display: flex;     flex-direction: var(--qaccbk-direction, column);     flex-wrap: nowrap;     justify-content: var(--qaccbk-justify-content);     align-items: var(--qaccbk-align-items);     gap: var(--qaccbk-gap, var(--qaccbk-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-qaccbk"] {                            gap: var(--qaccbk-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--qaccbk-padding-right-tablet, 0px) - var(--qaccbk-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-qaccbk"] {                            gap: var(--qaccbk-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--qaccbk-padding-right-mobile, 0px) - var(--qaccbk-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-90y2dh"] { margin-top: var(--90y2dh-margin-top, 0px); margin-right: var(--90y2dh-margin-right, 0px); margin-bottom: var(--90y2dh-margin-bottom, 0px); margin-left: var(--90y2dh-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--90y2dh-margin-top-tablet, 0px); margin-right: var(--90y2dh-margin-right-tablet, 0px); margin-bottom: var(--90y2dh-margin-bottom-tablet, 0px); margin-left: var(--90y2dh-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--90y2dh-margin-top-mobile, 0px); margin-right: var(--90y2dh-margin-right-mobile, 0px); margin-bottom: var(--90y2dh-margin-bottom-mobile, 0px); margin-left: var(--90y2dh-margin-left-mobile, 0px); } }[data-bnode="beae-rmmo4m"] { --rmmo4m-direction: column; --rmmo4m-direction-tablet: column; --rmmo4m-direction-mobile: column; --rmmo4m-gap: 16px; --rmmo4m-gap-tablet: 16px; --rmmo4m-gap-mobile: 16px; --rmmo4m-padding-top: 12px; --rmmo4m-padding-top-tablet: 12px; --rmmo4m-padding-top-mobile: 12px; --rmmo4m-padding-right: 20px; --rmmo4m-padding-right-tablet: 20px; --rmmo4m-padding-right-mobile: 20px; --rmmo4m-padding-bottom: 12px; --rmmo4m-padding-bottom-tablet: 12px; --rmmo4m-padding-bottom-mobile: 12px; --rmmo4m-padding-left: 20px; --rmmo4m-padding-left-tablet: 20px; --rmmo4m-padding-left-mobile: 20px; --rmmo4m-background-0: c; --rmmo4m-background-0-tablet: c; --rmmo4m-background-0-mobile: c; --rmmo4m-background-1: o; --rmmo4m-background-1-tablet: o; --rmmo4m-background-1-mobile: o; --rmmo4m-background-2: l; --rmmo4m-background-2-tablet: l; --rmmo4m-background-2-mobile: l; --rmmo4m-background-3: o; --rmmo4m-background-3-tablet: o; --rmmo4m-background-3-mobile: o; --rmmo4m-background-4: r; --rmmo4m-background-4-tablet: r; --rmmo4m-background-4-mobile: r; --rmmo4m-background-type: color; --rmmo4m-background-type-tablet: color; --rmmo4m-background-type-mobile: color; --rmmo4m-background-color: var(--beae-background-color); --rmmo4m-background-color-tablet: var(--beae-background-color); --rmmo4m-background-color-mobile: var(--beae-background-color); --rmmo4m-surface: light; --rmmo4m-surface-tablet: light; --rmmo4m-surface-mobile: light; }[data-bnode="beae-rmmo4m"] { padding-top: var(--rmmo4m-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--rmmo4m-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--rmmo4m-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--rmmo4m-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--rmmo4m-padding-top-tablet, var(--rmmo4m-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--rmmo4m-padding-right-tablet, var(--rmmo4m-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--rmmo4m-padding-bottom-tablet, var(--rmmo4m-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--rmmo4m-padding-left-tablet, var(--rmmo4m-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--rmmo4m-padding-top-mobile, var(--rmmo4m-padding-top-tablet, var(--rmmo4m-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--rmmo4m-padding-right-mobile, var(--rmmo4m-padding-right-tablet, var(--rmmo4m-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--rmmo4m-padding-bottom-mobile, var(--rmmo4m-padding-bottom-tablet, var(--rmmo4m-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--rmmo4m-padding-left-mobile, var(--rmmo4m-padding-left-tablet, var(--rmmo4m-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--rmmo4m-position, relative); top: var(--rmmo4m-top, auto); right: var(--rmmo4m-right, auto); bottom: var(--rmmo4m-bottom, auto); left: var(--rmmo4m-left, auto); transform: var(--rmmo4m-transform, none); z-index: var(--rmmo4m-z-index, 10); aspect-ratio: var(--rmmo4m-background-imageRatio, auto); background: var(--rmmo4m-background-color,transparent); border-style: var(--rmmo4m-borderStyle,solid); border-color: var(--rmmo4m-borderColor,#000000); border-width: var(--rmmo4m-borderWidth-tl,0px) var(--rmmo4m-borderWidth-tr,0px) var(--rmmo4m-borderWidth-br,0px) var(--rmmo4m-borderWidth-bl,0px); border-radius: var(--rmmo4m-borderRadius-tl,0px) var(--rmmo4m-borderRadius-tr,0px) var(--rmmo4m-borderRadius-br,0px) var(--rmmo4m-borderRadius-bl,0px); box-shadow: var(--rmmo4m-shadowHorizontal, 0px) var(--rmmo4m-shadowVertical, 0px) var(--rmmo4m-shadowBlur, 0px) 1px color-mix( in srgb, var(--rmmo4m-shadowColor, #000000) var(--rmmo4m-shadowTransparent, 0%), transparent ); max-width: var(--rmmo4m-max-width, 100%); width: 100%; height: if(style(--rmmo4m-position: absolute): var(--rmmo4m-height,100%); else: unset ); backdrop-filter:blur(var(--rmmo4m-background-blur, none)) saturate(var(--rmmo4m-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--rmmo4m-position-tablet, var(--rmmo4m-position, relative)); top: var(--rmmo4m-top-tablet, var(--rmmo4m-top, auto)); right: var(--rmmo4m-right-tablet, var(--rmmo4m-right, auto)); bottom: var(--rmmo4m-bottom-tablet, var(--rmmo4m-bottom, auto)); left: var(--rmmo4m-left-tablet, var(--rmmo4m-left, auto)); transform: var(--rmmo4m-transform-tablet, var(--rmmo4m-transform, none)); z-index: var(--rmmo4m-z-index-tablet, var(--rmmo4m-z-index, 10)); aspect-ratio: var(--rmmo4m-background-imageRatio-tablet, var(--rmmo4m-background-imageRatio, auto)); border-width: var(--rmmo4m-borderWidth-tl-tablet, var(--rmmo4m-borderWidth-tl,0px)) var(--rmmo4m-borderWidth-tr-tablet,var(--rmmo4m-borderWidth-tr,0px)) var(--rmmo4m-borderWidth-br-tablet,var(--rmmo4m-borderWidth-br,0px)) var(--rmmo4m-borderWidth-bl-tablet,var(--rmmo4m-borderWidth-bl,0px)); border-radius: var(--rmmo4m-borderRadius-tl-tablet,var(--rmmo4m-borderRadius-tl,0px)) var(--rmmo4m-borderRadius-tr-tablet,var(--rmmo4m-borderRadius-tr,0px)) var(--rmmo4m-borderRadius-br-tablet,var(--rmmo4m-borderRadius-br,0px)) var(--rmmo4m-borderRadius-bl-tablet,var(--rmmo4m-borderRadius-bl,0px)); max-width: var(--rmmo4m-max-width-tablet, var(--rmmo4m-max-width, 100%)); height: if(style(--rmmo4m-position-tablet: absolute): var(--rmmo4m-height-tablet,var(--rmmo4m-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--rmmo4m-position-mobile, var(--rmmo4m-position-tablet, var(--rmmo4m-position, relative))); top: var(--rmmo4m-top-mobile, var(--rmmo4m-top-tablet, var(--rmmo4m-top, auto))); right: var(--rmmo4m-right-mobile, var(--rmmo4m-right-tablet, var(--rmmo4m-right, auto))); bottom: var(--rmmo4m-bottom-mobile, var(--rmmo4m-bottom-tablet, var(--rmmo4m-bottom, auto))); left: var(--rmmo4m-left-mobile, var(--rmmo4m-left-tablet, var(--rmmo4m-left, auto))); transform: var(--rmmo4m-transform-mobile, var(--rmmo4m-transform-tablet, var(--rmmo4m-transform, none))); z-index: var(--rmmo4m-z-index-mobile, var(--rmmo4m-z-index-tablet, var(--rmmo4m-z-index, 10))); aspect-ratio: var(--rmmo4m-background-imageRatio-mobile, var(--rmmo4m-background-imageRatio, auto)); border-width: var(--rmmo4m-borderWidth-tl-mobile, var(--rmmo4m-borderWidth-tl,0px)) var(--rmmo4m-borderWidth-tr-mobile,var(--rmmo4m-borderWidth-tr,0px)) var(--rmmo4m-borderWidth-br-mobile,var(--rmmo4m-borderWidth-br,0px)) var(--rmmo4m-borderWidth-bl-mobile,var(--rmmo4m-borderWidth-bl,0px)); border-radius: var(--rmmo4m-borderRadius-tl-mobile,var(--rmmo4m-borderRadius-tl,0px)) var(--rmmo4m-borderRadius-tr-mobile,var(--rmmo4m-borderRadius-tr,0px)) var(--rmmo4m-borderRadius-br-mobile,var(--rmmo4m-borderRadius-br,0px)) var(--rmmo4m-borderRadius-bl-mobile,var(--rmmo4m-borderRadius-bl,0px)); max-width: var(--rmmo4m-max-width-mobile, var(--rmmo4m-max-width, 100%)); height: if(style(--rmmo4m-position-mobile: absolute): var(--rmmo4m-height-mobile,var(--rmmo4m-height-tablet,,var(--rmmo4m-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--rmmo4m-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--rmmo4m-gap,var(--beae-card-gap)); padding-top: var(--rmmo4m-padding-top,var(--beae-card-padding)); padding-right: var(--rmmo4m-padding-right,var(--beae-card-padding)); padding-bottom: var(--rmmo4m-padding-bottom,var(--beae-card-padding)); padding-left: var(--rmmo4m-padding-left,var(--beae-card-padding)); border-width: var(--rmmo4m-borderWidth-tl,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-tr,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-br,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--rmmo4m-borderRadius-tl,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-tr,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-br,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--rmmo4m-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--rmmo4m-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--rmmo4m-gap-tablet,var(--beae-card-gap)); padding-top: var(--rmmo4m-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--rmmo4m-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--rmmo4m-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--rmmo4m-padding-left-tablet,var(--beae-card-padding)); border-width: var(--rmmo4m-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-br-desktop,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--rmmo4m-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--rmmo4m-gap-mobile,var(--beae-card-gap)); padding-top: var(--rmmo4m-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--rmmo4m-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--rmmo4m-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--rmmo4m-padding-left-mobile,var(--beae-card-padding)); border-width: var(--rmmo4m-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-br-mobile,var(--beae-card-border-width)) var(--rmmo4m-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--rmmo4m-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--rmmo4m-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--rmmo4m-background-color,var(--beae-card-featured-background)); border-color: var(--rmmo4m-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--rmmo4m-shadowHorizontal, var(--beae-card-shadow-x)) var(--rmmo4m-shadowVertical, var(--beae-card-shadow-y)) var(--rmmo4m-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--rmmo4m-shadowColor, var(--beae-card-featured-shadow-color)) var(--rmmo4m-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--rmmo4m-background-color,var(--beae-card-prod-background)); border-color: var(--rmmo4m-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--rmmo4m-shadowHorizontal, var(--beae-card-shadow-x)) var(--rmmo4m-shadowVertical, var(--beae-card-shadow-y)) var(--rmmo4m-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--rmmo4m-shadowColor, var(--beae-card-prod-shadow-color)) var(--rmmo4m-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--rmmo4m-background-color,var(--beae-card-pricing-background)); border-color: var(--rmmo4m-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--rmmo4m-shadowHorizontal, var(--beae-card-shadow-x)) var(--rmmo4m-shadowVertical, var(--beae-card-shadow-y)) var(--rmmo4m-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--rmmo4m-shadowColor, var(--beae-card-pricing-shadow-color)) var(--rmmo4m-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--rmmo4m-background-color,var(--beae-card-cta-background)); border-color: var(--rmmo4m-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--rmmo4m-shadowHorizontal, var(--beae-card-shadow-x)) var(--rmmo4m-shadowVertical, var(--beae-card-shadow-y)) var(--rmmo4m-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--rmmo4m-shadowColor, var(--beae-card-cta-shadow-color)) var(--rmmo4m-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-rmmo4m"] {     display: flex;     flex-direction: var(--rmmo4m-direction, column);     flex-wrap: nowrap;     justify-content: var(--rmmo4m-justify-content);     align-items: var(--rmmo4m-align-items);     gap: var(--rmmo4m-gap, var(--rmmo4m-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-rmmo4m"] {                            gap: var(--rmmo4m-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--rmmo4m-padding-right-tablet, 0px) - var(--rmmo4m-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-rmmo4m"] {                            gap: var(--rmmo4m-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--rmmo4m-padding-right-mobile, 0px) - var(--rmmo4m-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-t4uj5z"] { margin-top: var(--t4uj5z-margin-top, 0px); margin-right: var(--t4uj5z-margin-right, 0px); margin-bottom: var(--t4uj5z-margin-bottom, 0px); margin-left: var(--t4uj5z-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--t4uj5z-margin-top-tablet, 0px); margin-right: var(--t4uj5z-margin-right-tablet, 0px); margin-bottom: var(--t4uj5z-margin-bottom-tablet, 0px); margin-left: var(--t4uj5z-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--t4uj5z-margin-top-mobile, 0px); margin-right: var(--t4uj5z-margin-right-mobile, 0px); margin-bottom: var(--t4uj5z-margin-bottom-mobile, 0px); margin-left: var(--t4uj5z-margin-left-mobile, 0px); } }[data-bnode="beae-901qpf"] { --901qpf-direction: row; --901qpf-direction-tablet: row; --901qpf-direction-mobile: row; }[data-bnode="beae-901qpf"] { padding-top: var(--901qpf-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--901qpf-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--901qpf-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--901qpf-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--901qpf-padding-top-tablet, var(--901qpf-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--901qpf-padding-right-tablet, var(--901qpf-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--901qpf-padding-bottom-tablet, var(--901qpf-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--901qpf-padding-left-tablet, var(--901qpf-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--901qpf-padding-top-mobile, var(--901qpf-padding-top-tablet, var(--901qpf-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--901qpf-padding-right-mobile, var(--901qpf-padding-right-tablet, var(--901qpf-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--901qpf-padding-bottom-mobile, var(--901qpf-padding-bottom-tablet, var(--901qpf-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--901qpf-padding-left-mobile, var(--901qpf-padding-left-tablet, var(--901qpf-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--901qpf-position, relative); top: var(--901qpf-top, auto); right: var(--901qpf-right, auto); bottom: var(--901qpf-bottom, auto); left: var(--901qpf-left, auto); transform: var(--901qpf-transform, none); z-index: var(--901qpf-z-index, 10); aspect-ratio: var(--901qpf-background-imageRatio, auto); background: var(--901qpf-background-color,transparent); border-style: var(--901qpf-borderStyle,solid); border-color: var(--901qpf-borderColor,#000000); border-width: var(--901qpf-borderWidth-tl,0px) var(--901qpf-borderWidth-tr,0px) var(--901qpf-borderWidth-br,0px) var(--901qpf-borderWidth-bl,0px); border-radius: var(--901qpf-borderRadius-tl,0px) var(--901qpf-borderRadius-tr,0px) var(--901qpf-borderRadius-br,0px) var(--901qpf-borderRadius-bl,0px); box-shadow: var(--901qpf-shadowHorizontal, 0px) var(--901qpf-shadowVertical, 0px) var(--901qpf-shadowBlur, 0px) 1px color-mix( in srgb, var(--901qpf-shadowColor, #000000) var(--901qpf-shadowTransparent, 0%), transparent ); max-width: var(--901qpf-max-width, 100%); width: 100%; height: if(style(--901qpf-position: absolute): var(--901qpf-height,100%); else: unset ); backdrop-filter:blur(var(--901qpf-background-blur, none)) saturate(var(--901qpf-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--901qpf-position-tablet, var(--901qpf-position, relative)); top: var(--901qpf-top-tablet, var(--901qpf-top, auto)); right: var(--901qpf-right-tablet, var(--901qpf-right, auto)); bottom: var(--901qpf-bottom-tablet, var(--901qpf-bottom, auto)); left: var(--901qpf-left-tablet, var(--901qpf-left, auto)); transform: var(--901qpf-transform-tablet, var(--901qpf-transform, none)); z-index: var(--901qpf-z-index-tablet, var(--901qpf-z-index, 10)); aspect-ratio: var(--901qpf-background-imageRatio-tablet, var(--901qpf-background-imageRatio, auto)); border-width: var(--901qpf-borderWidth-tl-tablet, var(--901qpf-borderWidth-tl,0px)) var(--901qpf-borderWidth-tr-tablet,var(--901qpf-borderWidth-tr,0px)) var(--901qpf-borderWidth-br-tablet,var(--901qpf-borderWidth-br,0px)) var(--901qpf-borderWidth-bl-tablet,var(--901qpf-borderWidth-bl,0px)); border-radius: var(--901qpf-borderRadius-tl-tablet,var(--901qpf-borderRadius-tl,0px)) var(--901qpf-borderRadius-tr-tablet,var(--901qpf-borderRadius-tr,0px)) var(--901qpf-borderRadius-br-tablet,var(--901qpf-borderRadius-br,0px)) var(--901qpf-borderRadius-bl-tablet,var(--901qpf-borderRadius-bl,0px)); max-width: var(--901qpf-max-width-tablet, var(--901qpf-max-width, 100%)); height: if(style(--901qpf-position-tablet: absolute): var(--901qpf-height-tablet,var(--901qpf-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--901qpf-position-mobile, var(--901qpf-position-tablet, var(--901qpf-position, relative))); top: var(--901qpf-top-mobile, var(--901qpf-top-tablet, var(--901qpf-top, auto))); right: var(--901qpf-right-mobile, var(--901qpf-right-tablet, var(--901qpf-right, auto))); bottom: var(--901qpf-bottom-mobile, var(--901qpf-bottom-tablet, var(--901qpf-bottom, auto))); left: var(--901qpf-left-mobile, var(--901qpf-left-tablet, var(--901qpf-left, auto))); transform: var(--901qpf-transform-mobile, var(--901qpf-transform-tablet, var(--901qpf-transform, none))); z-index: var(--901qpf-z-index-mobile, var(--901qpf-z-index-tablet, var(--901qpf-z-index, 10))); aspect-ratio: var(--901qpf-background-imageRatio-mobile, var(--901qpf-background-imageRatio, auto)); border-width: var(--901qpf-borderWidth-tl-mobile, var(--901qpf-borderWidth-tl,0px)) var(--901qpf-borderWidth-tr-mobile,var(--901qpf-borderWidth-tr,0px)) var(--901qpf-borderWidth-br-mobile,var(--901qpf-borderWidth-br,0px)) var(--901qpf-borderWidth-bl-mobile,var(--901qpf-borderWidth-bl,0px)); border-radius: var(--901qpf-borderRadius-tl-mobile,var(--901qpf-borderRadius-tl,0px)) var(--901qpf-borderRadius-tr-mobile,var(--901qpf-borderRadius-tr,0px)) var(--901qpf-borderRadius-br-mobile,var(--901qpf-borderRadius-br,0px)) var(--901qpf-borderRadius-bl-mobile,var(--901qpf-borderRadius-bl,0px)); max-width: var(--901qpf-max-width-mobile, var(--901qpf-max-width, 100%)); height: if(style(--901qpf-position-mobile: absolute): var(--901qpf-height-mobile,var(--901qpf-height-tablet,,var(--901qpf-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--901qpf-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--901qpf-gap,var(--beae-card-gap)); padding-top: var(--901qpf-padding-top,var(--beae-card-padding)); padding-right: var(--901qpf-padding-right,var(--beae-card-padding)); padding-bottom: var(--901qpf-padding-bottom,var(--beae-card-padding)); padding-left: var(--901qpf-padding-left,var(--beae-card-padding)); border-width: var(--901qpf-borderWidth-tl,var(--beae-card-border-width)) var(--901qpf-borderWidth-tr,var(--beae-card-border-width)) var(--901qpf-borderWidth-br,var(--beae-card-border-width)) var(--901qpf-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--901qpf-borderRadius-tl,var(--beae-card-border-radius)) var(--901qpf-borderRadius-tr,var(--beae-card-border-radius)) var(--901qpf-borderRadius-br,var(--beae-card-border-radius)) var(--901qpf-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--901qpf-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--901qpf-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--901qpf-gap-tablet,var(--beae-card-gap)); padding-top: var(--901qpf-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--901qpf-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--901qpf-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--901qpf-padding-left-tablet,var(--beae-card-padding)); border-width: var(--901qpf-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--901qpf-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--901qpf-borderWidth-br-desktop,var(--beae-card-border-width)) var(--901qpf-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--901qpf-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--901qpf-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--901qpf-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--901qpf-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--901qpf-gap-mobile,var(--beae-card-gap)); padding-top: var(--901qpf-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--901qpf-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--901qpf-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--901qpf-padding-left-mobile,var(--beae-card-padding)); border-width: var(--901qpf-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--901qpf-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--901qpf-borderWidth-br-mobile,var(--beae-card-border-width)) var(--901qpf-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--901qpf-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--901qpf-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--901qpf-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--901qpf-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--901qpf-background-color,var(--beae-card-featured-background)); border-color: var(--901qpf-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--901qpf-shadowHorizontal, var(--beae-card-shadow-x)) var(--901qpf-shadowVertical, var(--beae-card-shadow-y)) var(--901qpf-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--901qpf-shadowColor, var(--beae-card-featured-shadow-color)) var(--901qpf-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--901qpf-background-color,var(--beae-card-prod-background)); border-color: var(--901qpf-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--901qpf-shadowHorizontal, var(--beae-card-shadow-x)) var(--901qpf-shadowVertical, var(--beae-card-shadow-y)) var(--901qpf-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--901qpf-shadowColor, var(--beae-card-prod-shadow-color)) var(--901qpf-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--901qpf-background-color,var(--beae-card-pricing-background)); border-color: var(--901qpf-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--901qpf-shadowHorizontal, var(--beae-card-shadow-x)) var(--901qpf-shadowVertical, var(--beae-card-shadow-y)) var(--901qpf-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--901qpf-shadowColor, var(--beae-card-pricing-shadow-color)) var(--901qpf-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--901qpf-background-color,var(--beae-card-cta-background)); border-color: var(--901qpf-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--901qpf-shadowHorizontal, var(--beae-card-shadow-x)) var(--901qpf-shadowVertical, var(--beae-card-shadow-y)) var(--901qpf-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--901qpf-shadowColor, var(--beae-card-cta-shadow-color)) var(--901qpf-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-901qpf"] {     display: flex;     flex-direction: var(--901qpf-direction, column);     flex-wrap: nowrap;     justify-content: var(--901qpf-justify-content);     align-items: var(--901qpf-align-items);     gap: var(--901qpf-gap, var(--901qpf-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-901qpf"] {                            gap: var(--901qpf-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--901qpf-padding-right-tablet, 0px) - var(--901qpf-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-901qpf"] {                            gap: var(--901qpf-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--901qpf-padding-right-mobile, 0px) - var(--901qpf-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-9z0vbt"] { --9z0vbt-width: 100%; --9z0vbt-width-tablet: 100%; --9z0vbt-width-mobile: 100%; --9z0vbt-imageRatio: auto; --9z0vbt-imageRatio-tablet: auto; --9z0vbt-imageRatio-mobile: auto; --9z0vbt-objFit: cover; --9z0vbt-objFit-tablet: cover; --9z0vbt-objFit-mobile: cover; --9z0vbt-borderColor: #000000; --9z0vbt-borderColor-tablet: #000000; --9z0vbt-borderColor-mobile: #000000; --9z0vbt-shadowColor: #000000; --9z0vbt-shadowColor-tablet: #000000; --9z0vbt-shadowColor-mobile: #000000; --9z0vbt-borderStyle: none; --9z0vbt-borderStyle-tablet: none; --9z0vbt-borderStyle-mobile: none; --9z0vbt-enableShadow: false; --9z0vbt-enableShadow-tablet: false; --9z0vbt-enableShadow-mobile: false; }[data-bnode="beae-9z0vbt"] { margin-top: var(--9z0vbt-margin-top, 0px); margin-right: var(--9z0vbt-margin-right, 0px); margin-bottom: var(--9z0vbt-margin-bottom, 0px); margin-left: var(--9z0vbt-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--9z0vbt-margin-top-tablet, 0px); margin-right: var(--9z0vbt-margin-right-tablet, 0px); margin-bottom: var(--9z0vbt-margin-bottom-tablet, 0px); margin-left: var(--9z0vbt-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--9z0vbt-margin-top-mobile, 0px); margin-right: var(--9z0vbt-margin-right-mobile, 0px); margin-bottom: var(--9z0vbt-margin-bottom-mobile, 0px); margin-left: var(--9z0vbt-margin-left-mobile, 0px); } &.beae-media-wrapper { position: relative; overflow: hidden; display: block; width: 100%; max-width: calc(var(--9z0vbt-width,100%) - var(--9z0vbt-margin-left,0px) - var(--9z0vbt-margin-right,0px)); min-height: min-content; border-color: var(--9z0vbt-borderColor,var(--beae-card-media-border-color)); border-style: var(--9z0vbt-borderStyle,solid); border-width: var(--9z0vbt-borderWidth-tl,var(--beae-card-border-width)) var(--9z0vbt-borderWidth-tr,var(--beae-card-border-width)) var(--9z0vbt-borderWidth-br,var(--beae-card-border-width)) var(--9z0vbt-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--9z0vbt-borderRadius-tl,var(--beae-card-border-radius)) var(--9z0vbt-borderRadius-tr,var(--beae-card-border-radius)) var(--9z0vbt-borderRadius-br,var(--beae-card-border-radius)) var(--9z0vbt-borderRadius-bl,var(--beae-card-border-radius)); aspect-ratio: var(--9z0vbt-imageRatio, auto); @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--9z0vbt-borderWidth-tl-tablet, var(--9z0vbt-borderWidth-tl,var(--beae-card-border-width))) var(--9z0vbt-borderWidth-tr-tablet, var(--9z0vbt-borderWidth-tr,var(--beae-card-border-width))) var(--9z0vbt-borderWidth-br-tablet, var(--9z0vbt-borderWidth-br,var(--beae-card-border-width))) var(--9z0vbt-borderWidth-bl-tablet, var(--9z0vbt-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--9z0vbt-borderRadius-tl-tablet, var(--9z0vbt-borderRadius-tl,var(--beae-card-border-radius))) var(--9z0vbt-borderRadius-tr-tablet, var(--9z0vbt-borderRadius-tr,var(--beae-card-border-radius))) var(--9z0vbt-borderRadius-br-tablet, var(--9z0vbt-borderRadius-br,var(--beae-card-border-radius))) var(--9z0vbt-borderRadius-bl-tablet, var(--9z0vbt-borderRadius-bl,var(--beae-card-border-radius))); } @media (max-width: 767px) { border-width: var(--9z0vbt-borderWidth-tl-mobile, var(--9z0vbt-borderWidth-tl,var(--beae-card-border-width))) var(--9z0vbt-borderWidth-tr-mobile, var(--9z0vbt-borderWidth-tr,var(--beae-card-border-width))) var(--9z0vbt-borderWidth-br-mobile, var(--9z0vbt-borderWidth-br,var(--beae-card-border-width))) var(--9z0vbt-borderWidth-bl-mobile, var(--9z0vbt-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--9z0vbt-borderRadius-tl-mobile, var(--9z0vbt-borderRadius-tl,var(--beae-card-border-radius))) var(--9z0vbt-borderRadius-tr-mobile, var(--9z0vbt-borderRadius-tr,var(--beae-card-border-radius))) var(--9z0vbt-borderRadius-br-mobile, var(--9z0vbt-borderRadius-br,var(--beae-card-border-radius))) var(--9z0vbt-borderRadius-bl-mobile, var(--9z0vbt-borderRadius-bl,var(--beae-card-border-radius))); } box-shadow: var(--9z0vbt-shadowHorizontal, var(--beae-card-shadow-x)) var(--9z0vbt-shadowVertical, var(--beae-card-shadow-y)) var(--9z0vbt-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--9z0vbt-shadowColor, var(--beae-card-media-shadow-color)) var(--9z0vbt-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--9z0vbt-overlayColor-color, #000); opacity: var(--9z0vbt-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--9z0vbt-objFit, cover); object-position: var(--beae-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--9z0vbt-width-tablet,var(--9z0vbt-width,100%)) - var(--9z0vbt-margin-left-tablet,var(--9z0vbt-margin-left,0px)) - var(--9z0vbt-margin-right-tablet,var(--9z0vbt-margin-right,0px))); aspect-ratio: var(--9z0vbt-imageRatio-tablet, var(--9z0vbt-imageRatio, auto)); img { object-fit: var(--9z0vbt-objFit-tablet, var(--9z0vbt-objFit, cover)); object-position: var(--beae-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--9z0vbt-width-mobile,var(--9z0vbt-width,100%)) - var(--9z0vbt-margin-left-mobile,var(--9z0vbt-margin-left,0px)) - var(--9z0vbt-margin-right-mobile,var(--9z0vbt-margin-right,0px))); aspect-ratio: var(--9z0vbt-imageRatio-mobile, var(--9z0vbt-imageRatio, auto)); img { object-fit: var(--9z0vbt-objFit-mobile, var(--9z0vbt-objFit, cover)); object-position: var(--beae-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.beae-media-wrapper is relative; .beae-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.beae-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .beae-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: beae-ai-gen-shimmer 1.8s linear infinite; } &.beae-ai-gen-done .beae-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .beae-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: beae-ai-gen-scan 2.6s ease-in-out infinite; } & .beae-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .beae-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: beae-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. */ &.beae-ai-generating .beae-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.beae-ai-gen-done .beae-image { opacity: 1; transform: scale(1); } } @keyframes beae-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes beae-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes beae-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="beae-c7qn0n"] { --c7qn0n-width: var(--beae-section-width); --c7qn0n-width-tablet: var(--beae-section-width); --c7qn0n-width-mobile: var(--beae-section-width); --c7qn0n-height: fit-content; --c7qn0n-height-tablet: fit-content; --c7qn0n-height-mobile: fit-content; --c7qn0n-direction: row; --c7qn0n-direction-tablet: row; --c7qn0n-direction-mobile: row; --c7qn0n-structure: auto; --c7qn0n-structure-tablet: auto; --c7qn0n-structure-mobile: auto; --c7qn0n-padding-top: 40px; --c7qn0n-padding-top-tablet: 40px; --c7qn0n-padding-top-mobile: 40px; --c7qn0n-padding-bottom: 40px; --c7qn0n-padding-bottom-tablet: 40px; --c7qn0n-padding-bottom-mobile: 40px; --c7qn0n-justify-content: center; --c7qn0n-justify-content-tablet: center; --c7qn0n-justify-content-mobile: center; --c7qn0n-align-items: stretch; --c7qn0n-align-items-tablet: stretch; --c7qn0n-align-items-mobile: stretch; --c7qn0n-surface: dark; --c7qn0n-surface-tablet: dark; --c7qn0n-surface-mobile: dark; }[data-bnode="beae-c7qn0n"] { padding-top: var(--c7qn0n-padding-top, var(--beae-section-padding-y, 0px)); padding-right: var(--c7qn0n-padding-right, var(--beae-section-padding-x, 0px)); padding-bottom: var(--c7qn0n-padding-bottom, var(--beae-section-padding-y, 0px)); padding-left: var(--c7qn0n-padding-left, var(--beae-section-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--c7qn0n-padding-top-tablet, var(--c7qn0n-padding-top, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-right: var(--c7qn0n-padding-right-tablet, var(--c7qn0n-padding-right, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); padding-bottom: var(--c7qn0n-padding-bottom-tablet, var(--c7qn0n-padding-bottom, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))); padding-left: var(--c7qn0n-padding-left-tablet, var(--c7qn0n-padding-left, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--c7qn0n-padding-top-mobile, var(--c7qn0n-padding-top-tablet, var(--c7qn0n-padding-top, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-right: var(--c7qn0n-padding-right-mobile, var(--c7qn0n-padding-right-tablet, var(--c7qn0n-padding-right, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); padding-bottom: var(--c7qn0n-padding-bottom-mobile, var(--c7qn0n-padding-bottom-tablet, var(--c7qn0n-padding-bottom, var(--beae-section-padding-y-mobile, var(--beae-section-padding-y-tablet, var(--beae-section-padding-y, 0px)))))); padding-left: var(--c7qn0n-padding-left-mobile, var(--c7qn0n-padding-left-tablet, var(--c7qn0n-padding-left, var(--beae-section-padding-x-mobile, var(--beae-section-padding-x-tablet, var(--beae-section-padding-x, 0px)))))); } &.beae-section { background: var(--c7qn0n-background-color, var(--beae-background-color)); max-width: 100%; position: relative; .beae-section-container { height: var(--c7qn0n-height); width: 100%; max-width: var(--c7qn0n-width,var(--beae-section-width)); margin: 0 auto; > *:not(.beae-slot) { position: relative; z-index: 1; } > .beae-bg-image{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; img{ width: 100%; height: 100%; } } > .beae-video-background{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 0; object-fit: cover; background: #000000; } } } @media (min-width: 767.79px) and (max-width: 1180px) { &.beae-section { & .beae-section-container { height: var(--c7qn0n-height-tablet, auto); width: 100%; max-width: var(--c7qn0n-width-tablet, 100%); } } } @media (max-width: 767px) { &.beae-section { & .beae-section-container { height: var(--c7qn0n-height-mobile, auto); width: 100%; max-width: var(--c7qn0n-width-mobile, 100%); } } } }[data-bnode="beae-c7qn0n"] > .beae-section-container{     display: flex;     flex-direction: var(--c7qn0n-direction, column);     flex-wrap: nowrap;     justify-content: var(--c7qn0n-justify-content);     align-items: var(--c7qn0n-align-items);     gap: var(--c7qn0n-gap, var(--beae-grid-gap, 4px));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-c7qn0n"] > .beae-section-container{                            gap: var(--beae-grid-gap-tablet, 4px);               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--c7qn0n-padding-right-tablet, 0px) - var(--c7qn0n-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-c7qn0n"] > .beae-section-container{                            gap: var(--beae-grid-gap-mobile, 4px);              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--c7qn0n-padding-right-mobile, 0px) - var(--c7qn0n-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-wu7xlp"] { --wu7xlp-direction: row; --wu7xlp-direction-tablet: row; --wu7xlp-direction-mobile: row; --wu7xlp-structure: auto; --wu7xlp-structure-tablet: auto; --wu7xlp-structure-mobile: auto; --wu7xlp-align-items: center; --wu7xlp-align-items-tablet: center; --wu7xlp-align-items-mobile: center; --wu7xlp-justify-content: center; --wu7xlp-justify-content-tablet: center; --wu7xlp-justify-content-mobile: center; --wu7xlp-surface: dark; --wu7xlp-surface-tablet: dark; --wu7xlp-surface-mobile: dark; --wu7xlp-borderRadius-tl: 24px; --wu7xlp-borderRadius-tl-tablet: 24px; --wu7xlp-borderRadius-tl-mobile: 24px; --wu7xlp-borderRadius-tr: 24px; --wu7xlp-borderRadius-tr-tablet: 24px; --wu7xlp-borderRadius-tr-mobile: 24px; --wu7xlp-borderRadius-bl: 24px; --wu7xlp-borderRadius-bl-tablet: 24px; --wu7xlp-borderRadius-bl-mobile: 24px; --wu7xlp-borderRadius-br: 24px; --wu7xlp-borderRadius-br-tablet: 24px; --wu7xlp-borderRadius-br-mobile: 24px; }[data-bnode="beae-wu7xlp"] { padding-top: var(--wu7xlp-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--wu7xlp-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--wu7xlp-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--wu7xlp-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--wu7xlp-padding-top-tablet, var(--wu7xlp-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--wu7xlp-padding-right-tablet, var(--wu7xlp-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--wu7xlp-padding-bottom-tablet, var(--wu7xlp-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--wu7xlp-padding-left-tablet, var(--wu7xlp-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--wu7xlp-padding-top-mobile, var(--wu7xlp-padding-top-tablet, var(--wu7xlp-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--wu7xlp-padding-right-mobile, var(--wu7xlp-padding-right-tablet, var(--wu7xlp-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--wu7xlp-padding-bottom-mobile, var(--wu7xlp-padding-bottom-tablet, var(--wu7xlp-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--wu7xlp-padding-left-mobile, var(--wu7xlp-padding-left-tablet, var(--wu7xlp-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--wu7xlp-position, relative); top: var(--wu7xlp-top, auto); right: var(--wu7xlp-right, auto); bottom: var(--wu7xlp-bottom, auto); left: var(--wu7xlp-left, auto); transform: var(--wu7xlp-transform, none); z-index: var(--wu7xlp-z-index, 10); aspect-ratio: var(--wu7xlp-background-imageRatio, auto); background: var(--wu7xlp-background-color,transparent); border-style: var(--wu7xlp-borderStyle,solid); border-color: var(--wu7xlp-borderColor,#000000); border-width: var(--wu7xlp-borderWidth-tl,0px) var(--wu7xlp-borderWidth-tr,0px) var(--wu7xlp-borderWidth-br,0px) var(--wu7xlp-borderWidth-bl,0px); border-radius: var(--wu7xlp-borderRadius-tl,0px) var(--wu7xlp-borderRadius-tr,0px) var(--wu7xlp-borderRadius-br,0px) var(--wu7xlp-borderRadius-bl,0px); box-shadow: var(--wu7xlp-shadowHorizontal, 0px) var(--wu7xlp-shadowVertical, 0px) var(--wu7xlp-shadowBlur, 0px) 1px color-mix( in srgb, var(--wu7xlp-shadowColor, #000000) var(--wu7xlp-shadowTransparent, 0%), transparent ); max-width: var(--wu7xlp-max-width, 100%); width: 100%; height: if(style(--wu7xlp-position: absolute): var(--wu7xlp-height,100%); else: unset ); backdrop-filter:blur(var(--wu7xlp-background-blur, none)) saturate(var(--wu7xlp-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--wu7xlp-position-tablet, var(--wu7xlp-position, relative)); top: var(--wu7xlp-top-tablet, var(--wu7xlp-top, auto)); right: var(--wu7xlp-right-tablet, var(--wu7xlp-right, auto)); bottom: var(--wu7xlp-bottom-tablet, var(--wu7xlp-bottom, auto)); left: var(--wu7xlp-left-tablet, var(--wu7xlp-left, auto)); transform: var(--wu7xlp-transform-tablet, var(--wu7xlp-transform, none)); z-index: var(--wu7xlp-z-index-tablet, var(--wu7xlp-z-index, 10)); aspect-ratio: var(--wu7xlp-background-imageRatio-tablet, var(--wu7xlp-background-imageRatio, auto)); border-width: var(--wu7xlp-borderWidth-tl-tablet, var(--wu7xlp-borderWidth-tl,0px)) var(--wu7xlp-borderWidth-tr-tablet,var(--wu7xlp-borderWidth-tr,0px)) var(--wu7xlp-borderWidth-br-tablet,var(--wu7xlp-borderWidth-br,0px)) var(--wu7xlp-borderWidth-bl-tablet,var(--wu7xlp-borderWidth-bl,0px)); border-radius: var(--wu7xlp-borderRadius-tl-tablet,var(--wu7xlp-borderRadius-tl,0px)) var(--wu7xlp-borderRadius-tr-tablet,var(--wu7xlp-borderRadius-tr,0px)) var(--wu7xlp-borderRadius-br-tablet,var(--wu7xlp-borderRadius-br,0px)) var(--wu7xlp-borderRadius-bl-tablet,var(--wu7xlp-borderRadius-bl,0px)); max-width: var(--wu7xlp-max-width-tablet, var(--wu7xlp-max-width, 100%)); height: if(style(--wu7xlp-position-tablet: absolute): var(--wu7xlp-height-tablet,var(--wu7xlp-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--wu7xlp-position-mobile, var(--wu7xlp-position-tablet, var(--wu7xlp-position, relative))); top: var(--wu7xlp-top-mobile, var(--wu7xlp-top-tablet, var(--wu7xlp-top, auto))); right: var(--wu7xlp-right-mobile, var(--wu7xlp-right-tablet, var(--wu7xlp-right, auto))); bottom: var(--wu7xlp-bottom-mobile, var(--wu7xlp-bottom-tablet, var(--wu7xlp-bottom, auto))); left: var(--wu7xlp-left-mobile, var(--wu7xlp-left-tablet, var(--wu7xlp-left, auto))); transform: var(--wu7xlp-transform-mobile, var(--wu7xlp-transform-tablet, var(--wu7xlp-transform, none))); z-index: var(--wu7xlp-z-index-mobile, var(--wu7xlp-z-index-tablet, var(--wu7xlp-z-index, 10))); aspect-ratio: var(--wu7xlp-background-imageRatio-mobile, var(--wu7xlp-background-imageRatio, auto)); border-width: var(--wu7xlp-borderWidth-tl-mobile, var(--wu7xlp-borderWidth-tl,0px)) var(--wu7xlp-borderWidth-tr-mobile,var(--wu7xlp-borderWidth-tr,0px)) var(--wu7xlp-borderWidth-br-mobile,var(--wu7xlp-borderWidth-br,0px)) var(--wu7xlp-borderWidth-bl-mobile,var(--wu7xlp-borderWidth-bl,0px)); border-radius: var(--wu7xlp-borderRadius-tl-mobile,var(--wu7xlp-borderRadius-tl,0px)) var(--wu7xlp-borderRadius-tr-mobile,var(--wu7xlp-borderRadius-tr,0px)) var(--wu7xlp-borderRadius-br-mobile,var(--wu7xlp-borderRadius-br,0px)) var(--wu7xlp-borderRadius-bl-mobile,var(--wu7xlp-borderRadius-bl,0px)); max-width: var(--wu7xlp-max-width-mobile, var(--wu7xlp-max-width, 100%)); height: if(style(--wu7xlp-position-mobile: absolute): var(--wu7xlp-height-mobile,var(--wu7xlp-height-tablet,,var(--wu7xlp-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--wu7xlp-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--wu7xlp-gap,var(--beae-card-gap)); padding-top: var(--wu7xlp-padding-top,var(--beae-card-padding)); padding-right: var(--wu7xlp-padding-right,var(--beae-card-padding)); padding-bottom: var(--wu7xlp-padding-bottom,var(--beae-card-padding)); padding-left: var(--wu7xlp-padding-left,var(--beae-card-padding)); border-width: var(--wu7xlp-borderWidth-tl,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-tr,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-br,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--wu7xlp-borderRadius-tl,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-tr,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-br,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--wu7xlp-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--wu7xlp-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--wu7xlp-gap-tablet,var(--beae-card-gap)); padding-top: var(--wu7xlp-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--wu7xlp-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--wu7xlp-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--wu7xlp-padding-left-tablet,var(--beae-card-padding)); border-width: var(--wu7xlp-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-br-desktop,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--wu7xlp-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--wu7xlp-gap-mobile,var(--beae-card-gap)); padding-top: var(--wu7xlp-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--wu7xlp-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--wu7xlp-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--wu7xlp-padding-left-mobile,var(--beae-card-padding)); border-width: var(--wu7xlp-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-br-mobile,var(--beae-card-border-width)) var(--wu7xlp-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--wu7xlp-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--wu7xlp-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--wu7xlp-background-color,var(--beae-card-featured-background)); border-color: var(--wu7xlp-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--wu7xlp-shadowHorizontal, var(--beae-card-shadow-x)) var(--wu7xlp-shadowVertical, var(--beae-card-shadow-y)) var(--wu7xlp-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--wu7xlp-shadowColor, var(--beae-card-featured-shadow-color)) var(--wu7xlp-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--wu7xlp-background-color,var(--beae-card-prod-background)); border-color: var(--wu7xlp-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--wu7xlp-shadowHorizontal, var(--beae-card-shadow-x)) var(--wu7xlp-shadowVertical, var(--beae-card-shadow-y)) var(--wu7xlp-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--wu7xlp-shadowColor, var(--beae-card-prod-shadow-color)) var(--wu7xlp-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--wu7xlp-background-color,var(--beae-card-pricing-background)); border-color: var(--wu7xlp-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--wu7xlp-shadowHorizontal, var(--beae-card-shadow-x)) var(--wu7xlp-shadowVertical, var(--beae-card-shadow-y)) var(--wu7xlp-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--wu7xlp-shadowColor, var(--beae-card-pricing-shadow-color)) var(--wu7xlp-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--wu7xlp-background-color,var(--beae-card-cta-background)); border-color: var(--wu7xlp-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--wu7xlp-shadowHorizontal, var(--beae-card-shadow-x)) var(--wu7xlp-shadowVertical, var(--beae-card-shadow-y)) var(--wu7xlp-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--wu7xlp-shadowColor, var(--beae-card-cta-shadow-color)) var(--wu7xlp-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-wu7xlp"] {     display: flex;     flex-direction: var(--wu7xlp-direction, column);     flex-wrap: nowrap;     justify-content: var(--wu7xlp-justify-content);     align-items: var(--wu7xlp-align-items);     gap: var(--wu7xlp-gap, var(--wu7xlp-gap, var(--beae-slot-gap)));            &>.beae-slot[data-bnode-index] {         flex: 1;        }          }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-wu7xlp"] {                            gap: var(--wu7xlp-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--wu7xlp-padding-right-tablet, 0px) - var(--wu7xlp-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-wu7xlp"] {                            gap: var(--wu7xlp-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--wu7xlp-padding-right-mobile, 0px) - var(--wu7xlp-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-4sn21i"] { --4sn21i-width: 100%; --4sn21i-width-tablet: 100%; --4sn21i-width-mobile: 100%; --4sn21i-imageRatio: 16/9; --4sn21i-imageRatio-tablet: 3/2; --4sn21i-imageRatio-mobile: 2/3; --4sn21i-objFit: cover; --4sn21i-objFit-tablet: cover; --4sn21i-objFit-mobile: cover; --4sn21i-borderColor: #000000; --4sn21i-borderColor-tablet: #000000; --4sn21i-borderColor-mobile: #000000; --4sn21i-shadowColor: #000000; --4sn21i-shadowColor-tablet: #000000; --4sn21i-shadowColor-mobile: #000000; --4sn21i-borderStyle: none; --4sn21i-borderStyle-tablet: none; --4sn21i-borderStyle-mobile: none; --4sn21i-borderRadius-tl: 24px; --4sn21i-borderRadius-tl-tablet: 24px; --4sn21i-borderRadius-tl-mobile: 24px; --4sn21i-borderRadius-tr: 24px; --4sn21i-borderRadius-tr-tablet: 24px; --4sn21i-borderRadius-tr-mobile: 24px; --4sn21i-borderRadius-bl: 24px; --4sn21i-borderRadius-bl-tablet: 24px; --4sn21i-borderRadius-bl-mobile: 24px; --4sn21i-borderRadius-br: 24px; --4sn21i-borderRadius-br-tablet: 24px; --4sn21i-borderRadius-br-mobile: 24px; }[data-bnode="beae-4sn21i"] { margin-top: var(--4sn21i-margin-top, 0px); margin-right: var(--4sn21i-margin-right, 0px); margin-bottom: var(--4sn21i-margin-bottom, 0px); margin-left: var(--4sn21i-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--4sn21i-margin-top-tablet, 0px); margin-right: var(--4sn21i-margin-right-tablet, 0px); margin-bottom: var(--4sn21i-margin-bottom-tablet, 0px); margin-left: var(--4sn21i-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--4sn21i-margin-top-mobile, 0px); margin-right: var(--4sn21i-margin-right-mobile, 0px); margin-bottom: var(--4sn21i-margin-bottom-mobile, 0px); margin-left: var(--4sn21i-margin-left-mobile, 0px); } &.beae-media-wrapper { position: relative; overflow: hidden; display: block; width: 100%; max-width: calc(var(--4sn21i-width,100%) - var(--4sn21i-margin-left,0px) - var(--4sn21i-margin-right,0px)); min-height: min-content; border-color: var(--4sn21i-borderColor,var(--beae-card-media-border-color)); border-style: var(--4sn21i-borderStyle,solid); border-width: var(--4sn21i-borderWidth-tl,var(--beae-card-border-width)) var(--4sn21i-borderWidth-tr,var(--beae-card-border-width)) var(--4sn21i-borderWidth-br,var(--beae-card-border-width)) var(--4sn21i-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--4sn21i-borderRadius-tl,var(--beae-card-border-radius)) var(--4sn21i-borderRadius-tr,var(--beae-card-border-radius)) var(--4sn21i-borderRadius-br,var(--beae-card-border-radius)) var(--4sn21i-borderRadius-bl,var(--beae-card-border-radius)); aspect-ratio: var(--4sn21i-imageRatio, auto); @media (min-width: 767.79px) and (max-width: 1180px) { border-width: var(--4sn21i-borderWidth-tl-tablet, var(--4sn21i-borderWidth-tl,var(--beae-card-border-width))) var(--4sn21i-borderWidth-tr-tablet, var(--4sn21i-borderWidth-tr,var(--beae-card-border-width))) var(--4sn21i-borderWidth-br-tablet, var(--4sn21i-borderWidth-br,var(--beae-card-border-width))) var(--4sn21i-borderWidth-bl-tablet, var(--4sn21i-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--4sn21i-borderRadius-tl-tablet, var(--4sn21i-borderRadius-tl,var(--beae-card-border-radius))) var(--4sn21i-borderRadius-tr-tablet, var(--4sn21i-borderRadius-tr,var(--beae-card-border-radius))) var(--4sn21i-borderRadius-br-tablet, var(--4sn21i-borderRadius-br,var(--beae-card-border-radius))) var(--4sn21i-borderRadius-bl-tablet, var(--4sn21i-borderRadius-bl,var(--beae-card-border-radius))); } @media (max-width: 767px) { border-width: var(--4sn21i-borderWidth-tl-mobile, var(--4sn21i-borderWidth-tl,var(--beae-card-border-width))) var(--4sn21i-borderWidth-tr-mobile, var(--4sn21i-borderWidth-tr,var(--beae-card-border-width))) var(--4sn21i-borderWidth-br-mobile, var(--4sn21i-borderWidth-br,var(--beae-card-border-width))) var(--4sn21i-borderWidth-bl-mobile, var(--4sn21i-borderWidth-bl,var(--beae-card-border-width))); border-radius: var(--4sn21i-borderRadius-tl-mobile, var(--4sn21i-borderRadius-tl,var(--beae-card-border-radius))) var(--4sn21i-borderRadius-tr-mobile, var(--4sn21i-borderRadius-tr,var(--beae-card-border-radius))) var(--4sn21i-borderRadius-br-mobile, var(--4sn21i-borderRadius-br,var(--beae-card-border-radius))) var(--4sn21i-borderRadius-bl-mobile, var(--4sn21i-borderRadius-bl,var(--beae-card-border-radius))); } box-shadow: var(--4sn21i-shadowHorizontal, var(--beae-card-shadow-x)) var(--4sn21i-shadowVertical, var(--beae-card-shadow-y)) var(--4sn21i-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--4sn21i-shadowColor, var(--beae-card-media-shadow-color)) var(--4sn21i-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); &::before { content: ""; position: absolute; inset: 0; background: var(--4sn21i-overlayColor-color, #000); opacity: var(--4sn21i-overlayOpacity, 0); pointer-events: none; } img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: var(--4sn21i-objFit, cover); object-position: var(--beae-image-position, 0% 50%); } /* Tablet */ @media (max-width: 1180px) { max-width: calc(var(--4sn21i-width-tablet,var(--4sn21i-width,100%)) - var(--4sn21i-margin-left-tablet,var(--4sn21i-margin-left,0px)) - var(--4sn21i-margin-right-tablet,var(--4sn21i-margin-right,0px))); aspect-ratio: var(--4sn21i-imageRatio-tablet, var(--4sn21i-imageRatio, auto)); img { object-fit: var(--4sn21i-objFit-tablet, var(--4sn21i-objFit, cover)); object-position: var(--beae-image-position-ta, 0% 50%); } } /* Mobile */ @media (max-width: 767px) { max-width: calc(var(--4sn21i-width-mobile,var(--4sn21i-width,100%)) - var(--4sn21i-margin-left-mobile,var(--4sn21i-margin-left,0px)) - var(--4sn21i-margin-right-mobile,var(--4sn21i-margin-right,0px))); aspect-ratio: var(--4sn21i-imageRatio-mobile, var(--4sn21i-imageRatio, auto)); img { object-fit: var(--4sn21i-objFit-mobile, var(--4sn21i-objFit, cover)); object-position: var(--beae-image-position-mo, 0% 50%); } } } /* The host wrapper is already a positioning context (.beae-media-wrapper is relative; .beae-bg-image is absolute). isolation:isolate keeps the overlay's z-index contained so it never paints over section foreground. */ &.beae-ai-generating { isolation: isolate; } /* Dark shimmer surface — monochrome so colour stays in the laser + label. */ & .beae-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: beae-ai-gen-shimmer 1.8s linear infinite; } &.beae-ai-gen-done .beae-ai-gen-overlay { opacity: 0; } /* Glowing laser scan line sweeping top -> bottom. */ & .beae-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: beae-ai-gen-scan 2.6s ease-in-out infinite; } & .beae-ai-gen-stage { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; } & .beae-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: beae-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. */ &.beae-ai-generating .beae-image { opacity: 0; transform: scale(0.96); transition: opacity 1000ms ease, transform 1000ms ease; } &.beae-ai-gen-done .beae-image { opacity: 1; transform: scale(1); } } @keyframes beae-ai-gen-shimmer { to { background-position-x: -200%; } } @keyframes beae-ai-gen-scan { 0% { top: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 100%; opacity: 0; } } @keyframes beae-ai-gen-pulse { 0%, 100% { opacity: 0.65; transform: scale(0.99); } 50% { opacity: 1; transform: scale(1.02); } }[data-bnode="beae-fnt251"] { --fnt251-direction: column; --fnt251-direction-tablet: column; --fnt251-direction-mobile: column; --fnt251-structure: columns; --fnt251-structure-tablet: columns; --fnt251-structure-mobile: columns; --fnt251-justify-content: center; --fnt251-justify-content-tablet: center; --fnt251-justify-content-mobile: center; --fnt251-align-items: center; --fnt251-align-items-tablet: center; --fnt251-align-items-mobile: center; --fnt251-max-width: 1024px; --fnt251-max-width-tablet: 1024px; --fnt251-max-width-mobile: 1024px; --fnt251-position: absolute; --fnt251-position-tablet: absolute; --fnt251-position-mobile: absolute; --fnt251-background-0: c; --fnt251-background-0-tablet: c; --fnt251-background-0-mobile: c; --fnt251-background-1: o; --fnt251-background-1-tablet: o; --fnt251-background-1-mobile: o; --fnt251-background-2: l; --fnt251-background-2-tablet: l; --fnt251-background-2-mobile: l; --fnt251-background-3: o; --fnt251-background-3-tablet: o; --fnt251-background-3-mobile: o; --fnt251-background-4: r; --fnt251-background-4-tablet: r; --fnt251-background-4-mobile: r; --fnt251-background-type: color; --fnt251-background-type-tablet: color; --fnt251-background-type-mobile: color; --fnt251-background-saturation: 100%; --fnt251-background-saturation-tablet: 100%; --fnt251-background-saturation-mobile: 100%; --fnt251-background-transparent: 100%; --fnt251-background-transparent-tablet: 100%; --fnt251-background-transparent-mobile: 100%; --fnt251-background-blur: 0px; --fnt251-background-blur-tablet: 0px; --fnt251-background-blur-mobile: 0px; --fnt251-surface: surface-dark; --fnt251-surface-tablet: surface-dark; --fnt251-surface-mobile: surface-dark; --fnt251-z-index-tablet: 1000; --fnt251-z-index-mobile: 1000; --fnt251-padding-top-tablet: 56px; --fnt251-padding-top-mobile: 32px; --fnt251-padding-right-tablet: 56px; --fnt251-padding-right-mobile: 24px; --fnt251-padding-bottom-tablet: 56px; --fnt251-padding-bottom-mobile: 32px; --fnt251-padding-left-tablet: 56px; --fnt251-padding-left-mobile: 24px; }[data-bnode="beae-fnt251"] { padding-top: var(--fnt251-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--fnt251-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--fnt251-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--fnt251-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--fnt251-padding-top-tablet, var(--fnt251-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--fnt251-padding-right-tablet, var(--fnt251-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--fnt251-padding-bottom-tablet, var(--fnt251-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--fnt251-padding-left-tablet, var(--fnt251-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--fnt251-padding-top-mobile, var(--fnt251-padding-top-tablet, var(--fnt251-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--fnt251-padding-right-mobile, var(--fnt251-padding-right-tablet, var(--fnt251-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--fnt251-padding-bottom-mobile, var(--fnt251-padding-bottom-tablet, var(--fnt251-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--fnt251-padding-left-mobile, var(--fnt251-padding-left-tablet, var(--fnt251-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--fnt251-position, relative); top: var(--fnt251-top, auto); right: var(--fnt251-right, auto); bottom: var(--fnt251-bottom, auto); left: var(--fnt251-left, auto); transform: var(--fnt251-transform, none); z-index: var(--fnt251-z-index, 10); aspect-ratio: var(--fnt251-background-imageRatio, auto); background: var(--fnt251-background-color,transparent); border-style: var(--fnt251-borderStyle,solid); border-color: var(--fnt251-borderColor,#000000); border-width: var(--fnt251-borderWidth-tl,0px) var(--fnt251-borderWidth-tr,0px) var(--fnt251-borderWidth-br,0px) var(--fnt251-borderWidth-bl,0px); border-radius: var(--fnt251-borderRadius-tl,0px) var(--fnt251-borderRadius-tr,0px) var(--fnt251-borderRadius-br,0px) var(--fnt251-borderRadius-bl,0px); box-shadow: var(--fnt251-shadowHorizontal, 0px) var(--fnt251-shadowVertical, 0px) var(--fnt251-shadowBlur, 0px) 1px color-mix( in srgb, var(--fnt251-shadowColor, #000000) var(--fnt251-shadowTransparent, 0%), transparent ); max-width: var(--fnt251-max-width, 100%); width: 100%; height: if(style(--fnt251-position: absolute): var(--fnt251-height,100%); else: unset ); backdrop-filter:blur(var(--fnt251-background-blur, none)) saturate(var(--fnt251-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--fnt251-position-tablet, var(--fnt251-position, relative)); top: var(--fnt251-top-tablet, var(--fnt251-top, auto)); right: var(--fnt251-right-tablet, var(--fnt251-right, auto)); bottom: var(--fnt251-bottom-tablet, var(--fnt251-bottom, auto)); left: var(--fnt251-left-tablet, var(--fnt251-left, auto)); transform: var(--fnt251-transform-tablet, var(--fnt251-transform, none)); z-index: var(--fnt251-z-index-tablet, var(--fnt251-z-index, 10)); aspect-ratio: var(--fnt251-background-imageRatio-tablet, var(--fnt251-background-imageRatio, auto)); border-width: var(--fnt251-borderWidth-tl-tablet, var(--fnt251-borderWidth-tl,0px)) var(--fnt251-borderWidth-tr-tablet,var(--fnt251-borderWidth-tr,0px)) var(--fnt251-borderWidth-br-tablet,var(--fnt251-borderWidth-br,0px)) var(--fnt251-borderWidth-bl-tablet,var(--fnt251-borderWidth-bl,0px)); border-radius: var(--fnt251-borderRadius-tl-tablet,var(--fnt251-borderRadius-tl,0px)) var(--fnt251-borderRadius-tr-tablet,var(--fnt251-borderRadius-tr,0px)) var(--fnt251-borderRadius-br-tablet,var(--fnt251-borderRadius-br,0px)) var(--fnt251-borderRadius-bl-tablet,var(--fnt251-borderRadius-bl,0px)); max-width: var(--fnt251-max-width-tablet, var(--fnt251-max-width, 100%)); height: if(style(--fnt251-position-tablet: absolute): var(--fnt251-height-tablet,var(--fnt251-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--fnt251-position-mobile, var(--fnt251-position-tablet, var(--fnt251-position, relative))); top: var(--fnt251-top-mobile, var(--fnt251-top-tablet, var(--fnt251-top, auto))); right: var(--fnt251-right-mobile, var(--fnt251-right-tablet, var(--fnt251-right, auto))); bottom: var(--fnt251-bottom-mobile, var(--fnt251-bottom-tablet, var(--fnt251-bottom, auto))); left: var(--fnt251-left-mobile, var(--fnt251-left-tablet, var(--fnt251-left, auto))); transform: var(--fnt251-transform-mobile, var(--fnt251-transform-tablet, var(--fnt251-transform, none))); z-index: var(--fnt251-z-index-mobile, var(--fnt251-z-index-tablet, var(--fnt251-z-index, 10))); aspect-ratio: var(--fnt251-background-imageRatio-mobile, var(--fnt251-background-imageRatio, auto)); border-width: var(--fnt251-borderWidth-tl-mobile, var(--fnt251-borderWidth-tl,0px)) var(--fnt251-borderWidth-tr-mobile,var(--fnt251-borderWidth-tr,0px)) var(--fnt251-borderWidth-br-mobile,var(--fnt251-borderWidth-br,0px)) var(--fnt251-borderWidth-bl-mobile,var(--fnt251-borderWidth-bl,0px)); border-radius: var(--fnt251-borderRadius-tl-mobile,var(--fnt251-borderRadius-tl,0px)) var(--fnt251-borderRadius-tr-mobile,var(--fnt251-borderRadius-tr,0px)) var(--fnt251-borderRadius-br-mobile,var(--fnt251-borderRadius-br,0px)) var(--fnt251-borderRadius-bl-mobile,var(--fnt251-borderRadius-bl,0px)); max-width: var(--fnt251-max-width-mobile, var(--fnt251-max-width, 100%)); height: if(style(--fnt251-position-mobile: absolute): var(--fnt251-height-mobile,var(--fnt251-height-tablet,,var(--fnt251-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--fnt251-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--fnt251-gap,var(--beae-card-gap)); padding-top: var(--fnt251-padding-top,var(--beae-card-padding)); padding-right: var(--fnt251-padding-right,var(--beae-card-padding)); padding-bottom: var(--fnt251-padding-bottom,var(--beae-card-padding)); padding-left: var(--fnt251-padding-left,var(--beae-card-padding)); border-width: var(--fnt251-borderWidth-tl,var(--beae-card-border-width)) var(--fnt251-borderWidth-tr,var(--beae-card-border-width)) var(--fnt251-borderWidth-br,var(--beae-card-border-width)) var(--fnt251-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--fnt251-borderRadius-tl,var(--beae-card-border-radius)) var(--fnt251-borderRadius-tr,var(--beae-card-border-radius)) var(--fnt251-borderRadius-br,var(--beae-card-border-radius)) var(--fnt251-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--fnt251-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--fnt251-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--fnt251-gap-tablet,var(--beae-card-gap)); padding-top: var(--fnt251-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--fnt251-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--fnt251-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--fnt251-padding-left-tablet,var(--beae-card-padding)); border-width: var(--fnt251-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--fnt251-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--fnt251-borderWidth-br-desktop,var(--beae-card-border-width)) var(--fnt251-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--fnt251-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--fnt251-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--fnt251-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--fnt251-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--fnt251-gap-mobile,var(--beae-card-gap)); padding-top: var(--fnt251-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--fnt251-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--fnt251-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--fnt251-padding-left-mobile,var(--beae-card-padding)); border-width: var(--fnt251-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--fnt251-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--fnt251-borderWidth-br-mobile,var(--beae-card-border-width)) var(--fnt251-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--fnt251-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--fnt251-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--fnt251-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--fnt251-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--fnt251-background-color,var(--beae-card-featured-background)); border-color: var(--fnt251-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--fnt251-shadowHorizontal, var(--beae-card-shadow-x)) var(--fnt251-shadowVertical, var(--beae-card-shadow-y)) var(--fnt251-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--fnt251-shadowColor, var(--beae-card-featured-shadow-color)) var(--fnt251-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--fnt251-background-color,var(--beae-card-prod-background)); border-color: var(--fnt251-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--fnt251-shadowHorizontal, var(--beae-card-shadow-x)) var(--fnt251-shadowVertical, var(--beae-card-shadow-y)) var(--fnt251-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--fnt251-shadowColor, var(--beae-card-prod-shadow-color)) var(--fnt251-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--fnt251-background-color,var(--beae-card-pricing-background)); border-color: var(--fnt251-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--fnt251-shadowHorizontal, var(--beae-card-shadow-x)) var(--fnt251-shadowVertical, var(--beae-card-shadow-y)) var(--fnt251-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--fnt251-shadowColor, var(--beae-card-pricing-shadow-color)) var(--fnt251-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--fnt251-background-color,var(--beae-card-cta-background)); border-color: var(--fnt251-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--fnt251-shadowHorizontal, var(--beae-card-shadow-x)) var(--fnt251-shadowVertical, var(--beae-card-shadow-y)) var(--fnt251-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--fnt251-shadowColor, var(--beae-card-cta-shadow-color)) var(--fnt251-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-fnt251"] {     display: flex;     flex-direction: var(--fnt251-direction, column);     flex-wrap: nowrap;     justify-content: var(--fnt251-justify-content);     align-items: var(--fnt251-align-items);     gap: var(--fnt251-gap, var(--fnt251-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-fnt251"] {                            gap: var(--fnt251-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--fnt251-padding-right-tablet, 0px) - var(--fnt251-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-fnt251"] {                            gap: var(--fnt251-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(50.00% - var(--fnt251-padding-right-mobile, 0px) - var(--fnt251-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-zo1i24"] { --zo1i24-typography: h1; --zo1i24-typography-tablet: h1; --zo1i24-typography-mobile: h1; --beae-h3-text-align-tablet: start; --beae-h3-text-align-mobile: start; --beae-h1-text-align: center; }[data-bnode="beae-zo1i24"] { margin-top: var(--zo1i24-margin-top, 0px); margin-right: var(--zo1i24-margin-right, 0px); margin-bottom: var(--zo1i24-margin-bottom, 0px); margin-left: var(--zo1i24-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--zo1i24-margin-top-tablet, 0px); margin-right: var(--zo1i24-margin-right-tablet, 0px); margin-bottom: var(--zo1i24-margin-bottom-tablet, 0px); margin-left: var(--zo1i24-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--zo1i24-margin-top-mobile, 0px); margin-right: var(--zo1i24-margin-right-mobile, 0px); margin-bottom: var(--zo1i24-margin-bottom-mobile, 0px); margin-left: var(--zo1i24-margin-left-mobile, 0px); } & .beae-highlight-svg{ position: absolute; left: 0; width: 100%; height: 15px; z-index: -1; color: var(--zo1i24-highlightColor,var(--beae-p-color)); top: var(--zo1i24-highlightTop, 100%); } }[data-bnode="beae-ohldmk"] { --ohldmk-direction: column; --ohldmk-direction-tablet: column; --ohldmk-direction-mobile: column; --ohldmk-structure: columns; --ohldmk-structure-tablet: columns; --ohldmk-structure-mobile: columns; --ohldmk-max-width: 672px; --ohldmk-max-width-tablet: 672px; --ohldmk-max-width-mobile: 672px; }[data-bnode="beae-ohldmk"] { padding-top: var(--ohldmk-padding-top, var(--beae-slot-padding-y, 0px)); padding-right: var(--ohldmk-padding-right, var(--beae-slot-padding-x, 0px)); padding-bottom: var(--ohldmk-padding-bottom, var(--beae-slot-padding-y, 0px)); padding-left: var(--ohldmk-padding-left, var(--beae-slot-padding-x, 0px)); @media (min-width: 767.98px) and (max-width: 1180px) { padding-top: var(--ohldmk-padding-top-tablet, var(--ohldmk-padding-top, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-right: var(--ohldmk-padding-right-tablet, var(--ohldmk-padding-right, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); padding-bottom: var(--ohldmk-padding-bottom-tablet, var(--ohldmk-padding-bottom, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))); padding-left: var(--ohldmk-padding-left-tablet, var(--ohldmk-padding-left, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))); } @media (max-width: 767px) { padding-top: var(--ohldmk-padding-top-mobile, var(--ohldmk-padding-top-tablet, var(--ohldmk-padding-top, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-right: var(--ohldmk-padding-right-mobile, var(--ohldmk-padding-right-tablet, var(--ohldmk-padding-right, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); padding-bottom: var(--ohldmk-padding-bottom-mobile, var(--ohldmk-padding-bottom-tablet, var(--ohldmk-padding-bottom, var(--beae-slot-padding-y-mobile, var(--beae-slot-padding-y-tablet, var(--beae-slot-padding-y, 0px)))))); padding-left: var(--ohldmk-padding-left-mobile, var(--ohldmk-padding-left-tablet, var(--ohldmk-padding-left, var(--beae-slot-padding-x-mobile, var(--beae-slot-padding-x-tablet, var(--beae-slot-padding-x, 0px)))))); } &.beae-slot { position: var(--ohldmk-position, relative); top: var(--ohldmk-top, auto); right: var(--ohldmk-right, auto); bottom: var(--ohldmk-bottom, auto); left: var(--ohldmk-left, auto); transform: var(--ohldmk-transform, none); z-index: var(--ohldmk-z-index, 10); aspect-ratio: var(--ohldmk-background-imageRatio, auto); background: var(--ohldmk-background-color,transparent); border-style: var(--ohldmk-borderStyle,solid); border-color: var(--ohldmk-borderColor,#000000); border-width: var(--ohldmk-borderWidth-tl,0px) var(--ohldmk-borderWidth-tr,0px) var(--ohldmk-borderWidth-br,0px) var(--ohldmk-borderWidth-bl,0px); border-radius: var(--ohldmk-borderRadius-tl,0px) var(--ohldmk-borderRadius-tr,0px) var(--ohldmk-borderRadius-br,0px) var(--ohldmk-borderRadius-bl,0px); box-shadow: var(--ohldmk-shadowHorizontal, 0px) var(--ohldmk-shadowVertical, 0px) var(--ohldmk-shadowBlur, 0px) 1px color-mix( in srgb, var(--ohldmk-shadowColor, #000000) var(--ohldmk-shadowTransparent, 0%), transparent ); max-width: var(--ohldmk-max-width, 100%); width: 100%; height: if(style(--ohldmk-position: absolute): var(--ohldmk-height,100%); else: unset ); backdrop-filter:blur(var(--ohldmk-background-blur, none)) saturate(var(--ohldmk-background-saturation, 100%)); @media(min-width: 767.79px) and (max-width: 1180px){ position: var(--ohldmk-position-tablet, var(--ohldmk-position, relative)); top: var(--ohldmk-top-tablet, var(--ohldmk-top, auto)); right: var(--ohldmk-right-tablet, var(--ohldmk-right, auto)); bottom: var(--ohldmk-bottom-tablet, var(--ohldmk-bottom, auto)); left: var(--ohldmk-left-tablet, var(--ohldmk-left, auto)); transform: var(--ohldmk-transform-tablet, var(--ohldmk-transform, none)); z-index: var(--ohldmk-z-index-tablet, var(--ohldmk-z-index, 10)); aspect-ratio: var(--ohldmk-background-imageRatio-tablet, var(--ohldmk-background-imageRatio, auto)); border-width: var(--ohldmk-borderWidth-tl-tablet, var(--ohldmk-borderWidth-tl,0px)) var(--ohldmk-borderWidth-tr-tablet,var(--ohldmk-borderWidth-tr,0px)) var(--ohldmk-borderWidth-br-tablet,var(--ohldmk-borderWidth-br,0px)) var(--ohldmk-borderWidth-bl-tablet,var(--ohldmk-borderWidth-bl,0px)); border-radius: var(--ohldmk-borderRadius-tl-tablet,var(--ohldmk-borderRadius-tl,0px)) var(--ohldmk-borderRadius-tr-tablet,var(--ohldmk-borderRadius-tr,0px)) var(--ohldmk-borderRadius-br-tablet,var(--ohldmk-borderRadius-br,0px)) var(--ohldmk-borderRadius-bl-tablet,var(--ohldmk-borderRadius-bl,0px)); max-width: var(--ohldmk-max-width-tablet, var(--ohldmk-max-width, 100%)); height: if(style(--ohldmk-position-tablet: absolute): var(--ohldmk-height-tablet,var(--ohldmk-height,100%)); else: unset ); } @media(max-width: 767px){ position: var(--ohldmk-position-mobile, var(--ohldmk-position-tablet, var(--ohldmk-position, relative))); top: var(--ohldmk-top-mobile, var(--ohldmk-top-tablet, var(--ohldmk-top, auto))); right: var(--ohldmk-right-mobile, var(--ohldmk-right-tablet, var(--ohldmk-right, auto))); bottom: var(--ohldmk-bottom-mobile, var(--ohldmk-bottom-tablet, var(--ohldmk-bottom, auto))); left: var(--ohldmk-left-mobile, var(--ohldmk-left-tablet, var(--ohldmk-left, auto))); transform: var(--ohldmk-transform-mobile, var(--ohldmk-transform-tablet, var(--ohldmk-transform, none))); z-index: var(--ohldmk-z-index-mobile, var(--ohldmk-z-index-tablet, var(--ohldmk-z-index, 10))); aspect-ratio: var(--ohldmk-background-imageRatio-mobile, var(--ohldmk-background-imageRatio, auto)); border-width: var(--ohldmk-borderWidth-tl-mobile, var(--ohldmk-borderWidth-tl,0px)) var(--ohldmk-borderWidth-tr-mobile,var(--ohldmk-borderWidth-tr,0px)) var(--ohldmk-borderWidth-br-mobile,var(--ohldmk-borderWidth-br,0px)) var(--ohldmk-borderWidth-bl-mobile,var(--ohldmk-borderWidth-bl,0px)); border-radius: var(--ohldmk-borderRadius-tl-mobile,var(--ohldmk-borderRadius-tl,0px)) var(--ohldmk-borderRadius-tr-mobile,var(--ohldmk-borderRadius-tr,0px)) var(--ohldmk-borderRadius-br-mobile,var(--ohldmk-borderRadius-br,0px)) var(--ohldmk-borderRadius-bl-mobile,var(--ohldmk-borderRadius-bl,0px)); max-width: var(--ohldmk-max-width-mobile, var(--ohldmk-max-width, 100%)); height: if(style(--ohldmk-position-mobile: absolute): var(--ohldmk-height-mobile,var(--ohldmk-height-tablet,,var(--ohldmk-height,100%))); else: unset ); } &.beae-surface-light, &.beae-surface-muted, &.beae-surface-dark, &.beae-surface-accent{ background: var(--ohldmk-background-color,var(--beae-background-color)); } &.beae-featured-card, &.beae-product-card, &.beae-pricing-card, &.beae-cta-card{ gap: var(--ohldmk-gap,var(--beae-card-gap)); padding-top: var(--ohldmk-padding-top,var(--beae-card-padding)); padding-right: var(--ohldmk-padding-right,var(--beae-card-padding)); padding-bottom: var(--ohldmk-padding-bottom,var(--beae-card-padding)); padding-left: var(--ohldmk-padding-left,var(--beae-card-padding)); border-width: var(--ohldmk-borderWidth-tl,var(--beae-card-border-width)) var(--ohldmk-borderWidth-tr,var(--beae-card-border-width)) var(--ohldmk-borderWidth-br,var(--beae-card-border-width)) var(--ohldmk-borderWidth-bl,var(--beae-card-border-width)); border-radius: var(--ohldmk-borderRadius-tl,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-tr,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-br,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-bl,var(--beae-card-border-radius)); backdrop-filter:blur(var(--ohldmk-background-blur, var(--beae-card-backdrop-blur))) saturate(var(--ohldmk-background-saturation, var(--beae-card-backdrop-saturate))); @media (min-width: 767.79px) and (max-width: 1180px) { gap: var(--ohldmk-gap-tablet,var(--beae-card-gap)); padding-top: var(--ohldmk-padding-top-tablet,var(--beae-card-padding)); padding-right: var(--ohldmk-padding-right-tablet,var(--beae-card-padding)); padding-bottom: var(--ohldmk-padding-bottom-tablet,var(--beae-card-padding)); padding-left: var(--ohldmk-padding-left-tablet,var(--beae-card-padding)); border-width: var(--ohldmk-borderWidth-tl-tablet,var(--beae-card-border-width)) var(--ohldmk-borderWidth-tr-tablet,var(--beae-card-border-width)) var(--ohldmk-borderWidth-br-desktop,var(--beae-card-border-width)) var(--ohldmk-borderWidth-bl-desktop,var(--beae-card-border-width)); border-radius: var(--ohldmk-borderRadius-tl-tablet,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-tr-tablet,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-br-tablet,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-bl-tablet,var(--beae-card-border-radius)); } @media (max-width: 767px) { gap: var(--ohldmk-gap-mobile,var(--beae-card-gap)); padding-top: var(--ohldmk-padding-top-mobile,var(--beae-card-padding)); padding-right: var(--ohldmk-padding-right-mobile,var(--beae-card-padding)); padding-bottom: var(--ohldmk-padding-bottom-mobile,var(--beae-card-padding)); padding-left: var(--ohldmk-padding-left-mobile,var(--beae-card-padding)); border-width: var(--ohldmk-borderWidth-tl-mobile,var(--beae-card-border-width)) var(--ohldmk-borderWidth-tr-mobile,var(--beae-card-border-width)) var(--ohldmk-borderWidth-br-mobile,var(--beae-card-border-width)) var(--ohldmk-borderWidth-bl-mobile,var(--beae-card-border-width)); border-radius: var(--ohldmk-borderRadius-tl-mobile,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-tr-mobile,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-br-mobile,var(--beae-card-border-radius)) var(--ohldmk-borderRadius-bl-mobile,var(--beae-card-border-radius)); } } &.beae-featured-card{ background: var(--ohldmk-background-color,var(--beae-card-featured-background)); border-color: var(--ohldmk-borderColor,var(--beae-card-featured-border-color)); box-shadow: var(--ohldmk-shadowHorizontal, var(--beae-card-shadow-x)) var(--ohldmk-shadowVertical, var(--beae-card-shadow-y)) var(--ohldmk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ohldmk-shadowColor, var(--beae-card-featured-shadow-color)) var(--ohldmk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-product-card{ background: var(--ohldmk-background-color,var(--beae-card-prod-background)); border-color: var(--ohldmk-borderColor,var(--beae-card-prod-border-color)); box-shadow: var(--ohldmk-shadowHorizontal, var(--beae-card-shadow-x)) var(--ohldmk-shadowVertical, var(--beae-card-shadow-y)) var(--ohldmk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ohldmk-shadowColor, var(--beae-card-prod-shadow-color)) var(--ohldmk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-pricing-card{ background: var(--ohldmk-background-color,var(--beae-card-pricing-background)); border-color: var(--ohldmk-borderColor,var(--beae-card-pricing-border-color)); box-shadow: var(--ohldmk-shadowHorizontal, var(--beae-card-shadow-x)) var(--ohldmk-shadowVertical, var(--beae-card-shadow-y)) var(--ohldmk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ohldmk-shadowColor, var(--beae-card-pricing-shadow-color)) var(--ohldmk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } &.beae-cta-card{ background: var(--ohldmk-background-color,var(--beae-card-cta-background)); border-color: var(--ohldmk-borderColor,var(--beae-card-cta-border-color)); box-shadow: var(--ohldmk-shadowHorizontal, var(--beae-card-shadow-x)) var(--ohldmk-shadowVertical, var(--beae-card-shadow-y)) var(--ohldmk-shadowBlur, var(--beae-card-shadow-blur)) 1px color-mix( in srgb, var(--ohldmk-shadowColor, var(--beae-card-cta-shadow-color)) var(--ohldmk-shadowTransparent, var(--beae-card-shadow-transparent)), transparent ); } } }[data-bnode="beae-ohldmk"] {     display: flex;     flex-direction: var(--ohldmk-direction, column);     flex-wrap: nowrap;     justify-content: var(--ohldmk-justify-content);     align-items: var(--ohldmk-align-items);     gap: var(--ohldmk-gap, var(--ohldmk-gap, var(--beae-slot-gap)));              }    @media (min-width: 767.79px) and (max-width: 1180px) {     [data-bnode="beae-ohldmk"] {                            gap: var(--ohldmk-gap-tablet, var(--beae-slot-gap-tablet));               &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--ohldmk-padding-right-tablet, 0px) - var(--ohldmk-padding-right-tablet, 0px));           }                      }    }    @media (max-width: 767px) {     [data-bnode="beae-ohldmk"] {                            gap: var(--ohldmk-gap-mobile, var(--beae-slot-gap-mobile));              &>.beae-slot {          flex: 1 1 0;          min-width: 0;         }                   &>.beae-slot[data-bnode-index] {            flex-basis: calc(100.00% - var(--ohldmk-padding-right-mobile, 0px) - var(--ohldmk-padding-right-mobile, 0px));           }                      }    }[data-bnode="beae-ohs7xd"] { --beae-p-text-align-tablet: start; --beae-p-text-align-mobile: start; --ohs7xd-typography: p3; --ohs7xd-typography-tablet: p3; --ohs7xd-typography-mobile: p3; --beae-p3-text-align: center; }[data-bnode="beae-ohs7xd"] { margin-top: var(--ohs7xd-margin-top, 0px); margin-right: var(--ohs7xd-margin-right, 0px); margin-bottom: var(--ohs7xd-margin-bottom, 0px); margin-left: var(--ohs7xd-margin-left, 0px); @media (min-width: 767.98px) and (max-width: 1180px) { margin-top: var(--ohs7xd-margin-top-tablet, 0px); margin-right: var(--ohs7xd-margin-right-tablet, 0px); margin-bottom: var(--ohs7xd-margin-bottom-tablet, 0px); margin-left: var(--ohs7xd-margin-left-tablet, 0px); } @media (max-width: 767px) { margin-top: var(--ohs7xd-margin-top-mobile, 0px); margin-right: var(--ohs7xd-margin-right-mobile, 0px); margin-bottom: var(--ohs7xd-margin-bottom-mobile, 0px); margin-left: var(--ohs7xd-margin-left-mobile, 0px); } }