/* ---------- Base ---------- */
.reveal { opacity: 0; }
.reveal.in-view { opacity: 1; }

.gradient-text {
  background: linear-gradient(90deg, #ff5d73 0%, #f5a623 33%, #3ec46d 66%, #4d8bf5 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.gradient-underline {
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, #e8384f, #f5a623, #3ec46d, #1f6feb);
}

/* ---------- Glowy waves hero (light) ---------- */
.hero-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: radial-gradient(circle at 50% 0%, #F2F0EB 0%, #EEECE7 55%, #E5E2DA 100%);
}
.hero-bg.noise::after {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0.035;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.glow-blob {
  display: none;
  position: absolute;
  border-radius: 9999px;
  filter: blur(110px);
  opacity: 0.16;
  will-change: transform, opacity;
}
.glow-1 { width: 480px; height: 480px; left: -120px; top: -80px; background: #e8384f; animation: float1 16s ease-in-out infinite; }
.glow-2 { width: 520px; height: 520px; right: -160px; top: 40px; background: #1f6feb; animation: float2 20s ease-in-out infinite; }
.glow-3 { width: 420px; height: 420px; left: 30%; bottom: -200px; background: #3ec46d; animation: float3 18s ease-in-out infinite; }
.glow-4 { width: 380px; height: 380px; right: 10%; bottom: -160px; background: #f5a623; animation: float4 14s ease-in-out infinite; }

@keyframes float1 { 0%,100% { transform: translate(0,0) scale(1); opacity: .13; } 50% { transform: translate(60px,40px) scale(1.2); opacity: .2; } }
@keyframes float2 { 0%,100% { transform: translate(0,0) scale(1); opacity: .12; } 50% { transform: translate(-50px,60px) scale(1.15); opacity: .18; } }
@keyframes float3 { 0%,100% { transform: translate(0,0) scale(1); opacity: .1; } 50% { transform: translate(40px,-30px) scale(1.25); opacity: .16; } }
@keyframes float4 { 0%,100% { transform: translate(0,0) scale(1); opacity: .1; } 50% { transform: translate(-40px,-40px) scale(1.2); opacity: .16; } }

@keyframes floaty { 0%,100% { transform: translateY(0) rotate(var(--tilt,0deg)); } 50% { transform: translateY(-14px) rotate(var(--tilt,0deg)); } }
.float-card { animation: floaty 6s ease-in-out infinite; }

/* ---------- Pop-in load animation ---------- */
@keyframes popIn {
  0% { opacity: 0; scale: 0.9; filter: blur(4px); }
  100% { opacity: 1; scale: 1; filter: blur(0); }
}
.pop-in {
  animation: popIn 0.75s cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* ---------- Section wave dividers ---------- */
.divider-wave { display: block; width: 100%; line-height: 0; }
.divider-wave svg { width: 100%; height: 70px; display: block; }

/* ---------- Marquee ---------- */
.marquee-track {
  display: flex;
  width: max-content;
  animation: marquee 26s linear infinite;
}
@keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* ---------- Nav active indicator ---------- */
.nav-link { position: relative; }
.nav-link.active::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -8px;
  height: 2px;
  background: linear-gradient(90deg, #e8384f, #f5a623, #3ec46d, #1f6feb);
  border-radius: 999px;
}