/* ==========================================================================
   YENİKENT BÜLTEN TEMASI — İSKELET

   Bu dosya YALNIZCA temanın kendi parçalarını biçimlendirir: header,
   menü, footer, sayfa gövdesi, liste kartı. Sitenin geri kalanı
   (akış, profil, işletme, rehber, sektör) style.css'te — oraya
   dokunulmadı.

   HEADER NEDEN ÜÇ KATMAN
   ----------------------
   Eski header tek satırdı: logo + menü. Menüye başlık eklendikçe
   satır ikiye taşıyor ve düzen dağılıyordu. Haber sitelerinin
   çözümü katman ayırmak — her katmanın işi belli, biri büyüyünce
   diğeri bozulmuyor:

     üst şerit  → üyelik (giriş, kayıt, panel)
     orta       → kimlik (logo), arama, çağrı düğmeleri
     menü       → içerik başlıkları

   Menü uzarsa kendi çubuğunda kayar; logoyu ya da giriş düğmelerini
   itmez.
   ========================================================================== */

:root {
	--ybt-lacivert: #102033;
	--ybt-yesil: #1d6b56;
	--ybt-sari: #ffcf4a;
	--ybt-mavi: #2563eb;
	--ybt-metin: #111827;
	--ybt-soluk: #64748b;
	--ybt-cizgi: #e5e7eb;
	--ybt-zemin: #f8fafc;
	--ybt-kap: 1280px;
}

body.ybt-tema {
	margin: 0;
	background: var( --ybt-zemin );
	color: var( --ybt-metin );
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

.ybt-kap {
	max-width: var( --ybt-kap );
	margin: 0 auto;
	padding: 0 18px;
	width: 100%;
	box-sizing: border-box;
}

/* Klavyeyle gezenler için içeriğe atlama bağlantısı. */

.ybt-atla {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 999;
	background: var( --ybt-sari );
	color: #111827;
	padding: 12px 18px;
	border-radius: 0 0 12px 0;
	font-weight: 900;
	text-decoration: none;
}

.ybt-atla:focus {
	left: 0;
}

/* ==========================================================================
   1. KATMAN — üst şerit
   ========================================================================== */

.ybt-ust {
	background: var( --ybt-lacivert );
	color: rgba( 255, 255, 255, .78 );
	font-size: 13px;
}

.ybt-ust .ybt-kap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 38px;
}

.ybt-ust-sol {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}

.ybt-tarih {
	font-weight: 700;
	white-space: nowrap;
}

