/* MARKA İŞARETİ — ÇAKAN ŞİMŞEK (bütün panellerde ve sitede aynı).
   Dört panel ve site bu dosyayı yüklüyor, böylece birinde değişip ötekinde
   eski kalmıyor (kullanıcı, 2026-09-14: "her yerde olsun").

   ═══ YALNIZ OPAKLIK ANİMASYONU (2026-09-14) ═══════════════════════════
   Eski sürüm `filter: drop-shadow` ve `background-position` animasyonluydu;
   ikisi de her karede ANA İŞ PARÇACIĞINI boyatıyor ve sayfa hızlı
   kaydırılırken kare düşürüyordu (gerçek tekerlek ölçümü: 45 adımda 21
   düşen kare; animasyonsuz 0). Maskeli kap içinde transform ile kayan şerit
   de denendi: maske her karede yeniden uygulanınca 226 düşen kare — daha
   kötü. Kalan tek güvenli yol: her parça STATİK boyanır, yalnız OPAKLIĞI
   animasyonlanır ve kendi katmanında durur (will-change: opacity).
     • yıldırım: opaklık nabzı
     • beyaz çakma kopyası (maskeli, statik): opaklık ile kırpışır
     • hale: filtresiz radyal gradyan (kenarı zaten yumuşak): opaklık ile parlar */
.simsek {
  font-style: normal; width: 19px; height: 24px; display: inline-block;
  position: relative; vertical-align: -5px; flex: none;
}
.simsek svg {
  width: 100%; height: 100%; display: block;
  animation: cakma 6s ease-out infinite; will-change: opacity;
}
@keyframes cakma {
  0%, 74% { opacity: .62; }
  76% { opacity: 1; }
  78% { opacity: .45; }
  80% { opacity: 1; }
  86% { opacity: .95; }
  92% { opacity: .7; }
  100% { opacity: .62; }
}
/* Beyaz çakma: yıldırım biçiminde maskeli, statik beyaz-camgöbeği kopya. */
.simsek::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(100deg, #ffffff 0%, #ddd7ff 50%, #3fe0d0 100%);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 32'%3E%3Cpath d='M15.5 1 L4 18.5 h6.2 L8.5 31 L20 13.5 h-6.2 z' fill='%23000'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 32'%3E%3Cpath d='M15.5 1 L4 18.5 h6.2 L8.5 31 L20 13.5 h-6.2 z' fill='%23000'/%3E%3C/svg%3E");
  -webkit-mask-size: 100% 100%; mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  opacity: 0; will-change: opacity;
  animation: cakmaBeyaz 6s ease-out infinite;
}
@keyframes cakmaBeyaz {
  0%, 74% { opacity: 0; }
  76% { opacity: .55; }
  78% { opacity: 0; }
  80% { opacity: .95; }
  84% { opacity: .35; }
  88%, 100% { opacity: 0; }
}
/* Hale: filtresiz radyal gradyan, yıldırımın arkasında. Kap üstünde durur
   (.marka / .brand konumlu). */
.marka, .brand { position: relative; }
.marka::before, .brand::before {
  content: ""; position: absolute; left: -9px; top: 50%; width: 38px; height: 40px;
  margin-top: -20px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, #b7acffaa 0%, #8b7bff66 30%, #3fe0d033 52%, transparent 70%);
  opacity: 0; will-change: opacity;
  animation: parlama 6s ease-out infinite;
}
@keyframes parlama {
  0%, 74% { opacity: 0; }
  76% { opacity: .55; }
  78% { opacity: .1; }
  80% { opacity: 1; }
  86% { opacity: .5; }
  92% { opacity: .2; }
  100% { opacity: 0; }
}
/* Üzerine gelince hemen bir kez çaksın — marka canlı hissettirsin. */
.marka:hover .simsek svg, .brand:hover .simsek svg,
.marka:hover .simsek::after, .brand:hover .simsek::after,
.marka:hover::before, .brand:hover::before { animation-duration: 1.2s; }

/* AZ HAREKET TERCİHİ — işaret yine ama yumuşak nefes alır (kırpışma yok). */
@media (prefers-reduced-motion: reduce) {
  .simsek svg { animation: sakinCakma 5s ease-in-out infinite; }
  .simsek::after { animation: sakinCakmaBeyaz 5s ease-in-out infinite; }
  .marka::before, .brand::before { animation: sakinParlama 5s ease-in-out infinite; }
  .marka:hover .simsek svg, .brand:hover .simsek svg,
  .marka:hover .simsek::after, .brand:hover .simsek::after,
  .marka:hover::before, .brand:hover::before { animation-duration: 5s; }
}
@keyframes sakinCakma { 0%, 55% { opacity: .55; } 75% { opacity: 1; } 100% { opacity: .55; } }
@keyframes sakinCakmaBeyaz { 0%, 55% { opacity: 0; } 75% { opacity: .5; } 100% { opacity: 0; } }
@keyframes sakinParlama { 0%, 55% { opacity: 0; } 75% { opacity: .8; } 100% { opacity: 0; } }

/* ── Dil / para birimi seçicileri (i18n.js + para.js) ──────────────────── */
.dil-secici {
  background: #14131f; color: #a5a2c0; border: 1px solid #312c4d; border-radius: 9px;
  padding: 5px 8px; font: inherit; font-size: 12.5px; cursor: pointer; max-width: 150px;
}
.dil-secici:hover { color: #f3f1fb; border-color: #4a4470; }
.dil-secici option { background: #14131f; color: #f3f1fb; }
.para-secici { max-width: 120px; }
.secici-satir { display: flex; gap: 8px; justify-content: flex-end; margin-bottom: 8px; }