/*!
 * Elaf Turizm — YERLEŞİM
 * Header, menü, mobil çekmece, footer, sabit çağrı çubuğu, WhatsApp.
 * Bağımlılık: components.css
 *
 * Z-INDEX KATMANLARI (tek yerde, çakışma olmasın diye)
 *   10   sticky alt başlık          100  açılır menü
 *   900  header                    1000  mobil çağrı çubuğu
 *   1010 WhatsApp yüzen düğme      1100  çekmece perdesi
 *   1110 çekmece                   9999  atlama bağlantısı
 */

/* ==== 1. ÜST ŞERİT ===================================================== */

.e-ust {
	background: var(--e-blue-900);
	color: #fff;
	font-size: var(--e-t-mikro);
}
.e-ust__ic { display: flex; align-items: center; justify-content: space-between; gap: var(--e-s-4); min-height: 36px; flex-wrap: wrap; }
.e-ust a { color: rgba(255,255,255,.92); text-decoration: none; }
.e-ust a:hover { color: #fff; text-decoration: underline; }
.e-ust__sol { display: flex; align-items: center; gap: var(--e-s-4); flex-wrap: wrap; }
.e-ust__oge { display: inline-flex; align-items: center; gap: 6px; }
.e-ust__sosyal { display: flex; gap: 2px; }
.e-ust__sosyal a { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--e-r-xs); }
.e-ust__sosyal a:hover { background: rgba(255,255,255,.12); }
@media (max-width: 991px) { .e-ust { display: none; } }

/* ==== 2. HEADER ======================================================== */

.e-header {
	position: sticky; top: 0; z-index: 900;
	background: rgba(255,255,255,.96);
	-webkit-backdrop-filter: saturate(1.4) blur(10px);
	backdrop-filter: saturate(1.4) blur(10px);
	border-bottom: 1px solid var(--e-line);
	transition: box-shadow var(--e-dur-move) var(--e-ease);
}
.e-header--kaydi { box-shadow: var(--e-shadow-md); }
.e-header__ic { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--e-s-7); min-height: 84px; }

.e-logo { display: inline-flex; align-items: center; }
.e-logo img, .e-logo--yatay img { height: 48px; width: auto; }
.e-logo--dikey img { height: 128px; width: auto; }
.custom-logo-link img { height: 48px; width: auto; }

/* --- Ana menü --- */
.e-nav { justify-self: center; }
/* `list-style` acikca sifirlaniyor: base.css yalniz `ul[class]` seciyor,
   menu atanmamisken basilan yedek liste ise sinifsiz bir <ul> ve madde
   isaretleriyle geliyordu. */
.e-nav ul, .e-cekmece nav ul, .e-footer ul, .e-widget ul {
	list-style: none; margin: 0; padding: 0;
}
.e-nav ul { display: flex; align-items: center; gap: var(--e-s-6); }
.e-nav a {
	position: relative; display: inline-block;
	padding: 10px 2px;
	font-size: var(--e-t-govde); font-weight: 500;
	color: var(--e-neutral-800); text-decoration: none;
	transition: color var(--e-dur-color) var(--e-ease);
}
/* MARKA İMZASI — aktif/hover altı çizgisi 63/37 çift renkli. */
.e-nav a::after {
	content: ''; position: absolute; left: 0; right: 0; bottom: 2px;
	height: 2.5px; border-radius: 2px;
	background: var(--e-grad-rule);
	transform: scaleX(0); transform-origin: left;
	transition: transform var(--e-dur-move) var(--e-ease);
}
.e-nav a:hover { color: var(--e-blue-700); }
.e-nav a:hover::after,
.e-nav .current-menu-item > a::after,
.e-nav .current_page_item > a::after,
.e-nav [aria-current="page"]::after { transform: scaleX(1); }
.e-nav .current-menu-item > a, .e-nav .current_page_item > a { color: var(--e-blue-700); font-weight: 600; }

/* Alt menü */
.e-nav li { position: relative; }
.e-nav .sub-menu {
	position: absolute; top: 100%; left: 0; z-index: 100;
	display: block; min-width: 230px;
	flex-direction: column; gap: 0;
	padding: var(--e-s-2);
	background: var(--e-surface);
	border: 1px solid var(--e-line);
	border-radius: var(--e-r-md);
	box-shadow: var(--e-shadow-lg);
	opacity: 0; visibility: hidden; transform: translateY(6px);
	transition: opacity var(--e-dur-color) var(--e-ease), transform var(--e-dur-move) var(--e-ease), visibility var(--e-dur-color);
}
.e-nav li:hover > .sub-menu, .e-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.e-nav .sub-menu a { display: block; padding: 10px 12px; border-radius: var(--e-r-xs); font-size: var(--e-t-kucuk); }
.e-nav .sub-menu a::after { display: none; }
.e-nav .sub-menu a:hover { background: var(--e-blue-50); }

