/* ==========================================================================
   Dr. Mehmet Portakal — FAZ 2 BİLEŞENLERİ
   Header · sticky · mobil menü · iki lokasyonlu footer · izyolu ·
   içindekiler · video · hasta görüşleri
   tema.css'teki token'ların üstüne biner.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. HEADER — sade. Mega menü rayı YOK (Taylan imzası). Sticky'de kompaktlaşır.
   -------------------------------------------------------------------------- */

.ust {
	position: sticky;
	inset-block-start: 0;
	z-index: 60;
	background: rgba(251, 248, 243, .88);
	backdrop-filter: saturate(160%) blur(10px);
	border-block-end: 1px solid transparent;
	transition: border-color var(--gecis), background var(--gecis);
}

/* TİTREME ÖNLEMİ (2026-07-28)
   `backdrop-filter: blur()` sticky bir başlıkta HER KAREDE arkadaki alanı
   yeniden örnekleyip bulanıklaştırır. Kaydırma sırasında bu, yüksek kontrastlı
   içeriğin üstünde gözle görülür bir titreşim/kaynama üretebilir.
   Çözüm: kaydırma BAŞLAR BAŞLAMAZ (kompakt hâl) filtreyi bırak ve zemini TAM
   OPAK yap. Böylece kaydırırken filtre hiç çalışmaz; buzlu cam etkisi yalnız
   sayfa tepedeyken (hareketsizken) korunur — görünüm kaybı yok. */