.ybt-slogan {
	color: rgba( 255, 255, 255, .5 );
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ybt-ust-sag,
.ybt-ust-menu {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ybt-ust-link,
.ybt-ust-menu a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: rgba( 255, 255, 255, .82 );
	text-decoration: none;
	font-weight: 700;
	padding: 8px 11px;
	border-radius: 8px;
	white-space: nowrap;
	transition: background .16s ease, color .16s ease;
}

.ybt-ust-link:hover,
.ybt-ust-menu a:hover {
	background: rgba( 255, 255, 255, .10 );
	color: #fff;
}

.ybt-ust-vurgu {
	background: var( --ybt-sari );
	color: #111827 !important;
}

.ybt-ust-vurgu:hover {
	background: #fff;
}

.ybt-rozet {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 999px;
	background: #ef4444;
	color: #fff;
	font-size: 11px;
	font-weight: 900;
	line-height: 1;
}

/* ==========================================================================
   2. KATMAN — logo, arama, düğmeler
   ========================================================================== */

.ybt-orta {
	background: #fff;
	border-bottom: 1px solid var( --ybt-cizgi );
}

.ybt-orta .ybt-kap {
	display: flex;
	align-items: center;
	gap: 24px;
	padding-top: 16px;
	padding-bottom: 16px;
}

.ybt-logo {
	flex: 0 0 auto;
	max-width: 240px;
}

.ybt-logo img,
.ybt-logo .custom-logo {
	display: block;
	max-height: 68px;
	width: auto;
	height: auto;
}

.ybt-logo-yazi {
	text-decoration: none;
	display: block;
}

.ybt-logo-yazi strong {
	display: block;
	font-size: 24px;
	font-weight: 900;
	color: var( --ybt-lacivert );
	letter-spacing: -.02em;
	line-height: 1.1;
}

.ybt-logo-yazi span {
	display: block;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var( --ybt-soluk );
	margin-top: 3px;
}

/* --- Arama --------------------------------------------------------------- */

.ybt-arama {
	flex: 1 1 auto;
	max-width: 480px;
	display: flex;
	align-items: center;
	background: var( --ybt-zemin );
	border: 1px solid var( --ybt-cizgi );
	border-radius: 999px;
	overflow: hidden;
	transition: border-color .16s ease, box-shadow .16s ease;
}

.ybt-arama:focus-within {
	border-color: var( --ybt-mavi );
	box-shadow: 0 0 0 3px rgba( 37, 99, 235, .12 );
}

.ybt-arama input {
	flex: 1;
	border: 0;
	background: none;
	padding: 12px 18px;
	font-size: 14.5px;
	font-weight: 600;
	color: var( --ybt-metin );
	outline: none;
	min-width: 0;
}

.ybt-arama button {
	border: 0;
	background: var( --ybt-lacivert );
	color: #fff;
	width: 42px;
	height: 42px;
	margin: 0 3px 0 0;
	border-radius: 999px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	transition: background .16s ease;
}

.ybt-arama button:hover {
	background: var( --ybt-yesil );
}

.ybt-arama svg {
	width: 18px;
	height: 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.2;
	stroke-linecap: round;
}

/* --- Düğmeler ------------------------------------------------------------ */

.ybt-orta-butonlar {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-left: auto;
	flex: 0 0 auto;
}

.ybt-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 18px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 900;
	text-decoration: none !important;
	white-space: nowrap;
	transition: transform .16s ease, background .16s ease, color .16s ease;
}

.ybt-btn-dolu {
	background: var( --ybt-yesil );
	color: #fff !important;
}

.ybt-btn-dolu:hover {
	background: var( --ybt-lacivert );
	transform: translateY( -1px );
}

.ybt-btn-cizgi {
	background: #fff;
	color: var( --ybt-lacivert ) !important;
	box-shadow: inset 0 0 0 2px var( --ybt-cizgi );
}

.ybt-btn-cizgi:hover {
	box-shadow: inset 0 0 0 2px var( --ybt-lacivert );
	transform: translateY( -1px );
}

/* --- Hamburger ----------------------------------------------------------- */

.ybt-hamburger {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var( --ybt-cizgi );
	border-radius: 12px;
	background: #fff;
	cursor: pointer;
	margin-left: auto;
	flex: 0 0 auto;
}

.ybt-hamburger span {
	display: block;
	width: 20px;
	height: 2px;
	margin: 0 auto;
	background: var( --ybt-lacivert );
	border-radius: 2px;
	transition: transform .18s ease, opacity .18s ease;
}

.ybt-hamburger[aria-expanded="true"] span:nth-child(1) {
	transform: translateY( 7px ) rotate( 45deg );
}

.ybt-hamburger[aria-expanded="true"] span:nth-child(2) {
	opacity: 0;
}

.ybt-hamburger[aria-expanded="true"] span:nth-child(3) {
	transform: translateY( -7px ) rotate( -45deg );
}

/* ==========================================================================
   3. KATMAN — ana menü çubuğu
   ========================================================================== */

.ybt-menu-cubugu {
	background: linear-gradient( 135deg, var( --ybt-lacivert ), var( --ybt-yesil ) );
	position: sticky;
	top: 0;

	/* Alt menü, sayfadaki hiçbir bölümün altında kalmamalı. */
	z-index: 300;
	box-shadow: 0 6px 20px rgba( 15, 23, 42, .14 );
}

