/* ============================================================
   Köprülü Ekspertiz — animations.css
   Kaydırma açığa çıkarmaları, keyframe'ler, dekoratif hareket
   Not: Tüm hareket `prefers-reduced-motion` ile devre dışı bırakılabilir.
   ============================================================ */

/* ---------- 1. KAYDIRMA İLE AÇIĞA ÇIKMA ---------- */
[data-reveal] {
  opacity: 0;
  will-change: transform, opacity;
  transition:
    opacity .7s var(--ease-out),
    transform .7s var(--ease-out),
    filter .7s var(--ease-out);
  transition-delay: var(--reveal-delay, 0ms);
}
[data-reveal='up']    { transform: translateY(28px); }
[data-reveal='down']  { transform: translateY(-24px); }
[data-reveal='left']  { transform: translateX(-32px); }
[data-reveal='right'] { transform: translateX(32px); }
[data-reveal='scale'] { transform: scale(.94); }
[data-reveal='blur']  { transform: translateY(18px); filter: blur(8px); }
[data-reveal='fade']  { transform: none; }

[data-reveal].is-in {
  opacity: 1;
  transform: none;
  filter: none;
}

/* Alt öğeleri sırayla açan kapsayıcı — JS --reveal-delay atar */
[data-stagger] > * { opacity: 0; transform: translateY(22px); }
[data-stagger].is-in > * {
  opacity: 1;
  transform: none;
  transition: opacity .6s var(--ease-out), transform .6s var(--ease-out);
  transition-delay: calc(var(--i, 0) * var(--stagger-step, 70ms));
}

/* Başlık kelime kelime açılır */
.split-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(.5em) rotate(1.5deg);
  transition: opacity .6s var(--ease-out), transform .6s var(--ease-out);
  transition-delay: calc(var(--w, 0) * 55ms);
}
.is-in .split-word { opacity: 1; transform: none; }

/* ---------- 2. KEYFRAME'LER ---------- */
@keyframes spin { to { transform: rotate(360deg); } }

