/* =========================================================
   RITMA — Mobil menü (hamburger)

   1120px altında nav'ın mega menüleri gizleniyordu ve geriye
   yalnızca logo ile "Demo talep et" kalıyordu: telefonda menüden
   hiçbir sayfaya ulaşılamıyordu. Buton ve panel bu boşluğu
   dolduruyor.

   Panel nav'ın altına tam ekran açılıyor; gruplar akordeon, çünkü
   dört menünün tamamı açık olsa liste telefonda otuz satırı
   geçiyor.

   Ayrıca çözüm sayfalarının yapışkan alt menüsü (subnav) mobilde
   yalnızca marka adını gösteriyor — bağlantılar gizli. Eskiden marka
   gizlenip bağlantılar yatay kaydırmalı bir şeride dönüyordu;
   parmakla kaydırması zordu ve sayfanın kendi kaydırmasıyla
   karışıyordu. Bölümlerin hepsi zaten sayfanın içinde.
   ========================================================= */

/* --- buton --- */
.nav-hb {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0 10px;
  border: 0;
  border-radius: 12px;
  background: none;
  cursor: pointer
}

.nav-hb span {
  display: block;
  height: 2px;
  border-radius: 2px;
  background: var(--ink);
  transition: transform .22s ease, opacity .16s ease
}

/* açıkken çarpıya dönüyor */
.nav-hb[aria-expanded="true"] span:nth-child(1) {
  transform: translateY(7px) rotate(45deg)
}

.nav-hb[aria-expanded="true"] span:nth-child(2) {
  opacity: 0
}

.nav-hb[aria-expanded="true"] span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg)
}

/* --- panel --- */
.nav-hb-panel {
  position: fixed;
  top: 80px;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #fff;
  border-top: 1px solid var(--border);
  padding: 12px 0 40px
}

.nav-hb-panel[hidden] {
  display: none
}

.nav-hb-in {
  display: grid
}

.nav-hb-grup+.nav-hb-grup {
  border-top: 1px solid var(--border)
}

.nav-hb-bas {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  border: 0;
  background: none;
  padding: 18px 2px;
  font: inherit;
  font-size: 17px;
  font-weight: 800;
  color: var(--ink);
  text-align: left;
  cursor: pointer
}

.nav-hb-car {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  color: var(--gray-light);
  transition: transform .2s ease
}

.nav-hb-bas[aria-expanded="true"] .nav-hb-car {
  transform: rotate(180deg);
  color: var(--orange)
}

.nav-hb-list {
  display: grid;
  padding: 0 0 14px
}

.nav-hb-list[hidden] {
  display: none
}

.nav-hb-list a {
  border-radius: 10px;
  padding: 11px 12px;
  margin-left: -12px;
  font-size: 15.5px;
  font-weight: 600;
  color: var(--gray);
  text-decoration: none
}

.nav-hb-list a:active,
.nav-hb-list a:hover {
  background-color: var(--bg-soft);
  color: var(--orange)
}

.nav-hb-akt {
  display: grid;
  gap: 10px;
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--border)
}

.nav-hb-akt .btn {
  justify-content: center
}

/* panel açıkken arkadaki sayfa kaymasın */
body.nav-hb-acik {
  overflow: hidden
}

/* =================== KIRILIMLAR =================== */
@media (max-width:1120px) {
  .nav-hb {
    display: flex
  }

  .nav-right {
    gap: 14px
  }
}

@media (min-width:1121px) {
  /* geniş ekranda mega menü var; panel hiç açılmasın */
  .nav-hb-panel {
    display: none !important
  }
}

@media (max-width:760px) {
  /* subnav: yalnızca marka kalıyor */
  .subnav {
    display: none
  }

  .subnav-brand {
    display: flex
  }

  .subnav-in {
    padding: 13px 0
  }
}

/* --- telefonda gereksiz duran parçalar --- */
@media (max-width:760px) {
  /* aynı buton hamburger panelinin altında zaten var */
  .nav-right .btn-orange {
    display: none
  }

  /* footer'ın bağlantı sütunları: hepsi hamburger menüsünde de var,
     telefonda sayfayı boşuna uzatıyorlardı. İletişim sütunu kalıyor —
     adres ve telefon burada aranıyor. */
  .footer-col:not(.footer-contact) {
    display: none
  }
}

@media (prefers-reduced-motion:reduce) {

  .nav-hb span,
  .nav-hb-car {
    transition: none
  }
}