/* ===========================================================
   THE TURN ROASTERY — Hareket katmanı (Faz 3 · rev 2)

   Kural değişmedi: her öğe görünür halde durur. JS çalışıyorsa
   ve kullanıcı hareket istiyorsa .js-motion eklenir, ancak o
   zaman öğeler başlangıç durumuna alınır.

   rev 2: süreler yavaşladı. Referansta en yaygın geçiş 1.1 s ve
   1.7 s. 560 ms'lik önceki ritim, sinematik tempoyu kaçırıyordu.
   =========================================================== */

/* ---------- Scroll reveal ---------- */
.js-motion .reveal{
  opacity:0;
  translate:0 32px;
  transition:opacity var(--dur-slow) var(--ease-reveal),
             translate var(--dur-slow) var(--ease-reveal);
}
.js-motion .reveal.is-in{opacity:1;translate:0 0}

/* Sinematik: tam taşan medya ve poster başlıklar için */
.js-motion .reveal--cine{
  translate:0 48px;
  transition-duration:var(--dur-cinematic);
}

/* Görsel kendi kabında hafifçe küçülerek yerleşir —
   fotoğrafın "gelmesi" kayarak değil, oturarak okunur. */
.js-motion .reveal-img{
  clip-path:inset(0 0 0 0);
}
.js-motion .reveal-img img{
  scale:1.08;
  transition:scale var(--dur-cinematic) var(--ease-reveal);
}
.js-motion .reveal-img.is-in img{scale:1}

/* Kademe: aynı kap içindeki kardeşler 90 ms arayla */
.js-motion .stagger > *{transition-delay:calc(var(--i,0) * 90ms)}

/* Poster başlık: satır satır açılır */
.js-motion .reveal-lines > *{
  opacity:0;translate:0 .35em;
  transition:opacity var(--dur-slow) var(--ease-reveal),
             translate var(--dur-slow) var(--ease-reveal);
  transition-delay:calc(var(--i,0) * 110ms);
}
.js-motion .reveal-lines.is-in > *{opacity:1;translate:0 0}

/* ---------- Sayfa geçişi ---------- */
@view-transition{ navigation:auto; }
::view-transition-group(root){animation-duration:var(--dur-page)}
::view-transition-old(root){animation:vt-out 320ms var(--ease-swap) both}
::view-transition-new(root){animation:vt-in var(--dur-page) var(--ease-reveal) both}
@keyframes vt-out{to{opacity:0;translate:0 -12px}}
@keyframes vt-in{from{opacity:0;translate:0 16px}}
::view-transition-group(*){
  animation-duration:var(--dur-page);
  animation-timing-function:var(--ease-reveal);
}

.count{font-variant-numeric:tabular-nums}

@media (prefers-reduced-motion:reduce){
  @view-transition{ navigation:none; }
  .js-motion .reveal,
  .js-motion .reveal--cine,
  .js-motion .reveal-lines > *{opacity:1;translate:none;transition:none}
  .js-motion .reveal-img img{scale:1;transition:none}
  *,*::before,*::after{
    animation-duration:1ms !important;
    animation-iteration-count:1 !important;
    transition-duration:1ms !important;
    scroll-behavior:auto !important;
  }
}
