:root {
  --primary: #df152b;
  --navy: #071c31;
}

*, *::before, *::after {
  font-family: 'Poppins', system-ui, -apple-system, sans-serif;
}

/* Poppins everywhere: `font-mono` is only a styling hook (codes, badges, counts) */
code, pre, kbd, samp, .font-mono {
  font-family: 'Poppins', system-ui, -apple-system, sans-serif !important;
  font-variant-numeric: tabular-nums;
}

body {
  color: #0f172a;
  background-color: #ffffff;
  overflow-x: hidden;
}

/* Aspect ratio fallback */
.aspect-4\/3 {
  aspect-ratio: 4 / 3;
}

/* Entrance animations (the Tailwind CDN build has no tailwindcss-animate plugin) */
@keyframes sifon-enter {
  from {
    opacity: var(--tw-enter-opacity, 1);
    transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale(var(--tw-enter-scale, 1));
  }
}
.animate-in { animation: sifon-enter 150ms cubic-bezier(0.16, 1, 0.3, 1); }
.animate-in.duration-200 { animation-duration: 200ms; }
.animate-in.duration-300 { animation-duration: 300ms; }
.fade-in { --tw-enter-opacity: 0; }
.zoom-in-95 { --tw-enter-scale: 0.95; }
.slide-in-from-top-2 { --tw-enter-translate-y: -0.5rem; }
.slide-in-from-right { --tw-enter-translate-x: 100%; }
@media (prefers-reduced-motion: reduce) {
  .animate-in { animation: none; }
}

/* Custom Scrollbar for sleek UI */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Sleek Dark Scrollbar for Mega Menu Overlays & Panels */
.custom-dark-scroll {
  scrollbar-width: thin;
  scrollbar-color: rgba(223, 21, 43, 0.6) rgba(15, 23, 42, 0.6);
}
.custom-dark-scroll::-webkit-scrollbar {
  width: 4px;
}
.custom-dark-scroll::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.6);
  border-radius: 9999px;
}
.custom-dark-scroll::-webkit-scrollbar-thumb {
  background: rgba(223, 21, 43, 0.6);
  border-radius: 9999px;
}
.custom-dark-scroll::-webkit-scrollbar-thumb:hover {
  background: rgba(223, 21, 43, 0.95);
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Infinite Marquee Animation for Partners */
@keyframes marquee {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-50%); }
}

/* Timeline Spine Glow and Pulse */
@keyframes timeline-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(223, 21, 43, 0.4);
  }
  50% {
    box-shadow: 0 0 0 8px rgba(223, 21, 43, 0);
  }
}

.timeline-node-pulse {
  animation: timeline-pulse 2.5s infinite cubic-bezier(0.4, 0, 0.6, 1);
}

.animate-marquee {
  display: flex;
  width: max-content;
  animation: marquee 35s linear infinite;
}
.animate-marquee:hover {
  animation-play-state: paused;
}

/* Subtle reveal on scroll */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Custom cursor */
.cursor-ring {
  position: fixed;
  top: 0;
  left: 0;
  width: 32px;
  height: 32px;
  border: 1.5px solid rgba(223, 21, 43, 0.75);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: width 0.2s ease, height 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
  opacity: 0;
}
.cursor-ring.visible {
  opacity: 1;
}
.cursor-ring.hover {
  width: 54px;
  height: 54px;
  background-color: rgba(223, 21, 43, 0.08);
  border-color: #df152b;
}
.cursor-ring.click {
  transform: translate(-50%, -50%) scale(0.85);
}
@media (pointer: coarse) {
  .cursor-ring {
    display: none !important;
  }
}

/* Accessibility: Respect Reduced Motion Preferences */
@media (prefers-reduced-motion: reduce) {
  .animate-marquee,
  .timeline-node-pulse {
    animation: none !important;
  }
  .reveal,
  * {
    transition-duration: 0.01ms !important;
  }
}
