html { scroll-behavior: smooth; }
  body { font-family: 'IBM Plex Sans Arabic', sans-serif; }
  section { scroll-margin-top: 5rem; }
  ::selection { background-color: #1FA688; color: #fff; }

  ::-webkit-scrollbar { width: 10px; }
  ::-webkit-scrollbar-track { background: #EFF3F8; }
  ::-webkit-scrollbar-thumb { background: #93AECE; border-radius: 999px; }
  ::-webkit-scrollbar-thumb:hover { background: #6488B3; }

  .draw-path {
    stroke-dasharray: 200;
    stroke-dashoffset: 200;
    animation: draw 1.3s ease-out forwards;
  }
  @keyframes draw { to { stroke-dashoffset: 0; } }

  .fade-el {
    opacity: 0;
    animation: fadeInEl .4s ease-out forwards;
  }
  @keyframes fadeInEl { to { opacity: 1; } }

  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .draw-path { animation: none; stroke-dashoffset: 0; }
    .fade-el { animation: none; opacity: 1; }
    .animate-ping { animation: none; }
  }