/* ===================================================================
   UST MENU · urun ve kategori sablonlari              2026-08-27

   Kendi isaretlememiz. Elementor/ElementsKit basligi bu sablonlarda
   gizleniyor; baglantilar ayni WordPress menusunden geliyor, dolayisiyla
   hicbir adres degismiyor.

   Hareket kasitli olarak AZ ve YONLU: acilis panelleri asagi dogru
   cozuluyor, ogeler kademeli beliriyor, alt cizgi soldan buyuyor. Her sey
   prefers-reduced-motion ile kapaniyor.
   =================================================================== */

/* Elementor basligi SITE GENELINDE devre disi — menu artik her sayfada
   bizim. Sablonun icinde yalnizca menu ve logo vardi (kontrol edildi),
   baska bir sey kaybolmuyor. Alt bilgi dokunulmadan kaliyor. */
.elementor-location-header{
	display:none !important;
}

/* ---- ACIK ZEMINLI SAYFALAR ---------------------------------------
   Sitenin cogu hala elle kurulmus BEYAZ Elementor sayfalari. Baslik
   oralarda koyu paletle basilsa acik gri yazi beyaz zeminde okunmazdi.
   Degerler basligin KENDI uzerinde tanimlaniyor; ozel ozellikler asagi
   kalitildigi icin yalnizca baslik alt agacini etkiliyor, sayfanin geri
   kalanina hic dokunmuyor.

   Ayni degerler acik temanin paletinden; kontrastlar orada olculdu
   (govde 12.97:1, ikincil 6.23:1, baglanti 8.20:1 — hepsi WCAG AA).
   ------------------------------------------------------------------- */
.ek-ust--acik{
	--yuzey:          #FFFFFF;
	--yuzey-alt:      #F1F3FC;
	--metin:          #2B3048;
	--metin-baslik:   #080C24;
	--metin-ikincil:  #5A6076;
	--cizgi:          #DCE0F2;
	--marka-metin:    #2A34D6;
	--baslik-renk:    #4650DD;
	--alan-zemin:     rgba(8,12,36,.035);
	--switch-yuva:    rgba(8,12,36,.04);
	--zemin-golge-renk: 70, 80, 115;

}

/* Zemin AYRI ve iki sinifli bir kuralda: .ek-ust{background:transparent}
   bu dosyada daha asagida ve esit ozgullukte oldugu icin tek sinifla
   yazildiginda onu eziyordu — baslik acik sayfalarda saydam kaliyor,
   icerik altindan okunaksiz geciyordu (olculdu: rgba(0,0,0,0)).
   Iki sinif (0,2,0) sirayla oynamaya gerek birakmiyor.

   Koyu sayfalarda basligin arkasinda asamali bulaniklik seridi var;
   burada o yok, bu yuzden baslik kendi zeminini tasiyor. */
.ek-ust.ek-ust--acik{
	background:rgba(255,255,255,.88);
	-webkit-backdrop-filter:blur(14px);
	        backdrop-filter:blur(14px);
	border-bottom:1px solid var(--cizgi);
}

.ek-ust{
	position:sticky;
	top:0;
	z-index:60;
	background:transparent;   /* blur seridi arkada calissin */
}
.ek-ust-ic{
	display:flex;
	align-items:center;
	gap:clamp(16px, 3vw, 44px);
	max-width:1240px;
	margin-inline:auto;
	padding:18px clamp(16px, 4vw, 40px);
	transition:padding 260ms ease;
}
/* Kaydirildikca baslik inceliyor — sayfa iceriginin onune gecmesin. */
.ek-ust[data-kaydi] .ek-ust-ic{padding-top:10px;padding-bottom:10px}

.ek-ust-logo{display:block;flex:0 0 auto;line-height:0}
.ek-ust-logo img{
	/* Onceki baslikta logo 79px yuksekti; 38px'e dusurunce kucuk kaldi.
	   52px marka agirligini geri veriyor ama satiri sismiyor. */
	width:auto;height:58px;display:block;
	transition:height 260ms ease, filter 200ms ease;
}
.ek-ust[data-kaydi] .ek-ust-logo img{height:46px}
/* Logo koyu renkli bir SVG; koyu zeminde beyaza cevriliyor. */
.ek-ust-logo img{filter:brightness(0) invert(1)}
:root[data-tema="acik"] .ek-ust-logo img,
.ek-ust--acik .ek-ust-logo img{filter:none}

