/* =========================================================
   MASAL / Editöryal hareket katmanı
   Eşlik eden betik: js/editorial-motion.js

   Buradaki hiçbir kural içeriği kendi başına gizlemez. Satır maskeleri,
   bölüm numaraları ve tiraj çizgileri DOM'a betik çalıştıktan sonra
   giriyor; dosya inmezse ya da GSAP gelmezse sayfa bugünkü hâlinde kalır.
   Bu yüzden burada [data-reveal] benzeri bir "önce gizle" adımı yok.

   Katman yalnızca geniş ekranda, hareket kısıtı ve veri tasarrufu kapalıyken
   kuruluyor; koşul index.html'deki yükleyicide.
   ========================================================= */

/* ---------- başlık: satır maskesi ----------
   Başlık satırlara bölünüp her satır kendi maskesine giriyor, içteki kutu
   aşağıdan yükseliyor. Kolon flex çünkü flex kapsayıcıda bitişik kenar
   boşlukları birleşmiyor: aşağıdaki padding / negatif margin çifti satır
   başına birbirini tam götürsün, başlığın satır aralığı değişmesin. */
.em-lines {
  display: flex;
  flex-direction: column;
}

.em-l {
  display: block;
  overflow: hidden;
  /* Fraunces'ın alt/üst uzantıları ve yan taşan kernleri maskeye takılmasın
     diye kutu her yönde büyütülüyor, aynı miktar geri alınıyor. */
  padding: .12em .16em .28em;
  margin: -.12em -.16em -.28em;
}

.em-li {
  display: block;
}

/* Kelime kademesi: gölgeli / açık zemin üstündeki başlıklar maskeye
   girmiyor (overflow gölgeyi satır sınırında keserdi), kelime kelime
   yükseliyor. */
.em-w {
  display: inline-block;
}

/* ---------- eşik satırı: bölüm numarası ve tiraj ----------
   .esik zaten flex bir satır (logo + etiket). Numara logonun hemen ardına,
   çizgi satırın sonuna giriyor; ikisi de aria-hidden, ekran okuyucuya bölüm
   etiketinin kendisi gidiyor. */
.em-idx {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  letter-spacing: .1em;
  opacity: .62;
}

.em-idx::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: .95em;
  margin-inline-start: .55rem;
  vertical-align: -.14em;
  background: currentColor;
  opacity: .45;
}

.em-rule {
  flex: 1 1 auto;
  max-width: clamp(2.25rem, 8vw, 7rem);
  height: 1px;
  margin-inline-start: .25rem;
  background: currentColor;
  opacity: .36;
  transform-origin: left center;
}

/* Ortalanmış eşik satırında (varsa) tiraj çizgisi iki yana taşmasın. */
.vitrin-gallery__head .em-rule {
  flex: 0 0 auto;
}

/* ---------- akan şerit: kaydırma hızına tepki ----------
   Şeridin kendi CSS animasyonu .ticker__track üzerinde; eğim bir alt
   katmana, gruplara yazılıyor ki iki dönüşüm birbirini ezmesin. */
.ticker__group {
  transform-origin: center center;
}