* { -webkit-tap-highlight-color: transparent; }

html { scroll-behavior: smooth; }

body {
  font-family: 'Vazirmatn', sans-serif;
  color: #202124;
  background: #ffffff;
  margin: 0;
}

/* Soft Google-style hero background */
.hero-bg {
  background:
    radial-gradient(60% 60% at 80% 0%, rgba(26,115,232,0.06) 0%, rgba(26,115,232,0) 70%),
    radial-gradient(50% 50% at 10% 20%, rgba(52,168,83,0.05) 0%, rgba(52,168,83,0) 70%);
}

/* Config code */
.config-code {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* FAQ smooth accordion */
.faq-panel {
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease;
}

/* Reveal-on-load animation */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  animation: rise 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.reveal-1 { animation-delay: 0.08s; }
.reveal-2 { animation-delay: 0.16s; }
.reveal-3 { animation-delay: 0.24s; }

@keyframes rise {
  to { opacity: 1; transform: translateY(0); }
}

/* Scrollbar for config box */
.config-code::-webkit-scrollbar { height: 6px; }
.config-code::-webkit-scrollbar-thumb { background: #dadce0; border-radius: 3px; }

::selection { background: rgba(26,115,232,0.15); }