/* =========================================================
   Animasyon başlangıç durumları (anime.js v4)

   Buradaki gizleme kuralları yalnızca <html class="anim"> varken geçerlidir.
   Bu sınıfı layout'taki küçük betik ekler ve animations.js çalışmazsa
   2,5 saniye içinde geri kaldırır; yani betik yüklenmese bile içerik görünür.

   ÖNEMLİ: Aşağıda gizlenen her seçicinin animations.js içinde bir karşılığı
   olmalı. Birini silerseniz diğerini de silin, yoksa içerik gizli kalır.
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  /* Kullanıcı hareketi azaltmayı seçtiyse hiçbir şey gizlenmez. */
  .anim [class] { opacity: 1 !important; }
}

/* ---------- Genel site: açılışta gizlenenler ---------- */
.anim .hero__lead,
.anim .hero__trust span,
.anim .hero__stat,
.anim .search-card,
.anim .page-head h1,
.anim .page-head .breadcrumb,
.anim .header .nav a,
.anim .header__cta { opacity: 0; }

/* ---------- Genel site: kaydırmayla belirenler ---------- */
.anim .section-head,
.anim .vcard,
.anim .cat-strip .cat-chip,
.anim .feature,
.anim .step,
.anim .testi,
.anim .faq-item,
.anim .post-card,
.anim .cta-band,
.anim .footer__grid > *,
.anim .spec,
.anim .booking-box,
.anim .gallery__main,
.anim .gallery__thumbs button,
.anim .aside,
.anim .extra,
.anim .prose > h2,
.anim .prose > h3,
.anim .prose > p,
.anim .prose > ul,
.anim .prose > ol,
.anim .prose > table { opacity: 0; }

/* ---------- Yönetim paneli ---------- */
.anim .a-nav a,
.anim .stat,
.anim .panel,
.anim .flash,
.anim table.data tbody tr { opacity: 0; }

/* =========================================================
   Animasyonların ihtiyaç duyduğu stiller
   ========================================================= */

/* Okuma ilerleme çubuğu — kaydırmaya senkron */
.scroll-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 100%;
  transform: scaleX(0); transform-origin: 0 50%;
  background: linear-gradient(90deg, var(--red), var(--amber));
  z-index: 100; pointer-events: none;
}
body.admin .scroll-progress { background: linear-gradient(90deg, var(--a-red), #ff8a3d); }

/* Başlık kelime kelime bölündüğünde satır taşmasını engeller */
.hero h1 .word { display: inline-block; will-change: transform, opacity; }

/* Rezervasyon tamamlandı ekranındaki onay işareti */
.success-mark { display: block; margin: 0 auto 18px; }
.success-mark circle, .success-mark path {
  fill: none; stroke-linecap: round; stroke-linejoin: round;
}
.success-mark circle { stroke: var(--red); stroke-width: 4; }
.success-mark path { stroke: var(--red); stroke-width: 5; }

/* Fiyat özeti güncellendiğinde kısa vurgu */
.quote-flash { border-radius: var(--radius-sm); }

/* Animasyonlu öğelerde metin titremesini azaltır */
.anim .vcard, .anim .feature, .anim .testi, .anim .post-card, .anim .stat {
  backface-visibility: hidden;
}