.ybt-menu,
.ybt-menu-cubugu ul {
	display: flex;
	align-items: center;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * BURADA overflow-x:auto YOK — bilerek.
 *
 * İlk sürümde menü uzarsa kaysın diye konmuştu ama overflow, içindeki
 * açılır alt menüyü de KIRPIYORDU: alt menü aşağıdaki bölümün altında
 * kalıyor, yarısı görünmüyordu. Kaydırma yerine menü sığacak şekilde
 * daralıyor; dar ekranda zaten dikey panele dönüşüyor.
 */
.ybt-menu-cubugu > .ybt-kap {
	overflow: visible;
}

.ybt-menu > li {
	position: relative;
	flex: 0 0 auto;
}

.ybt-menu > li > a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: rgba( 255, 255, 255, .90 );
	text-decoration: none;
	font-size: 14.5px;
	font-weight: 800;
	padding: 15px clamp( 9px, 1.1vw, 16px );
	white-space: nowrap;
	border-bottom: 3px solid transparent;
	transition: color .16s ease, background .16s ease, border-color .16s ease;
}

.ybt-menu > li > a:hover,
.ybt-menu > li:focus-within > a {
	color: #fff;
	background: rgba( 255, 255, 255, .10 );
	border-bottom-color: var( --ybt-sari );
}

.ybt-menu > li.ybt-menu-aktif > a,
.ybt-menu > li.current-menu-item > a {
	color: #fff;
	border-bottom-color: var( --ybt-sari );
}

.ybt-menu svg {
	width: 13px;
	height: 13px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.6;
	stroke-linecap: round;
	stroke-linejoin: round;
	opacity: .75;
}

/* --- Açılır alt menü ----------------------------------------------------- */

.ybt-alt-menu,
.ybt-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 230px;
	background: #fff;
	border-radius: 0 0 16px 16px;
	box-shadow: 0 18px 40px rgba( 15, 23, 42, .18 );
	padding: 8px;
	z-index: 310;
	display: block;
	flex-direction: column;
	align-items: stretch;
	gap: 0;

	/* Görünmez ama okunabilir: ekran okuyucular menüyü bulabiliyor. */
	opacity: 0;
	visibility: hidden;
	transform: translateY( -6px );
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
}

.ybt-menu > li:hover > .ybt-alt-menu,
.ybt-menu > li:focus-within > .ybt-alt-menu,
.ybt-menu > li:hover > .sub-menu,
.ybt-menu > li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY( 0 );
}

.ybt-alt-menu li,
.ybt-menu .sub-menu li {
	display: block;
	width: 100%;
}

.ybt-alt-menu a,
.ybt-menu .sub-menu a {
	display: block;
	padding: 10px 13px;
	border-radius: 10px;
	color: var( --ybt-lacivert );
	text-decoration: none;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
}

.ybt-alt-menu a:hover,
.ybt-menu .sub-menu a:hover {
	background: var( --ybt-zemin );
	color: var( --ybt-yesil );
}

/* ==========================================================================
   Sayfa gövdesi
   ========================================================================== */

.site-content {
	padding: 26px 0 50px;
	min-height: 45vh;
}

.ybt-sayfa-basligi {
	font-size: clamp( 26px, 3.4vw, 36px );
	line-height: 1.16;
	margin: 0 0 22px;
	color: var( --ybt-lacivert );
	letter-spacing: -.02em;
}

.ybt-liste-duzen {
	display: grid;
	grid-template-columns: minmax( 0, 1fr ) 336px;
	gap: 28px;
	align-items: start;
}

.ybt-bos,
.ybt-arama-sayi {
	color: var( --ybt-soluk );
	font-weight: 700;
}

.ybt-arsiv-aciklama {
	color: var( --ybt-soluk );
	margin-bottom: 22px;
}

/* --- Liste kartı --------------------------------------------------------- */

.ybt-kart {
	display: grid;
	grid-template-columns: 240px minmax( 0, 1fr );
	gap: 20px;
	background: #fff;
	border: 1px solid var( --ybt-cizgi );
	border-radius: 20px;
	padding: 18px;
	margin-bottom: 18px;
	box-shadow: 0 10px 26px rgba( 15, 23, 42, .06 );
}

