/* ========== 960px ve altı (Büyük Telefon) ========== */

@media (max-width: 960px) {
  header {
    position: sticky;
    top: 0;
    z-index: 9999;
  }
  .amblem {
    position: absolute; /* header içinde ama serbest */
    top: 180px; /* biraz daha yukarı koyduk */
    width: 180px;
    height: 180px;
    z-index: 1000; /* linklerin üstünde kalsın */
  }
  nav {
    position: absolute;
    top: 80px;
    right: 0;
    width: 100%;
    background: var(--primary-bg);
    flex-direction: column;
    text-align: center;
    display: none;
    border-bottom: 1px solid var(--third-bg);

    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.5s ease, opacity 0.4s ease;
    z-index: 1001; /* linklerin üstünde kalsın */
  }

  /* Açılış Animasyonu */
  nav.show {
    display: flex;
    max-height: 500px;
    opacity: 1;
    animation: slideDown 0.45s ease forwards;
  }

  /* Kapanış Animasyonu */
  nav.closing {
    animation: slideUp 0.45s ease forwards;
  }

  /* Hover çizgisini kaldırma (mobil görünüm) */
  nav a::after {
    background: none;
  }

  /* Açılış animasyonu (yukarıdan aşağı) */
  @keyframes slideDown {
    0% {
      transform: translateY(-15px);
      opacity: 0;
    }
    100% {
      transform: translateY(0px);
      opacity: 1;
    }
  }

  /* Kapanış animasyonu (aşağıdan yukarı kaybolma) */
  @keyframes slideUp {
    0% {
      transform: translateY(0px);
      opacity: 1;
    }
    100% {
      transform: translateY(-15px);
      opacity: 0;
    }
  }

  nav a {
    margin: 15px 0;
    font-size: 1.1rem;
    text-align: left;
    padding: 0 50px;
    max-width: 50%;
  }

  .hamburger {
    display: flex;
  }
  .cursor {
    display: none !important;
  }
}