/* TrackedXL — supplemental styles on top of Tailwind CDN */

html {
  -webkit-font-smoothing: antialiased;
}

/* Subtle dotted grid overlay used behind the hero */
.bg-grid {
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 40%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 40%, transparent 100%);
}

/* Custom scrollbar for a more "product" feel */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: #0b1220;
}
::-webkit-scrollbar-thumb {
  background: #1e293b;
  border-radius: 9999px;
  border: 2px solid #0b1220;
}
::-webkit-scrollbar-thumb:hover {
  background: #334155;
}

/* Modal open/close transitions */
#modal-demo,
#modal-signin {
  transition: opacity 0.18s ease;
  opacity: 0;
}
#modal-demo.is-open,
#modal-signin.is-open {
  opacity: 1;
}
.modal-card {
  transform: translateY(12px) scale(0.98);
  transition: transform 0.2s ease;
}
.is-open .modal-card {
  transform: translateY(0) scale(1);
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}