/* Han Mobile Canvas Menu – only on mobile */
@media (min-width: 1025px){
  .han-mc-trigger, .han-mc-overlay, .han-mc-canvas { display:none !important; }
}

/* Trigger (header ikonu) */
.han-mc-trigger{
  width:42px; height:42px; border-radius:10px; border:none; cursor:pointer;
  background: var(--han-mc-trigger-bg,transparent); color: var(--han-mc-trigger-fg,#fff);
  display:inline-flex; align-items:center; justify-content:center; font-size:18px;
}
.han-mc-trigger.han-mc-trigger-fixed{
  position:fixed; top:12px; left:12px; z-index:99999; box-shadow:0 4px 16px rgba(0,0,0,.25);
}

.han-mc-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:99997; opacity:0; transition:opacity .25s ease;
}
.han-mc-overlay.is-open{ opacity:1 }

.han-mc-canvas{
  position:fixed; top:0; bottom:0; width:86vw; max-width:380px; z-index:99998;
  background: var(--han-mc-bg,#0B1220); color: var(--han-mc-fg,#fff);
  transform:translateX(-100%); transition:transform .25s ease;
  display:flex; flex-direction:column; padding:14px 14px 18px; box-shadow: 4px 0 32px rgba(0,0,0,.35);
}
.han-mc-canvas.side-right{ right:0; left:auto; transform:translateX(100%); box-shadow:-4px 0 32px rgba(0,0,0,.35) }
.han-mc-canvas.is-open{ transform:translateX(0) }
.han-mc-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px }
.han-mc-brandwrap{ display:flex; align-items:center; gap:10px }
.han-mc-logo{ width:var(--han-mc-logo-size, 28px); height:var(--han-mc-logo-size, 28px); object-fit:contain }
.han-mc-brand{ font-weight:700; font-size:18px }
.han-mc-close{ background:none; border:none; color:currentColor; width:38px; height:38px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; font-size:18px }

/* nav – scrollable, elegant shadows */
.han-mc-nav{
  flex:1 1 auto;
  overflow:auto;
  -webkit-overflow-scrolling: touch;
  scroll-behavior:smooth;
  position:relative;
  padding-right:6px; /* scrollbar alanı için min boşluk */
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 96%, rgba(0,0,0,0.75) 100%); /* hafif fade */
}
.han-mc-nav::before, .han-mc-nav::after{
  content:""; position:absolute; left:0; right:0; height:16px; pointer-events:none; opacity:0; transition:opacity .2s ease;
}
.han-mc-nav::before{
  top:0; background: linear-gradient(to bottom, var(--han-mc-bg,#0B1220), rgba(11,18,32,0));
}
.han-mc-nav::after{
  bottom:0; background: linear-gradient(to top, var(--han-mc-bg,#0B1220), rgba(11,18,32,0));
}
.han-mc-nav.has-top::before{ opacity:1 }
.han-mc-nav.has-bottom::after{ opacity:1 }

.han-mc-nav ul{ list-style:none; margin:0; padding:8px 0 0 }
.han-mc-nav li{ margin:0; padding:0 }
.han-mc-nav a{ display:block; padding:12px 10px; text-decoration:none; color:inherit; border-radius:10px }
.han-mc-nav a:active{ transform:translateY(1px) }
.han-mc-nav a:hover{ background: rgba(255,255,255,.06) }
.han-mc-nav .current-menu-item>a{ background: rgba(255,255,255,.1) }
.han-mc-nav .sub-menu a{ padding-left:20px; font-size:14px; opacity:.95 }

/* Thin scrollbar */
.han-mc-nav::-webkit-scrollbar{ width:6px }
.han-mc-nav::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.15); border-radius:6px }
.han-mc-nav{ scrollbar-width:thin; scrollbar-color: rgba(255,255,255,.15) transparent }

/* CTAs: alt alta, numarasız, özelleştirilebilir renkler */
.han-mc-cta{ display:flex; flex-direction:column; gap:10px; margin:16px 0 10px }
.han-mc-btn{
  display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:12px; text-decoration:none;
  color:inherit; font-weight:700;
}
.han-mc-ico{ font-size:16px; line-height:1 }
.han-mc-btn-phone{ background: var(--han-mc-phone-bg, #111827); }
.han-mc-btn-wa{ background: var(--han-mc-wa-bg, #12B981); color:#07130f; }

/* Info: mail & adres ALT ALTA ve ikonlu */
.han-mc-info{ margin:10px 0 6px }
.han-mc-row{ display:grid; grid-template-columns:1fr; gap:10px }
.han-mc-info-item{ display:flex; flex-direction:column; gap:6px; background: rgba(255,255,255,.06); padding:12px; border-radius:10px; color:inherit; text-decoration:none }
.han-mc-info-top{ display:flex; align-items:center; gap:8px }
.han-mc-info-item strong{ font-size:12px; opacity:.85 }
.han-mc-info-item span{ font-size:14px }

/* Socials: ikon-only rozetler */
.han-mc-social{ display:flex; gap:10px; flex-wrap:wrap; margin-top:auto }
.han-mc-soc{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:10px; background: rgba(255,255,255,.08);
  text-decoration:none; color:inherit;
}
.han-mc-soc .han-mc-ico{ font-size:16px; }
.han-mc-soc:active{ transform:translateY(1px) }

/* Body lock when open */
body.han-mc-open{ overflow:hidden }