.ybt-kart:only-child,
.ybt-kart:not(:has(.ybt-kart-gorsel)) {
	grid-template-columns: 1fr;
}

.ybt-kart-gorsel {
	display: block;
	border-radius: 14px;
	overflow: hidden;
	background: var( --ybt-zemin );
}

.ybt-kart-gorsel img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 150px;
	object-fit: cover;
}

.ybt-kart-meta {
	display: flex;
	gap: 8px;
	font-size: 12.5px;
	font-weight: 800;
	color: var( --ybt-soluk );
	margin-bottom: 8px;
}

.ybt-kart-meta span:not(:last-child)::after {
	content: "·";
	margin-left: 8px;
}

.ybt-kart-baslik {
	margin: 0 0 8px;
	font-size: 21px;
	line-height: 1.25;
}

.ybt-kart-baslik a {
	color: var( --ybt-lacivert );
	text-decoration: none;
}

.ybt-kart-baslik a:hover {
	color: var( --ybt-yesil );
}

.ybt-kart-ozet {
	margin: 0 0 12px;
	color: #475569;
}

.ybt-kart-devam {
	display: inline-flex;
	color: var( --ybt-mavi );
	font-weight: 900;
	text-decoration: none;
}

/* --- 404 ----------------------------------------------------------------- */

.ybt-404 {
	background: #fff;
	border: 1px solid var( --ybt-cizgi );
	border-radius: 24px;
	padding: 48px 30px;
	text-align: center;
	max-width: 640px;
	margin: 30px auto;
	box-shadow: 0 12px 30px rgba( 15, 23, 42, .07 );
}

.ybt-404 > span {
	display: block;
	font-size: 64px;
	font-weight: 900;
	color: var( --ybt-sari );
	line-height: 1;
}

.ybt-404 h1 {
	font-size: 26px;
	margin: 12px 0 8px;
	color: var( --ybt-lacivert );
}

.ybt-404 p {
	color: var( --ybt-soluk );
	margin: 0 0 22px;
}

.ybt-404-butonlar {
	display: flex;
	gap: 10px;
	justify-content: center;
	flex-wrap: wrap;
	margin-bottom: 24px;
}

/* ==========================================================================
   ALT BİLGİ

   İlk sütun WIDGET ALANI DEĞİL, temanın kendi marka bloğu. Sebebi:
   WordPress tema değiştirirken eski temanın widget'larını yeni temanın
   ilk kayıtlı alanına taşıyor — GeneratePress'ten devralınan
   "Arşivler / Kategoriler" listeleri tam da oraya düşüp alt bilgiyi
   bozuyordu. Marka bloğu artık koda gömülü; widget alanları isteğe
   bağlı ve ayrı bir satırda.
   ========================================================================== */

.ybt-footer {
	background: var( --ybt-lacivert );
	color: rgba( 255, 255, 255, .72 );
	margin-top: 48px;
}

.ybt-footer-ust {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1fr;
	gap: 40px;
	padding-top: 52px;
	padding-bottom: 42px;
}

/* --- Marka sütunu -------------------------------------------------------- */

.ybt-footer-logo {
	display: inline-block;
	background: #fff;
	border-radius: 14px;
	padding: 12px 16px;
	margin-bottom: 18px;
	line-height: 0;
}

.ybt-footer-logo img {
	display: block;
	max-width: 170px;
	width: auto;
	height: auto;
	max-height: 56px;
}

.ybt-footer-ad {
	color: #fff;
	font-size: 21px;
	margin: 0 0 14px;
}

.ybt-footer-marka p {
	margin: 0 0 20px;
	font-size: 14.5px;
	line-height: 1.7;
	max-width: 340px;
}

.ybt-footer-sayilar {
	display: flex;
	gap: 10px;
	margin-bottom: 20px;
}