.ust--kompakt {
	border-block-end-color: var(--kabuk);
	background: var(--kagit);
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.ust__ic {
	inline-size: min(100% - 2.5rem, var(--kap-genis));
	margin-inline: auto;
	display: flex;
	align-items: center;
	gap: clamp(1rem, 3vw, 2.5rem);
	padding-block: 1.15rem;
	transition: padding var(--gecis);
}

.ust--kompakt .ust__ic { padding-block: .68rem; }

.ust__marka { flex: none; margin-inline-end: auto; }

.ust--kompakt .wordmark { font-size: 1.12rem; }
.ust--kompakt .wordmark__alt { display: none; }
.wordmark { transition: font-size var(--gecis); }

.ust__gezinme { display: flex; align-items: center; gap: 1.6rem; }

.menu {
	display: flex;
	align-items: center;
	gap: clamp(.9rem, 2vw, 1.7rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.menu__oge { position: relative; }

.menu__bag {
	font-size: .96rem;
	font-weight: 500;
	color: var(--murekkep);
	text-decoration: none;
	padding-block: .35rem;
	display: inline-block;
	border-block-end: 1.5px solid transparent;
	transition: color var(--gecis-hizli), border-color var(--gecis-hizli);
}

.menu__bag:hover,
.menu__oge:focus-within > .menu__bag {
	color: var(--isik-koyu);
	border-block-end-color: var(--isik);
}

.menu__oge--alt > .menu__bag::after {
	content: '';
	display: inline-block;
	inline-size: .38rem;
	block-size: .38rem;
	margin-inline-start: .42rem;
	border-inline-end: 1.5px solid currentColor;
	border-block-end: 1.5px solid currentColor;
	rotate: 45deg;
	translate: 0 -.14em;
	opacity: .5;
}

.menu__acar { display: none; }

/* --------------------------------------------------------------------------
   AÇILIR PANEL (2026-07-28 yeniden kuruldu)

   Taylan'daki iki panelli mega-menü rayı KOPYALANMADI. Burada sade, sıcak ve
   kompakt bir panel var: en fazla 2 kolon, sıcak kâğıt zemin, ince kum çizgi,
   ağır gölge ve beyaz kart YOK.

   Erişilebilirlik: açma düğmesi bağlantıdan AYRI (`.menu__acar`), masaüstünde
   de görünür. Panel; hover, klavye odağı VEYA düğmenin `aria-expanded="true"`
   durumuyla açılır — üçü de aynı görsel kurala bağlı, desenkron olmaz.
   -------------------------------------------------------------------------- */

/* Hover köprüsü: bağlantı ile panel arasındaki 0.6rem boşlukta imleç
   "boşluğa düşüp" menüyü aniden kapatmasın. */
.menu__oge--alt::after {
	content: '';
	position: absolute;
	inset-inline: -1rem;
	inset-block-start: 100%;
	block-size: .7rem;
}

.altmenu {
	position: absolute;
	inset-block-start: calc(100% + .6rem);
	inset-inline-start: -1rem;
	z-index: 5;
	margin: 0;
	padding: .55rem;
	list-style: none;

	/* En fazla İKİ kolon. Tek kolona sığan kısa listeler tek kolon kalır.
	   2026-07-28: panel 30rem'di ve küme adları ("Fonksiyonel Sağlık ve
	   Sağlıklı Yaş Alma", "Enjeksiyon ve Rejeneratif Yaklaşımlar") kolona
	   sığmayıp KIRPILIYORDU. Brief'in önerdiği 720–900px bandına çıkarıldı
	   ve metin sarması açıldı — artık kırpma yok, taşma yok. */
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
	inline-size: max-content;
	max-inline-size: min(46rem, calc(100vw - 3rem));
	gap: .1rem .5rem;

	background: var(--kagit);
	border: 1px solid var(--kabuk);
	border-radius: var(--kose-kart);
	box-shadow: var(--golge-ince);   /* ağır gölge yok */
	opacity: 0;
	visibility: hidden;
	translate: 0 -6px;
	transition: opacity var(--gecis), translate var(--gecis), visibility var(--gecis);
}

/* Grup başlığı (odak/yöntem) iki kolonu da kaplar. */
.altmenu__baslik { grid-column: 1 / -1; }

/* EKRAN DIŞINA TAŞMA ÖNLEMİ.
   Panel genişleyince (≈580px) sağdaki menü ögelerinin paneli viewport'u
   aşıyordu. Menünün son iki ögesinde panel SOLA değil SAĞA hizalanır.
   CSS'te "son .menu__oge--alt" seçicisi yok; `nth-last-child` kullanılıyor —
   menü sırası değişirse bu sayı gözden geçirilmeli. */
.menu__oge--alt:nth-last-child(-n+2) > .altmenu {
	inset-inline-start: auto;
	inset-inline-end: -1rem;
}

.menu__oge--alt:hover > .altmenu,
.menu__oge--alt:focus-within > .altmenu,
.menu__acar[aria-expanded='true'] + .altmenu { opacity: 1; visibility: visible; translate: 0 0; }

/* Masaüstünde açma düğmesi GÖRÜNÜR — bağlantı ile açma eylemi ayrışsın.
   Bağlantının kendi ::after oku kaldırılır, yoksa iki ok görünür. */
@media (min-width: 1260px) {
	.menu__acar {
		display: inline-grid;
		place-items: center;
		inline-size: 1.5rem;
		block-size: 1.5rem;
		margin-inline-start: .1rem;
		padding: 0;
		background: none;
		border: 0;
		border-radius: var(--kose);
		cursor: pointer;
		vertical-align: middle;
	}

	.menu__oge--alt > .menu__bag::after { content: none; }

	.menu__acar .menu__ok {
		inline-size: .38rem;
		block-size: .38rem;
		border-inline-end: 1.5px solid var(--murekkep-soluk);
		border-block-end: 1.5px solid var(--murekkep-soluk);
		rotate: 45deg;
		translate: 0 -.1em;
		transition: rotate var(--gecis-hizli);
	}

	.menu__acar[aria-expanded='true'] .menu__ok { rotate: -135deg; translate: 0 .08em; }
	.menu__acar:hover .menu__ok { border-color: var(--isik-koyu); }
}

/* Odak her yerde GÖRÜNÜR. */
.menu__bag:focus-visible,
.menu__acar:focus-visible,
.altmenu a:focus-visible {
	outline: 2px solid var(--isik-koyu);
	outline-offset: 3px;
	border-radius: var(--kose);
}

@media (prefers-reduced-motion: reduce) {
	.altmenu { transition: none; }
	.menu__acar .menu__ok { transition: none; }
}

.altmenu a {
	display: block;
	padding: .52rem .7rem;
	font-size: .93rem;
	border-radius: var(--kose);
	color: var(--murekkep-soluk);
	text-decoration: none;
}

.altmenu a:hover { background: var(--kagit-isik); color: var(--murekkep); }

.ust__eylem { flex: 0 0 auto; }
.ust__cta { padding-block: .68rem; }
.ust--kompakt .ust__cta { padding-block: .56rem; font-size: .93rem; }

/* --------------------------------------------------------------------------
   HEADER YATAY BÜTÇESİ  (2026-07-28 düzeltmesi)

   ÖLÇÜM NOTU — "83px taşma" YANILSAMAYDI: `nav.scrollWidth` 628 / kutu 545
   farkının tamamı, `position:absolute` olan 4 gizli `.altmenu` panelinden
   geliyordu (mutlak konumlu alt öğeler scrollWidth'e dahildir). Paneller
   akıştan çıkarılınca taşma 0 ve HİÇBİR menü etiketi kırpılmıyordu.
   Dolayısıyla görünür bir çakışma yoktu.

   GERÇEK SORUN emniyet payıydı: kırılım 1080px'ti ve 1080–1160 aralığında
   menü ile CTA arasında yalnız ~33px kalıyordu; etiket uzunluğu veya font
   yedeği değişse çakışacaktı.

   ÇÖZÜM: (a) `.menu` artık sıkışmaz — daralınca kırpmak yerine kırılım devreye
   girer, (b) yatay bütçe daraltıldı (boşluk + punto: menü 545px → 499px),
   (c) kırılım ölçülen gerçek ihtiyaca göre 1260px'e alındı (asgari ~1161px +
   ~100px pay). 1280/1366/1440/1920'de doğrulandı.
   -------------------------------------------------------------------------- */
.ust__gezinme { gap: clamp(1rem, 1.6vw, 1.5rem); }

.menu {
	/* Sıkışmayı YASAKLAR: metin kırpılmaz, taşma olmaz. */
	flex: 0 0 auto;
	gap: clamp(.7rem, 1.15vw, 1.1rem);
}

.menu__bag {
	font-size: var(--y-menu);        /* 15px */
	font-weight: var(--ag-menu);     /* 500 */
	letter-spacing: -.004em;
	white-space: nowrap;             /* menü etiketi iki satıra düşmesin */
}

/* Küme adları uzun olabilir: kırpma değil SARMA. Grid ögesinin küçülebilmesi
   için `min-inline-size: 0` şart — yoksa içerik kutuyu taşırır. */
.altmenu li { min-inline-size: 0; }

.altmenu a {
	font-size: var(--y-menu);
	font-weight: var(--ag-govde);
	white-space: normal;
	overflow-wrap: anywhere;
	line-height: 1.35;
}

.ust__marka { flex: 0 0 auto; }

/* Orta masaüstünde marka bloğunu daralt — 1440px altında alt satır gizlenir,
   böylece menüye ~60px yer açılır ve kırılım noktası aşağı çekilebilir. */
@media (min-width: 1260px) and (max-width: 1439px) {
	.wordmark__alt { display: none; }
}

.menu__iletisim { display: none; }

/* Hamburger */
.ust__acar {
	display: none;
	inline-size: 2.85rem;
	block-size: 2.85rem;
	padding: 0;
	background: none;
	border: 1px solid var(--kabuk-koyu);
	border-radius: var(--kose);
	cursor: pointer;
	position: relative;
}

.ust__acar-cizgi,
.ust__acar-cizgi::before,
.ust__acar-cizgi::after {
	position: absolute;
	inline-size: 1.15rem;
	block-size: 1.5px;
	background: var(--murekkep);
	transition: transform var(--gecis), background var(--gecis-hizli);
}

.ust__acar-cizgi { inset-block-start: 50%; inset-inline-start: 50%; translate: -50% -50%; }
.ust__acar-cizgi::before { content: ''; inset-block-start: -.42rem; inset-inline-start: 0; }
.ust__acar-cizgi::after  { content: ''; inset-block-start: .42rem;  inset-inline-start: 0; }

.ust__acar[aria-expanded='true'] .ust__acar-cizgi { background: transparent; }
.ust__acar[aria-expanded='true'] .ust__acar-cizgi::before { transform: translateY(.42rem) rotate(45deg); }
.ust__acar[aria-expanded='true'] .ust__acar-cizgi::after  { transform: translateY(-.42rem) rotate(-45deg); }

/* --------------------------------------------------------------------------
   2. MOBİL MENÜ
   Masaüstü menüsünün sıkıştırılmışı DEĞİL: büyük dokunma alanları (≥48px),
   okunaklı punto, akordeon alt listeler, altta doğrudan iletişim.
   -------------------------------------------------------------------------- */

/* 1080px → 1259px (2026-07-28): menünün gerçek içerik genişliği ~628px;
   logo + menü + CTA + güvenli boşluklar 1260px altında sığmıyordu. */
@media (max-width: 1259px) {
	.ust__acar { display: block; }
	.ust__eylem { display: none; }

	/* KRITIK: backdrop-filter, position:fixed alt ogeler icin KAPSAYICI BLOK
	   yaratir. Header'da acik kalirsa mobil menu viewport'a degil header'in
	   83px'lik kutusuna gore konumlanir ve 43px yukseklikte sikisir.
	   Mobilde bulaniklia gerek yok; header zaten opak. */
	.ust {
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		background: var(--kagit);
	}

	.ust__gezinme {
		position: fixed;
		inset-block-start: var(--ust-yuk, 74px);
		inset-block-end: 0;
		inset-inline: 0;
		display: block;
		max-height: none;
		block-size: auto;
		z-index: 58;
		border-block-end: 0;
		padding: 1.1rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom));
		background: var(--kagit);
		border-block-start: 1px solid var(--kabuk);
		overflow-y: auto;
		overscroll-behavior: contain;
		opacity: 0;
		visibility: hidden;
		translate: 0 -8px;
		transition: opacity var(--gecis), translate var(--gecis), visibility var(--gecis);
	}

	.ust__gezinme.acik { opacity: 1; visibility: visible; translate: 0 0; }

	/* Arka plan kilidi — overflow:hidden scroll konumunu KORUR, sticky bozulmaz */
	body.menu-acik { overflow: hidden; }

	.menu { display: block; }

	.menu__oge { border-block-end: 1px solid var(--kabuk); }
	.menu__oge:last-of-type { border-block-end: 0; }

	.menu__bag {
		display: block;
		padding-block: 1rem;
		padding-inline-end: 3.25rem;
		font-size: 1.14rem;
		font-weight: 500;
		border: 0;
	}

	.menu__oge--alt > .menu__bag::after { display: none; }

	.menu__acar {
		display: grid;
		place-items: center;
		position: absolute;
		inset-block-start: .2rem;
		inset-inline-end: 0;
		inline-size: 3rem;
		block-size: 3rem;
		padding: 0;
		background: none;
		border: 0;
		cursor: pointer;
	}

	.menu__ok {
		inline-size: .5rem;
		block-size: .5rem;
		border-inline-end: 1.6px solid var(--murekkep-soluk);
		border-block-end: 1.6px solid var(--murekkep-soluk);
		rotate: 45deg;
		translate: 0 -.12em;
		transition: rotate var(--gecis);
	}

	.menu__oge.acik .menu__ok { rotate: -135deg; translate: 0 .12em; }

	.altmenu {
		position: static;
		opacity: 1;
		visibility: visible;
		translate: 0;
		display: none;
		min-inline-size: 0;
		margin: 0 0 .7rem;
		padding: 0;
		background: none;
		border: 0;
		box-shadow: none;
	}

	.menu__oge.acik > .altmenu { display: block; }

	.altmenu a { padding-block: .72rem; font-size: 1.02rem; }

	.menu__iletisim {
		display: grid;
		gap: .6rem;
		margin-block-start: 1.4rem;
		padding-block-start: 1.25rem;
		border-block-start: 1px solid var(--kabuk);
	}

	.menu__iletisim-bag {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: .55rem;
		padding: .85rem 1rem;
		border: 1px solid var(--kabuk-koyu);
		border-radius: var(--kose);
		font-weight: 600;
		font-size: 1rem;
		color: var(--murekkep);
		text-decoration: none;
		text-align: center;
	}

	.menu__cta { inline-size: 100%; padding-block: .95rem; }
}

/* --------------------------------------------------------------------------
   3. FOOTER — iki lokasyon ayrı bloklarda
   -------------------------------------------------------------------------- */

.alt {
	margin-block-start: var(--bolum-bosluk);
	padding-block: clamp(2.75rem, 5vw, 4rem) 0;
	background: var(--kagit-katman);
	border-block-start: 1px solid var(--kabuk);
}

.alt__ic,
.alt__konumlar,
.alt__son {
	inline-size: min(100% - 2.5rem, var(--kap-genis));
	margin-inline: auto;
}

.alt__ic {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.75rem, 4vw, 3.5rem);
}

