@import url('https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=Inter:wght@400;500;600&family=Great+Vibes&display=swap');

.font-syne{font-family:'Syne',sans-serif}
.font-inter{font-family:'Inter',sans-serif}
.font-script{font-family:'Great Vibes',cursive}

.kenburns{animation:ken 12s ease-in-out infinite alternate}
@keyframes ken{0%{transform:scale(1)}100%{transform:scale(1.12)}}

.confetti{position:absolute;width:5px;height:5px;border-radius:50%;animation:fall linear infinite}
@keyframes fall{
  0%{transform:translateY(-10vh) rotate(0deg);opacity:0}
  10%{opacity:0.7}
  90%{opacity:0.7}
  100%{transform:translateY(110vh) rotate(720deg);opacity:0}
}

.fairy{position:absolute;width:2px;height:2px;background:radial-gradient(circle,#fff 0%,#e8c873 60%,transparent 70%);border-radius:50%;box-shadow:0 0 6px #e8c873,0 0 12px #c9a6ff;animation:twinkle 3s ease-in-out infinite alternate}
@keyframes twinkle{0%{opacity:0.2;transform:scale(0.6)}100%{opacity:1;transform:scale(1.4)}}

.gradient-border{position:relative;background:#fff;border-radius:20px;transition:transform .3s}
.gradient-border::before{content:'';position:absolute;inset:-1.5px;border-radius:20px;background:linear-gradient(135deg,#d4af37,#e8e8e8,#a78bfa,#d4af37);z-index:-1;opacity:0;transition:opacity .3s}
.gradient-border:hover::before{opacity:1}

.marquee-track{animation:marquee 28s linear infinite;display:flex;width:max-content;will-change:transform}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

.marker-yellow{background:#FFE600;color:#000;padding:0 8px;border-radius:6px;transform:rotate(-1deg);display:inline-block}
.marker-green-yellow{background:linear-gradient(90deg,#00FF9D,#FFE600);color:#000;padding:2px 10px;border-radius:8px;transform:rotate(-1deg);display:inline-block}

.tilt-card{transform-style:preserve-3d;transition:transform .2s ease-out}