/* ==========================================================================
   SİTE HEADER'I — parts/header.php ile birlikte SIFIRDAN yazıldı.

   Avada Theme Builder header'ı (post 27) devre dışı; buradaki hiçbir kural
   `.awb-menu` / `.fusion-tb-header` markup'ına dokunmuyor. Bu yüzden dosyada
   TEK BİR `!important` yok — spesifiklik yarışı bitti.

   Token'lar style.css `:root`'undan gelir (wp_head'e inline basılır, yani
   mağaza/sepet/ödeme/blog dahil HER sayfada tanımlıdır). Yine de kritik
   olanlara var() fallback'i yazıldı: header'ın çökmesi kabul edilemez.
   ========================================================================== */

/* --------------------------------------------------------------------------
   STICKY'NİN ÖN KOŞULU — Avada'nın gövde kuralı.

   Avada `body { overflow-x: hidden; overflow-y: scroll }` basıyor. `overflow`
   `visible` olmayınca gövde AYRI bir kaydırma bağlamı olur ve `position:sticky`
   sayfaya değil O bağlama göre sabitlenir: header sayfa akarken yukarı kaçıyordu
   (ölçüldü — 600px scroll sonrası bar `top: -584px`).

   `clip` kaydırma bağlamı YARATMAZ ama yatay taşmayı yine keser; `overflow-y`
   `visible` olunca dikey kaydırma viewport'a devredilir ve sticky çalışır.
   (`html, body { overflow-x: clip; max-width: 100vw }` kuralı Avada custom
   CSS'inde zaten vardı; eksik olan tek şey overflow-y idi.)
   -------------------------------------------------------------------------- */
html, body { overflow-x: clip; overflow-y: visible; }

/* Sabit header, `#hedef` bağlantılarında içeriğin üstünü örtmesin. */
:root { --ma-hdr-space: 100px; }
html { scroll-padding-top: var(--ma-hdr-space); }

.ma-hdr {
	--hdr-h:        84px;   /* bar yüksekliği — scroll'da küçülür */
	--hdr-h-min:    68px;
	--hdr-logo:     54px;
	--hdr-logo-min: 44px;
	--hdr-gap:      30px;   /* menü öğeleri arası */

	position: sticky;
	top: 0;
	z-index: 900;
	font-family: var(--ma-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif);
	-webkit-font-smoothing: antialiased;
}

/* Giriş yapmış kullanıcıda WP admin bar sabit duruyor — altına kaymayalım. */
.admin-bar .ma-hdr { top: 32px; }
@media (max-width: 782px) {
	/* 782px altında admin bar `position: absolute` — offset gerekmiyor. */
	.admin-bar .ma-hdr { top: 0; }
}