.ybt-footer-sayilar div {
	flex: 1;
	max-width: 150px;
	background: rgba( 255, 255, 255, .07 );
	border: 1px solid rgba( 255, 255, 255, .13 );
	border-radius: 14px;
	padding: 12px 14px;
}

.ybt-footer-sayilar strong {
	display: block;
	color: #fff;
	font-size: 21px;
	font-weight: 900;
	line-height: 1;
	margin-bottom: 4px;
}

.ybt-footer-sayilar span {
	font-size: 12px;
	font-weight: 700;
	color: rgba( 255, 255, 255, .62 );
}

.ybt-footer-cta {
	display: inline-flex;
	align-items: center;
	background: var( --ybt-sari );
	color: #111827 !important;
	font-weight: 900;
	font-size: 14px;
	padding: 12px 20px;
	border-radius: 999px;
	text-decoration: none !important;
	transition: transform .16s ease, background .16s ease;
}

.ybt-footer-cta:hover {
	background: #fff;
	transform: translateY( -2px );
}

/* --- Bağlantı sütunları -------------------------------------------------- */

.ybt-footer h3 {
	color: #fff;
	font-size: 15px;
	font-weight: 900;
	letter-spacing: .04em;
	margin: 0 0 16px;
	padding-bottom: 10px;
	border-bottom: 2px solid rgba( 255, 255, 255, .12 );
}

.ybt-footer-sutun ul,
.ybt-footer-widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 11px;
}

.ybt-footer a {
	color: rgba( 255, 255, 255, .76 );
	text-decoration: none;
	font-weight: 600;
	font-size: 14.5px;
	transition: color .16s ease;
}

.ybt-footer-sutun a:hover,
.ybt-footer-widget a:hover {
	color: var( --ybt-sari );
}

/* --- Sektör şeridi ------------------------------------------------------- */

.ybt-footer-sektorler {
	display: flex;
	align-items: baseline;
	gap: 16px;
	flex-wrap: wrap;
	padding-top: 22px;
	padding-bottom: 22px;
	border-top: 1px solid rgba( 255, 255, 255, .10 );
}

.ybt-footer-sektorler > span {
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: rgba( 255, 255, 255, .45 );
	flex: 0 0 auto;
}

.ybt-footer-sektorler > div {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.ybt-footer-sektorler a {
	display: inline-flex;
	background: rgba( 255, 255, 255, .07 );
	border: 1px solid rgba( 255, 255, 255, .13 );
	border-radius: 999px;
	padding: 7px 13px;
	font-size: 13px;
	font-weight: 700;
	color: rgba( 255, 255, 255, .82 );
}

.ybt-footer-sektorler a:hover {
	background: var( --ybt-sari );
	border-color: var( --ybt-sari );
	color: #111827;
}

/* --- İsteğe bağlı widget alanları ---------------------------------------- */

.ybt-footer-widgetlar {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 220px, 1fr ) );
	gap: 32px;
	padding-top: 30px;
	padding-bottom: 30px;
	border-top: 1px solid rgba( 255, 255, 255, .10 );
}

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

.ybt-footer-alt {
	border-top: 1px solid rgba( 255, 255, 255, .12 );
	padding: 16px 0;
	background: rgba( 0, 0, 0, .18 );
}

.ybt-footer-alt .ybt-kap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.ybt-footer-alt .site-info {
	margin: 0;
	font-size: 13.5px;
	color: rgba( 255, 255, 255, .55 );
}

.ybt-yukari {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 12px;
	background: rgba( 255, 255, 255, .09 );
	border: 1px solid rgba( 255, 255, 255, .14 );
	flex: 0 0 auto;
}

