/* ============================================================
   RIA ART JEWELLERY — ANIMATIONS & KEYFRAMES
   ============================================================ */

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInLeft {
  from { opacity: 0; transform: translateX(-28px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes fadeInRight {
  from { opacity: 0; transform: translateX(28px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.94); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes goldShimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}
@keyframes softPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.7; transform: scale(0.96); }
}
@keyframes vaultBounce {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.35); }
  60%  { transform: scale(0.88); }
  80%  { transform: scale(1.1); }
  100% { transform: scale(1); }
}
@keyframes tickerScroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@keyframes slideInRight {
  from { transform: translateX(100%); opacity: 0; }
  to   { transform: translateX(0); opacity: 1; }
}
@keyframes slideInUp {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}
@keyframes overlayIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes skeletonShimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes scrollLinePulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.3; }
}

/* ── SCROLL REVEAL ── */
.reveal {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity var(--dur-slow) var(--ease-out),
              transform var(--dur-slow) var(--ease-out);
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0) translateX(0) scale(1);
}
.reveal-left  { transform: translateX(-36px); }
.reveal-right { transform: translateX(36px); }
.reveal-scale { transform: scale(0.93); }

.stagger-1 { transition-delay: 0.1s; }
.stagger-2 { transition-delay: 0.2s; }
.stagger-3 { transition-delay: 0.3s; }
.stagger-4 { transition-delay: 0.4s; }
.stagger-5 { transition-delay: 0.5s; }

.animate-fade-up  { animation: fadeInUp var(--dur-slow) var(--ease-out) both; }
.animate-scale-in { animation: scaleIn var(--dur-slow) var(--ease-out) both; }
.animate-bounce   { animation: vaultBounce 0.5s var(--ease-bounce); }
.pulse-badge      { animation: softPulse 2s ease-in-out infinite; }

.shimmer-text {
  background: linear-gradient(90deg,
    var(--ria-gold-dark) 0%,
    var(--ria-gold-shine) 40%,
    var(--ria-gold-primary) 60%,
    var(--ria-gold-dark) 100%
  );
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: goldShimmer 3s linear infinite;
}

.hover-lift {
  transition: transform var(--dur-base) var(--ease-smooth),
              box-shadow var(--dur-base) var(--ease-smooth);
}
.hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
}

@supports (animation-timeline: scroll()) {
  .scroll-fade {
    animation: fadeInUp linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 30%;
  }
}