/* KS Suppoint Benefit — Elementor widget styles */

.elementor-widget-ks_suppoint_benefit,
.elementor-widget-ks_suppoint_benefit > .elementor-widget-container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: visible !important;
}

.ks-el-root.ks-suppoint-benefit {
  --ks-sb-bg: #ebe6dc;
  --ks-sb-product-bottom: 40%;
  --ks-sb-pills-top: 6.5rem;
  --ks-sb-spin-duration: 48s;
  --ks-sb-blur-strength: 20px;
  --ks-sb-circle-size: 35rem;
  --ks-sb-stage-min-height: 38rem;
  --ks-sb-blur-tint: rgba(44, 107, 50, 0.1);
  --ks-sb-pill-1-top: -2%;
  --ks-sb-pill-1-left: -38%;
  --ks-sb-pill-2-top: 15%;
  --ks-sb-pill-2-right: -48%;
  --ks-sb-pill-3-bottom: 10%;
  --ks-sb-pill-3-right: -8%;
  --ks-sb-pill-4-bottom: 10%;
  --ks-sb-pill-4-left: -35%;

  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  overflow: visible !important;
  background: var(--ks-sb-bg) !important;
  font-family: Poppins, sans-serif !important;
}

.ks-el-root.ks-suppoint-benefit .section.benefit.inner {
  margin: 0 !important;
  overflow: visible !important;
  padding-bottom: 10rem !important;
}

.ks-el-root.ks-suppoint-benefit .container {
  max-width: 74rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
  overflow: visible !important;
}

.ks-el-root.ks-suppoint-benefit .benefit-section-wrap {
  position: relative !important;
  width: 100% !important;
  margin: 0 auto !important;
  overflow: visible !important;
  padding-bottom: 8rem !important;
}

.ks-el-root.ks-suppoint-benefit .section-title-wrapper {
  text-align: center !important;
}

.ks-el-root.ks-suppoint-benefit .benefit-content-wrap {
  margin-left: auto !important;
  margin-right: auto !important;
  overflow: visible !important;
  min-height: var(--ks-sb-stage-min-height) !important;
  position: relative !important;
  width: 100% !important;
  max-width: 45.875rem !important;
}

.ks-el-root.ks-suppoint-benefit .benefit-circle-wrap {
  z-index: 1 !important;
  background-color: transparent !important;
  overflow: visible !important;
  position: absolute !important;
  left: 50% !important;
  top: 0 !important;
  transform: translateX(-50%) !important;
  width: var(--ks-sb-circle-size) !important;
  height: var(--ks-sb-circle-size) !important;
}

.ks-el-root.ks-suppoint-benefit .benefit-circle-wrap::before {
  content: "" !important;
  position: absolute !important;
  inset: 8% !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 32% 28%, rgba(44, 107, 50, 0.32), transparent 62%),
    radial-gradient(circle at 68% 72%, rgba(0, 50, 31, 0.22), transparent 58%),
    radial-gradient(circle, rgba(44, 107, 50, 0.14) 0%, rgba(235, 230, 220, 0.18) 100%) !important;
  filter: blur(var(--ks-sb-blur-strength)) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

.ks-el-root.ks-suppoint-benefit .benefit-circle-bg {
  z-index: 1 !important;
  -webkit-backdrop-filter: blur(var(--ks-sb-blur-strength)) saturate(115%) !important;
  backdrop-filter: blur(var(--ks-sb-blur-strength)) saturate(115%) !important;
  background-color: var(--ks-sb-blur-tint) !important;
  border: 1px solid rgba(44, 107, 50, 0.14) !important;
  box-shadow:
    inset 0 0 56px rgba(44, 107, 50, 0.1),
    0 8px 28px rgba(0, 50, 31, 0.05) !important;
}

.ks-el-root.ks-suppoint-benefit .benefit-circle-inner {
  z-index: 2 !important;
  position: relative !important;
  overflow: visible !important;
}

.ks-el-root.ks-suppoint-benefit .benefit-product-wrap {
  z-index: 2 !important;
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  bottom: var(--ks-sb-product-bottom) !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  overflow: visible !important;
  pointer-events: none !important;
  display: flex !important;
  justify-content: center !important;
}