.ek-ust-nav{margin-left:auto}
.ek-ust-liste{
	display:flex;align-items:center;gap:clamp(4px, 1.4vw, 18px);
	margin:0;padding:0;list-style:none;
}
.ek-ust-oge{position:relative;margin:0}

.ek-ust-bag{
	display:inline-flex;align-items:center;gap:6px;
	position:relative;
	padding:8px 10px;
	border:0;background:none;cursor:pointer;
	font-family:Montserrat,"Helvetica Neue",Arial,sans-serif;
	font-size:14px;font-weight:500;letter-spacing:.005em;
	color:var(--metin);
	text-decoration:none;
	/* Sydney temasi TUM <button>'lara text-transform:uppercase veriyor;
	   acilir menu tetigi bir <button> oldugu icin "ÜRÜNLERİMİZ" diye
	   buyuk harfle cikiyordu, komsulari normal yazilirken. */
	text-transform:none;
	transition:color 200ms ease;
}
.ek-ust-bag:hover,
.ek-ust-tetik[aria-expanded="true"]{color:var(--metin-baslik)}

/* Alt cizgi soldan buyur — hover'da beliren degil, CIZILEN bir cizgi. */
.ek-ust-bag > span{position:relative}
.ek-ust-bag > span::after{
	content:'';position:absolute;left:0;right:0;bottom:-5px;height:1.5px;
	background:var(--marka-metin);
	transform:scaleX(0);transform-origin:left center;
	transition:transform 260ms cubic-bezier(.4,0,.2,1);
}
.ek-ust-bag:hover > span::after,
.ek-ust-tetik[aria-expanded="true"] > span::after{transform:scaleX(1)}

.ek-ust-ok{
	width:12px;height:12px;flex:0 0 12px;
	transition:transform 260ms cubic-bezier(.4,0,.2,1);
}
.ek-ust-tetik[aria-expanded="true"] .ek-ust-ok{transform:rotate(180deg)}

.ek-ust-bag:focus-visible{
	outline:2px solid var(--marka-metin);outline-offset:3px;border-radius:6px;
}

/* --- ACILIR PANEL ------------------------------------------------- */
.ek-ust-panel{
	position:absolute;
	top:calc(100% + 14px);
	left:50%;
	z-index:5;
	padding:22px;
	border:1px solid var(--cizgi);
	border-radius:18px;
	background:var(--yuzey-alt);
	box-shadow:0 24px 60px rgba(var(--zemin-golge-renk), .38);
	/* Kapali hal: hafif yukarida ve seffaf. `hidden` erisilebilirlik icin,
	   gorunum icin degil — gecis suresince kaldiriliyor. */
	opacity:0;
	transform:translate(-50%, -8px);
	pointer-events:none;
	transition:opacity 220ms ease, transform 260ms cubic-bezier(.4,0,.2,1);
}
.ek-ust-panel[hidden]{display:none}
.ek-ust-oge--acik > .ek-ust-panel{
	opacity:1;
	transform:translate(-50%, 0);
	pointer-events:auto;
}
.ek-ust-panel--mega{min-width:min(560px, 76vw)}

.ek-ust-panel-ic{display:flex;gap:34px}
.ek-ust-panel:not(.ek-ust-panel--mega) .ek-ust-panel-ic{flex-direction:column;gap:2px}

.ek-ust-sutun{min-width:172px}
.ek-ust-sutun-baslik{
	display:block;
	margin-bottom:10px;
	font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
	color:var(--baslik-renk);
	text-decoration:none;
}
.ek-ust-sutun-baslik:hover{color:var(--marka-metin)}
.ek-ust-sutun-liste{margin:0;padding:0;list-style:none}
.ek-ust-sutun-liste a,
.ek-ust-panel:not(.ek-ust-panel--mega) .ek-ust-sutun-baslik{
	display:block;padding:7px 0;
	font-size:14px;color:var(--metin);text-decoration:none;
	transition:color 180ms ease, transform 220ms cubic-bezier(.4,0,.2,1);
}
.ek-ust-sutun-liste a:hover{color:var(--marka-metin);transform:translateX(3px)}

/* Kademeli belirme: panel acilinca ogeler sirayla giriyor. */
.ek-ust-sutun,
.ek-ust-sutun-liste li{
	opacity:0;transform:translateY(6px);
	transition:opacity 260ms ease, transform 300ms cubic-bezier(.4,0,.2,1);
}
.ek-ust-oge--acik .ek-ust-sutun,
.ek-ust-oge--acik .ek-ust-sutun-liste li{
	opacity:1;transform:none;
	transition-delay:calc(60ms + var(--ek-sira, 0) * 34ms);
}

