/* ============================================================
   DUZ1 — Üst çubuk taşması ve maskot yönü
   ks3.css'ten SONRA yüklenir.
   ============================================================ */

/* ---------- ÜST ÇUBUK ----------
   Ölçüldü (KS3 sonrası): "Başvuru Yap" düğmesi 1280px'de 91px,
   1366'da 48px, 1440'ta 11px sağa taşıyordu. Yedi menü maddesi ve
   dört düğme 1200px'lik kaba sığmıyor.

   Çözüm kademeli: dar ekranda önce "Ücretsiz Deneyin" çekilir,
   daha darda menü hamburgere döner. Hiçbir bağlantı kaybolmaz;
   hepsi mobil menüde zaten var.                                */

/* 1280 altı: menü hamburgere döner (Tailwind lg=1024 fazla erken) */
@media (max-width: 1279px) {
  header .yy-hd-nav { display: none !important; }
  header [data-yy-hd="menu"] { display: inline-flex !important; }
  header .yy-hd-giris { display: none !important; }
}
/* 1280–1499: menü açık, "Ücretsiz Deneyin" çekilir */
@media (min-width: 1280px) and (max-width: 1499px) {
  header .yy-hd-demo { display: none !important; }
  header .yy-hd-nav { gap: 1.1rem !important; font-size: 13px !important; }
}
/* 1500+: hepsi görünür */
@media (min-width: 1500px) {
  header .yy-hd-nav { gap: 1.45rem !important; font-size: 13.5px !important; }
}

/* ---------- HERO MASKOTU ----------
   Maskot sağı gösteriyor. Sağ alt köşede durunca ekranın dışını
   işaret ediyordu; sol alt köşeye alındı, artık panele bakıyor.
   Konuşma balonu da maskotun sağına geçti.                      */
.ks-maskot.sol {
  right: auto;
  left: -78px;
  bottom: -52px;
  width: 138px;
}
@media (max-width: 1023px) {
  .ks-maskot.sol { left: -14px; bottom: -18px; width: 108px; }
}
.ks-balon.sag {
  right: auto;
  left: 44px;
  bottom: 142px;
  border-radius: 14px 14px 14px 4px;
}

/* ---------- PANEL GÖRSELİ: FAREYLE HAFİF HAREKET ----------
   Yalnız hero'daki gerçek panel görüntüsü. Maskot kardeş eleman
   olduğu için yerinde kalır. Ürün sekmelerindeki tarayıcılar da
   etkilenmez: seçici .ks-sahne ile sınırlı.                     */
.ks-sahne .ks-tarayici {
  transition: transform .38s cubic-bezier(.2,.7,.2,1), box-shadow .38s cubic-bezier(.2,.7,.2,1);
  will-change: transform;
}
.ks-sahne .ks-tarayici:hover {
  transform: translateY(-9px) scale(1.012);
  box-shadow: 0 42px 84px -34px rgba(15,45,91,.45);
}
/* Hareketi azalt tercihi açıksa animasyon yok */
@media (prefers-reduced-motion: reduce) {
  .ks-sahne .ks-tarayici { transition: none; }
  .ks-sahne .ks-tarayici:hover { transform: none; }
}
/* sağdan sola dillerde ayna: maskot sağa, balon sola */
[dir="rtl"] .ks-maskot.sol { left: auto; right: -34px; transform: scaleX(-1); }
[dir="rtl"] .ks-balon.sag { left: auto; right: 132px; border-radius: 14px 14px 4px 14px; }