.ybt-yukari svg {
	width: 18px;
	height: 18px;
	fill: none;
	stroke: rgba( 255, 255, 255, .8 );
	stroke-width: 2.4;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ybt-yukari:hover {
	background: var( --ybt-sari );
	border-color: var( --ybt-sari );
}

.ybt-yukari:hover svg {
	stroke: #111827;
}

/* ==========================================================================
   Duyarlı
   ========================================================================== */

@media ( max-width: 1080px ) {
	.ybt-liste-duzen {
		grid-template-columns: 1fr;
	}
}

@media ( max-width: 980px ) {
	.ybt-orta-butonlar {
		display: none;
	}

	.ybt-hamburger {
		display: flex;
	}

	.ybt-arama {
		max-width: none;
	}

	/* Menü mobilde açılır panel olur. */
	.ybt-menu-cubugu {
		position: static;
		display: none;
	}

	.ybt-menu-cubugu.ybt-acik {
		display: block;
	}



	.ybt-menu {
		flex-direction: column;
		align-items: stretch;
		padding: 8px 0;
	}

	.ybt-menu > li > a {
		padding: 13px 4px;
		border-bottom: 1px solid rgba( 255, 255, 255, .12 );
		justify-content: space-between;
	}

	/*
	 * ALT MENÜLER KAPALI BAŞLAR
	 *
	 * Buradaki seçicilerin ".ybt-menu-cubugu" ile başlaması şart.
	 * Menü çubuğunun genel kuralı ".ybt-menu-cubugu ul { display:flex }"
	 * ve o kural, sade ".ybt-alt-menu"den daha ağır basıyor: mobilde
	 * "display:none" yazsak da alt menüler açık kalıyordu. Masaüstünde
	 * fark edilmiyordu, çünkü orada alt menü opacity/visibility ile
	 * gizleniyor.
	 */
	.ybt-menu-cubugu .ybt-alt-menu,
	.ybt-menu-cubugu .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		background: rgba( 0, 0, 0, .16 );
		box-shadow: none;
		border-radius: 12px;
		margin: 0 0 8px;
		display: none;
	}

	.ybt-menu-cubugu .ybt-menu > li.ybt-alt-acik > .ybt-alt-menu,
	.ybt-menu-cubugu .ybt-menu > li.ybt-alt-acik > .sub-menu {
		display: block;
	}

	.ybt-alt-menu a,
	.ybt-menu .sub-menu a {
		color: rgba( 255, 255, 255, .88 );
	}

	.ybt-alt-menu a:hover,
	.ybt-menu .sub-menu a:hover {
		background: rgba( 255, 255, 255, .10 );
		color: #fff;
	}

	.ybt-footer-ust {
		grid-template-columns: 1fr 1fr;
		gap: 30px;
	}

	.ybt-footer-marka {
		grid-column: 1 / -1;
	}

	.ybt-kart {
		grid-template-columns: 1fr;
	}
}

