/* ============================================
   KODIUM BİLİŞİM — ANIMATIONS STYLESHEET
============================================ */

/* ===== REVEAL =====
   Kaldırıldı: .reveal öğeleri IntersectionObserver tetiklenene kadar opacity:0
   bekliyordu; ekran görüntüsü, paylaşım önizlemesi ve kaydırmayan okuyucu boş
   bölümler görüyordu. İçerik artık her zaman görünür. Sınıflar HTML'de zararsız
   işaret olarak kalıyor. */

/* ===== BUTTON ANIMATIONS ===== */
.btn-primary, .btn-secondary, .btn-nav {
  position: relative; overflow: hidden;
}
.btn-primary::after {
  content: '';
  position: absolute; inset: 0;
  background: rgba(255,255,255,0.15);
  transform: translateX(-100%) skewX(-15deg);
  transition: transform 0.4s ease;
}
.btn-primary:hover::after {
  transform: translateX(100%) skewX(-15deg);
}

/* ===== GRADIENT ANIMATION =====
   Yalnızca hero başlığında akar. Sayfa başına ~40 degrade metnin hepsinin
   sonsuz döngüde yeniden boyanması hem dikkat dağıtıyor hem de boyama maliyeti. */
@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.hero-title .gradient-text {
  background-size: 200% 200%;
  animation: gradientShift 6s ease infinite;
}

/* ===== GLOW PULSE =====
   Kaldırıldı: sayfada 31 butonda sonsuz box-shadow nabzı vardı. Statik gölge main.css'te. */

/* ===== NAV SCROLL ANIMATION ===== */
#navbar { transition: padding 0.3s ease, background 0.3s ease, box-shadow 0.3s ease; }

/* ===== HERO ENTRANCE =====
   Metin opaklıkla gizlenmez; yalnızca hafifçe yükselir. Başlık ilk karede okunur
   (LCP gecikmesi yok). */
.hero-content { animation: heroEnter 0.7s cubic-bezier(0.16, 1, 0.3, 1) both; }
.hero-visual  { animation: heroEnterRight 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.15s both; }
@keyframes heroEnter {
  from { transform: translateY(16px); }
  to   { transform: translateY(0); }
}
@keyframes heroEnterRight {
  from { opacity: 0; transform: translateX(30px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ===== ICON FLOAT ===== */
@keyframes iconFloat {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  33%       { transform: translateY(-6px) rotate(2deg); }
  66%       { transform: translateY(3px) rotate(-1deg); }
}
.service-card:hover .service-icon { animation: iconFloat 2s ease-in-out infinite; }

/* ===== SCROLL BAR CUSTOM ===== */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg-primary); }
::-webkit-scrollbar-thumb { background: rgba(59,130,246,0.4); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

/* ===== SELECTION ===== */
::selection { background: rgba(59,130,246,0.3); color: var(--text-primary); }

/* ===== FOCUS =====
   Odak halkası main.css'te tek yerde tanımlı. Buradaki eski kural bu dosya sonra
   yüklendiği için onu eziyor ve odaktaki yuvarlak düğmelerin köşesini 4px'e çekiyordu. */

/* ===== REDUCED MOTION =====
   Kullanıcı sistem düzeyinde hareketi azaltmayı seçtiyse tüm süsleme
   animasyonları durur; içerik anında ve tam görünür kalır. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  html { scroll-behavior: auto; }
  .reveal, .reveal-left, .reveal-right { opacity: 1; transform: none; }
  .hero-content, .hero-visual { opacity: 1; transform: none; }
  .orb, .floating-card { animation: none !important; }
  .btn-primary:hover { transform: none; }
}
