/* ═══════════════════════════════════════════════════════════════════════
   360° TUR · v2 "Sade Üçlü"
   =======================================================================
   En sade alternatif: sıfır betik, sıfır bağımlılık, tek ekran.

   ÜÇ HAREKET, HİÇ BETİK:
     paralaks   → animation-timeline: view() · görsel kadrajın içinde kayar
     sonsuz ok  → offset-path ile sekiz çizen bir yörünge
     içe çekme  → görsel durgunken taşar (scale 1.08), hover'da 1'e iner
   Desteklemeyen tarayıcıda hepsi sessizce düşer; içerik yerinde durur.

   Görsel kadrajından TAŞACAK kadar büyük (block-size 116%): paralaks
   kaydırırken alt ya da üstte boşluk açılmasın diye.
   ═════════════════════════════════════════════════════════════════════ */
.tur-v2{
  --tur-bo:var(--bo-2);
  --tur-yari:var(--yr-l);
  position:relative;background:var(--z1);
  padding-block:var(--blm-pd);
}
/* BAŞLIK BLOĞU · iki sütun, SOLA hizalı.
   25 Ağu 2026: bu bölüm tek başına ortalıydı, diğer beş bölüm sola
   hizalıydı — sayfada bütünlük kırılıyordu. Ölçüler ortak token'lardan. */
.tur-bas{display:grid;justify-items:center;text-align:center;
  gap:var(--blm-bsl-ara);margin-inline:auto;
  margin-block-end:var(--blm-bas-alt)}
.tur-bas > p{max-inline-size:58ch;margin:0}
.tur-bsl{
  font-family:Manrope,ui-sans-serif,sans-serif;font-weight:800;
  font-size:var(--blm-bsl);line-height:1.06;letter-spacing:-.038em;
  margin:0;color:var(--mrk);text-wrap:balance;
}
.tur-bsl em{font-style:normal;color:inherit}  /* gradient'i delmesin */
html[lang="ar"] .tur-bsl{font-family:"Noto Kufi Arabic",sans-serif;letter-spacing:0;line-height:1.4}
.tur-giris{max-inline-size:62ch;line-height:1.62;margin:0}

.tur-iz{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--tur-bo);
}
.tur-kart{display:block;color:inherit}
.tur-cerceve2{
  /* overflow:HIDDEN değil CLIP. hidden bir KAYDIRMA KABI yaratır; içindeki
     görselin view() çizelgesi o kabı ölçer, o kap hiç kaymadığı için
     parallax sabit kalır (ölçüldü: translate 0px 0% her konumda).
     clip aynı kırpmayı yapar ama kaydırma kabı yaratmaz. */
  display:block;position:relative;overflow:clip;
  border-radius:var(--tur-yari);background:var(--z2);
  /* 25 Ağu 2026: 4/5 fazla uzundu, üç kart ekranı dolduruyordu. Kare. */
  aspect-ratio:1;
  isolation:isolate;
}
.tur-gor{
  position:absolute;inset-inline:0;inset-block-start:-11%;
  inline-size:100%;block-size:122%;object-fit:cover;display:block;
  /* Durgunken taşar, üzerine gelince İÇERİ çekilir. */
  scale:1.08;transition:scale 760ms var(--egri);
}
.tur-kart:hover .tur-gor,.tur-kart:focus-visible .tur-gor{scale:1}

/* Adın arkası — gölge değil, tek yönlü perde. */
.tur-tul{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(168deg,
    rgba(11,15,14,.76) 0%, rgba(11,15,14,.42) 34%,
    rgba(11,15,14,.06) 62%, rgba(11,15,14,0) 100%);
}
.tur-ad{
  position:absolute;z-index:2;
  inset-block-start:clamp(1rem,2vw,1.6rem);
  inset-inline-start:clamp(1rem,2vw,1.6rem);
  inset-inline-end:clamp(3.6rem,5vw,4.6rem);
  font-family:Manrope,ui-sans-serif,sans-serif;font-weight:800;
  font-size:var(--blm-bsl);line-height:1.12;letter-spacing:-.035em;
  color:#F4EFE4;padding-block-end:.08em;text-wrap:balance;
}
html[lang="ar"] .tur-ad{font-family:"Noto Kufi Arabic",sans-serif;letter-spacing:0;line-height:1.4}

