/* Extras on top of Tailwind CDN */
html { overflow-x: hidden; }
html, body { font-family: 'Inter', ui-sans-serif, system-ui, sans-serif; }
body { overflow-x: clip; max-width: 100vw; }

/* Force nav fixed — overrides any conflicting CSS */
nav.site-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
  transform: none !important;
  will-change: auto !important;
  -webkit-transform: none !important;
  background: rgba(9, 9, 11, 0.97) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
@media (min-width: 768px) {
  nav.site-nav {
    background: rgba(9, 9, 11, 0.85) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
  }
}

/* Rotating word animation */
@keyframes rw-in {
  from { transform: translateY(0.6em); opacity: 0; filter: blur(6px); }
  to   { transform: translateY(0); opacity: 1; filter: blur(0); }
}
@keyframes rw-out {
  from { transform: translateY(0); opacity: 1; filter: blur(0); }
  to   { transform: translateY(-0.6em); opacity: 0; filter: blur(6px); }
}
.rw-enter { animation: rw-in 0.5s cubic-bezier(0.16,1,0.3,1) both; }
.rw-exit  { animation: rw-out 0.5s cubic-bezier(0.16,1,0.3,1) both; position: absolute; top: 0; left: 0; }

@keyframes fade-up {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.fade-up { animation: fade-up 0.45s cubic-bezier(0.16,1,0.3,1) both; }

@keyframes toast-in {
  from { opacity: 0; transform: translate(-50%, 20px); }
  to   { opacity: 1; transform: translate(-50%, 0); }
}
.toast-show { animation: toast-in 0.25s cubic-bezier(0.16,1,0.3,1) both; }