.wordmark--alt { margin: 0 0 .85rem; font-size: 1.22rem; }

.alt__aciklama {
	margin: 0 0 1rem;
	font-size: .93rem;
	color: var(--murekkep-soluk);
	max-width: 44ch;
}

.alt__sosyal {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem .9rem;
	margin: 1.1rem 0 0;
	padding: 0;
	list-style: none;
}

.alt__sosyal a {
	font-size: .88rem;
	color: var(--murekkep-yardimci);
	text-decoration: none;
	border-block-end: 1px solid var(--kabuk-koyu);
	padding-block-end: 1px;
}

.alt__sosyal a:hover { color: var(--isik-koyu); border-block-end-color: var(--isik); }

.alt__baslik {
	font-family: var(--yazi-govde);
	font-size: var(--y-etiket);
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--murekkep-yardimci);
	margin: 0 0 .9rem;
}

.alt__menu { margin: 0; padding: 0; list-style: none; display: grid; gap: .52rem; }

.alt__menu a {
	font-size: .945rem;
	color: var(--murekkep-soluk);
	text-decoration: none;
	transition: color var(--gecis-hizli);
}

.alt__menu a:hover { color: var(--isik-koyu); }

/* --- Konumlar --------------------------------------------------------- */

.alt__konumlar {
	margin-block-start: clamp(2rem, 4vw, 3rem);
	padding-block-start: clamp(1.5rem, 3vw, 2.25rem);
	border-block-start: 1px solid var(--kabuk);
}

