.elementor-16135 .elementor-element.elementor-element-222212b{--display:flex;--min-height:96px;}.elementor-16135 .elementor-element.elementor-element-cb33dac{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}/* Start custom CSS for container, class: .elementor-element-222212b */.top-gradient-bg {
  background:
    linear-gradient(180deg, #11104a 0%, #1b1054 60%, #2b116d 100%) !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-cb33dac *//* أضف الكلاس للسيكشن: shapes-bg */
.shapes-bg {
  position: relative;
  overflow: hidden;
  z-index: 1;

  background:
    radial-gradient(circle at 50% 15%, rgba(95, 45, 255, 0.75), transparent 35%),
    linear-gradient(135deg, #1b0b4f 0%, #2b116d 45%, #3b1a8f 100%);
}

.shapes-bg::before,
.shapes-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-repeat: no-repeat;
}

/* طبقة الأشكال الأولى */
.shapes-bg::before {
  background-image:
    radial-gradient(circle, #ff2f8f 0 7px, transparent 8px),
    radial-gradient(circle, #35b7ff 0 7px, transparent 8px),
    radial-gradient(circle, #ffc107 0 6px, transparent 7px),
    radial-gradient(circle, #8bc34a 0 6px, transparent 7px),
    radial-gradient(circle, #7d5fff 0 9px, transparent 10px),
    linear-gradient(45deg, #ff9f43 0 18px, transparent 19px),
    linear-gradient(90deg, #6c63ff 0 38px, transparent 39px),
    linear-gradient(90deg, #ff8c42 0 34px, transparent 35px),
    conic-gradient(from 45deg, #4ecdc4 0 25%, transparent 0 100%),
    conic-gradient(from 20deg, #f72585 0 25%, transparent 0 100%);

  background-size:
    22px 22px,
    24px 24px,
    18px 18px,
    18px 18px,
    28px 28px,
    28px 28px,
    48px 10px,
    44px 9px,
    26px 26px,
    24px 24px;

  background-position:
    4% 85%,
    92% 12%,
    86% 31%,
    6% 24%,
    78% 72%,
    10% 55%,
    79% 76%,
    9% 53%,
    63% 47%,
    83% 4%;

  animation: floatShapesOne 9s ease-in-out infinite alternate;
}

/* طبقة الأشكال الثانية */
.shapes-bg::after {
  background-image:
    radial-gradient(circle, #ffffff99 0 5px, transparent 6px),
    radial-gradient(circle, #9fa8da 0 8px, transparent 9px),
    radial-gradient(circle, #673ab7 0 10px, transparent 11px),
    linear-gradient(45deg, #ffb74d 0 30px, transparent 31px),
    linear-gradient(75deg, #7c4dff 0 42px, transparent 43px),
    conic-gradient(from 45deg, #64b5f6 0 25%, transparent 0 100%),
    conic-gradient(from 90deg, #ff4081 0 25%, transparent 0 100%),
    linear-gradient(135deg, #43e97b 0 16px, transparent 17px);

  background-size:
    16px 16px,
    28px 28px,
    30px 30px,
    40px 8px,
    52px 10px,
    28px 28px,
    26px 26px,
    24px 24px;

  background-position:
    20% 79%,
    20% 18%,
    92% 56%,
    1% 7%,
    97% 33%,
    97% 12%,
    3% 86%,
    34% 8%;

  animation: floatShapesTwo 12s ease-in-out infinite alternate;
}

/* إبقاء محتوى السيكشن فوق الأشكال */
.shapes-bg > .elementor-container,
.shapes-bg > .e-con-inner {
  position: relative;
  z-index: 2;
}

@keyframes floatShapesOne {
  from {
    transform: translateY(0) rotate(0deg);
  }
  to {
    transform: translateY(-18px) rotate(7deg);
  }
}

@keyframes floatShapesTwo {
  from {
    transform: translateY(0) rotate(0deg);
  }
  to {
    transform: translateY(22px) rotate(-8deg);
  }
}/* End custom CSS */