/* ===== حوزه‌های فعالیت – نسخه با گرادیان طلایی ===== */

#domains {
  --cream: #f5f3ed;   /* پس‌زمینه کل سکشن */
  --ellipse-bg: linear-gradient(180deg, #fff 0%, #fdfaf5 60%, #f7f2e8 100%);
  --navy: #0b1b35;
  --gold: #d9b36b;
  --ink: #1f2a37;
  --muted: #8b93a1;
  --shadow: 0 10px 25px rgba(0,0,0,.06);
  background: var(--cream);
}

#domains h2 {
  color: var(--ink);
  font-weight: 800;
}

#domains .text-muted {
  color: #6e7785 !important;
}

.domains-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 20px;
  flex-wrap: wrap;
}

.domain {
  flex: 0 0 168px;
  text-align: center;
}

.domain .num {
  color: var(--muted);
  font-weight: 700;
  font-size: 1.1rem;
  margin-bottom: 8px;
}

/* بیضی اصلی با گرادیان */
.cap {
  position: relative;
  inline-size: 168px;
  block-size: 240px;
  margin: 0 auto;
  border-radius: 110px;
  background: var(--ellipse-bg);
  border: 1px solid rgba(0, 0, 0, .05);
  box-shadow: var(--shadow);
  display: grid;
  grid-template-rows: 74px 1fr 64px;
  align-items: center;
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
}

.cap:hover {
  transform: translateY(-4px);
  box-shadow: 0 15px 35px rgba(0,0,0,.12);
}

/* نیم‌دایره بالای بیضی */
.cap::before {
  content: "";
  position: absolute;
  inset-inline: 26px;
  top: -18px;
  height: 26px;
  border-top-left-radius: 60px;
  border-top-right-radius: 60px;
  background: var(--navy);
}

/* نیم‌دایره پایین حذف شد */
.cap::after {
  display: none !important;
}

/* آیکن */
.cap .icon {
  inline-size: 78px;
  block-size: 78px;
  border-radius: 50%;
  background: #ffffffcc;   /* کمی شفاف برای نمایش گرادیان پشت */
  display: grid;
  place-items: center;
  margin: 0 auto;
  color: var(--navy);
  font-size: 32px;
  box-shadow: inset 0 5px 10px rgba(0,0,0,.04);
}

/* عنوان */
.cap .title {
  font-weight: 800;
  color: var(--ink);
  font-size: 1.05rem;
}

.domains-desc {
  color: #4b5563;
  max-width: 980px;
  line-height: 2;
  font-size: .95rem;
  margin: 20px auto 0;
}

.bridge {
  display: none !important;
}

/* ===== ریسپانسیو ===== */
@media (min-width:1200px) {
  .domains-wrap {
    flex-wrap: nowrap;
    gap: 18px;
  }
  .domain {
    flex: 0 0 156px;
  }
  .cap {
    inline-size: 156px;
    block-size: 232px;
    grid-template-rows: 72px 1fr 62px;
  }
  .cap .icon {
    inline-size: 72px;
    block-size: 72px;
    font-size: 30px;
  }
  .cap .title {
    font-size: 1rem;
  }
}