/* Add styles you cannot handle well with Tailwind CDN Config */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Base mesh backgrounds (Tailwind custom variant provided in index.html is cleaner, but this can serve as fallback) */
.mesh-bg {
  background-color: #fff5f5;
  background-image:
    radial-gradient(at 0% 0%, hsla(347, 100%, 90%, 1) 0px, transparent 50%),
    radial-gradient(at 100% 0%, hsla(340, 100%, 90%, 1) 0px, transparent 50%),
    radial-gradient(at 100% 100%, hsla(34, 100%, 88%, 1) 0px, transparent 50%),
    radial-gradient(at 0% 100%, hsla(39, 100%, 88%, 1) 0px, transparent 50%);
}

.dark .mesh-bg {
  background-color: #0f172a; /* slate-900 */
  background-image:
    radial-gradient(at 40% 20%, hsla(284, 30%, 20%, 1) 0px, transparent 50%),
    radial-gradient(at 80% 0%, hsla(189, 30%, 20%, 1) 0px, transparent 50%),
    radial-gradient(at 0% 50%, hsla(355, 30%, 20%, 1) 0px, transparent 50%),
    radial-gradient(at 80% 50%, hsla(340, 30%, 20%, 1) 0px, transparent 50%);
}

/* Animations */
@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0px);
  }
}

.animate-float {
  animation: float 6s ease-in-out infinite;
}

/* Custom Selection Color */
::selection {
  background-color: #ffb6c1; /* Dusty Rose */
  color: #fff;
}
.dark ::selection {
  background-color: #ffb347; /* Muted apricot */
}

/* Lenis Recommended Root Styles */
html.lenis {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}