/* --- Sağ blok --- */
.e-header__sag { display: flex; align-items: center; gap: var(--e-s-4); }
.e-header__tel { display: inline-flex; align-items: center; gap: var(--e-s-2); font-size: var(--e-t-govde); font-weight: 700; color: var(--e-blue-900); text-decoration: none; white-space: nowrap; }
.e-header__tel .e-ikon { color: var(--e-blue-600); }
.e-header__tel:hover { color: var(--e-blue-700); }

.e-menu-ac { display: none; }

@media (max-width: 1199px) { .e-nav ul { gap: var(--e-s-4); } .e-nav a { font-size: var(--e-t-kucuk); } }
@media (max-width: 991px) {
	.e-header__ic { grid-template-columns: auto 1fr; min-height: 68px; }
	.e-nav, .e-header__tel { display: none; }
	.e-header__sag { justify-self: end; }
	.e-menu-ac { display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--e-r-sm); color: var(--e-neutral-800); }
	.e-menu-ac:hover { background: var(--e-bg); }
	.e-logo img, .e-logo--yatay img, .custom-logo-link img { height: 40px; }
}

/* ==== 3. MOBİL ÇEKMECE ================================================= */

.e-cekmece-perde {
	position: fixed; inset: 0; z-index: 1100;
	background: rgba(17,44,74,.52);
	opacity: 0; pointer-events: none;
	transition: opacity var(--e-dur-panel) var(--e-ease-sym);
}
.e-cekmece-perde[data-acik] { opacity: 1; pointer-events: auto; }

.e-cekmece {
	position: fixed; inset: 0 0 0 auto; z-index: 1110;
	display: flex; flex-direction: column;
	width: min(88vw, 380px);
	background: var(--e-surface);
	box-shadow: var(--e-shadow-xl);
	/* Sağdan geliyor: telefonu tek elle tutan kullanıcının başparmağı sağda. */
	transform: translateX(100%);
	transition: transform var(--e-dur-panel) var(--e-ease);
	overscroll-behavior: contain;
	overflow-y: auto;
	padding-bottom: max(var(--e-s-6), env(safe-area-inset-bottom));
}
.e-cekmece[data-acik] { transform: translateX(0); }

.e-cekmece__bas { display: flex; align-items: center; justify-content: space-between; gap: var(--e-s-4); padding: var(--e-s-4) var(--e-s-5); border-bottom: 1px solid var(--e-line); }
.e-cekmece__kapat { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--e-r-sm); color: var(--e-neutral-600); }
.e-cekmece__kapat:hover { background: var(--e-bg); color: var(--e-neutral-900); }

.e-cekmece nav ul { display: block; }
.e-cekmece nav a { display: block; padding: var(--e-s-4) var(--e-s-5); min-height: 56px; font-size: 18px; font-weight: 500; color: var(--e-neutral-800); text-decoration: none; border-bottom: 1px solid var(--e-line); }
.e-cekmece nav a:hover { background: var(--e-blue-50); color: var(--e-blue-700); }
.e-cekmece .sub-menu a { padding-left: var(--e-s-9); font-size: var(--e-t-govde); color: var(--e-neutral-600); }
.e-cekmece__eylem { display: grid; gap: var(--e-s-3); padding: var(--e-s-5); margin-top: auto; }

/* Çekmece açıkken sayfa kaymasın. */
body.e-kilit { overflow: hidden; }

/* ==== 4. WHATSAPP YÜZEN DÜĞME ========================================= */

/*
 * Sabit alt çağrı çubuğu ("beyaz div" + Ara/WhatsApp) KALDIRILDI — mobilde
 * yüzen bu düğme artık TEK hızlı WhatsApp erişimi. Ara için kapaktaki "Bizi
 * arayın" düğmesi ve hamburger menüdeki çekmece (`.e-cekmece__eylem`) var.
 */
