/* ============================================================
   EVENTS BY JESSICA — Animations & Keyframes
   ============================================================ */

/* --- Floating Elements --- */
@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-14px); }
}

@keyframes floatX {
  0%, 100% { transform: translateX(0); }
  50%       { transform: translateX(10px); }
}

@keyframes floatDiag {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  33%       { transform: translate(8px, -10px) rotate(3deg); }
  66%       { transform: translate(-6px, -6px) rotate(-2deg); }
}

/* --- Shimmer --- */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

.shimmer-text {
  background: linear-gradient(90deg, var(--clr-gold) 0%, var(--clr-gold-light) 40%, var(--clr-gold) 80%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 3s linear infinite;
}

/* --- Pulse Glow --- */
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201,168,76,0.3); }
  50%       { box-shadow: 0 0 0 12px rgba(201,168,76,0); }
}

.pulse-glow {
  animation: pulseGlow 2s ease-in-out infinite;
}

/* --- Spin Slow --- */
@keyframes spinSlow {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* --- Scale In --- */
@keyframes scaleIn {
  from { transform: scale(0.5); opacity: 0; }
  to   { transform: scale(1); opacity: 1; }
}

/* --- Slide In Right --- */
@keyframes slideInRight {
  from { transform: translateX(40px); opacity: 0; }
  to   { transform: translateX(0); opacity: 1; }
}

/* --- Slide In Left --- */
@keyframes slideInLeft {
  from { transform: translateX(-40px); opacity: 0; }
  to   { transform: translateX(0); opacity: 1; }
}

/* --- Slide In Up --- */
@keyframes slideInUp {
  from { transform: translateY(30px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* --- Clip Path Reveal --- */
@keyframes clipReveal {
  from { clip-path: inset(0 100% 0 0); }
  to   { clip-path: inset(0 0% 0 0); }
}

.clip-reveal {
  animation: clipReveal 0.9s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

/* --- Counter Number --- */
@keyframes countUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* --- Draw Line --- */
@keyframes drawLine {
  from { width: 0; }
  to   { width: 100%; }
}

/* --- Gradient Shift --- */
@keyframes gradShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.gradient-animate {
  background-size: 200% 200%;
  animation: gradShift 6s ease infinite;
}

/* --- Skeleton Loading --- */
@keyframes skeleton {
  0%   { background-position: -200px 0; }
  100% { background-position: calc(200px + 100%) 0; }
}

/* --- Bounce Soft --- */
@keyframes bounceSoft {
  0%, 100% { transform: translateY(0); }
  40%       { transform: translateY(-10px); }
  60%       { transform: translateY(-5px); }
}

/* --- Rotate & Scale --- */
@keyframes rotateScale {
  0%, 100% { transform: rotate(0deg) scale(1); }
  50%       { transform: rotate(5deg) scale(1.05); }
}

/* --- Ping Effect --- */
@keyframes ping {
  75%, 100% {
    transform: scale(2);
    opacity: 0;
  }
}

/* --- Decorative Petals --- */
.deco-petal {
  position: absolute;
  pointer-events: none;
  opacity: 0.12;
  border-radius: 50% 0 50% 0;
}

.deco-petal-1 {
  width: 80px;
  height: 80px;
  background: var(--clr-primary);
  top: 15%;
  right: 8%;
  animation: floatDiag 9s ease-in-out infinite;
}

.deco-petal-2 {
  width: 50px;
  height: 50px;
  background: var(--clr-gold);
  bottom: 20%;
  left: 5%;
  animation: floatDiag 7s ease-in-out 1s infinite;
}

.deco-petal-3 {
  width: 100px;
  height: 100px;
  background: var(--clr-primary-light);
  top: 60%;
  right: 3%;
  animation: floatY 11s ease-in-out 2s infinite;
  opacity: 0.07;
}

/* --- Floating Circle Rings --- */
.deco-ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(201,168,76,0.15);
  pointer-events: none;
}

/* --- Hover Tilt (JS adds class) --- */
.tilt-card {
  transform-style: preserve-3d;
  transition: transform 0.15s ease;
}

/* --- Page Transition Overlay --- */
.page-transition {
  position: fixed;
  inset: 0;
  background: var(--clr-dark);
  z-index: 9999;
  pointer-events: none;
  transform: translateY(100%);
}

.page-transition.enter {
  transform: translateY(0);
  transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
}

.page-transition.exit {
  transform: translateY(-100%);
  transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1) 0.1s;
}

/* --- Gold Line Animate --- */
.gold-line-animate {
  height: 1px;
  background: var(--grad-gold);
  transform-origin: left;
  animation: drawLine 1.2s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

/* --- Stagger Children --- */
.stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.stagger.revealed > *:nth-child(1) { opacity:1; transform:none; transition-delay:0.05s; }
.stagger.revealed > *:nth-child(2) { opacity:1; transform:none; transition-delay:0.12s; }
.stagger.revealed > *:nth-child(3) { opacity:1; transform:none; transition-delay:0.19s; }
.stagger.revealed > *:nth-child(4) { opacity:1; transform:none; transition-delay:0.26s; }
.stagger.revealed > *:nth-child(5) { opacity:1; transform:none; transition-delay:0.33s; }
.stagger.revealed > *:nth-child(6) { opacity:1; transform:none; transition-delay:0.40s; }
.stagger.revealed > *:nth-child(7) { opacity:1; transform:none; transition-delay:0.47s; }
.stagger.revealed > *:nth-child(8) { opacity:1; transform:none; transition-delay:0.54s; }
.stagger.revealed > *:nth-child(9) { opacity:1; transform:none; transition-delay:0.61s; }

/* --- Floating Action Pulse --- */
.sticky-cta__btn--call,
.sticky-cta__btn--whatsapp {
  animation: none;
}

/* On load pulse once */
@keyframes buttonEntrance {
  0%   { transform: scale(0.8); opacity: 0; }
  60%  { transform: scale(1.05); }
  100% { transform: scale(1); opacity: 1; }
}

.sticky-cta-enter {
  animation: buttonEntrance 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}