/* ═══════════════════════════════════════════════════════════════
   ANIMATIONS.CSS — The Bride Story By Deepsikha
   All keyframes, entrance animations, shimmer effects
═══════════════════════════════════════════════════════════════ */

/* ─── Splash Screen Animations ──────────────────────────────── */
@keyframes splashLogoReveal {
    0%   { opacity: 0; transform: scale(0.6) rotate(-10deg); filter: brightness(0); }
    40%  { opacity: 1; transform: scale(1.08) rotate(0deg); filter: brightness(1.5); }
    70%  { transform: scale(0.98); }
    100% { opacity: 1; transform: scale(1); filter: brightness(1); }
}

@keyframes splashTitleReveal {
    0%   { opacity: 0; letter-spacing: 0.5em; transform: translateY(30px); }
    100% { opacity: 1; letter-spacing: 0.12em; transform: translateY(0); }
}

@keyframes splashGlowPulse {
    0%, 100% { box-shadow: 0 0 60px 20px rgba(212,175,55,0.2), 0 0 120px 40px rgba(212,175,55,0.08); }
    50%       { box-shadow: 0 0 80px 30px rgba(212,175,55,0.4), 0 0 160px 60px rgba(212,175,55,0.15); }
}

@keyframes splashFadeOut {
    0%   { opacity: 1; visibility: visible; }
    100% { opacity: 0; visibility: hidden; }
}

/* ─── Golden Shimmer Sweep ───────────────────────────────────── */
@keyframes goldShimmer {
    0%   { background-position: -200% center; }
    100% { background-position: 200% center; }
}

@keyframes shimmerSweep {
    0%   { left: -100%; }
    100% { left: 200%; }
}

/* ─── Floating Sparkles ─────────────────────────────────────── */
@keyframes sparkleFloat {
    0%   { transform: translateY(0) scale(0) rotate(0deg);  opacity: 0; }
    20%  { opacity: 1; }
    80%  { opacity: 0.8; }
    100% { transform: translateY(-120px) scale(1) rotate(180deg); opacity: 0; }
}

@keyframes sparkleTwinkle {
    0%, 100% { opacity: 0; transform: scale(0); }
    50%       { opacity: 1; transform: scale(1); }
}

/* ─── Entrance Animations ───────────────────────────────────── */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(50px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInLeft {
    from { opacity: 0; transform: translateX(-60px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInRight {
    from { opacity: 0; transform: translateX(60px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes scaleIn {
    from { opacity: 0; transform: scale(0.8); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-30px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ─── Divider Animations ────────────────────────────────────── */
@keyframes expandLine {
    from { width: 0; opacity: 0; }
    to   { width: 100%; opacity: 1; }
}

@keyframes dividerGlow {
    0%, 100% { box-shadow: 0 0 4px rgba(212,175,55,0.3); }
    50%       { box-shadow: 0 0 12px rgba(212,175,55,0.8), 0 0 24px rgba(212,175,55,0.4); }
}

/* ─── Card & Button Hover ───────────────────────────────────── */
@keyframes cardGlowPulse {
    0%, 100% { box-shadow: 0 8px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(212,175,55,0.2); }
    50%       { box-shadow: 0 8px 32px rgba(0,0,0,0.4), 0 0 20px rgba(212,175,55,0.4), 0 0 0 1px rgba(212,175,55,0.5); }
}

@keyframes btnShimmer {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ─── WhatsApp Button ───────────────────────────────────────── */
@keyframes whatsappPulse {
    0%   { transform: scale(1); box-shadow: 0 0 0 0 rgba(37,211,102,0.5); }
    70%  { transform: scale(1); box-shadow: 0 0 0 18px rgba(37,211,102,0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}

@keyframes whatsappBounce {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-6px); }
}

/* ─── Scrolling Marquee (Add-Ons) ───────────────────────────── */
@keyframes marqueeScroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* ─── Hero Parallax ─────────────────────────────────────────── */
@keyframes heroKenBurns {
    0%   { transform: scale(1) translate(0, 0); }
    50%  { transform: scale(1.05) translate(-1%, -1%); }
    100% { transform: scale(1) translate(0, 0); }
}

/* ─── Star Rating ───────────────────────────────────────────── */
@keyframes starPop {
    0%   { transform: scale(0) rotate(-30deg); opacity: 0; }
    70%  { transform: scale(1.3) rotate(5deg); }
    100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

/* ─── Floating Animation (hero elements) ────────────────────── */
@keyframes floatUpDown {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-12px); }
}

/* ─── Ripple Effect ─────────────────────────────────────────── */
@keyframes ripple {
    0%   { transform: scale(0); opacity: 0.6; }
    100% { transform: scale(4); opacity: 0; }
}

/* ─── Loading Spinner ───────────────────────────────────────── */
@keyframes spinGold {
    to { transform: rotate(360deg); }
}

/* ─── Gallery Hover Overlay ─────────────────────────────────── */
@keyframes overlayReveal {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ─── Scroll Down Indicator ─────────────────────────────────── */
@keyframes scrollBounce {
    0%, 100% { transform: translateY(0) translateX(-50%); opacity: 1; }
    50%       { transform: translateY(10px) translateX(-50%); opacity: 0.5; }
}

/* ─── Page Transition ───────────────────────────────────────── */
@keyframes pageIn {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ─── Modal ─────────────────────────────────────────────────── */
@keyframes modalIn {
    from { opacity: 0; transform: scale(0.85) translateY(30px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes modalBackdropIn {
    from { opacity: 0; backdrop-filter: blur(0); }
    to   { opacity: 1; backdrop-filter: blur(12px); }
}

/* ─── Section Title Ornament ────────────────────────────────── */
@keyframes titleLineExpand {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
}