.ma-hdr__bar {
	background: var(--ma-bg, #fff);
	border-bottom: 1px solid var(--ma-border, #e6e6ea);
	transition: box-shadow .25s var(--ma-ease, cubic-bezier(.16,1,.3,1)),
	            background-color .25s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}

/* Sayfa kaydırılınca: hafif cam efekti + yumuşak gölge, bar kısalır. */
.ma-hdr.is-scrolled .ma-hdr__bar {
	background: rgba(255, 255, 255, .88);
	-webkit-backdrop-filter: saturate(180%) blur(14px);
	backdrop-filter: saturate(180%) blur(14px);
	box-shadow: 0 6px 24px rgba(15, 15, 16, .07);
}

.ma-hdr__inner {
	max-width: var(--ma-container, 1200px);
	margin: 0 auto;
	padding: 0 var(--ma-gutter, 24px);
	height: var(--hdr-h);
	display: flex;
	align-items: center;
	gap: 24px;
	transition: height .25s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}
.ma-hdr.is-scrolled .ma-hdr__inner { height: var(--hdr-h-min); }

/* ── Logo ────────────────────────────────────────────────────────────── */
.ma-hdr__logo {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	line-height: 0;
	border-radius: 6px;
}
.ma-hdr__logo img {
	height: var(--hdr-logo);
	width: auto;
	max-width: none;
	display: block;
	transition: height .25s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}
.ma-hdr.is-scrolled .ma-hdr__logo img { height: var(--hdr-logo-min); }

/* ── Masaüstü menü ───────────────────────────────────────────────────── */
.ma-hdr__nav {
	/* İki yanda otomatik boşluk: menü, logo ile aksiyonlar arasında ortalanır.
	   Eski header'da menü sağ kenara yapışıp ortada 300px boşluk kalıyordu. */
	margin: 0 auto;
	align-self: stretch;
	display: flex;
}
.ma-hdr__menu {
	display: flex;
	align-items: stretch;
	gap: var(--hdr-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}
.ma-hdr__item {
	position: relative;
	display: flex;
	align-items: stretch;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ma-hdr__link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	position: relative;
	padding: 0;
	margin: 0;
	border: 0;
	background: none;
	cursor: pointer;
	font-family: inherit;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: -.005em;
	line-height: 1.2;
	color: var(--ma-text-2, #46464a);
	text-decoration: none;
	white-space: nowrap;
	transition: color .18s ease;
}
.ma-hdr__link:hover,
.ma-hdr__link:focus-visible { color: var(--ma-text, #0f0f10); }

/* Aktif / hover alt çizgisi — ortadan açılır.
   Link, bar yüksekliği kadar uzuyor (item `align-items: stretch`), yani çizgi
   barın alt kenarına oturuyor: sekme göstergesi gibi ve mega panelin üstüne
   denk geliyor. */
.ma-hdr__link::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	border-radius: 2px;
	background: var(--ma-accent, #4d3f96);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform .22s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}
.ma-hdr__item:hover > .ma-hdr__link::after,
.ma-hdr__link:focus-visible::after,
.ma-hdr__link.is-current::after,
.ma-hdr__link.is-ancestor::after,
.ma-hdr__item.is-open > .ma-hdr__link::after { transform: scaleX(1); }

.ma-hdr__link.is-current,
.ma-hdr__link.is-ancestor { color: var(--ma-text, #0f0f10); font-weight: 600; }

.ma-hdr__caret {
	width: 11px;
	height: 11px;
	flex: 0 0 auto;
	opacity: .55;
	transition: transform .22s var(--ma-ease, cubic-bezier(.16,1,.3,1)), opacity .18s ease;
}
.ma-hdr__item:hover > .ma-hdr__link .ma-hdr__caret,
.ma-hdr__item.is-open > .ma-hdr__link .ma-hdr__caret { opacity: 1; }
.ma-hdr__item.is-open > .ma-hdr__link .ma-hdr__caret { transform: rotate(180deg); }

/* ── Mega panel ──────────────────────────────────────────────────────── */
.ma-hdr__panel {
	position: absolute;
	top: 100%;
	left: 50%;
	/* Şeffaf üst boşluk: fare linkten panele giderken hover kopmasın. */
	padding-top: 12px;
	width: max-content;
	max-width: min(820px, calc(100vw - 2 * var(--ma-gutter, 24px)));
	opacity: 0;
	visibility: hidden;
	transform: translateX(-50%) translateY(-6px);
	transition: opacity .2s ease, transform .24s var(--ma-ease, cubic-bezier(.16,1,.3,1)), visibility .2s;
	pointer-events: none;
}
.ma-hdr__item.is-open > .ma-hdr__panel {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
	pointer-events: auto;
}
/* Fare ile açılış — dokunmatikte hover "yapışık" kaldığı için sadece
   gerçek imleçli cihazlarda. Dokunmatikte JS `.is-open` ile açar. */
@media (hover: hover) and (pointer: fine) {
	.ma-hdr__item.has-panel:hover > .ma-hdr__panel,
	.ma-hdr__item.has-panel:focus-within > .ma-hdr__panel {
		opacity: 1;
		visibility: visible;
		transform: translateX(-50%) translateY(0);
		pointer-events: auto;
	}
}

.ma-hdr__panel-in {
	display: grid;
	gap: 8px 28px;
	padding: 26px 28px;
	background: #fff;
	border: 1px solid var(--ma-border, #e6e6ea);
	border-radius: var(--ma-radius-lg, 16px);
	box-shadow: var(--ma-shadow-3, 0 18px 38px rgba(15,15,16,.10), 0 6px 14px rgba(15,15,16,.06));
}
.ma-hdr__panel-in[data-cols="1"] { grid-template-columns: minmax(220px, 1fr); }
.ma-hdr__panel-in[data-cols="2"] { grid-template-columns: repeat(2, minmax(200px, 1fr)); }
.ma-hdr__panel-in[data-cols="3"] { grid-template-columns: repeat(3, minmax(190px, 1fr)); }

.ma-hdr__col { min-width: 0; }

.ma-hdr__col-title {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin: 0 0 12px;
	padding: 0 0 10px;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--ma-accent, #4d3f96);
	text-decoration: none;
	border-bottom: 1px solid var(--ma-border-2, #ececef);
	width: 100%;
	transition: color .18s ease;
}
.ma-hdr__col-title:hover { color: var(--ma-accent-h, #3d3179); }
.ma-hdr__col-arrow {
	width: 13px;
	height: 13px;
	flex: 0 0 auto;
	opacity: 0;
	transform: translateX(-3px);
	transition: opacity .2s ease, transform .2s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}
.ma-hdr__col-title:hover .ma-hdr__col-arrow,
.ma-hdr__col-title:focus-visible .ma-hdr__col-arrow { opacity: 1; transform: translateX(0); }

.ma-hdr__col-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 1px;
}
.ma-hdr__col-list li { margin: 0; padding: 0; list-style: none; }

.ma-hdr__col-link {
	display: block;
	padding: 9px 10px;
	margin-left: -10px;
	border-radius: 8px;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.35;
	color: var(--ma-text-2, #46464a);
	text-decoration: none;
	transition: background-color .16s ease, color .16s ease, transform .16s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}
.ma-hdr__col-link:hover,
.ma-hdr__col-link:focus-visible {
	background: var(--ma-bg-soft, #fafafa);
	color: var(--ma-text, #0f0f10);
	transform: translateX(2px);
}
.ma-hdr__col-link.is-current {
	color: var(--ma-accent, #4d3f96);
	font-weight: 600;
}

/* ── Sağdaki aksiyonlar ──────────────────────────────────────────────── */
.ma-hdr__actions {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 8px;
}

.ma-hdr__cart {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: var(--ma-radius, 12px);
	color: var(--ma-text-2, #46464a);
	text-decoration: none;
	transition: background-color .18s ease, color .18s ease;
}
.ma-hdr__cart:hover,
.ma-hdr__cart:focus-visible {
	background: var(--ma-bg-mute, #f4f4f4);
	color: var(--ma-text, #0f0f10);
}
.ma-hdr__cart svg { width: 23px; height: 23px; display: block; }
.ma-hdr__cart-count {
	position: absolute;
	top: 4px;
	right: 3px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--ma-accent-2, #fa9d1a);
	color: #1a1a1c;
	font-size: 11px;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
	box-shadow: 0 0 0 2px #fff;
}

.ma-hdr__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 20px;
	border-radius: var(--ma-radius, 12px);
	background: var(--ma-primary, #1a1a1c);
	color: #fff;
	font-size: 14.5px;
	font-weight: 600;
	letter-spacing: -.005em;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	border: 1px solid transparent;
	box-shadow: 0 1px 0 rgba(255,255,255,.15) inset, 0 6px 16px rgba(15,15,16,.16);
	transition: background-color .2s ease, transform .18s var(--ma-ease, cubic-bezier(.16,1,.3,1)), box-shadow .2s ease;
}
.ma-hdr__cta:hover,
.ma-hdr__cta:focus-visible {
	background: var(--ma-primary-h, #000);
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 1px 0 rgba(255,255,255,.15) inset, 0 10px 22px rgba(15,15,16,.22);
}
.ma-hdr__cta:active { transform: translateY(0); }

/* ── Hamburger ───────────────────────────────────────────────────────── */
.ma-hdr__burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	background: none;
	border-radius: var(--ma-radius, 12px);
	color: var(--ma-text, #0f0f10);
	cursor: pointer;
	transition: background-color .18s ease;
}
.ma-hdr__burger:hover { background: var(--ma-bg-mute, #f4f4f4); }
.ma-hdr__burger-box {
	position: relative;
	display: block;
	width: 22px;
	height: 15px;
}
.ma-hdr__burger-box i {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	transition: transform .28s var(--ma-ease, cubic-bezier(.16,1,.3,1)), opacity .18s ease, top .28s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}
.ma-hdr__burger-box i:nth-child(1) { top: 0; }
.ma-hdr__burger-box i:nth-child(2) { top: 6.5px; }
.ma-hdr__burger-box i:nth-child(3) { top: 13px; }
.ma-hdr__burger[aria-expanded="true"] .ma-hdr__burger-box i:nth-child(1) { top: 6.5px; transform: rotate(45deg); }
.ma-hdr__burger[aria-expanded="true"] .ma-hdr__burger-box i:nth-child(2) { opacity: 0; }
.ma-hdr__burger[aria-expanded="true"] .ma-hdr__burger-box i:nth-child(3) { top: 6.5px; transform: rotate(-45deg); }

/* ── Mobil çekmece ───────────────────────────────────────────────────── */
.ma-hdr__drawer {
	position: fixed;
	left: 0;
	right: 0;
	top: calc(var(--hdr-h) + var(--hdr-top, 0px));
	bottom: 0;
	background: #fff;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	opacity: 0;
	transform: translateY(-8px);
	transition: opacity .22s ease, transform .28s var(--ma-ease, cubic-bezier(.16,1,.3,1));
	z-index: 899;
}
.ma-hdr__drawer[hidden] { display: none; }
.ma-hdr.is-open .ma-hdr__drawer { opacity: 1; transform: translateY(0); }
.ma-hdr__drawer-in {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	padding: 8px var(--ma-gutter, 16px) 28px;
	/* Tablette liste 820px'e yayılınca aç/kapa oku etiketten ~700px uzağa
	   düşüyordu; başparmakla ulaşılamaz. Ölçüyü okunur genişlikte tut. */
	width: 100%;
	max-width: 620px;
	margin: 0 auto;
}

.ma-hdr__d-list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.ma-hdr__d-item { margin: 0; padding: 0; list-style: none; }
.ma-hdr__d-list[data-depth="0"] > .ma-hdr__d-item + .ma-hdr__d-item {
	border-top: 1px solid var(--ma-border-2, #ececef);
}

.ma-hdr__d-row {
	display: flex;
	align-items: center;
	gap: 8px;
}
.ma-hdr__d-link {
	flex: 1 1 auto;
	display: block;
	padding: 15px 2px;
	font-size: 17px;
	font-weight: 600;
	letter-spacing: -.01em;
	color: var(--ma-text, #0f0f10);
	text-decoration: none;
	border-radius: 8px;
}
.ma-hdr__d-link.is-current,
.ma-hdr__d-link.is-ancestor { color: var(--ma-accent, #4d3f96); }

.ma-hdr__d-toggle {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--ma-border, #e6e6ea);
	border-radius: 10px;
	background: #fff;
	color: var(--ma-text-2, #46464a);
	cursor: pointer;
	transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
.ma-hdr__d-toggle svg {
	width: 16px;
	height: 16px;
	transition: transform .26s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}
.ma-hdr__d-toggle[aria-expanded="true"] {
	background: var(--ma-accent-soft, #ecebf5);
	border-color: transparent;
	color: var(--ma-accent, #4d3f96);
}
.ma-hdr__d-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }

/* Akordeon: grid-template-rows 0fr → 1fr, yükseklik JS ölçümü olmadan animasyon. */
.ma-hdr__d-sub {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .3s var(--ma-ease, cubic-bezier(.16,1,.3,1));
}
.ma-hdr__d-sub.is-open { grid-template-rows: 1fr; }
.ma-hdr__d-sub-in { overflow: hidden; min-height: 0; }

/* 2. ve 3. seviye — sol kenarda ince marka çizgisi. */
.ma-hdr__d-list[data-depth="1"],
.ma-hdr__d-list[data-depth="2"] {
	margin: 2px 0 12px;
	padding-left: 14px;
	border-left: 2px solid var(--ma-accent-soft, #ecebf5);
}
.ma-hdr__d-list[data-depth="1"] .ma-hdr__d-link { font-size: 15.5px; font-weight: 600; padding: 11px 2px; }
.ma-hdr__d-list[data-depth="2"] .ma-hdr__d-link {
	font-size: 14.5px;
	font-weight: 500;
	padding: 10px 2px;
	color: var(--ma-text-2, #46464a);
}
.ma-hdr__d-list[data-depth="2"] .ma-hdr__d-link.is-current { color: var(--ma-accent, #4d3f96); }

.ma-hdr__drawer-foot {
	margin-top: auto;
	padding-top: 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.ma-hdr__cta--block {
	width: 100%;
	padding: 15px 20px;
	font-size: 16px;
}
.ma-hdr__wa {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 20px;
	border-radius: var(--ma-radius, 12px);
	border: 1px solid var(--ma-border, #e6e6ea);
	background: #fff;
	color: var(--ma-text, #0f0f10);
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color .18s ease, border-color .18s ease;
}
.ma-hdr__wa:hover { background: var(--ma-bg-soft, #fafafa); border-color: var(--ma-text-3, #6b6b72); }
.ma-hdr__wa svg { width: 19px; height: 19px; flex: 0 0 auto; }

/* Çekmece açıkken sayfa kaymasın + WhatsApp balonu menünün üstüne binmesin.
   Kilit SADECE <html> üzerinde: `body { overflow: hidden }` eklenirse iOS
   Safari gövdeyi ikinci bir kaydırma bağlamı yapıp konumu sıfırlıyor. */
html.ma-nav-open { overflow: hidden; }
/* Yüzen balonlar çekmecenin üstünde kalıyordu (Click-to-Chat z-index
   99999999, Avada "yukarı çık" 100000). Menü açıkken gizle.
   `html.ma-nav-open #ht-ctc-chat` = (0,1,1,0) — eklentinin kuralını
   !important'sız geçiyor. */
html.ma-nav-open #ht-ctc-chat,
html.ma-nav-open .ht-ctc,
html.ma-nav-open .joinchat,
html.ma-nav-open #toTop { display: none; }

/* ── Breakpoint'ler ──────────────────────────────────────────────────── */

/* Menü 5 öğe + logo + CTA: 1024px altında yatayda sıkışıyor → çekmece. */
@media (max-width: 1024px) {
	:root { --ma-hdr-space: 86px; }
	.ma-hdr {
		--hdr-h: 70px;
		--hdr-h-min: 62px;
		--hdr-logo: 46px;
		--hdr-logo-min: 42px;
	}
	.ma-hdr__nav { display: none; }
	.ma-hdr__burger { display: inline-flex; }
	.ma-hdr__inner { gap: 12px; }
	.ma-hdr__actions { margin-left: auto; }
}

/* Telefon: CTA butonu barda yer kaplıyor — çekmecenin içinde zaten var. */
@media (max-width: 600px) {
	:root { --ma-hdr-space: 80px; }
	.ma-hdr {
		--hdr-h: 64px;
		--hdr-h-min: 58px;
		--hdr-logo: 40px;
		--hdr-logo-min: 36px;
	}
	.ma-hdr__actions .ma-hdr__cta { display: none; }
	.ma-hdr__cart { width: 40px; height: 40px; }
	.ma-hdr__d-link { font-size: 16.5px; }
}

/* 1200px altı: menü aralığını kıs ki logo+CTA ile çakışmasın. */
@media (max-width: 1180px) and (min-width: 1025px) {
	.ma-hdr { --hdr-gap: 22px; }
	.ma-hdr__link { font-size: 14.5px; }
}

@media (prefers-reduced-motion: reduce) {
	.ma-hdr *,
	.ma-hdr__drawer { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Ekran okuyucu metni — Avada'nınkine bağlı kalmayalım. */
.ma-hdr .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Klavye odağı — style.css'teki genel kural zaten var, burada offset'i
   header yüksekliğine göre kısıyoruz ki halka bara taşmasın. */
.ma-hdr :is(a, button):focus-visible {
	outline: 2px solid var(--ma-accent, #4d3f96);
	outline-offset: 3px;
	border-radius: 6px;
}