.alt__baslik--konum { margin-block-end: 1.1rem; }

.konumlar {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1rem, 3vw, 2.5rem);
}

.konum {
	display: grid;
	gap: .3rem;
	font-style: normal;
	padding-inline-start: 1rem;
	border-inline-start: 2px solid var(--kabuk-koyu);
}

.konum:first-child { border-inline-start-color: var(--isik); }

.konum__ad {
	font-family: var(--yazi-baslik);
	font-size: 1.06rem;
	font-weight: 600;
	color: var(--murekkep);
}

.konum__adres { font-size: .93rem; color: var(--murekkep-soluk); max-width: 34ch; }

.konum__tel {
	font-size: 1rem;
	font-weight: 600;
	color: var(--isik-koyu);
	text-decoration: none;
	margin-block-start: .15rem;
	justify-self: start;
}

.konum__tel:hover { text-decoration: underline; }

.konum__harita {
	font-size: .88rem;
	color: var(--murekkep-yardimci);
	text-decoration: none;
	border-block-end: 1px solid var(--kabuk-koyu);
	justify-self: start;
}

.konum__harita:hover { color: var(--isik-koyu); }

/* --- Alt şerit --------------------------------------------------------- */

.alt__son {
	margin-block-start: clamp(2rem, 4vw, 3rem);
	padding-block: 1.35rem 1.6rem;
	border-block-start: 1px solid var(--kabuk);
}

