/* --- TEMEL AYARLAR (Aynı) --- */
html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: #000;
  font-family: "Courier New", monospace;
  overflow: hidden;
}

/* --- TERMİNAL EKRANI (Aynı) --- */
.load {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: black;
  z-index: 999;
}

.term {
  font-family: monospace;
  color: #fff;
  opacity: 0.8;
  font-size: 14px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 20px;
  height: 100%;
  box-sizing: border-box;
}

.term:after {
  content: "_";
  animation: cursor 1s infinite;
}

@keyframes cursor {
  0%,
  40% {
    opacity: 0;
  }
  50%,
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* --- ANA KAPSYAICI --- */
.maintenance-screen {
  display: none; /* JS ile açılacak */
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #080808; /* Derin siyah */
  /* Hafif bir tarama çizgisi efekti ekleyelim */
  background-image: repeating-linear-gradient(
    0deg,
    rgba(0, 0, 0, 0.2) 0px,
    rgba(0, 0, 0, 0.2) 1px,
    transparent 1px,
    transparent 2px
  );
  background-size: 100% 4px;
  z-index: 1;
}

/* --- GELİŞTİRİLMİŞ ORİJİNAL GLITCH EFEKTİ --- */
.glitch {
  position: relative;
  font-size: 4em; /* Boyut büyük */
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #fff; /* Ana renk BEYAZ */
  z-index: 1;
  /* Hafif bir beyaz parlama */
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.4);
  /* Ana yazının kendisi de hafifçe titresin */
  animation: glitch-main-shake 3s infinite;
}

/* CYAN (Mavi) KATMAN */
.glitch::before {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #0ff; /* Neon Mavisi */
  background: transparent;
  overflow: hidden;
  z-index: -1;
  opacity: 0.8;
  /* Karışım modu ile renklerin üst üste binmesini sağla */
  mix-blend-mode: screen;
  animation: glitch-anim-cyan 2s infinite linear alternate-reverse;
}

/* MAGENTA (Kırmızı/Pembe) KATMAN */
.glitch::after {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #f0f; /* Neon Pembesi */
  background: transparent;
  overflow: hidden;
  z-index: -2;
  opacity: 0.8;
  mix-blend-mode: screen;
  animation: glitch-anim-magenta 2.5s infinite linear alternate-reverse;
}

/* ALT YAZILAR */
.subtitle {
  margin-top: 35px;
  font-size: 1.5em;
  color: #0f0; /* Terminal yeşili */
  font-family: "Courier New", monospace;
  text-shadow: 0 0 5px #0f0;
  animation: pulse-green 2s infinite;
}

/* --- ALTTAKİ KÜÇÜK BİLGİ YAZISI (GÜNCELLENDİ) --- */
.info-text {
    display: block;
    margin-top: 15px;
    font-size: 0.7em; /* Yazıyı bir tık büyüttüm */
    color: #cccccc;   /* Rengi koyu griden açık griye çektim (Daha net okunur) */
    font-weight: italic; /* Yazıyı kalınlaştırdım */
    letter-spacing: 1px; /* Harflerin arasını açtım */
    font-family: 'Courier New', monospace;
    text-shadow: none; /* Gölge efektini kapattım ki bulanıklık gitsin */
    opacity: 0.8;
}
/* --- ANİMASYONLAR --- */

/* Ana yazının hafif titremesi */
@keyframes glitch-main-shake {
  0% {
    transform: translate(0px, 0px);
  }
  2% {
    transform: translate(-1px, 1px);
  }
  4% {
    transform: translate(1px, -1px);
  }
  6% {
    transform: translate(0px, 0px);
  }
  90% {
    transform: translate(0px, 0px);
  }
  92% {
    transform: translate(1px, 2px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}

/* CYAN animasyonu: Daha geniş hareketler (translate değerleri arttı) */
/* clip-path değerleri daha kalın dilimler için ayarlandı (Okunabilirlik için) */
@keyframes glitch-anim-cyan {
  0% {
    clip-path: inset(10% 0 60% 0);
    transform: translate(-5px, 2px);
  }
  20% {
    clip-path: inset(50% 0 30% 0);
    transform: translate(5px, -5px);
  }
  40% {
    clip-path: inset(20% 0 70% 0);
    transform: translate(-3px, 6px);
  }
  60% {
    clip-path: inset(70% 0 10% 0);
    transform: translate(6px, -2px);
  }
  80% {
    clip-path: inset(5% 0 85% 0);
    transform: translate(-7px, 2px);
  }
  100% {
    clip-path: inset(40% 0 40% 0);
    transform: translate(3px, -3px);
  }
}

/* MAGENTA animasyonu: Farklı zamanlama ve ters yönler */
@keyframes glitch-anim-magenta {
  0% {
    clip-path: inset(70% 0 10% 0);
    transform: translate(5px, -2px);
  }
  20% {
    clip-path: inset(10% 0 60% 0);
    transform: translate(-6px, 3px);
  }
  40% {
    clip-path: inset(40% 0 40% 0);
    transform: translate(4px, -6px);
  }
  60% {
    clip-path: inset(80% 0 5% 0);
    transform: translate(-5px, 4px);
  }
  80% {
    clip-path: inset(30% 0 50% 0);
    transform: translate(7px, -3px);
  }
  100% {
    clip-path: inset(60% 0 20% 0);
    transform: translate(-2px, 5px);
  }
}

/* Alt yazı için yanıp sönme */
@keyframes pulse-green {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}
@keyframes noise {
  0% {
    clip-path: inset(40% 0 61% 0);
    transform: translate(-10px, -5px); /* Sola ve yukarı sert kayma */
    text-shadow: 10px 5px 0px #ff00ff, -10px -5px 0px #00ffff; /* Renkler iyice ayrık */
  }
  20% {
    clip-path: inset(92% 0 1% 0);
    transform: translate(10px, 5px); /* Sağa ve aşağı sert kayma */
    text-shadow: -10px -5px 0px #ff00ff, 10px 5px 0px #00ffff; /* Renkler ters yönde ayrık */
  }
  40% {
    clip-path: inset(43% 0 1% 0);
    transform: translate(-8px, 3px);
    text-shadow: 8px 3px 0px #ff00ff, -8px -3px 0px #00ffff;
  }
  60% {
    clip-path: inset(25% 0 58% 0);
    transform: translate(8px, -3px);
    text-shadow: -8px -3px 0px #ff00ff, 8px 3px 0px #00ffff;
  }
  80% {
    clip-path: inset(54% 0 7% 0);
    transform: translate(-5px, 5px);
    text-shadow: 5px -5px 0px #ff00ff, -5px 5px 0px #00ffff;
  }
  100% {
    clip-path: inset(58% 0 43% 0);
    transform: translate(5px, -5px);
    text-shadow: -5px 5px 0px #ff00ff, 5px -5px 0px #00ffff;
  }
}