/* İnan Tech — mobil topbar + hamburger menü.
   Statik tasarımda mobilde dropdown'lar absolute/hidden kalıyor, .dd-mega (min-width:720px)
   taşıyordu. Ayrıca menü site.js'te inline `top:112px` ile açılıyordu: topbar yüksekliği
   mobilde değişiyor ve header sticky olduğu için menü ile header arasında boşluk kalıyordu.
   Artık konum `top:100%` ile header'ın altına kilitli; açma/kapama `header.main.nav-open`. */

/* ---------------------------------------------------------------- topbar */

@media (max-width: 980px) {
  .top .wrap {
    justify-content: center;
    gap: 8px 16px;
    min-height: 0;
    padding-top: 7px;
    padding-bottom: 7px;
  }
  .top .r { gap: 14px; flex-wrap: wrap; justify-content: center; }
}

@media (max-width: 620px) {
  /* Adres + telefon gizli (mobil alt CTA çubuğunda "Ara" var).
     Sosyal ikonlar footer'da tekrar ediyor; topbar'ı iki satıra bölmesinler. */
  .top .soc { display: none; }
  .top .wrap { gap: 6px 12px; }
  .top .mail { font-size: .78rem; }

  /* Dil: ayraç yerine hap (pill) düğmeler — dokunma hedefi büyür, hizalama düzelir. */
  .lang { gap: 6px; }
  .lang > * + *::before { content: none; }
  .lang b,
  .lang a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .02em;
    line-height: 1;
  }
  .lang b { background: var(--green); color: #fff; }
  .lang a { border: 1px solid rgba(255, 255, 255, .22); color: #cbd5e1; }
  .lang a:hover { border-color: var(--green-l); color: #fff; }
}

@media (max-width: 420px) {
  .top .mail { display: none; } /* dil hapları tek satırda kalsın */
  .top .wrap { justify-content: center; }
}

/* ---------------------------------------------------------------- menü paneli */

@media (max-width: 980px) {
  header.main nav.menu { display: none; }

  header.main.nav-open nav.menu {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;

    /* top:100% → her zaman header'ın hemen altı. Topbar yüksekliğinden ve
       sayfa kaydırmasından (sticky header) bağımsız. */
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 50;

    background: #fff;
    /* Alt boşluk: son madde, yapışkan CTA çubuğunun kenarına dayanmasın. */
    padding: 10px 22px 26px;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 26px 44px -26px rgba(15, 23, 42, .45);

    max-height: calc(100vh - 72px); /* dvh desteklemeyen tarayıcılar için */
    max-height: calc(100dvh - 72px);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  header.main nav.menu .mi { position: static; width: 100%; }

  header.main nav.menu > a,
  header.main nav.menu .mi > a {
    width: 100%;
    padding: 13px 2px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
  }
  header.main nav.menu > a:last-child { border-bottom: 0; }

  /* Dropdown + mega: absolute yerine akış içinde, tam genişlik, her zaman görünür */
  header.main nav.menu .dd,
  header.main nav.menu .dd-mega {
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 4px 0 10px 12px !important;
    margin: 0 !important;
    display: block !important;
    grid-template-columns: 1fr !important;
    z-index: auto !important;
    background: transparent !important;
  }

  header.main nav.menu .dd-mega .col { margin-bottom: 8px; }
  header.main nav.menu .dd-mega .col h6 { padding-left: 0; margin-bottom: 2px; }

  header.main nav.menu .dd a,
  header.main nav.menu .dd-mega a {
    display: block;
    padding: 9px 0;
    font-size: .93rem;
    color: var(--slate);
    white-space: normal;
    word-break: break-word;
  }

  /* Parent ok işaretini gizle (artık her şey açık) */
  header.main nav.menu .mi.has > a::after { display: none; }
  header.main nav.menu .mi.has::after { display: none; }

  /* Hamburger → X */
  .hamb span { transition: transform .2s ease, opacity .15s ease; }
  header.main.nav-open .hamb span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
  header.main.nav-open .hamb span:nth-child(2) { opacity: 0; }
  header.main.nav-open .hamb span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }
}

@media (prefers-reduced-motion: reduce) {
  .hamb span { transition: none; }
}