:root {
  --cp-shape-icon: url("../shapes/cp-icon-lightblue.svg");
  --cp-shape-opacity: 0.8;
  --cp-shape-section-min-height: 100vh;
}

@supports (height: 100svh) {
  :root {
    --cp-shape-section-min-height: 100svh;
  }
}

html[data-theme="dark"] {
  --cp-shape-icon: url("../shapes/cp-icon-darkblue.svg");
}


.site-main,
#content,
.elementor {
  background: transparent;
}

.cp-shape-group-left,
.cp-shape-group-right,
.elementor .e-con.cp-shape-group-left,
.elementor .e-con.cp-shape-group-right,
.elementor .elementor-section.cp-shape-group-left,
.elementor .elementor-section.cp-shape-group-right {
  --cp-shape-group-offset-x: 60vw;

  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.cp-shape-group-left > *,
.cp-shape-group-right > *,
.elementor .e-con.cp-shape-group-left > *,
.elementor .e-con.cp-shape-group-right > *,
.elementor .elementor-section.cp-shape-group-left > *,
.elementor .elementor-section.cp-shape-group-right > * {
  position: relative;
  z-index: 2;
}

.cp-shape-group-left::before,
.cp-shape-group-right::before,
.elementor .e-con.cp-shape-group-left::before,
.elementor .e-con.cp-shape-group-right::before,
.elementor .elementor-section.cp-shape-group-left::before,
.elementor .elementor-section.cp-shape-group-right::before {
  background-image: var(--cp-shape-icon);
  background-repeat: no-repeat;
  background-size: auto 100%;
  content: "";
  inset: 0;
  opacity: var(--cp-shape-opacity);
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.cp-shape-group-left::before,
.elementor .e-con.cp-shape-group-left::before,
.elementor .elementor-section.cp-shape-group-left::before {
  background-position-x: right var(--cp-shape-group-offset-x);
  background-position-y: center;
}

.cp-shape-group-right::before,
.elementor .e-con.cp-shape-group-right::before,
.elementor .elementor-section.cp-shape-group-right::before {
  background-position-x: left var(--cp-shape-group-offset-x);
  background-position-y: center;
}

.cp-shape-group-left.cp-shape-group-single-upper::before,
.cp-shape-group-right.cp-shape-group-single-upper::before,
.elementor .e-con.cp-shape-group-left.cp-shape-group-single-upper::before,
.elementor .e-con.cp-shape-group-right.cp-shape-group-single-upper::before,
.elementor .elementor-section.cp-shape-group-left.cp-shape-group-single-upper::before,
.elementor .elementor-section.cp-shape-group-right.cp-shape-group-single-upper::before {
  background-size: auto 200%;
  background-position-y: top;
}

.cp-shape-group-left.cp-shape-group-single-lower::before,
.cp-shape-group-right.cp-shape-group-single-lower::before,
.elementor .e-con.cp-shape-group-left.cp-shape-group-single-lower::before,
.elementor .e-con.cp-shape-group-right.cp-shape-group-single-lower::before,
.elementor .elementor-section.cp-shape-group-left.cp-shape-group-single-lower::before,
.elementor .elementor-section.cp-shape-group-right.cp-shape-group-single-lower::before {
  background-size: auto 200%;
  background-position-y: bottom;
}

.cp-shape-left-upper,
.cp-shape-left-lower,
.cp-shape-right-upper,
.cp-shape-right-lower,
.elementor .e-con.cp-shape-left-upper,
.elementor .e-con.cp-shape-left-lower,
.elementor .e-con.cp-shape-right-upper,
.elementor .e-con.cp-shape-right-lower,
.elementor .elementor-section.cp-shape-left-upper,
.elementor .elementor-section.cp-shape-left-lower,
.elementor .elementor-section.cp-shape-right-upper,
.elementor .elementor-section.cp-shape-right-lower {
  --cp-shape-width: 180vw;
  --cp-shape-height: 180%;
  --cp-shape-side-offset: -145vw;
  --cp-shape-vertical-offset: -35%;

  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.cp-shape-left-upper > *,
.cp-shape-left-lower > *,
.cp-shape-right-upper > *,
.cp-shape-right-lower > *,
.elementor .e-con.cp-shape-left-upper > *,
.elementor .e-con.cp-shape-left-lower > *,
.elementor .e-con.cp-shape-right-upper > *,
.elementor .e-con.cp-shape-right-lower > *,
.elementor .elementor-section.cp-shape-left-upper > *,
.elementor .elementor-section.cp-shape-left-lower > *,
.elementor .elementor-section.cp-shape-right-upper > *,
.elementor .elementor-section.cp-shape-right-lower > * {
  position: relative;
  z-index: 2;
}

.cp-shape-left-upper::before,
.cp-shape-left-lower::before,
.cp-shape-right-upper::before,
.cp-shape-right-lower::before,
.elementor .e-con.cp-shape-left-upper::before,
.elementor .e-con.cp-shape-left-lower::before,
.elementor .e-con.cp-shape-right-upper::before,
.elementor .e-con.cp-shape-right-lower::before,
.elementor .elementor-section.cp-shape-left-upper::before,
.elementor .elementor-section.cp-shape-left-lower::before,
.elementor .elementor-section.cp-shape-right-upper::before,
.elementor .elementor-section.cp-shape-right-lower::before {
  background-image: var(--cp-shape-icon);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: var(--cp-shape-height);
  opacity: var(--cp-shape-opacity);
  pointer-events: none;
  position: absolute;
  width: var(--cp-shape-width);
  z-index: 0;
}

.cp-shape-left-upper::before,
.elementor .e-con.cp-shape-left-upper::before,
.elementor .elementor-section.cp-shape-left-upper::before {
  background-position: right top;
  left: var(--cp-shape-side-offset);
  top: var(--cp-shape-vertical-offset);
}

.cp-shape-left-lower::before,
.elementor .e-con.cp-shape-left-lower::before,
.elementor .elementor-section.cp-shape-left-lower::before {
  background-position: right bottom;
  bottom: var(--cp-shape-vertical-offset);
  left: var(--cp-shape-side-offset);
}

.cp-shape-right-upper::before,
.elementor .e-con.cp-shape-right-upper::before,
.elementor .elementor-section.cp-shape-right-upper::before {
  background-position: left top;
  right: var(--cp-shape-side-offset);
  top: var(--cp-shape-vertical-offset);
}

.cp-shape-right-lower::before,
.elementor .e-con.cp-shape-right-lower::before,
.elementor .elementor-section.cp-shape-right-lower::before {
  background-position: left bottom;
  bottom: var(--cp-shape-vertical-offset);
  right: var(--cp-shape-side-offset);
}

.cp-shape-group-left .cp-shape-left-upper::before,
.cp-shape-group-left .cp-shape-left-lower::before,
.cp-shape-group-left .cp-shape-right-upper::before,
.cp-shape-group-left .cp-shape-right-lower::before,
.cp-shape-group-right .cp-shape-left-upper::before,
.cp-shape-group-right .cp-shape-left-lower::before,
.cp-shape-group-right .cp-shape-right-upper::before,
.cp-shape-group-right .cp-shape-right-lower::before,
.elementor .cp-shape-group-left .e-con.cp-shape-left-upper::before,
.elementor .cp-shape-group-left .e-con.cp-shape-left-lower::before,
.elementor .cp-shape-group-left .e-con.cp-shape-right-upper::before,
.elementor .cp-shape-group-left .e-con.cp-shape-right-lower::before,
.elementor .cp-shape-group-right .e-con.cp-shape-left-upper::before,
.elementor .cp-shape-group-right .e-con.cp-shape-left-lower::before,
.elementor .cp-shape-group-right .e-con.cp-shape-right-upper::before,
.elementor .cp-shape-group-right .e-con.cp-shape-right-lower::before,
.elementor .cp-shape-group-left .elementor-section.cp-shape-left-upper::before,
.elementor .cp-shape-group-left .elementor-section.cp-shape-left-lower::before,
.elementor .cp-shape-group-left .elementor-section.cp-shape-right-upper::before,
.elementor .cp-shape-group-left .elementor-section.cp-shape-right-lower::before,
.elementor .cp-shape-group-right .elementor-section.cp-shape-left-upper::before,
.elementor .cp-shape-group-right .elementor-section.cp-shape-left-lower::before,
.elementor .cp-shape-group-right .elementor-section.cp-shape-right-upper::before,
.elementor .cp-shape-group-right .elementor-section.cp-shape-right-lower::before {
  content: none;
  display: none;
}

.elementor-widget-cp-product-section,
.elementor-widget-cp-product-section .elementor-widget-container {
  position: relative;
  z-index: 2;
}

@media (min-width: 2200px) {
  .cp-shape-left-upper,
  .cp-shape-left-lower,
  .cp-shape-right-upper,
  .cp-shape-right-lower,
  .elementor .e-con.cp-shape-left-upper,
  .elementor .e-con.cp-shape-left-lower,
  .elementor .e-con.cp-shape-right-upper,
  .elementor .e-con.cp-shape-right-lower,
  .elementor .elementor-section.cp-shape-left-upper,
  .elementor .elementor-section.cp-shape-left-lower,
  .elementor .elementor-section.cp-shape-right-upper,
  .elementor .elementor-section.cp-shape-right-lower {
    --cp-shape-width: 165vw;
    --cp-shape-height: 175%;
    --cp-shape-side-offset: -132vw;
  }
}

@media (max-width: 1200px) {
  :root {
    --cp-shape-section-min-height: 90vh;
  }

  @supports (height: 100svh) {
    :root {
      --cp-shape-section-min-height: 90svh;
    }
  }

  .cp-shape-left-upper,
  .cp-shape-left-lower,
  .cp-shape-right-upper,
  .cp-shape-right-lower,
  .elementor .e-con.cp-shape-left-upper,
  .elementor .e-con.cp-shape-left-lower,
  .elementor .e-con.cp-shape-right-upper,
  .elementor .e-con.cp-shape-right-lower,
  .elementor .elementor-section.cp-shape-left-upper,
  .elementor .elementor-section.cp-shape-left-lower,
  .elementor .elementor-section.cp-shape-right-upper,
  .elementor .elementor-section.cp-shape-right-lower {
    --cp-shape-width: 205vw;
    --cp-shape-height: 170%;
    --cp-shape-side-offset: -166vw;
  }
}

@media (orientation: landscape) and (max-height: 820px) and (min-width: 901px) {
  :root {
    --cp-shape-section-min-height: 82vh;
  }

  @supports (height: 100svh) {
    :root {
      --cp-shape-section-min-height: 82svh;
    }
  }
}

@media (min-width: 1200px) and (min-height: 1200px) and (max-aspect-ratio: 1 / 1) {
  :root {
    --cp-shape-section-min-height: clamp(760px, 64vh, 1080px);
  }

  @supports (height: 100svh) {
    :root {
      --cp-shape-section-min-height: clamp(760px, 64svh, 1080px);
    }
  }

  .cp-shape-group-left,
  .cp-shape-group-right,
  .elementor .e-con.cp-shape-group-left,
  .elementor .e-con.cp-shape-group-right,
  .elementor .elementor-section.cp-shape-group-left,
  .elementor .elementor-section.cp-shape-group-right {
    --cp-shape-group-offset-x: 45vw;
  }
}

@media (max-width: 900px) {
  :root {
    --cp-shape-section-min-height: 80vh;
  }

  @supports (height: 100svh) {
    :root {
      --cp-shape-section-min-height: 80svh;
    }
  }

  .cp-shape-left-upper,
  .cp-shape-left-lower,
  .cp-shape-right-upper,
  .cp-shape-right-lower,
  .elementor .e-con.cp-shape-left-upper,
  .elementor .e-con.cp-shape-left-lower,
  .elementor .e-con.cp-shape-right-upper,
  .elementor .e-con.cp-shape-right-lower,
  .elementor .elementor-section.cp-shape-left-upper,
  .elementor .elementor-section.cp-shape-left-lower,
  .elementor .elementor-section.cp-shape-right-upper,
  .elementor .elementor-section.cp-shape-right-lower {
    --cp-shape-width: 230vw;
    --cp-shape-height: 150%;
    --cp-shape-side-offset: -188vw;
    --cp-shape-vertical-offset: -24%;
  }
}

@media (max-width: 560px) {
  :root {
    --cp-shape-section-min-height: 65vh;
  }

  @supports (height: 100svh) {
    :root {
      --cp-shape-section-min-height: 65svh;
    }
  }

  .cp-shape-group-left,
  .cp-shape-group-right,
  .elementor .e-con.cp-shape-group-left,
  .elementor .e-con.cp-shape-group-right,
  .elementor .elementor-section.cp-shape-group-left,
  .elementor .elementor-section.cp-shape-group-right {
    --cp-shape-group-offset-x: 30vw;
    --cp-shape-opacity: 0.56;
  }

  .cp-shape-left-upper,
  .cp-shape-left-lower,
  .cp-shape-right-upper,
  .cp-shape-right-lower,
  .elementor .e-con.cp-shape-left-upper,
  .elementor .e-con.cp-shape-left-lower,
  .elementor .e-con.cp-shape-right-upper,
  .elementor .e-con.cp-shape-right-lower,
  .elementor .elementor-section.cp-shape-left-upper,
  .elementor .elementor-section.cp-shape-left-lower,
  .elementor .elementor-section.cp-shape-right-upper,
  .elementor .elementor-section.cp-shape-right-lower {
    --cp-shape-width: 275vw;
    --cp-shape-height: 135%;
    --cp-shape-side-offset: -228vw;
    --cp-shape-opacity: 0.72;
    --cp-shape-vertical-offset: -16%;
  }
}
