.audio-container {
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.5);
background-color: rgba(0, 0, 0, 0.5);
border-radius: 0;
}

audio {
  width: 100%;
  filter: invert(1);
}

.fire-effect {
  font-weight: bold; /* Kalın yazı */
  color: #DB9460; /* Ana renk (#DB9460) */
  text-shadow: 
    0 0 5px #DB9460, /* İlk gölge */
    0 0 10px #DB9460, /* İkinci gölge */
    0 0 20px #DB9460, /* Üçüncü gölge */
    0 0 40px #DB9460, /* Dördüncü gölge */
    0 0 80px #DB9460; /* Beşinci gölge */
  animation: fire-animation 0.8s infinite alternate; /* Ateş animasyonu */
}

@keyframes fire-animation {
  0% {
    text-shadow: 
      0 0 5px #DB9460, 
      0 0 10px #DB9460, 
      0 0 20px #DB9460, 
      0 0 40px #DB9460, 
      0 0 80px #DB9460;
  }
  100% {
    text-shadow: 
      0 0 10px #DB9460, 
      0 0 20px #DB9460, 
      0 0 30px #DB9460, 
      0 0 50px #DB9460, 
      0 0 100px #DB9460;
  }
}

.strikethrough-text {
  color: #424242; /* Metin rengi */
  position: relative; /* Çizgiyi konumlandırmak için */
  display: inline-block; /* Çizginin genişliğini ayarlamak için */
}

.strikethrough-text::after {
  content: ''; /* Pseudo-element içeriği */
  position: absolute; /* Çizgiyi metnin üzerine yerleştir */
  left: 0; /* Sola hizala */
  top: 50%; /* Metnin ortasına yerleştir */
  width: 0; /* Başlangıçta çizgi genişliği 0 */
  height: 3px; /* Çizgi kalınlığı */
  background-color: #ff0000; /* Çizgi rengi (kırmızı) */
  animation: strikethrough 3s linear infinite; /* Animasyon (infinite ekledik) */
}

@keyframes strikethrough {
  0% {
    width: 0; /* Başlangıçta çizgi yok */
  }
  100% {
    width: 100%; /* Çizgi metnin tamamını kaplar */
  }
}


.madness-text {
  position: relative;
  animation: madness 4s infinite; /* Titreme ve blur animasyonu */
}

@keyframes madness {
  0% {
    filter: blur(0); /* Başlangıçta blur yok */
    transform: translate(0, 0); /* Başlangıçta konum */
  }
  25% {
    filter: blur(2px); /* Hafif blur */
    transform: translate(-3px, -3px); /* Sola ve yukarı kaydır */
  }
  50% {
    filter: blur(1px); /* Daha az blur */
    transform: translate(3px, 3px); /* Sağa ve aşağı kaydır */
  }
  75% {
    filter: blur(3px); /* Daha fazla blur */
    transform: translate(-3px, 3px); /* Sola ve aşağı kaydır */
  }
  100% {
    filter: blur(0); /* Blur yok */
    transform: translate(0, 0); /* Başlangıç konumuna dön */
  }
}

.broken-text {
  position: relative;
  display: inline-block; /* Metni blok olarak ele al */
}

.broken-text span {
  display: inline-block; /* Her harfi blok olarak ele al */
  position: relative;
  animation: break-fix 2s infinite; /* Kırılma ve düzelme animasyonu */
}

@keyframes break-fix {
  0%, 100% {
    transform: translate(0, 0) rotate(0deg); /* Başlangıç ve bitiş: normal */
    opacity: 1; /* Tam görünür */
  }
  25% {
    transform: translate(-10px, -10px) rotate(-10deg); /* Sola ve yukarı kaydır */
    opacity: 0.5; /* Yarım görünür */
  }
  50% {
    transform: translate(10px, 10px) rotate(10deg); /* Sağa ve aşağı kaydır */
    opacity: 0.5; /* Yarım görünür */
  }
  75% {
    transform: translate(-5px, 5px) rotate(-5deg); /* Sola ve aşağı kaydır */
    opacity: 0.75; /* Daha görünür */
  }
}

@keyframes scary-movie-effect {
  0%, 100% {
    font-weight: normal; /* Normal kalınlık */
    font-style: normal; /* Normal stil */
    text-decoration: none; /* Dekorasyon yok */
    text-transform: none; /* Metin dönüşümü yok */
  }
  20% {
    font-weight: bold; /* Kalın */
    font-style: normal; /* Normal stil */
    text-decoration: none; /* Dekorasyon yok */
    text-transform: none; /* Metin dönüşümü yok */
  }
  40% {
    font-weight: normal; /* Normal kalınlık */
    font-style: italic; /* İtalik */
    text-decoration: none; /* Dekorasyon yok */
    text-transform: none; /* Metin dönüşümü yok */
  }
  60% {
    font-weight: normal; /* Normal kalınlık */
    font-style: normal; /* Normal stil */
    text-decoration: line-through; /* Üstü çizili */
    text-transform: none; /* Metin dönüşümü yok */
  }
  90% {
    font-weight: normal; /* Normal kalınlık */
    font-style: normal; /* Normal stil */
    text-decoration: none; /* Dekorasyon yok */
    text-transform: lowercase; /* Küçük harf */
  }
}

.glitch-text {
  position: relative;
  animation: glitch 2s infinite; /* Glitch animasyonu */
}

.glitch-text::before,
.glitch-text::after {
  content: attr(data-text); /* Metni kopyala */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.8; /* Yarı saydam */
}

.glitch-text::before {
  animation: glitch-before 1s infinite; /* Ön glitch animasyonu */
  clip-path: polygon(0 0, 100% 0, 100% 45%, 0 45%); /* Üst yarısını kes */
}

.glitch-text::after {
  animation: glitch-after 1s infinite; /* Arka glitch animasyonu */
  clip-path: polygon(0 55%, 100% 55%, 100% 100%, 0 100%); /* Alt yarısını kes */
}

@keyframes glitch {
  0%, 100% {
    transform: translate(0, 0); /* Normal konum */
  }
  20% {
    transform: translate(-5px, 5px); /* Sola ve aşağı kaydır */
  }
  40% {
    transform: translate(5px, -5px); /* Sağa ve yukarı kaydır */
  }
  60% {
    transform: translate(-3px, 3px); /* Sola ve aşağı kaydır */
  }
  80% {
    transform: translate(3px, -3px); /* Sağa ve yukarı kaydır */
  }
}

@keyframes glitch-before {
  0%, 100% {
    transform: translate(0, 0); /* Normal konum */
  }
  20% {
    transform: translate(-3px, 3px); /* Sola ve aşağı kaydır */
  }
  40% {
    transform: translate(3px, -3px); /* Sağa ve yukarı kaydır */
  }
  60% {
    transform: translate(-2px, 2px); /* Sola ve aşağı kaydır */
  }
  80% {
    transform: translate(2px, -2px); /* Sağa ve yukarı kaydır */
  }
}

@keyframes glitch-after {
  0%, 100% {
    transform: translate(0, 0); /* Normal konum */
  }
  20% {
    transform: translate(3px, -3px); /* Sağa ve yukarı kaydır */
  }
  40% {
    transform: translate(-3px, 3px); /* Sola ve aşağı kaydır */
  }
  60% {
    transform: translate(2px, -2px); /* Sağa ve yukarı kaydır */
  }
  80% {
    transform: translate(-2px, 2px); /* Sola ve aşağı kaydır */
  }
}