/* ═══════════════════════════════════════════════════════════════════════
   HAREKET KATMANI — başlangıç durumları

   Buradaki tek iş, animasyonla gelecek öğeleri JS devralmadan ÖNCE
   gizlemek. Gizlemezsek öğe bir kare görünüp sonra kaybolur ve geri
   gelir; bu "zıplama" hissi bütün intibayı bozar.

   Gizleme YALNIZCA `html.hareket-var` altında yapılır. Bu sınıfı
   `hareket-acilis.html` içindeki satır içi kod koyar ve yalnız iki şart
   birden sağlanırsa koyar:
     1) ziyaretçi işletim sisteminde hareketi kısmamış,
     2) sayfada gerçekten hareket işareti (data-*) var.
   JS hiç çalışmazsa sınıf hiç eklenmez; hiçbir şey gizlenmez, sayfa
   olduğu gibi görünür. Bu katman bozulursa site bozulmaz.
   ═══════════════════════════════════════════════════════════════════════ */

/* Sadece dönüşüm (transform) ve saydamlık (opacity) canlandırılır —
   ikisi de yerleşimi yeniden hesaplatmaz, bu yüzden sayfa zıplamaz (CLS). */

.hareket-var [data-belir],
.hareket-var [data-belir-grup] > *,
.hareket-var [data-giris] > * {
  opacity: 0;
}

/* Satır satır açılan başlıkta maskeyi SplitText kuruyor; burada yalnız
   başlığın tamamını saklıyoruz ki bölünmeden önce görünmesin. */
.hareket-var [data-satir] {
  opacity: 0;
}

/* Sayaç: son değeri yazıyken sıfırlanmasın diye genişliği baştan
   ayrılır. Aksi hâlde "0" iken dar, "544" iken geniş olur ve yanındaki
   yazı kayar. */
[data-sayac] {
  display: inline-block;
  font-variant-numeric: tabular-nums;
}

/* Lenis akıcı kaydırma açıkken gövde kendi kaydırmasını yönetir. */
html.lenis,
html.lenis body {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}
.lenis.lenis-stopped {
  overflow: hidden;
}

/* ── Hareketi kapatmış ziyaretçi ────────────────────────────────────────
   Sınıf zaten eklenmediği için buraya normalde hiç gelinmez; yine de
   ikinci bir emniyet: hareket kısılıysa hiçbir şey gizli kalmaz. */
@media (prefers-reduced-motion: reduce) {
  .hareket-var [data-belir],
  .hareket-var [data-belir-grup] > *,
  .hareket-var [data-giris] > *,
  .hareket-var [data-satir] {
    opacity: 1 !important;
    transform: none !important;
  }
}