/* ==========================================================================
   Elementor Bento Lite 5.0.8
   Activation:
   - Base class: .shape-mask
   - Variants:
     - .shape-mask--left-notch
     - .shape-mask--diagonal-tabs
     - .shape-mask--bento-builder
   - Optional attribute alternative:
     - data-shape="left-notch"
     - data-shape="diagonal-tabs"
     - data-shape="bento-builder"

   Per-instance configuration:
   - CSS variables from global CSS, preset classes, or inline style attribute
   - data-shape-* attributes for geometric values read by JS
   ========================================================================== */

.shape-mask {
  --shape-radius: 1em;
  --shape-notch-depth: 2.25em;
  --shape-notch-span: 2.75em;
  --shape-tab-width: 9em;
  --shape-tab-height: 1.75em;
  --shape-edge-mode: none;
  --shape-edge-size: 10em;
  --shape-edge-depth: 1.5em;
  --shape-edge-angle: 38;
  --shape-edge-start-angle: var(--shape-edge-angle);
  --shape-edge-end-angle: var(--shape-edge-angle);
  --shape-edge-align: center;
  --shape-stroke-width: 1px;
  --shape-stroke-color: rgba(15, 23, 42, 0.12);
  --shape-border-z-index: 3;
  --shape-shadow: 0 18px 44px rgba(15, 23, 42, 0.16);
  --shape-media-opacity: 1;
  --shape-noise-opacity: 0;
  --shape-corner-mode: radius;
  --shape-noise-size: 180px;
  --shape-noise-contrast: 170%;
  --shape-noise-gamma: 0.85;
  --shape-noise-detail: 4;
  --shape-noise-blend-mode: overlay;
  --shape-glass-enabled: 0;
  --shape-glass-preset: custom;
  --shape-glass-editor-preview-mode: auto;
  --shape-glass-intensity: 1;

  position: relative;
  background-color: transparent;
  block-size: auto;
  min-block-size: var(--shape-min-block-size, 0px);
  overflow: visible;
  isolation: isolate;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-mode: alpha;
  mask-mode: alpha;
  -webkit-mask-image: var(--shape-mask-image, linear-gradient(#fff, #fff));
  mask-image: var(--shape-mask-image, linear-gradient(#fff, #fff));
  -webkit-filter: var(--shape-shadow-filter, none);
  filter: var(--shape-shadow-filter, none);
}

.shape-mask-preview-host {
  -webkit-mask-image: none !important;
  mask-image: none !important;
  -webkit-filter: none !important;
  filter: none !important;
}

.shape-mask-preview-host > .e-con-inner {
  -webkit-mask-image: var(--shape-mask-image, none);
  mask-image: var(--shape-mask-image, none);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  overflow: hidden;
}

.shape-mask__editor-content-surface {
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  overflow: hidden;
  position: relative;
  z-index: 1;
  isolation: isolate;
}

.shape-mask-preview-host > .shape-mask__editor-shell {
  position: absolute;
  inset: 0;
  background-color: transparent;
  box-sizing: border-box;
}



.shape-mask > .shape-mask__overlay {
  position: absolute;
  inset: 0;
  z-index: var(--shape-border-z-index, 4);
  pointer-events: none;
  display: block;
  color: var(--shape-stroke-color, currentColor);
  transform: translateZ(0);
}

.shape-mask__native-frame {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
  display: block;
  box-sizing: border-box;
  background: none !important;
}

.shape-mask__shadow {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  display: block;
  overflow: visible;
}

.shape-mask__shadow svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.shape-mask__shadow .shape-mask__shadow-path {
  fill: #fff;
  stroke: none;
}

.shape-mask > .shape-mask__overlay[hidden],
.shape-mask > .shape-mask__glass[hidden],
.shape-mask > .shape-mask__glass-base[hidden],
.shape-mask > .shape-mask__native-frame[hidden],
.shape-mask > .shape-mask__shadow[hidden] {
  display: none;
}

.shape-mask > .shape-mask__overlay svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.shape-mask > .shape-mask__overlay .shape-mask__border-path {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  shape-rendering: geometricPrecision;
}

.shape-mask > .shape-mask__overlay .shape-mask__glass-border-path {
  fill: none;
  stroke: var(--shape-glass-current-border-color, rgba(255, 255, 255, 0.34));
  stroke-linecap: round;
  stroke-linejoin: round;
  shape-rendering: geometricPrecision;
  vector-effect: non-scaling-stroke;
}

.shape-mask > .shape-mask__media,
.shape-mask > .shape-mask__noise {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.shape-mask > .shape-mask__media {
  z-index: 0;
  overflow: hidden;
}

.shape-mask > .shape-mask__media video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center center;
  opacity: var(--shape-media-opacity, 1);
}

.shape-mask > .shape-mask__noise {
  z-index: 2;
  opacity: var(--shape-noise-opacity, 0);
  mix-blend-mode: var(--shape-noise-blend-mode, overlay);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.92' numOctaves='4' seed='7' stitchTiles='stitch' result='grain'/%3E%3CfeColorMatrix in='grain' type='saturate' values='0' result='mono'/%3E%3CfeComponentTransfer in='mono' result='gamma'%3E%3CfeFuncR type='gamma' amplitude='1' exponent='0.85' offset='0'/%3E%3CfeFuncG type='gamma' amplitude='1' exponent='0.85' offset='0'/%3E%3CfeFuncB type='gamma' amplitude='1' exponent='0.85' offset='0'/%3E%3C/feComponentTransfer%3E%3CfeColorMatrix in='gamma' type='matrix' values='1.7 0 0 0 -0.35 0 1.7 0 0 -0.35 0 0 1.7 0 -0.35 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: var(--shape-noise-size, 180px) var(--shape-noise-size, 180px);
}

.shape-mask > *:not(.shape-mask__media):not(.shape-mask__noise):not(.shape-mask__glass):not(.shape-mask__glass-base):not(.shape-mask__overlay):not(.shape-mask__native-frame) {
  position: relative;
  z-index: 3;
}

.shape-mask > .e-con-inner,
.shape-mask > .shape-mask__editor-content-surface {
  background-color: transparent;
}

.shape-mask.shape-mask--diagonal-tabs,
.shape-mask[data-shape="diagonal-tabs"] {
  --shape-top-tab-width: 18em;
  --shape-top-tab-height: 2em;
  --shape-bottom-tab-width: 9em;
  --shape-bottom-tab-height: 1.5em;
}

.shape-mask.shape-mask--bento-builder,
.shape-mask[data-shape="bento-builder"] {
  --shape-top-features: none;
  --shape-right-features: none;
  --shape-bottom-features: none;
  --shape-left-features: none;

  --shape-top-mode: none;
  --shape-top-size: 10em;
  --shape-top-depth: 2em;
  --shape-top-start-angle: 52;
  --shape-top-end-angle: 52;
  --shape-top-align: 82%;

  --shape-right-mode: none;
  --shape-right-size: 8em;
  --shape-right-depth: 1.25em;
  --shape-right-start-angle: 42;
  --shape-right-end-angle: 42;
  --shape-right-align: center;

  --shape-bottom-mode: none;
  --shape-bottom-size: 10em;
  --shape-bottom-depth: 1.25em;
  --shape-bottom-start-angle: 40;
  --shape-bottom-end-angle: 40;
  --shape-bottom-align: center;

  --shape-left-mode: none;
  --shape-left-size: 8em;
  --shape-left-depth: 1.25em;
  --shape-left-start-angle: 42;
  --shape-left-end-angle: 42;
  --shape-left-align: center;
}



/* ========================================================================== 
   Glass Layer
   --------------------------------------------------------------------------
   Pure CSS visual layer rendered only on .shape-mask / .shape-mask__editor-shell.
   Presets provide soft defaults; manual vars win through the fallback chain.
   Layer order: shadow -> media/noise -> glass -> content -> shape overlay.
   ========================================================================== */

.shape-mask {
  --shape-glass-preset-blur: 32px;
  --shape-glass-preset-opacity: 0.65;
  --shape-glass-preset-tint: rgba(255, 255, 255, 0.18);
  --shape-glass-preset-border-color: rgba(255, 255, 255, 0.34);
  --shape-glass-preset-border-width: 0px;
  --shape-glass-preset-highlight-opacity: 0.5;
  --shape-glass-preset-saturation: 176%;
  --shape-glass-preset-fallback-opacity: 0.28;
  --shape-glass-current-blur: var(--shape-glass-blur, var(--shape-glass-preset-blur));
  --shape-glass-current-opacity: var(--shape-glass-opacity, var(--shape-glass-preset-opacity));
  --shape-glass-current-tint: var(--shape-glass-tint, var(--shape-glass-preset-tint));
  --shape-glass-current-border-color: var(--shape-glass-border-color, var(--shape-glass-preset-border-color));
  --shape-glass-current-border-width: var(--shape-glass-border-width, var(--shape-glass-preset-border-width));
  --shape-glass-current-highlight-opacity: var(--shape-glass-highlight-opacity, var(--shape-glass-preset-highlight-opacity));
  --shape-glass-current-saturation: var(--shape-glass-saturation, var(--shape-glass-preset-saturation));
  --shape-glass-auto-fallback-opacity: clamp(0.12, calc((var(--shape-glass-current-opacity) * 1.18) + 0.08), 0.72);
  --shape-glass-current-fallback-opacity: var(--shape-glass-fallback-opacity, var(--shape-glass-auto-fallback-opacity));
  --shape-glass-current-intensity: clamp(0, var(--shape-glass-intensity, 1.5), 2);
  --shape-glass-visual-opacity: clamp(0, calc(var(--shape-glass-current-opacity) * var(--shape-glass-current-intensity)), 1);
  --shape-glass-highlight-visual-opacity: clamp(0, calc(var(--shape-glass-current-highlight-opacity) * (0.7 + (var(--shape-glass-current-intensity) * 0.3))), 1);
  --shape-glass-fallback-visual-opacity: clamp(0, calc(var(--shape-glass-current-fallback-opacity) * var(--shape-glass-current-intensity)), 1);
  --shape-glass-visual-border-width: calc(var(--shape-glass-current-border-width) * (0.8 + (var(--shape-glass-current-intensity) * 0.2)));
}

.shape-mask[data-shape-glass-preset="soft"] {
  --shape-glass-preset-blur: 32px;
  --shape-glass-preset-opacity: 0.65;
  --shape-glass-preset-tint: rgba(255, 255, 255, 0.18);
  --shape-glass-preset-border-color: rgba(255, 255, 255, 0.34);
  --shape-glass-preset-border-width: 0px;
  --shape-glass-preset-highlight-opacity: 0.5;
  --shape-glass-preset-saturation: 176%;
  --shape-glass-preset-fallback-opacity: 0.28;
}

.shape-mask[data-shape-glass-preset="frosted"] {
  --shape-glass-preset-blur: 26px;
  --shape-glass-preset-opacity: 0.28;
  --shape-glass-preset-tint: rgba(255, 255, 255, 0.22);
  --shape-glass-preset-border-color: rgba(255, 255, 255, 0.40);
  --shape-glass-preset-border-width: 1px;
  --shape-glass-preset-highlight-opacity: 0.42;
  --shape-glass-preset-saturation: 155%;
  --shape-glass-preset-fallback-opacity: 0.34;
}

.shape-mask[data-shape-glass-preset="floating"] {
  --shape-glass-preset-blur: 14px;
  --shape-glass-preset-opacity: 0.18;
  --shape-glass-preset-tint: rgba(255, 255, 255, 0.14);
  --shape-glass-preset-border-color: rgba(255, 255, 255, 0.30);
  --shape-glass-preset-border-width: 1px;
  --shape-glass-preset-highlight-opacity: 0.32;
  --shape-glass-preset-saturation: 128%;
  --shape-glass-preset-fallback-opacity: 0.22;
}

.shape-mask[data-shape-glass-preset="outline"] {
  --shape-glass-preset-blur: 8px;
  --shape-glass-preset-opacity: 0.12;
  --shape-glass-preset-tint: rgba(255, 255, 255, 0.08);
  --shape-glass-preset-border-color: rgba(255, 255, 255, 0.42);
  --shape-glass-preset-border-width: 1px;
  --shape-glass-preset-highlight-opacity: 0.20;
  --shape-glass-preset-saturation: 118%;
  --shape-glass-preset-fallback-opacity: 0.16;
}

.shape-mask[data-shape-glass-preset="custom"] {
  --shape-glass-preset-blur: 32px;
  --shape-glass-preset-opacity: 0.65;
  --shape-glass-preset-tint: rgba(255, 255, 255, 0.18);
  --shape-glass-preset-border-color: rgba(255, 255, 255, 0.34);
  --shape-glass-preset-border-width: 0px;
  --shape-glass-preset-highlight-opacity: 0.5;
  --shape-glass-preset-saturation: 176%;
  --shape-glass-preset-fallback-opacity: 0.28;
}

.shape-mask {
  --shape-glass-preset-lowlight-opacity: 0.5;
  --shape-glass-preset-light-angle: 45deg;
  --shape-glass-current-lowlight-opacity: var(--shape-glass-lowlight-opacity, var(--shape-glass-preset-lowlight-opacity));
  --shape-glass-current-light-angle: var(--shape-glass-light-angle, var(--shape-glass-preset-light-angle));
  --shape-glass-lowlight-visual-opacity: clamp(0, calc(var(--shape-glass-current-lowlight-opacity) * (0.7 + (var(--shape-glass-current-intensity) * 0.3))), 1);
}

.shape-mask[data-shape-glass-preset="soft"] {
  --shape-glass-preset-lowlight-opacity: 0.5;
  --shape-glass-preset-light-angle: 45deg;
}

.shape-mask[data-shape-glass-preset="frosted"] {
  --shape-glass-preset-lowlight-opacity: 0.22;
  --shape-glass-preset-light-angle: 180deg;
}

.shape-mask[data-shape-glass-preset="floating"] {
  --shape-glass-preset-lowlight-opacity: 0.14;
  --shape-glass-preset-light-angle: 180deg;
}

.shape-mask[data-shape-glass-preset="outline"] {
  --shape-glass-preset-lowlight-opacity: 0.10;
  --shape-glass-preset-light-angle: 180deg;
}

.shape-mask[data-shape-glass-preset="custom"] {
  --shape-glass-preset-lowlight-opacity: 0.5;
  --shape-glass-preset-light-angle: 45deg;
}

.shape-mask[data-shape-glass-preset] {
  isolation: auto;
}

.shape-mask[data-shape-glass-render-mode="simulated"] {
  isolation: isolate;
}

.shape-mask > .shape-mask__glass-base,
.shape-mask > .shape-mask__glass {
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
  overflow: hidden;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-mask-image: var(--shape-mask-image, linear-gradient(#fff, #fff));
  mask-image: var(--shape-mask-image, linear-gradient(#fff, #fff));
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.shape-mask > .shape-mask__glass-base {
  z-index: 1;
  background: var(--shape-glass-current-tint);
  opacity: calc(var(--shape-glass-enabled, 0) * var(--shape-glass-fallback-visual-opacity));
  transition: none;
  will-change: auto;
}

.shape-mask > .shape-mask__glass {
  z-index: 2;
  background: transparent;
  opacity: calc(var(--shape-glass-enabled, 0) * var(--shape-glass-visual-opacity, var(--shape-glass-current-opacity, 1)));
  transition: none;
  will-change: auto;
}

.shape-mask > .shape-mask__glass::before,
.shape-mask > .shape-mask__glass::after {
  content: "";
  position: absolute;
  inset: -1px;
  display: block;
  pointer-events: none;
}

.shape-mask > .shape-mask__glass::before {
  background:
    linear-gradient(
      var(--shape-glass-current-light-angle),
      rgba(255, 255, 255, 0.70) 0%,
      rgba(255, 255, 255, 0.20) 18%,
      rgba(255, 255, 255, 0.05) 36%,
      rgba(255, 255, 255, 0) 58%
    );
  opacity: calc(var(--shape-glass-enabled, 0) * var(--shape-glass-highlight-visual-opacity));
}

.shape-mask > .shape-mask__glass::after {
  background:
    linear-gradient(
      calc(var(--shape-glass-current-light-angle) + 180deg),
      rgba(0, 0, 0, 0.22) 0%,
      rgba(0, 0, 0, 0.10) 24%,
      rgba(0, 0, 0, 0.03) 46%,
      rgba(0, 0, 0, 0) 68%
    );
  opacity: calc(var(--shape-glass-enabled, 0) * var(--shape-glass-lowlight-visual-opacity));
}

.shape-mask[data-shape-glass-render-mode="simulated"] > .shape-mask__glass-base {
  opacity: calc(var(--shape-glass-enabled, 0) * max(var(--shape-glass-visual-opacity), var(--shape-glass-fallback-visual-opacity)));
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.shape-mask[data-shape-glass-render-mode="simulated"] > .shape-mask__glass::before {
  opacity: clamp(0, calc(var(--shape-glass-highlight-visual-opacity) * 1.1), 1);
}

.shape-mask[data-shape-glass-render-mode="simulated"] > .shape-mask__glass::after {
  opacity: clamp(0, calc(var(--shape-glass-lowlight-visual-opacity) * 0.9), 1);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .shape-mask[data-shape-glass-preview-mode="auto"] > .shape-mask__glass-base,
  .shape-mask[data-shape-glass-preview-mode="glass"] > .shape-mask__glass-base,
  .shape-mask:not([data-shape-glass-preview-mode]) > .shape-mask__glass-base {
    opacity: calc(var(--shape-glass-enabled, 0) * var(--shape-glass-visual-opacity));
    -webkit-backdrop-filter: blur(calc(var(--shape-glass-current-blur) * var(--shape-glass-current-intensity))) saturate(var(--shape-glass-current-saturation));
    backdrop-filter: blur(calc(var(--shape-glass-current-blur) * var(--shape-glass-current-intensity))) saturate(var(--shape-glass-current-saturation));
  }
}

@media (max-width: 1024px) {
  .shape-mask {
    --shape-glass-current-blur: var(--shape-glass-blur-tablet, var(--shape-glass-blur, var(--shape-glass-preset-blur)));
    --shape-glass-current-opacity: var(--shape-glass-opacity-tablet, var(--shape-glass-opacity, var(--shape-glass-preset-opacity)));
    --shape-glass-current-tint: var(--shape-glass-tint-tablet, var(--shape-glass-tint, var(--shape-glass-preset-tint)));
    --shape-glass-current-border-color: var(--shape-glass-border-color-tablet, var(--shape-glass-border-color, var(--shape-glass-preset-border-color)));
    --shape-glass-current-border-width: var(--shape-glass-border-width-tablet, var(--shape-glass-border-width, var(--shape-glass-preset-border-width)));
    --shape-glass-current-highlight-opacity: var(--shape-glass-highlight-opacity-tablet, var(--shape-glass-highlight-opacity, var(--shape-glass-preset-highlight-opacity)));
    --shape-glass-current-lowlight-opacity: var(--shape-glass-lowlight-opacity-tablet, var(--shape-glass-lowlight-opacity, var(--shape-glass-preset-lowlight-opacity)));
    --shape-glass-current-saturation: var(--shape-glass-saturation-tablet, var(--shape-glass-saturation, var(--shape-glass-preset-saturation)));
    --shape-glass-current-fallback-opacity: var(--shape-glass-fallback-opacity-tablet, var(--shape-glass-fallback-opacity, var(--shape-glass-preset-fallback-opacity)));
    --shape-glass-current-light-angle: var(--shape-glass-light-angle-tablet, var(--shape-glass-light-angle, var(--shape-glass-preset-light-angle)));
    --shape-glass-current-intensity: clamp(0, var(--shape-glass-intensity-tablet, var(--shape-glass-intensity, 1.5)), 2);
  }
}

@media (max-width: 767px) {
  .shape-mask {
    --shape-glass-current-blur: var(--shape-glass-blur-mobile, var(--shape-glass-blur-tablet, var(--shape-glass-blur, var(--shape-glass-preset-blur))));
    --shape-glass-current-opacity: var(--shape-glass-opacity-mobile, var(--shape-glass-opacity-tablet, var(--shape-glass-opacity, var(--shape-glass-preset-opacity))));
    --shape-glass-current-tint: var(--shape-glass-tint-mobile, var(--shape-glass-tint-tablet, var(--shape-glass-tint, var(--shape-glass-preset-tint))));
    --shape-glass-current-border-color: var(--shape-glass-border-color-mobile, var(--shape-glass-border-color-tablet, var(--shape-glass-border-color, var(--shape-glass-preset-border-color))));
    --shape-glass-current-border-width: var(--shape-glass-border-width-mobile, var(--shape-glass-border-width-tablet, var(--shape-glass-border-width, var(--shape-glass-preset-border-width))));
    --shape-glass-current-highlight-opacity: var(--shape-glass-highlight-opacity-mobile, var(--shape-glass-highlight-opacity-tablet, var(--shape-glass-highlight-opacity, var(--shape-glass-preset-highlight-opacity))));
    --shape-glass-current-lowlight-opacity: var(--shape-glass-lowlight-opacity-mobile, var(--shape-glass-lowlight-opacity-tablet, var(--shape-glass-lowlight-opacity, var(--shape-glass-preset-lowlight-opacity))));
    --shape-glass-current-saturation: var(--shape-glass-saturation-mobile, var(--shape-glass-saturation-tablet, var(--shape-glass-saturation, var(--shape-glass-preset-saturation))));
    --shape-glass-current-fallback-opacity: var(--shape-glass-fallback-opacity-mobile, var(--shape-glass-fallback-opacity-tablet, var(--shape-glass-fallback-opacity, var(--shape-glass-preset-fallback-opacity))));
    --shape-glass-current-light-angle: var(--shape-glass-light-angle-mobile, var(--shape-glass-light-angle-tablet, var(--shape-glass-light-angle, var(--shape-glass-preset-light-angle))));
    --shape-glass-current-intensity: clamp(0, var(--shape-glass-intensity-mobile, var(--shape-glass-intensity-tablet, var(--shape-glass-intensity, 1.5))), 2);
  }
}
/* ==========================================================================
   Editor preview isolation
   --------------------------------------------------------------------------
   In Elementor editor we render the Bento mask on an internal visual shell
   instead of the structural .e-con host, so the editor box model and handles
   stay stable while the shape preview remains visible.
   ========================================================================== */

.shape-mask-preview-host {
  position: relative;
  background-color: transparent;
  overflow: visible !important;
  isolation: isolate;
}

.shape-mask-preview-host[data-bento-runtime-source="elementor-preview-template"],
.shape-mask-preview-host[data-bento-runtime-source="elementor-editor-bridge"] {
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.shape-mask-preview-host > .shape-mask__editor-shell {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  pointer-events: none;
}

.shape-mask-preview-host > .e-con-inner,
.shape-mask-preview-host > .shape-mask__editor-content-surface {
  position: relative;
  background-color: transparent;
  z-index: 1;
}

.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .shape-mask__editor-shell,
.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .shape-mask__shadow,
.shape-mask-preview-host[data-bento-preview-content-mode="generated-surface"] > .shape-mask__editor-shell,
.shape-mask-preview-host[data-bento-preview-content-mode="generated-surface"] > .shape-mask__shadow {
  z-index: 1;
  pointer-events: none;
}

.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .elementor-element:not(.elementor-element-overlay),
.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .e-con,
.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .e-child,
.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .elementor-widget {
  position: relative;
  z-index: 3;
}

.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .elementor-shape-top,
.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .elementor-shape-bottom,
.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .ui-resizable-handle,
.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .elementor-element-overlay,
.shape-mask-preview-host[data-bento-preview-content-mode="direct-children"] > .elementor-bento-lite-preview-marker,
.shape-mask-preview-host[data-bento-preview-content-mode="generated-surface"] > .elementor-shape-top,
.shape-mask-preview-host[data-bento-preview-content-mode="generated-surface"] > .elementor-shape-bottom,
.shape-mask-preview-host[data-bento-preview-content-mode="generated-surface"] > .ui-resizable-handle,
.shape-mask-preview-host[data-bento-preview-content-mode="generated-surface"] > .elementor-element-overlay,
.shape-mask-preview-host[data-bento-preview-content-mode="generated-surface"] > .elementor-bento-lite-preview-marker {
  pointer-events: none;
}

.elementor-editor-active .shape-mask-preview-host > .elementor-element-overlay {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.elementor-editor-active .shape-mask-preview-host > .elementor-element-overlay::before,
.elementor-editor-active .shape-mask-preview-host > .elementor-element-overlay::after {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}