
body {
  background-color: oklch(0.985 0.012 60); /* bg-cream/bg-background */
  color: oklch(0.32 0.06 30); /* text-foreground/text-brown */
  font-family: "Poppins", system-ui, sans-serif;
}

h1, h2, h3, h4 { 
  font-family: "Playfair Display", Georgia, serif; 
}

.font-script { 
  font-family: "Allura", "Great Vibes", cursive; 
}

.font-display { 
  font-family: "Playfair Display", Georgia, serif; 
}

.dashed-border {
  background-image: repeating-linear-gradient(0deg, oklch(0.68 0.18 5) 0 6px, transparent 6px 12px),
    repeating-linear-gradient(90deg, oklch(0.68 0.18 5) 0 6px, transparent 6px 12px),
    repeating-linear-gradient(180deg, oklch(0.68 0.18 5) 0 6px, transparent 6px 12px),
    repeating-linear-gradient(270deg, oklch(0.68 0.18 5) 0 6px, transparent 6px 12px);
  background-size: 1px 100%, 100% 1px, 1px 100%, 100% 1px;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
  background-repeat: no-repeat;
}

.premium-card {
  transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease, border-color .3s;
}

.premium-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 60px -25px oklch(0.68 0.18 5 / 0.35);
}

.btn-wpp {
  background: linear-gradient(135deg, oklch(0.72 0.2 5), oklch(0.62 0.2 10));
  box-shadow: 0 14px 30px -10px oklch(0.68 0.18 5 / 0.55);
  transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
}

.btn-wpp:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 22px 40px -14px oklch(0.68 0.18 5 / 0.7);
  filter: brightness(1.05);
}

@keyframes float-heart {
  0%,100% { transform: translateY(0) rotate(-8deg); opacity: .8; }
  50% { transform: translateY(-10px) rotate(8deg); opacity: 1; }
}
.float-heart { animation: float-heart 4s ease-in-out infinite; }

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.marquee-track { animation: marquee 40s linear infinite; }
.marquee-track:hover { animation-play-state: paused; }

.animate-fade-in {
  animation: fadeIn 0.5s ease-in-out;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
