html { scroll-behavior: smooth; }
body { font-family: 'Heebo', sans-serif; }
h1, h2, h3, h4, .font-display { font-family: 'Rubik', sans-serif; }

.gradient-text {
  background: linear-gradient(90deg, #00F0FF 0%, #4FD1FF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hero-glow {
  background: radial-gradient(circle at 30% 30%, rgba(0,240,255,0.18), transparent 60%);
}

/* Subtle tech grid behind dark sections */
.grid-bg {
  background-image:
    linear-gradient(rgba(0,240,255,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,240,255,0.06) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
}

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease-out, transform .7s ease-out; }
.reveal.in-view { opacity: 1; transform: none; }

.dash-line { stroke-dasharray: 6 6; animation: dash 2s linear infinite; }
@keyframes dash { to { stroke-dashoffset: -24; } }

.nav-link { position: relative; }
.nav-link::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: -6px;
  width: 0;
  height: 2px;
  background: #00F0FF;
  transition: width 0.25s ease;
}
.nav-link:hover::after, .nav-link.active::after { width: 100%; }
.nav-link.active { color: #0A192F; }

.feature-card { transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; }
.feature-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px -10px rgba(10, 25, 47, 0.18);
  border-color: #00F0FF;
}

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: #00F0FF;
  box-shadow: 0 0 0 4px rgba(0, 240, 255, 0.15);
}

#mobile-menu { transition: max-height 0.3s ease, opacity 0.3s ease; }

/* Integrations marquee (RTL-safe: animates the track, duplicated content) */
.marquee { overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.marquee-track { display: flex; width: max-content; animation: marquee 40s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* FAQ */
details summary { list-style: none; cursor: pointer; }
details summary::-webkit-details-marker { display: none; }
details[open] .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform .2s ease; }

/* Floating WhatsApp button */
.wa-float { box-shadow: 0 10px 30px -8px rgba(37, 211, 102, 0.6); }

@media (prefers-reduced-motion: reduce) {
  .marquee-track, .dash-line, .animate-float, .animate-float-delay { animation: none !important; }
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* Keep "2,500+" / "15+" reading correctly inside RTL text */
[data-count], .num { direction: ltr; unicode-bidi: isolate; display: inline-block; }