  body {
      font-family: "Poppins", sans-serif;
      scroll-behavior: smooth;
      background-color: #4d305f;
      color: white;
    }
    .brand-green { color: #b4e28f; }
    .brand-bg { background-color: #4d305f; }
    .accent-bg { background-color: #b4e28f; }
    .fade-section { opacity: 0; transform: translateY(40px); }
.aligned-list {
  list-style: none; /* remove default bullets */
  padding: 0;
  margin: 0;
}
.aligned-list li {
  position: relative;
  padding-left: 1.25rem; /* space for custom bullet */
  margin-bottom: 0.5rem;
  line-height: 1.5;
}
.aligned-list li::before {
  content: '•';
  position: absolute;
  left: 0;
  top: 0;
  color: #b58b40; /* bullet color */
  font-weight: bold;
  font-size: 1.1rem;
  line-height: 1.4;
}

@keyframes bubbleFloat {
  0%, 100% {
    transform: translateY(0) scale(1);
    border-radius: 60% 40% 60% 40% / 40% 60% 40% 60%;
  }
  25% {
    transform: translateY(-15px) scale(1.05);
    border-radius: 55% 45% 50% 50% / 45% 55% 50% 50%;
  }
  50% {
    transform: translateY(10px) scale(0.98);
    border-radius: 65% 35% 55% 45% / 35% 65% 45% 55%;
  }
  75% {
    transform: translateY(-10px) scale(1.02);
    border-radius: 50% 50% 60% 40% / 50% 50% 60% 40%;
  }
}

.animate-bubble-float {
  animation: bubbleFloat 10s ease-in-out infinite;
}

/* Optional subtle hover effect on the teardrops */
#about .relative:hover {
  transform: translateY(-4px) scale(1.03);
  transition: all 0.3s ease;
  background-color: #3b234d;
  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.25);
}

html {
  scroll-padding-top: 100px; /* Adjust value = your header height */
  scroll-behavior: smooth;   /* optional for smooth scrolling */
}


/* =========================
   Arabic Font (Zain)
========================= */

html[lang="ar"] body {
  font-family: "Zain", sans-serif !important;
  direction: rtl;
  text-align: right;
}

/* agar mixed content ho */
[lang="ar"], .arabic {
  font-family: "Zain", sans-serif !important;
  direction: rtl;
  text-align: right;
}
/* Arabic Font - Zain */
[dir="rtl"] * {
  font-family: 'Zain', sans-serif !important;
}