@media ( max-width: 640px ) {
	.ybt-slogan {
		display: none;
	}

	.ybt-orta .ybt-kap {
		flex-wrap: wrap;
		gap: 12px;
	}

	.ybt-arama {
		order: 3;
		flex-basis: 100%;
	}

	.ybt-logo-yazi strong {
		font-size: 20px;
	}

	.ybt-footer-ust {
		grid-template-columns: 1fr;
		gap: 26px;
	}

	.ybt-footer-alt .ybt-kap {
		flex-direction: column;
		text-align: center;
	}

	.ybt-footer-sektorler {
		flex-direction: column;
		gap: 10px;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.ybt-btn,
	.ybt-menu > li > a,
	.ybt-alt-menu,
	.ybt-hamburger span,
	.ybt-arama {
		transition: none;
	}
}

/* ==========================================================================
   Yönetici çubuğu

   WordPress oturum açmış yöneticiye ekranın en üstünde 32px'lik sabit
   bir çubuk koyuyor. Yapışkan menü top:0 ile onun ALTINDA kalıyordu.
   ========================================================================== */

body.admin-bar .ybt-menu-cubugu {
	top: 32px;
}

@media ( max-width: 782px ) {
	body.admin-bar .ybt-menu-cubugu {
		top: 46px;
	}
}

/* ==========================================================================
   MOBİLDE KENAR BOŞLUKLARI

   Masaüstünde 18px'lik yan boşluk doğru duruyor; 360px'lik telefonda
   ise ekranın onda birini yiyor ve kartlar ince uzun görünüyordu.
   Dar ekranda daraltılıyor.
   ========================================================================== */

@media ( max-width: 640px ) {
	.ybt-kap {
		padding-left: 12px;
		padding-right: 12px;
	}

	.site-content {
		padding-top: 18px;
		padding-bottom: 34px;
	}
}

@media ( max-width: 400px ) {
	.ybt-kap {
		padding-left: 10px;
		padding-right: 10px;
	}
}

/*
 * Hiçbir şey ekranın dışına taşmasın. Uzun bir düğme metni ya da
 * kırılamayan bir bağlantı, sayfanın tamamını yana kaydırıyordu.
 */
body.ybt-tema {
	overflow-x: hidden;
}

.site-content img,
.site-content table {
	max-width: 100%;
}

/* --------------------------------------------------------------------------
   İŞLETME PROFİLİ — TANITIM VİDEOSU

   Eski stilde yalnızca "width: 100%" vardı. WordPress'in oEmbed'i
   iframe'e 500x281 ölçüsünü öznitelik olarak yazıyor; genişlik yüzdeye
   çekilince yükseklik 281 pikselde kalıyordu. Video, 983 piksel
   genişliğinde 281 piksel yüksekliğinde bir yarığa sıkışıyor, üstünde
   ve altında siyah bantlar oluşuyordu.

   Paylaşım sayfasındaki videoda oran kuralı zaten vardı; işletme
   profilinde unutulmuş. Aynı kural buraya da geliyor.
   -------------------------------------------------------------------------- */

.yk-video-wrap iframe,
.yk-video-wrap embed,
.yk-video-wrap object,
.yk-video-wrap video {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border: 0;
	border-radius: 14px;
	background: #000;
}

@media ( max-width: 768px ) {
	.yk-video-wrap iframe,
	.yk-video-wrap embed,
	.yk-video-wrap object,
	.yk-video-wrap video {
		border-radius: 10px;
	}
}

/* --------------------------------------------------------------------------
   MOBİLDE ÜST ÜSTE BİNEN KENAR BOŞLUKLARI

   Eski Ek CSS, GeneratePress için yazılmıştı: orada sayfayı ortalayan
   bir kapsayıcı yoktu, bu yüzden .site-content ve .inside-article'a
   8'er piksel !important boşluk veriliyordu. Yeni temada bu işi zaten
   .ybt-kap yapıyor; ikisi üst üste binince 375 piksellik bir ekranda
   yanlarda toplam 100 piksel gidiyor, kutular ince uzun kalıyordu.

   Dar ekranda tek gutter bırakılıyor: .ybt-kap'ınki.
   -------------------------------------------------------------------------- */

@media ( max-width: 768px ) {
	body.ybt-tema .site-content,
	body.ybt-tema .inside-article {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	body.ybt-tema .yk-business-card,
	body.ybt-tema .yk-business-video,
	body.ybt-tema .yk-business-private,
	body.ybt-tema .yk-business-gallery,
	body.ybt-tema .yk-business-posts {
		margin-left: 0;
		margin-right: 0;
	}
}


/* --------------------------------------------------------------------------
   DÜĞME ŞERİDİ BEŞ DÜĞMEYE ÇIKTI (1.3.1)

   Yönetim ve İletişim eklenince şerit üç değil beş düğme taşıyor. Dar
   masaüstünde logo ve aramayı ezmemesi için düğmeler biraz daraldı ve
   gerekirse alt satıra iniyor.
   -------------------------------------------------------------------------- */

.ybt-orta-butonlar {
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px;
}

.ybt-orta-butonlar .ybt-btn {
	padding: 9px 14px;
	font-size: 13.5px;
}

.ybt-btn-yonetim {
	border-color: #cbd5e1;
	color: var( --ybt-soluk );
}

@media ( max-width: 1180px ) {
	.ybt-orta-butonlar .ybt-btn {
		padding: 8px 12px;
		font-size: 13px;
	}
}