/* ===== BASE ===== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }

/* ===== NAVBAR ===== */
.nav-scrolled {
  background: rgba(250, 245, 249, 0.95);
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 20px rgba(74, 26, 50, 0.08);
}
.nav-scrolled .nav-link { color: #4a1a32; }
.nav-scrolled .nav-link:hover { color: #2d0f1e; }

/* ===== HERO BLOBS ===== */
.hero-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.4;
  animation: blob-drift 12s ease-in-out infinite alternate;
}
.blob-1 {
  width: 500px; height: 500px;
  background: radial-gradient(circle, #a85578, transparent 70%);
  top: -100px; left: -100px;
}
.blob-2 {
  width: 400px; height: 400px;
  background: radial-gradient(circle, #d4a017, transparent 70%);
  bottom: -50px; right: 10%;
  animation-delay: -4s;
}
.blob-3 {
  width: 300px; height: 300px;
  background: radial-gradient(circle, #c17899, transparent 70%);
  top: 40%; left: 30%;
  animation-delay: -8s;
}
@keyframes blob-drift {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(30px, -20px) scale(1.05); }
  100% { transform: translate(-20px, 30px) scale(0.95); }
}

/* ===== FLOATING CARDS ===== */
@keyframes float-slow {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-12px); }
}
@keyframes float-medium {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-18px); }
}
@keyframes float-fast {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-24px); }
}
.animate-float-slow    { animation: float-slow    5s ease-in-out infinite; }
.animate-float-medium  { animation: float-medium  4s ease-in-out infinite; }
.animate-float-fast    { animation: float-fast    3s ease-in-out infinite; }

/* ===== SCROLL REVEAL (progressive enhancement) ===== */
@media (prefers-reduced-motion: no-preference) {
  .reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.7s ease, transform 0.7s ease;
  }
  .reveal.revealed {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Fallback: always visible if JS disabled or prefers-reduced-motion */
@media not all and (prefers-reduced-motion: no-preference) {
  .reveal { opacity: 1; transform: none; }
}
html.reduce-motion .reveal {
  opacity: 1;
  transform: none;
  transition: none;
}