.e-wa {
	position: fixed; right: 20px; bottom: 20px; z-index: 1010;
	display: grid; place-items: center;
	width: 58px; height: 58px;
	border-radius: var(--e-r-pill);
	background: var(--e-whatsapp); color: #fff;
	box-shadow: var(--e-shadow-lg);
	transition: transform var(--e-dur-move) var(--e-ease), box-shadow var(--e-dur-move) var(--e-ease), background-color var(--e-dur-color) var(--e-ease);
}
.e-wa:hover { background: var(--e-whatsapp-600); color: #fff; transform: scale(1.06); box-shadow: var(--e-shadow-xl); }
.e-wa .e-ikon { width: 29px; height: 29px; }
@media (max-width: 767px) {
	.e-wa { right: var(--e-s-4); bottom: calc(var(--e-s-4) + env(safe-area-inset-bottom)); width: 52px; height: 52px; }
}
@media (hover: none), (max-width: 767px) { .e-wa:hover { transform: none !important; } }

/* ==== 6. FOOTER ======================================================== */

.e-footer { position: relative; background: var(--e-bg-dark); color: var(--e-neutral-300); overflow: hidden; }
/* MARKA İMZASI — footer'ın üst kenarında 63/37 çizgi. */
.e-footer::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--e-grad-rule); z-index: 2; }

.e-footer__ust { position: relative; z-index: 1; display: grid; grid-template-columns: 2fr 1fr 1fr 1.4fr; gap: var(--e-s-8); padding-block: var(--e-s-11) var(--e-s-9); }
.e-footer h2, .e-footer h3 { color: #fff; }
.e-footer__baslik, .e-widget__baslik { margin: 0 0 var(--e-s-4); font-family: var(--e-font-govde); font-size: var(--e-t-govde); font-weight: 700; color: #fff; }
.e-footer a { color: var(--e-blue-300); text-decoration: none; }   /* lacivert üstünde 6.52 ✓ */
.e-footer a:hover { color: #fff; text-decoration: underline; }
.e-footer ul li + li { margin-top: 10px; }
.e-footer__tanit { margin: var(--e-s-4) 0 var(--e-s-5); font-size: var(--e-t-kucuk); color: var(--e-neutral-300); max-width: 42ch; }

.e-footer__iletisim li { display: flex; gap: var(--e-s-3); align-items: flex-start; font-size: var(--e-t-kucuk); }
.e-footer__iletisim .e-ikon { color: var(--e-blue-300); margin-top: 3px; }

.e-sosyal { display: flex; gap: var(--e-s-2); }
.e-sosyal a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--e-r-sm); background: rgba(255,255,255,.08); color: #fff; }
.e-sosyal a:hover { background: var(--e-blue-600); color: #fff; }

.e-footer__alt { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: var(--e-s-4); flex-wrap: wrap; padding-block: var(--e-s-5); border-top: 1px solid rgba(255,255,255,.12); font-size: var(--e-t-mikro); }
.e-footer__alt ul { display: flex; gap: var(--e-s-5); flex-wrap: wrap; }

@media (max-width: 991px) { .e-footer__ust { grid-template-columns: 1fr 1fr; gap: var(--e-s-7); } }
/* Tarayıcının kendi üçgen işareti HER GENİŞLİKTE kapatılıyor. Yalnız mobil
   sorgusunun içinde kapatılmıştı ve masaüstünde başlığın yanında sahipsiz bir
   ▼ duruyordu — footer sütunları masaüstünde zaten hep açık. */
.e-footer__katla summary { list-style: none; display: block; }
.e-footer__katla summary::-webkit-details-marker { display: none; }
.e-footer__katla summary::marker { content: ''; }

@media (max-width: 575px) {
	.e-footer__ust { grid-template-columns: 1fr; gap: var(--e-s-6); }
	/* Mobilde dört sütun alt alta gelince footer 2000px uzuyor; 2-4. sütunlar
	   akordiyona dönüyor. <details> olduğu için JS gerekmiyor.              */
	.e-footer__katla summary { cursor: pointer; display: flex; align-items: center; justify-content: space-between; padding: var(--e-s-3) 0; }
	.e-footer__katla summary::after { content: ''; width: 10px; height: 10px; border-right: 2px solid var(--e-blue-300); border-bottom: 2px solid var(--e-blue-300); transform: rotate(45deg); margin-top: -4px; transition: transform var(--e-dur-panel) var(--e-ease); }
	.e-footer__katla[open] summary::after { transform: rotate(-135deg); margin-top: 2px; }
	.e-footer__katla .e-footer__baslik { margin: 0; }
	.e-footer__alt { justify-content: flex-start; }
}

/* ==== 7. WIDGET ======================================================== */

.e-widget + .e-widget { margin-top: var(--e-s-6); }
.e-widget ul li + li { margin-top: 10px; }

/* Masaüstünde görünüp mobilde gizlenen yardımcı. */
@media (max-width: 991px) { .e-gizli-mobil { display: none !important; } }

.e-footer__widget { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--e-s-7); padding-bottom: var(--e-s-8); position: relative; z-index: 1; }
@media (max-width: 767px) { .e-footer__widget { grid-template-columns: 1fr; } }