@keyframes fade-slide-up {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

@keyframes toast-in {
  from { opacity: 0; transform: translateY(16px) scale(.97); }
  to   { opacity: 1; transform: none; }
}
@keyframes toast-out {
  to { opacity: 0; transform: translateY(10px) scale(.98); }
}

@keyframes shake {
  0%, 100% { transform: translateX(0); }
  25%      { transform: translateX(-4px); }
  75%      { transform: translateX(4px); }
}

@keyframes float-soft {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}

@keyframes pulse-ring {
  0%   { box-shadow: 0 0 0 0 rgba(37, 211, 102, .55); }
  70%  { box-shadow: 0 0 0 14px rgba(37, 211, 102, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes shimmer-sweep {
  from { background-position: 200% 0; }
  to   { background-position: -200% 0; }
}

@keyframes orb-drift {
  0%   { transform: translate3d(0, 0, 0) scale(1); }
  33%  { transform: translate3d(4%, -5%, 0) scale(1.08); }
  66%  { transform: translate3d(-3%, 4%, 0) scale(.95); }
  100% { transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes caret-blink {
  0%, 45%   { opacity: 1; }
  50%, 95%  { opacity: 0; }
  100%      { opacity: 1; }
}

/* ---------- 3. DEKORATİF ARKA PLAN ---------- */
.bg-decor {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: -1;
}

.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  opacity: .5;
  animation: orb-drift 26s ease-in-out infinite;
  will-change: transform;
}
.orb--a {
  width: min(420px, 55vw);
  aspect-ratio: 1;
  top: -12%;
  left: -8%;
  background: radial-gradient(circle, rgba(59,130,246,.5), transparent 68%);
}
.orb--b {
  width: min(360px, 48vw);
  aspect-ratio: 1;
  bottom: -14%;
  right: -6%;
  background: radial-gradient(circle, rgba(212,175,55,.4), transparent 68%);
  animation-duration: 32s;
  animation-direction: reverse;
}

/* İnce ızgara dokusu */
.grid-texture {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background-image:
    linear-gradient(to right, rgba(11,18,32,.045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(11,18,32,.045) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse 78% 62% at 50% 0%, #000 35%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 78% 62% at 50% 0%, #000 35%, transparent 78%);
}
.section--dark .grid-texture {
  background-image:
    linear-gradient(to right, rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.05) 1px, transparent 1px);
}

/* ---------- 4. HAREKET YARDIMCILARI ---------- */
.float-soft { animation: float-soft 6s ease-in-out infinite; }
.float-soft--slow { animation-duration: 8s; animation-delay: -2s; }

.pulse-ring { animation: pulse-ring 2.4s ease-out infinite; }

/* Kayan şerit (çözüm ortakları) */
.marquee {
  position: relative;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.marquee__track {
  display: flex;
  gap: .875rem;
  width: max-content;
  animation: marquee var(--marquee-time, 46s) linear infinite;
}
.marquee:hover .marquee__track,
.marquee:focus-within .marquee__track { animation-play-state: paused; }
.marquee__track > * { flex: 0 0 auto; width: 190px; }

/* Sayı sayacı — düzen kaymasını önlemek için sabit genişlik */
[data-count] { font-variant-numeric: tabular-nums; }

/* Altı çizili animasyonlu bağlantı */
.link-underline {
  position: relative;
  color: var(--brand-500);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: .3125rem;
}
.link-underline::after {
  content: '';
  position: absolute;
  left: 0; bottom: -2px;
  width: 100%; height: 1.5px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--t-base);
}
.link-underline:hover::after { transform: scaleX(1); transform-origin: left; }
.link-underline svg { transition: transform var(--t-base); }
.link-underline:hover svg { transform: translateX(3px); }

/* Yazılıyor efekti imleci (hero sorgu kutusu ipucu) */
.typed-caret {
  display: inline-block;
  width: 2px;
  height: 1em;
  margin-left: 1px;
  background: var(--brand-500);
  vertical-align: text-bottom;
  animation: caret-blink 1.1s steps(1) infinite;
}

/* Altın parıltılı kenarlık */
.beam-border {
  position: relative;
  isolation: isolate;
}
.beam-border::before {
  content: '';
  position: absolute;
  inset: -1px;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(110deg, transparent 30%, rgba(212,175,55,.85) 50%, transparent 70%);
  background-size: 220% 100%;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: shimmer-sweep 4.5s linear infinite;
  opacity: .8;
}

/* Görsel yükleme iskeleti */
.skeleton {
  background: linear-gradient(100deg, var(--bg-subtle) 30%, #f4f6f9 50%, var(--bg-subtle) 70%);
  background-size: 220% 100%;
  animation: shimmer-sweep 1.4s linear infinite;
}

/* ---------- 5. AZALTILMIŞ HAREKET ---------- */
/* ÖNEMLİ — bu blok bir zamanlar şöyleydi:
       *, *::before, *::after { animation-duration: .01ms !important; }
   Yani hareket azaltma açık olan HERKESTE sitedeki bütün animasyonlar
   susuyordu. Windows'ta "Animasyon efektleri"ni farkında olmadan kapatmış
   çok kullanıcı var; onlar siteyi tamamen hareketsiz görüyordu.

   Yeni yaklaşım cerrahi: vestibüler rahatsızlığın asıl kaynağı olan
   SONSUZ DÖNGÜLER ve BÜYÜK MESAFELİ HAREKETLER kapatılır; içeriğin
   belirmesi, sayaçlar ve arayüz geçişleri kısaltılarak korunur. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  /* 1) Sonsuz/dekoratif hareketler — tamamen kapalı */
  .orb,
  .marquee__track,
  .float-soft,
  .pulse-ring,
  .skeleton,
  .beam-border::before {
    animation: none !important;
  }
  .typed-caret { display: none; }

  /* 2) İçerik açığa çıkarmaları: kayma/bulanıklık yok, kısa bir beliriş var.
        Konum değişmediği için baş dönmesi yapmaz; hareket hissi korunur. */
  [data-reveal],
  [data-stagger] > *,
  .split-word {
    transform: none !important;
    filter: none !important;
    transition-duration: .35s !important;
    transition-delay: 0ms !important;
  }

  /* 3) Arayüz geçişleri kısalır ama kaybolmaz */
  .btn, .service-card, .doc-item, .partner-card, .stat-card,
  .value-item, .contact-item, .trust-chip, .quick-link, .acc-btn {
    transition-duration: .15s !important;
  }
  .service-card:hover, .doc-item:hover, .partner-card:hover,
  .stat-card:hover, .btn:hover { transform: none !important; }

  /* 4) Uzun mesafeli yumuşak kaydırma — gerçek tetikleyici, kapalı kalır */
  .doc-track { scroll-behavior: auto !important; }
}

/* JS devre dışıysa içerik yine de görünür olmalı */
.no-js [data-reveal],
.no-js [data-stagger] > *,
.no-js .split-word {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}
.no-js .doc-track { grid-auto-flow: row; grid-auto-columns: auto; }