.alt__uyari {
	margin: 0 0 .85rem;
	font-size: .85rem;
	color: var(--murekkep-yardimci);
	max-width: 78ch;
}

.alt__son-satir {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.alt__telif { margin: 0; font-size: .85rem; color: var(--murekkep-yardimci); }

.alt__yasal { display: flex; gap: 1.1rem; margin: 0; padding: 0; list-style: none; }

.alt__yasal a { font-size: .85rem; color: var(--murekkep-yardimci); text-decoration: none; }
.alt__yasal a:hover { color: var(--isik-koyu); }

@media (max-width: 900px) {
	.alt__ic { grid-template-columns: 1fr 1fr; }
	.alt__marka { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
	.alt__ic { grid-template-columns: 1fr; }
	.konumlar { grid-template-columns: 1fr; gap: 1.5rem; }
	.alt { padding-block-end: 5.5rem; }
}

/* --------------------------------------------------------------------------
   4. MOBİL ALT ÇUBUK — ekranı kaplamaz, tek satır
   -------------------------------------------------------------------------- */

.mobil-bar { display: none; }

@media (max-width: 780px) {
	.mobil-bar {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		position: fixed;
		inset-block-end: 0;
		inset-inline: 0;
		z-index: 55;
		background: rgba(251, 248, 243, .96);
		backdrop-filter: blur(8px);
		border-block-start: 1px solid var(--kabuk);
		padding-block-end: env(safe-area-inset-bottom);
	}

	.mobil-bar a {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: .4rem;
		padding-block: .95rem;
		font-size: .9rem;
		font-weight: 600;
		color: var(--murekkep);
		text-decoration: none;
	}

	.mobil-bar a + a { border-inline-start: 1px solid var(--kabuk); }

	/* Ucuncu hucre birincil eylem: DOLU zemin + acik metin.
	   (Cekirdek zaten dolu zemin veriyordu; metin rengi ayni tona kalinca
	   kaybolmustu — beyaza cevrildi, 6.0:1.) */
	.mobil-bar a:last-child {
		background: var(--isik-koyu);
		color: var(--renk-vurgu-metin);
		border-inline-start-color: var(--isik-koyu);
	}

	.mobil-bar a:last-child svg { color: currentColor; }

	body.menu-acik .mobil-bar { display: none; }
}

/* --------------------------------------------------------------------------
   5. İZYOLU
   -------------------------------------------------------------------------- */

.izyolu { margin-block-end: 1.35rem; }

.izyolu__liste {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .3rem .55rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: .84rem;
	color: var(--murekkep-yardimci);
}

.izyolu__oge + .izyolu__oge::before {
	content: '';
	display: inline-block;
	inline-size: .3rem;
	block-size: .3rem;
	margin-inline-end: .55rem;
	border-inline-end: 1.2px solid var(--kabuk-koyu);
	border-block-start: 1.2px solid var(--kabuk-koyu);
	rotate: 45deg;
	translate: 0 -.05em;
}

.izyolu a { color: var(--murekkep-yardimci); text-decoration: none; }
.izyolu a:hover { color: var(--isik-koyu); text-decoration: underline; }
.izyolu [aria-current='page'] { color: var(--murekkep-soluk); }

/* --------------------------------------------------------------------------
   6. İÇİNDEKİLER — ilk anlamlı başlıktan sonra, tepeyi kaplamaz
   -------------------------------------------------------------------------- */

.icindekiler {
	margin-block: 1.85rem;
	padding: 1.15rem 1.35rem;
	background: var(--kagit-isik);
	border: 1px solid var(--kabuk);
	border-radius: var(--kose-kart);
}

.icindekiler > summary {
	font-family: var(--yazi-govde);
	font-size: var(--y-etiket);
	font-weight: 700;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--murekkep-yardimci);
	cursor: pointer;
	list-style: none;
}

.icindekiler > summary::-webkit-details-marker { display: none; }

.icindekiler > summary::after {
	content: '';
	float: right;
	inline-size: .45rem;
	block-size: .45rem;
	border-inline-end: 1.5px solid currentColor;
	border-block-end: 1.5px solid currentColor;
	rotate: 45deg;
	translate: 0 .25em;
	transition: rotate var(--gecis);
}

.icindekiler[open] > summary::after { rotate: -135deg; translate: 0 .5em; }

.icindekiler ol,
.icindekiler ul {
	margin: .95rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: .48rem;
	counter-reset: toc;
}

.icindekiler li { counter-increment: toc; }

.icindekiler a {
	display: block;
	font-size: .95rem;
	color: var(--murekkep-soluk);
	text-decoration: none;
	padding-inline-start: 1.9rem;
	position: relative;
	transition: color var(--gecis-hizli);
}

.icindekiler a::before {
	content: counter(toc, decimal-leading-zero);
	position: absolute;
	inset-inline-start: 0;
	font-family: var(--yazi-baslik);
	font-size: .8rem;
	color: var(--murekkep-yardimci);
}

.icindekiler a:hover,
.icindekiler a.acik { color: var(--isik-koyu); }
.icindekiler a.acik::before { color: var(--isik); }

/* --------------------------------------------------------------------------
   7. VIDEO
   Cekirdegin markup'i KORUNUR (.youtube__*, .video__*) — modal ve tiklayinca
   yukleme davranisi calismaya devam etsin diye. Burada yalniz gorsel dil
   Portakal'a cevriliyor. YotuWP kaldirilmaz/pasiflestirilmez; bu bilesen EK'tir.
   -------------------------------------------------------------------------- */

.youtube__izgara {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: clamp(1rem, 2vw, 1.6rem);
	list-style: none;
	margin: 0;
	padding: 0;
}

.youtube__oge { display: flex; flex-direction: column; gap: .7rem; }

.video {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: var(--kose-kart);
	overflow: hidden;
	background: var(--kagit-katman);
	border: 1px solid var(--kabuk);
}

.video__kapak { inline-size: 100%; block-size: 100%; object-fit: cover; }

.video__dugme {
	position: absolute;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
	padding: 0;
	background: none;
	border: 0;
	cursor: pointer;
}

.video__ikon {
	position: absolute;
	inset-block-end: .65rem;
	inset-inline-start: .65rem;
	inline-size: 2.5rem;
	block-size: 2.5rem;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: rgba(251, 248, 243, .92);
	border: 1px solid var(--kabuk-koyu);
	transition: background var(--gecis), border-color var(--gecis);
}

.video__ikon::before {
	content: '';
	inline-size: 0;
	block-size: 0;
	border-inline-start: .62rem solid var(--isik-koyu);
	border-block-start: .4rem solid transparent;
	border-block-end: .4rem solid transparent;
	margin-inline-start: .18rem;
}

.video__dugme:hover .video__ikon,
.video__dugme:focus-visible .video__ikon { background: #fff; border-color: var(--isik); }

.youtube__baslik {
	font-family: var(--yazi-baslik);
	font-size: 1.02rem;
	font-weight: 500;
	line-height: 1.32;
	margin: 0;
}

.youtube__baslik a { color: inherit; text-decoration: none; }
.youtube__baslik a:hover { color: var(--isik-koyu); }

.youtube__tarih { margin: 0; font-size: .84rem; color: var(--murekkep-yardimci); }

.youtube__oge--kisa .video::after {
	content: 'Kisa';
	position: absolute;
	inset-block-start: .6rem;
	inset-inline-end: .6rem;
	padding: .1rem .45rem;
	border-radius: 3px;
	background: rgba(251, 248, 243, .92);
	border: 1px solid var(--kabuk-koyu);
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--yaprak);
}

.videolar__kanal { margin-block-start: 1.75rem; }

@media (max-width: 1024px) { .youtube__izgara { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .youtube__izgara { grid-template-columns: 1fr; } }

/* --------------------------------------------------------------------------
   8. HASTA GÖRÜŞLERİ
   Rakam tasarıma GÖMÜLMEZ; veri yoksa bölüm hiç basılmaz (PHP tarafında).
   Her yorum: metin + ad + puan + tarih + KAYNAK (hangi konum).
   -------------------------------------------------------------------------- */

.gorusler {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(1rem, 2vw, 1.5rem);
	align-items: start;
}

.gorus {
	display: flex;
	flex-direction: column;
	gap: .8rem;
	padding: 1.5rem;
	background: rgba(255, 255, 255, .5);
	border: 1px solid var(--kabuk);
	border-radius: var(--kose-kart);
	block-size: 100%;
}

.gorus__ust { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }

/* Yıldız — bakır, parlak sarı değil. Ekran okuyucuya metin karşılığı var. */
.gorus__yildiz { color: var(--isik); font-size: .95rem; letter-spacing: .08em; }

.gorus__kaynak {
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .05em;
	color: var(--murekkep-yardimci);
	padding: .14rem .45rem;
	border: 1px solid var(--kabuk);
	border-radius: 3px;
	white-space: nowrap;
}

.gorus__metin { margin: 0; font-size: .97rem; color: var(--murekkep); }

.gorus__alt { display: flex; align-items: center; gap: .7rem; margin-block-start: auto; }

.gorus__avatar {
	inline-size: 2.4rem;
	block-size: 2.4rem;
	border-radius: 50%;
	object-fit: cover;
	background: var(--kagit-isik);
	display: grid;
	place-items: center;
	font-family: var(--yazi-baslik);
	font-size: .9rem;
	font-weight: 600;
	color: var(--isik-koyu);
	flex: none;
}

.gorus__kim { display: grid; gap: .1rem; }
.gorus__ad { font-weight: 600; font-size: .93rem; }
.gorus__kunye { font-size: .8rem; color: var(--murekkep-yardimci); }

@media (max-width: 1024px) { .gorusler { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .gorusler { grid-template-columns: 1fr; } }

.gorusler__ozet {
	display: flex;
	align-items: center;
	gap: .6rem;
	margin: .35rem 0 0;
	font-size: 1.05rem;
}

.gorusler__ozet strong {
	font-family: var(--yazi-baslik);
	font-size: 1.5rem;
	font-weight: 600;
}

.gorusler__eylem { margin-block-start: 1.75rem; }

.gorus__kunye a { color: inherit; text-decoration: underline; text-decoration-color: var(--kabuk-koyu); }
.gorus__kunye a:hover { color: var(--isik-koyu); }

/* --------------------------------------------------------------------------
   9. MİRAS İÇERİK UYUMU
   Yayınlanmış yazılarımızda "Hızlı Yanıt" kutuları SATIR İÇİ stille basılmış
   (#f0f9ff zemin + #0ea5e9 mavi kenar). Bu, eski temanın renk dünyasına
   göreydi; sıcak kâğıt paletinde yabancı duruyor.

   İçeriğe DOKUNULMUYOR — post_content aynen kalıyor. Yalnız sunum katmanında,
   TAM O renk değerlerini taşıyan kutular sıcak palete çevriliyor. Başka bir
   renkle basılmış blok bu kuraldan etkilenmez.

   Kalıcı çözüm (Faz 6/7): kutular tema kısa koduna taşınır, satır içi stil
   içerikten temizlenir. O iş içerik değişikliği olduğu için ONAY ister.
   -------------------------------------------------------------------------- */

.metin .wp-block-group[style*="#f0f9ff"],
.metin .wp-block-group[style*="#F0F9FF"] {
	background-color: var(--kagit-isik) !important;
	border-left-color: var(--isik) !important;
	border-left-width: 3px !important;
	border-radius: 0 var(--kose-kart) var(--kose-kart) 0;
}

/* Aynı partide kullanılan diğer bilgi kutusu tonları */
.metin .wp-block-group[style*="#fef3c7"],
.metin .wp-block-group[style*="#fffbeb"] {
	background-color: #fbf4e6 !important;
	border-left-color: var(--kabuk-koyu) !important;
	border-left-width: 3px !important;
}

.metin .wp-block-group[style*="#fee2e2"],
.metin .wp-block-group[style*="#fef2f2"] {
	background-color: #fbeee9 !important;
	border-left-color: #a2400f !important;
	border-left-width: 3px !important;
}

/* --------------------------------------------------------------------------
   10. BOLUM BASI — dikey ritim duzeltmesi
   Cekirdek h1/h2/p'ye margin veriyor; bolum basliginda .bolum__basi'nin
   `gap` degeriyle toplanip asiri bosluk yaratiyordu.
   -------------------------------------------------------------------------- */

.bolum__basi > * { margin-block: 0; }
.bolum__basi > .spot { margin-block-start: .2rem; }

/* Sayfa basligi (h1) bolum basliklarindan biraz daha nefes alsin */
.bolum__basi > h1 { margin-block-end: .15rem; }

/* --------------------------------------------------------------------------
   11. BÖLÜM BAŞI — yatay varyant (başlık solda, eylem sağda)
   -------------------------------------------------------------------------- */

.bolum__basi--yatay {
	flex-direction: row;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.bolum__basi--yatay > div { display: flex; flex-direction: column; gap: .55rem; }

@media (max-width: 700px) {
	.bolum__basi--yatay { flex-direction: column; align-items: flex-start; }
}


/* Açılır menüde grup başlığı (Odak alanları / Yöntemler ayrımı) */
.altmenu__baslik {
	padding: .55rem .7rem .3rem;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--murekkep-yardimci);
}

.altmenu__baslik + li a { padding-block-start: .35rem; }
.altmenu li + .altmenu__baslik { margin-block-start: .35rem; border-block-start: 1px solid var(--kabuk); padding-block-start: .7rem; }

/* --------------------------------------------------------------------------
   12. MİRAS GEO BLOKLARI (dmp-*)
   2026-07 GEO çalışmasında yazılara gömdüğümüz bloklar: in-content breadcrumb,
   Hızlı Yanıt (TL;DR), meta şeridi, sesli okuma. Kendi <style> etiketlerini
   taşıyorlar ve yeşil bir palete göre yazılmışlar.

   İÇERİK DEĞİŞMİYOR — yalnız görünüm sıcak palete çekiliyor ve temanın zaten
   sağladığı öğe (izyolu) gizleniyor. Kalıcı çözüm: blokları tema kısa koduna
   taşımak (içerik değişikliği → ONAY ister, Faz 6/7).
   -------------------------------------------------------------------------- */

/* İzyolu tema tarafından zaten basılıyor; içerikteki kopyası gizlenir.
   (Schema'daki BreadcrumbList de temadan geliyor, çift kalmasın.) */
.icerik .dmp-breadcrumb { display: none !important; }

/* Hızlı Yanıt — GEO için değerli, KALIYOR; yalnız rengi düzeltiliyor. */
.icerik .dmp-tldr {
	background: var(--kagit-isik) !important;
	border: 1px solid var(--kabuk) !important;
	border-inline-start: 3px solid var(--isik) !important;
	border-radius: 0 var(--kose-kart) var(--kose-kart) 0 !important;
	color: var(--murekkep) !important;
	box-shadow: none !important;
}

.icerik .dmp-tldr h2,
.icerik .dmp-tldr h3,
.icerik .dmp-tldr strong,
.icerik .dmp-tldr .dmp-tldr-title {
	color: var(--isik-koyu) !important;
	font-family: var(--yazi-govde) !important;
	font-size: var(--y-etiket) !important;
	font-weight: 700 !important;
	letter-spacing: .13em !important;
	text-transform: uppercase !important;
}

.icerik .dmp-tldr li::marker { color: var(--isik) !important; }

/* Meta şeridi (okuma süresi, güncelleme, hekim onayı) */
.icerik .dmp-meta > * {
	background: rgba(255, 255, 255, .55) !important;
	border: 1px solid var(--kabuk) !important;
	color: var(--murekkep-soluk) !important;
	border-radius: var(--kose) !important;
	font-family: var(--yazi-govde) !important;
}

.icerik .dmp-meta svg { color: var(--isik-koyu) !important; }

/* Sesli okuma bloğu */
.icerik .dmp-audio {
	background: rgba(255, 255, 255, .5) !important;
	border: 1px solid var(--kabuk) !important;
	border-radius: var(--kose-kart) !important;
}

.icerik .dmp-audio button,
.icerik .dmp-audio .dmp-audio-btn {
	background: var(--isik-koyu) !important;
	color: var(--renk-vurgu-metin) !important;
	border: 0 !important;
}

/* Yeşile çalan her türlü miras vurgu rengini sıcak tona çevir. */
.icerik [style*="#0a6d52"],
.icerik [style*="#0A6D52"] { color: var(--isik-koyu) !important; }

.icerik a[style*="#0a6d52"] { color: var(--isik-koyu) !important; }

/* Marka işareti (SVG logo) — header ve footer */
.marka--logo img { block-size: auto; inline-size: clamp(190px, 20vw, 250px); }
.ust--kompakt .marka--logo img { inline-size: clamp(160px, 16vw, 200px); transition: inline-size var(--gecis); }

/* Öne çıkan görseli olmayan yazılar için yer tutucu (2026-07-29, brief §11).
   Dosya indirilmez; sıcak palete uygun saf CSS doku. Kırık görsel ikonu
   ya da boş beyaz kutu göstermek yerine sessiz bir zemin. */
.kart__gorsel--bos {
	display: block;
	inline-size: 100%;
	aspect-ratio: 16 / 9;
	border-radius: var(--kose);
	background:
		repeating-linear-gradient(48deg, rgba(201, 88, 31, .045) 0 10px, transparent 10px 20px),
		var(--kagit-katman);
}

/* Önceki / sonraki yazı — aynı konu kümesinden (2026-07-29, brief §11). */
.yazi-gecis { margin-block: clamp(2rem, 4vw, 3rem) 0; }

.yazi-gecis__kap {
	display: grid;
	gap: .75rem;
	border-block: 1px solid var(--kabuk);
	padding-block: 1rem;
}

@media (min-width: 45rem) {
	.yazi-gecis__kap { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
	.yazi-gecis__bag--ileri { text-align: end; }
	/* Yalnız "sonraki" varsa sağa yaslansın, sol sütun boş kalmasın. */
	.yazi-gecis__bag--ileri:only-child { grid-column: 2; }
}

.yazi-gecis__bag {
	display: grid;
	gap: .2rem;
	text-decoration: none;
	color: inherit;
	padding-block: .35rem;
}

.yazi-gecis__etiket {
	font-size: .75rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--murekkep-yardimci);
}

.yazi-gecis__baslik {
	font-weight: var(--ag-baslik);
	line-height: 1.35;
	transition: color var(--gecis-hizli);
}

.yazi-gecis__bag:hover .yazi-gecis__baslik { color: var(--isik-koyu); }
.yazi-gecis__bag:focus-visible { outline: 2px solid var(--isik-koyu); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) { .yazi-gecis__baslik { transition: none; } }