@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Pinyon+Script&display=swap');

:root {
  --color-rose-gold: #E0A899;
  --color-rose-gold-dark: #B87D6E;
  --color-rose-gold-light: #F6E6DF;
  --color-gold: #D4AF37;
  --color-ivory: #FAF6F0;
  --color-charcoal: #2C2523;
  --color-blush: #FDEFEF;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: var(--color-ivory);
}
::-webkit-scrollbar-thumb {
  background: var(--color-rose-gold);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-rose-gold-dark);
}

body {
  font-family: 'Montserrat', sans-serif;
  background-color: var(--color-ivory);
  color: var(--color-charcoal);
  overflow-x: hidden;
}

h1, h2, h3, h4, .font-serif-elegant {
  font-family: 'Playfair Display', serif;
}

.font-cursive-elegant {
  font-family: 'Pinyon Script', cursive;
}

/* Decorative Background Pattern */
.bg-lace-pattern {
  background-color: var(--color-ivory);
  background-image: radial-gradient(var(--color-rose-gold-light) 1px, transparent 1px), radial-gradient(var(--color-rose-gold-light) 1px, var(--color-ivory) 1px);
  background-size: 40px 40px;
  background-position: 0 0, 20px 20px;
  opacity: 0.85;
}

/* Coquette Bow Animations */
@keyframes float-bow {
  0% {
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    transform: translateY(-8px) rotate(2deg);
  }
  100% {
    transform: translateY(0px) rotate(0deg);
  }
}

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

@keyframes pulse-ring {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(224, 168, 153, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 15px rgba(224, 168, 153, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(224, 168, 153, 0);
  }
}

.animate-pulse-ring {
  animation: pulse-ring 2.5s infinite;
}

/* Equalizer Bars Animation */
@keyframes bounce-bar {
  0%, 100% {
    transform: scaleY(0.3);
  }
  50% {
    transform: scaleY(1);
  }
}

.music-bar {
  display: inline-block;
  width: 3px;
  height: 20px;
  background-color: var(--color-gold);
  margin: 0 1.5px;
  transform-origin: bottom;
  border-radius: 2px;
}

.music-bar-1 { animation: bounce-bar 0.6s ease-in-out infinite; }
.music-bar-2 { animation: bounce-bar 0.8s ease-in-out infinite; animation-delay: 0.15s; }
.music-bar-3 { animation: bounce-bar 0.5s ease-in-out infinite; animation-delay: 0.3s; }
.music-bar-4 { animation: bounce-bar 0.7s ease-in-out infinite; animation-delay: 0.45s; }

/* Lightbox styles */
.lightbox-active {
  overflow: hidden;
}

/* Text glow */
.text-gold-glow {
  text-shadow: 0 0 8px rgba(212, 175, 55, 0.3);
}

/* Glassmorphism over photo background */
.glass-panel {
  background: rgba(250, 246, 240, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(224, 168, 153, 0.3);
}

.glass-panel-dark {
  background: rgba(44, 37, 35, 0.75);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(224, 168, 153, 0.15);
}

/* Custom cards styling with gold frame and coquette lace border effect */
.luxury-frame {
  position: relative;
  border: 1px solid var(--color-rose-gold);
  box-shadow: 0 4px 20px rgba(184, 125, 110, 0.08);
}

.luxury-frame::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  right: 4px;
  bottom: 4px;
  border: 1px solid rgba(212, 175, 55, 0.4);
  pointer-events: none;
}

/* Double confirmation style button curves */
.rsvp-btn {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.rsvp-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(184, 125, 110, 0.2);
}

/* Custom map frame coquette style */
.map-container {
  overflow: hidden;
  border: 4px solid #fff;
  box-shadow: 0 10px 25px rgba(184, 125, 110, 0.12);
  border-radius: 8px;
}