﻿/* =========================================
   LORIAN V ? ANIMATIONS
   ========================================= */

/* --- Fade In --- */
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

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

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

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

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

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

/* --- Glow Pulse --- */
@keyframes pulse-glow {
  0%, 100% { filter: drop-shadow(0 0 10px rgba(168, 85, 247, 0.4)); }
  50%       { filter: drop-shadow(0 0 25px rgba(168, 85, 247, 0.8)); }
}

@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 0 10px rgba(168, 85, 247, 0.3); }
  50%       { box-shadow: 0 0 30px rgba(168, 85, 247, 0.6), 0 0 60px rgba(168, 85, 247, 0.2); }
}

/* --- Float --- */
@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-12px); }
}

/* --- Slide --- */
@keyframes slideUp {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

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

@keyframes spinReverse {
  from { transform: rotate(360deg); }
  to   { transform: rotate(0deg); }
}

/* --- Shimmer (skeleton loading) --- */
@keyframes shimmer {
  0%   { background-position: -1000px 0; }
  100% { background-position:  1000px 0; }
}

.skeleton {
  background: linear-gradient(90deg, var(--color-card) 25%, var(--color-card-hover) 50%, var(--color-card) 75%);
  background-size: 1000px 100%;
  animation: shimmer 2s infinite;
  border-radius: var(--border-radius-sm);
}

/* --- Typing Cursor --- */
@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

.typing-cursor::after {
  content: '|';
  animation: blink 1s infinite;
  color: var(--color-primary-light);
}

/* --- Neon Border --- */
@keyframes neon-border {
  0%, 100% { border-color: rgba(168, 85, 247, 0.3); box-shadow: 0 0 5px rgba(168, 85, 247, 0.2); }
  50%       { border-color: rgba(168, 85, 247, 0.8); box-shadow: 0 0 20px rgba(168, 85, 247, 0.5); }
}

/* --- Hero Title Particles --- */
@keyframes particle-float {
  0%   { transform: translateY(100vh) rotate(0deg);   opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { transform: translateY(-20px) rotate(720deg); opacity: 0; }
}

/* --- Scroll Reveal (JS ile tetiklenir) --- */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

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

/* --- Nav Glassmorphism --- */
@keyframes navSlideDown {
  from { transform: translateY(-100%); opacity: 0; }
  to   { transform: translateY(0);     opacity: 1; }
}

/* --- Counter (stat sayacA±) --- */
@keyframes countUp {
  from { opacity: 0; transform: scale(0.5); }
  to   { opacity: 1; transform: scale(1); }
}

/* --- Gradient Shift (hero background) --- */
@keyframes gradient-shift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* --- Orb drift --- */
@keyframes orb-drift {
  0%   { transform: translate(0, 0) scale(1); }
  33%  { transform: translate(30px, -30px) scale(1.05); }
  66%  { transform: translate(-20px, 20px) scale(0.95); }
  100% { transform: translate(0, 0) scale(1); }
}

.orb-animated {
  animation: orb-drift 12s ease-in-out infinite;
}

.orb-animated-2 {
  animation: orb-drift 16s ease-in-out infinite reverse;
}

/* --- Star twinkle --- */
@keyframes twinkle {
  0%, 100% { opacity: 0.2; transform: scale(1); }
  50%       { opacity: 1;   transform: scale(1.3); }
}

/* --- Discord bounce --- */
@keyframes discord-bounce {
  0%, 100% { transform: translateY(0) rotate(0); }
  25% { transform: translateY(-6px) rotate(-3deg); }
  75% { transform: translateY(-3px) rotate(2deg); }
}

/* --- Utility animation classes --- */
.anim-fade-in         { animation: fadeIn        0.5s ease forwards; }
.anim-fade-in-up      { animation: fadeInUp      0.6s ease forwards; }
.anim-fade-in-down    { animation: fadeInDown    0.6s ease forwards; }
.anim-scale-in        { animation: scaleIn       0.5s ease forwards; }
.anim-float           { animation: float         4s ease-in-out infinite; }
.anim-pulse-glow      { animation: pulse-glow    2s ease-in-out infinite; }
.anim-glow-pulse      { animation: glow-pulse    2.5s ease-in-out infinite; }
.anim-spin            { animation: spin          1s linear infinite; }
.anim-neon-border     { animation: neon-border   2s ease-in-out infinite; }


@keyframes float3d {
  0% { transform: translateY(0) rotateX(0deg) rotateY(0deg); }
  50% { transform: translateY(-40px) rotateX(20deg) rotateY(20deg); }
  100% { transform: translateY(0) rotateX(0deg) rotateY(0deg); }
}
@keyframes float3d-reverse {
  0% { transform: translateY(0) rotateX(0deg) rotateY(0deg); }
  50% { transform: translateY(50px) rotateX(-20deg) rotateY(-30deg); }
  100% { transform: translateY(0) rotateX(0deg) rotateY(0deg); }
}