/* --- SAG TARAF ---------------------------------------------------- */
.ek-ust-sag{display:flex;align-items:center;gap:10px;flex:0 0 auto}

.ek-ust-dil{display:flex;align-items:center;gap:2px}
.ek-ust-dil-bag{
	/* Yukseklik switch'in rayiyla AYNI (30px) ve zemini ayni tokendan:
	   ucu de tek bir kontrol grubu gibi okunsun. Once dil baglari 30px
	   ama switch 13px asagidaydi ve etkin dilin zemini daha agir
	   duruyordu. */
	display:inline-flex;align-items:center;
	height:30px;padding:0 10px;
	border-radius:var(--yuvarlak-hap,100px);
	font-family:Montserrat,"Helvetica Neue",Arial,sans-serif;
	font-size:12px;font-weight:600;letter-spacing:.04em;
	color:var(--metin-ikincil);text-decoration:none;
	transition:color 180ms ease, background-color 180ms ease;
}
.ek-ust-dil-bag:hover{color:var(--metin-baslik)}
.ek-ust-dil-bag--acik{
	color:var(--metin-baslik);
	background:var(--switch-yuva);
	box-shadow:inset 0 0 0 1px var(--cizgi);
}

/* --- HAMBURGER (dar ekran) ---------------------------------------- */
.ek-ust-hamburger{
	display:none;
	width:40px;height:40px;padding:10px;
	border:0;background:none;cursor:pointer;
	flex-direction:column;justify-content:center;gap:5px;
}
.ek-ust-hamburger span{
	display:block;height:1.6px;width:100%;
	background:var(--metin);border-radius:2px;
	transition:transform 260ms cubic-bezier(.4,0,.2,1), opacity 180ms ease;
}
.ek-ust-hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
.ek-ust-hamburger[aria-expanded="true"] span:nth-child(2){opacity:0}
.ek-ust-hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}

/* --- MOBIL PANEL --------------------------------------------------- */
.ek-ust-mobil{
	position:fixed;inset:0;
	z-index:59;
	padding:96px clamp(20px, 6vw, 40px) 40px;
	background:var(--yuzey);
	overflow-y:auto;
	opacity:0;
	transition:opacity 240ms ease;
}
.ek-ust-mobil[hidden]{display:none}
.ek-ust-mobil--acik{opacity:1}
.ek-ust-mobil-liste{margin:0;padding:0;list-style:none}
.ek-ust-mobil-liste > li{
	padding:14px 0;border-bottom:1px solid var(--cizgi);
	opacity:0;transform:translateY(10px);
	transition:opacity 300ms ease, transform 360ms cubic-bezier(.4,0,.2,1);
}
.ek-ust-mobil--acik .ek-ust-mobil-liste > li{
	opacity:1;transform:none;
	transition-delay:calc(80ms + var(--ek-sira, 0) * 46ms);
}
.ek-ust-mobil-bag,
.ek-ust-mobil-baslik{
	display:block;
	font-family:Montserrat,"Helvetica Neue",Arial,sans-serif;
	font-size:20px;font-weight:600;letter-spacing:-.01em;
	color:var(--metin-baslik);text-decoration:none;
}
.ek-ust-mobil-alt{
	display:block;margin-top:12px;
	font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
	color:var(--baslik-renk);text-decoration:none;
}
.ek-ust-mobil-torun{
	display:block;padding:7px 0 7px 14px;
	font-size:15px;color:var(--metin);text-decoration:none;
}

@media (max-width:900px){
	.ek-ust-nav{display:none}
	.ek-ust-hamburger{display:flex}
	.ek-ust-ic{gap:12px}
	.ek-ust-sag{margin-left:auto}
}

@media (prefers-reduced-motion:reduce){
	.ek-ust-ic, .ek-ust-logo img, .ek-ust-bag, .ek-ust-bag > span::after,
	.ek-ust-ok, .ek-ust-panel, .ek-ust-sutun, .ek-ust-sutun-liste li,
	.ek-ust-sutun-liste a, .ek-ust-hamburger span, .ek-ust-mobil,
	.ek-ust-mobil-liste > li{
		transition:none !important;
	}
	.ek-ust-sutun, .ek-ust-sutun-liste li, .ek-ust-mobil-liste > li{
		opacity:1;transform:none;
	}
}