/* SONSUZ OK — sağ üstte; üzerine gelince belirir ve sekiz çizer.
   Yörünge offset-path ile: elle yazılmış çeyrek çeyrek keyframe yerine
   tek bir eğri, hızı sabit. */
.tur-ok{
  position:absolute;z-index:2;
  inset-block-start:clamp(.9rem,1.8vw,1.4rem);
  inset-inline-end:clamp(.9rem,1.8vw,1.4rem);
  inline-size:2.1rem;block-size:2.1rem;
  display:grid;place-items:center;color:#F4EFE4;
  opacity:0;transition:opacity 300ms var(--egri);
}
.tur-kart:hover .tur-ok,.tur-kart:focus-visible .tur-ok{opacity:1}
.tur-ok-ic{display:block;inline-size:1.7rem}
.tur-ok svg{inline-size:100%;block-size:auto}
html[dir="rtl"] .tur-ok-ic{transform:scaleX(-1)}
@supports (offset-path: path("M0,0")){
  @media (prefers-reduced-motion: no-preference){
    .tur-ok-ic{
      offset-path:path("M-9,0 C-9,-7 0,-7 0,0 C0,7 9,7 9,0 C9,-7 0,-7 0,0 C0,7 -9,7 -9,0 Z");
      offset-rotate:0deg;
      animation:tur-sonsuz 3.4s linear infinite;
      animation-play-state:paused;
    }
    .tur-kart:hover .tur-ok-ic,
    .tur-kart:focus-visible .tur-ok-ic{animation-play-state:running}
  }
}
@keyframes tur-sonsuz{ to{ offset-distance:100% } }

/* PARALAKS — sıfır betik. Görsel kadrajın içinde kayar; kadraj sabit. */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    @keyframes tur-belir{ from{opacity:0;translate:0 1.5rem} to{opacity:1;translate:0 0} }
    .tur-oge{
      animation:tur-belir linear both;
      animation-timeline:view();
      animation-range:entry 10% cover 26%;
    }
    @keyframes tur-kaydir{ from{translate:0 -4%} to{translate:0 4%} }
    .tur-gor{
      animation:tur-kaydir linear both;
      animation-timeline:view();
      animation-range:cover;
    }
  }
}

@media(max-width:900px){
  .tur-iz{grid-template-columns:1fr;gap:calc(var(--tur-bo) * 1.4)}
  .tur-cerceve2{aspect-ratio:16 / 10}
  .tur-ok{opacity:1}
  .tur-ad{font-size:var(--blm-bsl)}
}


/* ── HAFİF PARALLAX ─────────────────────────────────────────────
   Betik yok: kaydırma çizelgesi (view()) ile. Görsel zaten çerçeveden
   %8 taşkın duruyor (block-size:116%, inset-block-start:-8%); hareket
   o payın içinde kalır, kenarda boşluk açılmaz.

   `translate` ÖZELLİĞİ kullanılır, transform değil: .tur-gor'un
   `scale`i ayrı bir özellik ve hover'da değişiyor. Aynı transform
   listesine yazsaydık biri diğerini ezerdi.

   Desteklemeyen tarayıcıda hiçbir şey olmaz; görsel sabit durur. */
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline: view()){
    .tur-gor{
      /* KISA YAZIM KULLANMA. `animation:tur-par linear both` süreyi 0s'ye
         çeker; kaydırma çizelgesinde süre `auto` olmalı, yoksa animasyon
         "çalışıyor" görünür ama değer üretmez (ölçüldü: translate 0px 0%). */
      animation-name:tur-par;
      animation-duration:auto;
      animation-timing-function:linear;
      animation-fill-mode:both;
      animation-timeline:view();
      animation-range:cover 0% cover 100%;
    }
    @keyframes tur-par{ from{translate:0 -5.5%} to{translate:0 5.5%} }
  }
}