.ks-el-root.ks-suppoint-benefit .benefits-item-wrap {
  z-index: 3 !important;
  position: absolute !important;
  left: 50% !important;
  top: var(--ks-sb-pills-top) !important;
  transform: translateX(-50%) !important;
  width: var(--ks-sb-circle-size) !important;
  height: var(--ks-sb-circle-size) !important;
  overflow: visible !important;
  pointer-events: none !important;
}

.ks-el-root.ks-suppoint-benefit .single-benefit-wrap {
  overflow: visible !important;
  height: auto !important;
  min-height: 5.125rem !important;
  z-index: 3 !important;
  position: absolute !important;
  pointer-events: auto !important;
  animation: none !important;
}

.ks-el-root.ks-suppoint-benefit .single-benefit-wrap._1 {
  top: var(--ks-sb-pill-1-top) !important;
  left: var(--ks-sb-pill-1-left) !important;
  bottom: auto !important;
  right: auto !important;
}

.ks-el-root.ks-suppoint-benefit .single-benefit-wrap._2 {
  top: var(--ks-sb-pill-2-top) !important;
  right: var(--ks-sb-pill-2-right) !important;
  bottom: auto !important;
  left: auto !important;
}

.ks-el-root.ks-suppoint-benefit .single-benefit-wrap._3 {
  bottom: var(--ks-sb-pill-3-bottom) !important;
  right: var(--ks-sb-pill-3-right) !important;
  top: auto !important;
  left: auto !important;
}

.ks-el-root.ks-suppoint-benefit .single-benefit-wrap._4 {
  bottom: var(--ks-sb-pill-4-bottom) !important;
  left: var(--ks-sb-pill-4-left) !important;
  top: auto !important;
  right: auto !important;
}

.ks-el-root.ks-suppoint-benefit .benefit-medicine-box {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  top: auto !important;
  width: clamp(8rem, 18vw, 16.25rem) !important;
  max-width: 16.25rem !important;
  display: block !important;
  margin: 0 auto !important;
}

.ks-el-root.ks-suppoint-benefit.is-spin-enabled .benefit-circle {
  animation: ks-suppoint-benefit-spin var(--ks-sb-spin-duration) linear infinite;
  transform-origin: 50% 50%;
}

@keyframes ks-suppoint-benefit-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ks-el-root.ks-suppoint-benefit .benefit-circle {
    animation: none !important;
  }
}

@media (max-width: 991px) {
  .ks-el-root.ks-suppoint-benefit {
    --ks-sb-circle-size: 26rem;
    --ks-sb-stage-min-height: 28rem;
    --ks-sb-pills-top: 5.5rem;
    --ks-sb-pill-3-bottom: 9%;
    --ks-sb-pill-3-right: -6%;
    --ks-sb-pill-4-bottom: 9%;
    --ks-sb-pill-4-left: -32%;
  }

  .ks-el-root.ks-suppoint-benefit .section.benefit.inner {
    padding-bottom: 6rem !important;
  }

  .ks-el-root.ks-suppoint-benefit .benefit-section-wrap {
    padding-bottom: 5rem !important;
  }

  .ks-el-root.ks-suppoint-benefit .benefit-content-wrap {
    width: 100% !important;
    max-width: 70% !important;
  }

  .ks-el-root.ks-suppoint-benefit .benefit-medicine-box {
    width: clamp(6rem, 22vw, 12rem) !important;
  }
}

@media (max-width: 479px) {
  .ks-el-root.ks-suppoint-benefit {
    --ks-sb-circle-size: 16rem;
    --ks-sb-stage-min-height: 18rem;
    --ks-sb-pills-top: 4.5rem;
    --ks-sb-pill-3-bottom: 8%;
    --ks-sb-pill-3-right: -4%;
    --ks-sb-pill-4-bottom: 8%;
    --ks-sb-pill-4-left: -28%;
  }

  .ks-el-root.ks-suppoint-benefit .section.benefit.inner {
    padding-bottom: 4rem !important;
  }

  .ks-el-root.ks-suppoint-benefit .benefit-content-wrap {
    max-width: 22rem !important;
  }
}