/* ==========================================================================
   Kabrim teması — ana stil dosyası
   Geliştirici: Zohi (zohi.tr)
   ========================================================================== */

:root {
	--kbr-koyu: #10263a;
	--kbr-koyu-2: #0a1a29;
	--kbr-altin: #c8992f;
	--kbr-yaprak: #3f6b4f;
	--kbr-krem: #f6f2ea;
	--kbr-yazi: #22303a;
	--kbr-koyu-rgb: 16, 38, 58;
	--kbr-altin-rgb: 200, 153, 47;

	--kbr-beyaz: #ffffff;
	--kbr-gri: #6b7885;
	--kbr-cizgi: rgba(var(--kbr-koyu-rgb), 0.12);
	--kbr-golge: 0 18px 44px rgba(var(--kbr-koyu-rgb), 0.1);
	--kbr-golge-yumusak: 0 6px 18px rgba(var(--kbr-koyu-rgb), 0.07);
	--kbr-radius: 4px;
	--kbr-kap: 1180px;
	--kbr-serif: "Cormorant Garamond", "Times New Roman", Georgia, serif;
	--kbr-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Temel ------------------------------------------------------------------ */

*,
*::before,
*::after { box-sizing: border-box; }

body.kbr {
	margin: 0;
	font-family: var(--kbr-sans);
	font-size: 16px;
	line-height: 1.7;
	color: var(--kbr-yazi);
	background: var(--kbr-beyaz);
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

.kbr img { max-width: 100%; height: auto; display: block; }
.kbr a { color: var(--kbr-koyu); text-decoration: none; transition: color .2s ease; }
.kbr a:hover { color: var(--kbr-altin); }
.kbr h1, .kbr h2, .kbr h3, .kbr h4 { font-family: var(--kbr-serif); font-weight: 600; line-height: 1.18; margin: 0 0 .5em; letter-spacing: .2px; }
.kbr p { margin: 0 0 1em; }
.kbr ul { margin: 0; padding: 0; list-style: none; }

.kbr .kbr-atla {
	position: absolute; left: -9999px; top: 0; z-index: 999;
	background: var(--kbr-koyu); color: #fff; padding: 10px 18px;
}
.kbr .kbr-atla:focus { left: 12px; top: 12px; }

.kbr :focus-visible { outline: 2px solid var(--kbr-altin); outline-offset: 3px; }

.kbr-kap { width: 100%; max-width: var(--kbr-kap); margin: 0 auto; padding: 0 24px; }

.kbr-bolum { padding: 92px 0; position: relative; }
.kbr-bolum-krem { background: var(--kbr-krem); }
.kbr-bolum-koyu { background: var(--kbr-koyu); color: rgba(255, 255, 255, .84); }
.kbr-bolum-koyu h2,
.kbr-bolum-koyu h3 { color: #fff; }
.kbr-bolum-koyu a { color: #fff; }

/* Tipografi bileşenleri --------------------------------------------------- */

.kbr-etiket {
	display: inline-block;
	font-family: var(--kbr-sans);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--kbr-yaprak);
	margin-bottom: 14px;
	position: relative;
	padding-left: 34px;
}
.kbr-etiket::before {
	content: "";
	position: absolute; left: 0; top: 50%;
	width: 24px; height: 1px;
	background: var(--kbr-altin);
}
.kbr-etiket-acik { color: var(--kbr-altin); }

.kbr-baslik { font-size: clamp(28px, 3.4vw, 44px); color: var(--kbr-koyu); }
.kbr-bolum-koyu .kbr-baslik { color: #fff; }

.kbr-bolum-basligi { max-width: 760px; margin: 0 0 52px; }
.kbr-hiza-orta { text-align: center; }
.kbr-hiza-orta.kbr-bolum-basligi { margin-left: auto; margin-right: auto; }
.kbr-hiza-orta .kbr-etiket { padding-left: 0; }
.kbr-hiza-orta .kbr-etiket::before { display: none; }
.kbr-bolum-metin { font-size: 17px; color: var(--kbr-gri); margin: 0; }
.kbr-bolum-koyu .kbr-bolum-metin { color: rgba(255, 255, 255, .72); }

/* Kazıma etkisi — mermer üzerine işlenmiş yazı hissi */
.kbr-kazima {
	color: #f3ede2;
	text-shadow: 0 1px 0 rgba(0, 0, 0, .55), 0 -1px 0 rgba(255, 255, 255, .12);
}

/* Butonlar --------------------------------------------------------------- */

/* Not: Buton kuralları `.kbr` ile başlar. Aksi halde `.kbr a` seçicisi
   (sınıf + eleman) buton renklerini ezer ve yazılar görünmez olur. */
.kbr .kbr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 15px 28px;
	font-family: var(--kbr-sans);
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	border: 1px solid transparent;
	border-radius: var(--kbr-radius);
	cursor: pointer;
	transition: transform .18s ease, background .2s ease, color .2s ease, box-shadow .2s ease;
	text-align: center;
	text-decoration: none;
}
.kbr .kbr-btn em { font-style: normal; opacity: .78; font-weight: 500; }
.kbr .kbr-btn:hover { transform: translateY(-2px); }

/* Altın buton: her zemin üzerinde koyu yazı */
.kbr .kbr-btn-altin { background: var(--kbr-altin); border-color: var(--kbr-altin); color: #16212b; }
.kbr .kbr-btn-altin:hover,
.kbr .kbr-btn-altin:focus { background: #b58723; border-color: #b58723; color: #16212b; box-shadow: 0 10px 24px rgba(var(--kbr-altin-rgb), .3); }

/* Koyu buton: her zemin üzerinde beyaz yazı */
.kbr .kbr-btn-koyu { background: var(--kbr-koyu); border-color: var(--kbr-koyu); color: #fff; }
.kbr .kbr-btn-koyu:hover,
.kbr .kbr-btn-koyu:focus { background: var(--kbr-koyu-2); border-color: var(--kbr-koyu-2); color: #fff; }

/* Çerçeveli buton: bulunduğu bölümün yazı rengini alır */
.kbr .kbr-btn-cizgi { background: transparent; border-color: currentColor; color: var(--kbr-koyu); }
.kbr .kbr-btn-cizgi:hover,
.kbr .kbr-btn-cizgi:focus { background: rgba(var(--kbr-koyu-rgb), .07); color: var(--kbr-koyu); }
.kbr .kbr-bolum-koyu .kbr-btn-cizgi,
.kbr .kbr-cta .kbr-btn-cizgi,
.kbr .kbr-sayfa-basligi .kbr-btn-cizgi { color: #fff; }
.kbr .kbr-bolum-koyu .kbr-btn-cizgi:hover,
.kbr .kbr-cta .kbr-btn-cizgi:hover,
.kbr .kbr-sayfa-basligi .kbr-btn-cizgi:hover { background: rgba(255, 255, 255, .12); color: #fff; }

.kbr .kbr-btn-tam { width: 100%; }
.kbr-butonlar { display: flex; flex-wrap: wrap; gap: 12px; }

/* Üst bar ve başlık ------------------------------------------------------- */

.kbr-ustbar {
	background: var(--kbr-koyu-2);
	color: rgba(255, 255, 255, .74);
	font-size: 13.5px;
}
.kbr-ustbar-ic { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 42px; }
.kbr-ustbar a { color: rgba(255, 255, 255, .9); }
.kbr-ustbar a:hover { color: var(--kbr-altin); }
.kbr-ustbar-iletisim { display: flex; gap: 20px; white-space: nowrap; }

.kbr-header {
	position: sticky; top: 0; z-index: 90;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--kbr-cizgi);
	transition: box-shadow .25s ease;
}
.kbr-header.kbr-sabit { box-shadow: var(--kbr-golge-yumusak); }
.kbr-header-ic { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 82px; }

.kbr-logo { display: flex; align-items: center; }
.kbr-logo-yazi { display: flex; flex-direction: column; }
.kbr-logo-yazi strong {
	font-family: var(--kbr-serif);
	font-size: 30px;
	font-weight: 700;
	letter-spacing: .06em;
	color: var(--kbr-koyu);
	text-transform: uppercase;
	line-height: 1;
}
.kbr-logo-yazi small { font-size: 11.5px; letter-spacing: .04em; color: var(--kbr-gri); margin-top: 5px; }

/* Menü katmanı masaüstünde yerleşimi etkilemez */
.kbr-menu-katman { display: contents; }
.kbr-menu-liste { display: flex; align-items: center; gap: 28px; }
.kbr-menu-liste li { position: relative; }
.kbr-menu-liste a { font-size: 15px; font-weight: 500; color: var(--kbr-yazi); }
.kbr-menu-liste > li > a { padding: 10px 0; display: inline-block; }
.kbr-menu-liste .current-menu-item > a { color: var(--kbr-altin); }
.kbr-menu-liste .sub-menu {
	position: absolute; top: 100%; left: 0; min-width: 220px;
	background: #fff; box-shadow: var(--kbr-golge); padding: 10px 0;
	border-top: 2px solid var(--kbr-altin);
	opacity: 0; visibility: hidden; transform: translateY(8px);
	transition: all .2s ease; z-index: 5;
}
.kbr-menu-liste li:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.kbr-menu-liste .sub-menu a { display: block; padding: 9px 20px; }
.kbr-menu-alt { display: none; }

.kbr-header-sag { display: flex; align-items: center; gap: 14px; }
.kbr-menu-buton {
	display: none; width: 46px; height: 42px;
	background: transparent; border: 1px solid var(--kbr-cizgi); border-radius: var(--kbr-radius);
	cursor: pointer; padding: 11px 11px;
}
.kbr-menu-buton span { display: block; height: 2px; background: var(--kbr-koyu); margin: 0 0 4px; transition: transform .25s ease, opacity .2s ease; }
.kbr-menu-buton span:last-child { margin-bottom: 0; }
.kbr-menu-acik .kbr-menu-buton span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.kbr-menu-acik .kbr-menu-buton span:nth-child(2) { opacity: 0; }
.kbr-menu-acik .kbr-menu-buton span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Giriş bölümü ------------------------------------------------------------ */

.kbr-hero {
	position: relative;
	padding: 84px 0 68px;
	background:
		radial-gradient(120% 90% at 85% 0%, rgba(var(--kbr-altin-rgb), .1) 0%, rgba(255, 255, 255, 0) 55%),
		linear-gradient(180deg, var(--kbr-krem) 0%, #fff 78%);
	overflow: hidden;
}
.kbr-hero-ic { display: grid; grid-template-columns: 1.05fr .95fr; gap: 60px; align-items: center; }
.kbr-hero-baslik { font-size: clamp(34px, 4.6vw, 58px); color: var(--kbr-koyu); margin-bottom: 18px; }
.kbr-hero-metin { font-size: 17.5px; color: var(--kbr-gri); max-width: 540px; margin-bottom: 30px; }

.kbr-hero-gorsel { position: relative; }
.kbr-hero-gorsel img,
.kbr-hero-gorsel .kbr-gorsel-yok {
	width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
	border-radius: var(--kbr-radius);
	box-shadow: var(--kbr-golge);
}
.kbr-hero-kart {
	position: absolute; left: 22px; bottom: 22px; right: 22px;
	width: fit-content; max-width: calc(100% - 44px);
	background: rgba(16, 38, 58, .94);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	color: #fff;
	padding: 15px 22px; border-radius: var(--kbr-radius);
	border-left: 3px solid var(--kbr-altin);
	box-shadow: 0 18px 40px rgba(10, 26, 41, .32);
}
.kbr-hero-kart strong { display: block; font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--kbr-altin); margin-bottom: 4px; }
.kbr-hero-kart span { display: block; font-size: 15px; line-height: 1.45; color: rgba(255, 255, 255, .85); }
/* Fiyat ile para birimi ayrı satıra düşmesin */
.kbr-hero-kart b { color: #fff; font-weight: 700; white-space: nowrap; }

.kbr-rozetler {
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
	margin-top: 72px;
	border-top: 1px solid var(--kbr-cizgi);
}
.kbr-rozet { padding: 26px 30px 6px; border-right: 1px solid var(--kbr-cizgi); }
.kbr-rozet:last-child { border-right: 0; }
.kbr-rozet:first-child { padding-left: 0; }
.kbr-rozet strong { display: block; font-family: var(--kbr-serif); font-size: 21px; color: var(--kbr-koyu); margin-bottom: 4px; }
.kbr-rozet span { font-size: 14.5px; color: var(--kbr-gri); }

.kbr-gorsel-yok {
	display: block; width: 100%; aspect-ratio: 4 / 3;
	background:
		linear-gradient(135deg, #e9e3d7 0%, #f7f4ee 42%, #ded6c7 100%);
	border-radius: var(--kbr-radius);
	position: relative;
}
.kbr-gorsel-yok::after {
	content: "";
	position: absolute; inset: 14px;
	border: 1px solid rgba(var(--kbr-koyu-rgb), .12);
}

/* Izgaralar --------------------------------------------------------------- */

.kbr-izgara { display: grid; gap: 24px; }
.kbr-izgara-2 { grid-template-columns: repeat(2, 1fr); gap: 32px; }
.kbr-izgara-3 { grid-template-columns: repeat(3, 1fr); }
.kbr-izgara-4 { grid-template-columns: repeat(4, 1fr); }

/* Hizmetler --------------------------------------------------------------- */

.kbr-hizmet-kart {
	background: #fff;
	border: 1px solid var(--kbr-cizgi);
	border-radius: var(--kbr-radius);
	padding: 30px 26px;
	position: relative;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.kbr-hizmet-kart:hover { transform: translateY(-4px); box-shadow: var(--kbr-golge); border-color: rgba(var(--kbr-altin-rgb), .5); }
.kbr-hizmet-gorsel { margin: -30px -26px 22px; }
.kbr-hizmet-gorsel img,
.kbr-hizmet-gorsel .kbr-gorsel-yok { aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--kbr-radius) var(--kbr-radius) 0 0; }
.kbr-sira {
	display: block; font-family: var(--kbr-serif); font-size: 15px; font-weight: 700;
	color: var(--kbr-altin); letter-spacing: .1em; margin-bottom: 10px;
}
.kbr-hizmet-kart h3 { font-size: 22px; color: var(--kbr-koyu); }
.kbr-hizmet-kart p { font-size: 15px; color: var(--kbr-gri); margin: 0; }

/* Paketler ---------------------------------------------------------------- */

.kbr-paketler { background: linear-gradient(180deg, var(--kbr-koyu) 0%, var(--kbr-koyu-2) 100%); }
.kbr-donem {
	display: inline-block; margin: 4px 0 16px;
	font-size: 13px; letter-spacing: .16em; text-transform: uppercase;
	color: var(--kbr-altin);
	border: 1px solid rgba(var(--kbr-altin-rgb), .45);
	padding: 6px 16px; border-radius: 100px;
}
.kbr-paket {
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .13);
	border-radius: var(--kbr-radius);
	padding: 32px 26px;
	display: flex; flex-direction: column; align-items: flex-start;
	transition: transform .25s ease, border-color .25s ease, background .25s ease;
	position: relative;
}
.kbr-paket:hover { transform: translateY(-4px); border-color: rgba(var(--kbr-altin-rgb), .6); background: rgba(255, 255, 255, .08); }
.kbr-paket-one { border-color: var(--kbr-altin); background: rgba(var(--kbr-altin-rgb), .1); }
.kbr-paket-rozet {
	position: absolute; top: -12px; left: 26px;
	background: var(--kbr-altin); color: #16212b;
	font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
	padding: 5px 12px; border-radius: 100px;
}
.kbr-paket h3 { font-size: 25px; margin-bottom: 4px; }
.kbr-paket-kapsam { font-size: 14px; color: rgba(255, 255, 255, .6); margin-bottom: 20px; }
.kbr-paket-fiyat { margin: auto 0 22px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .14); width: 100%; }
.kbr-paket-fiyat strong { font-family: var(--kbr-serif); font-size: 40px; color: var(--kbr-altin); display: block; line-height: 1.1; }
.kbr-paket-fiyat small { font-size: 13px; color: rgba(255, 255, 255, .58); letter-spacing: .06em; }

.kbr-not {
	margin: 34px 0 0; text-align: center;
	font-size: 14.5px; color: rgba(255, 255, 255, .68);
}
.kbr-bolum-krem .kbr-not,
.kbr-bolum:not(.kbr-bolum-koyu) .kbr-not { color: var(--kbr-gri); }
.kbr-not-uyari {
	background: rgba(var(--kbr-altin-rgb), .13);
	border-left: 3px solid var(--kbr-altin);
	color: var(--kbr-koyu);
	padding: 14px 20px; text-align: left; border-radius: var(--kbr-radius);
	max-width: 780px; margin-left: auto; margin-right: auto;
}
.kbr-not-sol { text-align: left; }

/* Süsleme ----------------------------------------------------------------- */

.kbr-susleme-kart {
	background: #fff;
	border: 1px solid var(--kbr-cizgi);
	border-radius: var(--kbr-radius);
	overflow: hidden;
	display: flex; flex-direction: column;
	box-shadow: var(--kbr-golge-yumusak);
}
.kbr-susleme-gorsel { position: relative; }
.kbr-susleme-gorsel img,
.kbr-susleme-gorsel .kbr-gorsel-yok { aspect-ratio: 16 / 10; object-fit: cover; border-radius: 0; }
.kbr-susleme-etiket {
	position: absolute; left: 20px; bottom: 20px;
	background: var(--kbr-koyu); color: #fff;
	font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
	padding: 9px 18px; border-radius: 100px;
}
.kbr-susleme-govde { padding: 28px; display: flex; flex-direction: column; flex: 1; }
.kbr-susleme-govde h3 { font-size: 22px; color: var(--kbr-koyu); }
.kbr-susleme-fiyat {
	font-family: var(--kbr-serif); font-size: 27px; font-weight: 700;
	color: var(--kbr-koyu); background: var(--kbr-krem);
	border: 1px dashed rgba(var(--kbr-altin-rgb), .55);
	text-align: center; padding: 14px; border-radius: var(--kbr-radius);
	margin: 8px 0 18px;
}

.kbr-liste { margin: 0 0 20px; }
.kbr-liste li {
	position: relative; padding-left: 30px; margin-bottom: 10px;
	font-size: 15.5px;
}
.kbr-liste li::before {
	content: "";
	position: absolute; left: 0; top: 9px;
	width: 8px; height: 8px; border-radius: 50%;
	background: var(--kbr-altin);
	box-shadow: 0 0 0 4px rgba(var(--kbr-altin-rgb), .16);
}
.kbr-liste-2 { columns: 2; column-gap: 34px; }
.kbr-liste-2 li { break-inside: avoid; }

/* Bakım / ikili düzen ----------------------------------------------------- */

.kbr-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.kbr-ikili-ters .kbr-ikili-yazi { order: 2; }
.kbr-ikili-ters .kbr-ikili-gorsel { order: 1; }
.kbr-ikili-gorsel img,
.kbr-ikili-gorsel .kbr-gorsel-yok {
	width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
	border-radius: var(--kbr-radius); box-shadow: var(--kbr-golge);
}

.kbr-harf-fiyat {
	display: flex; align-items: center; flex-wrap: wrap; gap: 14px;
	background: rgba(var(--kbr-altin-rgb), .12);
	border: 1px solid rgba(var(--kbr-altin-rgb), .4);
	border-radius: var(--kbr-radius);
	padding: 16px 22px; margin: 0 0 24px;
}
.kbr-harf-etiket { font-size: 15.5px; font-weight: 600; color: var(--kbr-altin); letter-spacing: .04em; }
.kbr-harf-fiyat strong { font-family: var(--kbr-serif); font-size: 26px; color: #fff; }

/* Süreç ------------------------------------------------------------------- */

.kbr-adimlar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; counter-reset: adim; }
.kbr-adim {
	padding: 0 28px; border-left: 1px solid var(--kbr-cizgi);
	position: relative;
}
.kbr-adim:first-child { padding-left: 0; border-left: 0; }
.kbr-adim-no {
	display: block; font-family: var(--kbr-serif); font-size: 46px; font-weight: 700;
	color: rgba(var(--kbr-koyu-rgb), .14); line-height: 1; margin-bottom: 12px;
}
.kbr-adim h3 { font-size: 21px; color: var(--kbr-koyu); }
.kbr-adim p { font-size: 15px; color: var(--kbr-gri); margin: 0; }

/* Bölgeler ---------------------------------------------------------------- */

.kbr-bolge-liste { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
.kbr-bolge {
	background: #fff; border: 1px solid var(--kbr-cizgi);
	padding: 11px 20px; border-radius: 100px;
	font-size: 15px; font-weight: 500; color: var(--kbr-koyu);
	transition: border-color .2s ease, transform .2s ease;
}
.kbr-bolge:hover { border-color: var(--kbr-altin); transform: translateY(-2px); }

/* Çağrı bloğu ------------------------------------------------------------- */

.kbr-cta {
	background: var(--kbr-yaprak);
	color: #fff; padding: 56px 0;
}
.kbr-cta-ic { display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.kbr-cta .kbr-baslik { color: #fff; margin-bottom: 6px; }
.kbr-cta p { margin: 0; color: rgba(255, 255, 255, .82); }

/* İletişim ---------------------------------------------------------------- */

.kbr-iletisim-liste { margin: 26px 0; border-top: 1px solid var(--kbr-cizgi); }
.kbr-iletisim-liste li {
	display: flex; justify-content: space-between; align-items: center; gap: 16px;
	padding: 15px 0; border-bottom: 1px solid var(--kbr-cizgi);
	flex-wrap: wrap;
}
.kbr-iletisim-liste span { font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--kbr-gri); }
.kbr-iletisim-liste a,
.kbr-iletisim-liste strong { font-size: 17px; font-weight: 600; color: var(--kbr-koyu); text-align: right; }

.kbr-harita { margin-top: 22px; border-radius: var(--kbr-radius); overflow: hidden; }
.kbr-harita iframe { width: 100%; min-height: 280px; border: 0; display: block; }

.kbr-iletisim-form {
	background: var(--kbr-krem);
	border: 1px solid var(--kbr-cizgi);
	border-radius: var(--kbr-radius);
	padding: 34px;
}
.kbr-iletisim-form h3 { font-size: 24px; color: var(--kbr-koyu); margin-bottom: 4px; }
.kbr-iletisim-form > p { color: var(--kbr-gri); font-size: 15px; }

.kbr-form label { display: block; margin-bottom: 14px; }
.kbr-form label span { display: block; font-size: 13px; font-weight: 600; color: var(--kbr-koyu); margin-bottom: 6px; }
.kbr-form input,
.kbr-form select,
.kbr-form textarea {
	width: 100%; padding: 13px 15px;
	font-family: var(--kbr-sans); font-size: 15px; color: var(--kbr-yazi);
	background: #fff; border: 1px solid var(--kbr-cizgi); border-radius: var(--kbr-radius);
	transition: border-color .2s ease, box-shadow .2s ease;
}
.kbr-form input:focus,
.kbr-form select:focus,
.kbr-form textarea:focus {
	outline: none; border-color: var(--kbr-altin);
	box-shadow: 0 0 0 3px rgba(var(--kbr-altin-rgb), .16);
}
.kbr-form-satir { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.kbr-hp { position: absolute !important; left: -9999px !important; opacity: 0; height: 0; }
.kbr-form-durum { margin: 14px 0 0; font-size: 14.5px; font-weight: 500; min-height: 20px; }
.kbr-form-durum.kbr-basarili { color: var(--kbr-yaprak); }
.kbr-form-durum.kbr-hata { color: #b3261e; }
.kbr-form button[disabled] { opacity: .6; cursor: progress; }

/* Sayfa başlığı ve yazılar ------------------------------------------------ */

.kbr-sayfa-basligi {
	background: var(--kbr-koyu);
	color: #fff; padding: 72px 0 62px;
	background-image: radial-gradient(80% 120% at 90% 0%, rgba(var(--kbr-altin-rgb), .16) 0%, rgba(0, 0, 0, 0) 60%);
}
.kbr-sayfa-basligi .kbr-baslik { color: #fff; margin: 0; }
.kbr-sayfa-basligi .kbr-etiket { color: var(--kbr-altin); }
.kbr-sayfa-giris { color: rgba(255, 255, 255, .78); max-width: 720px; margin-top: 10px; }

.kbr-yazi { max-width: 820px; }
.kbr-yazi h2 { font-size: 30px; margin-top: 1.4em; }
.kbr-yazi h3 { font-size: 23px; margin-top: 1.3em; }
.kbr-yazi ul, .kbr-yazi ol { margin: 0 0 1.2em 1.2em; padding-left: 1em; list-style: revert; }
.kbr-yazi img { border-radius: var(--kbr-radius); margin: 1.2em 0; }
.kbr-yazi blockquote {
	margin: 1.4em 0; padding: 18px 24px;
	background: var(--kbr-krem); border-left: 3px solid var(--kbr-altin);
	font-family: var(--kbr-serif); font-size: 20px;
}
.kbr-yazi-kapak { margin-bottom: 28px; }

.kbr-yazi-listesi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.kbr-yazi-kart { border: 1px solid var(--kbr-cizgi); border-radius: var(--kbr-radius); overflow: hidden; background: #fff; }
.kbr-yazi-govde { padding: 24px; }
.kbr-yazi-govde h2 { font-size: 21px; margin: 6px 0 8px; }
.kbr-yazi-govde p { font-size: 15px; color: var(--kbr-gri); }
.kbr .kbr-devam { font-size: 14px; font-weight: 600; color: var(--kbr-altin); }
.kbr .kbr-devam:hover { color: var(--kbr-koyu); }

.kbr .pagination,
.kbr .nav-links { display: flex; gap: 8px; justify-content: center; margin-top: 40px; flex-wrap: wrap; }
.kbr .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 42px; height: 42px; padding: 0 12px;
	border: 1px solid var(--kbr-cizgi); border-radius: var(--kbr-radius);
}
.kbr .page-numbers.current { background: var(--kbr-koyu); color: #fff; border-color: var(--kbr-koyu); }

.kbr-404 { padding: 120px 0; }
.kbr-404 .kbr-butonlar { justify-content: center; }

/* Alt bilgi --------------------------------------------------------------- */

.kbr-footer { background: var(--kbr-koyu-2); color: rgba(255, 255, 255, .68); padding-top: 68px; font-size: 15px; }
.kbr-footer-ic { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.1fr; gap: 40px; padding-bottom: 52px; }
.kbr-footer h3, .kbr-footer h4 { color: #fff; }
.kbr-footer h4 { font-size: 17px; letter-spacing: .04em; margin-bottom: 16px; }
.kbr-footer-baslik { font-size: 28px; letter-spacing: .08em; text-transform: uppercase; }
/* Önek zorunlu: ".kbr img { height: auto }" kuralı tek sınıflı bir yükseklik tanımını eziyor */
.kbr .kbr-footer-logo { height: var(--kbr-logo-h-footer, 56px); max-width: 100%; width: auto; margin-bottom: 16px; object-fit: contain; }
.kbr-footer a { color: rgba(255, 255, 255, .78); }
.kbr-footer a:hover { color: var(--kbr-altin); }
.kbr-footer-menu li,
.kbr-footer-iletisim li { margin-bottom: 10px; }
.kbr-footer-bolge { line-height: 1.9; }
.kbr-sosyal { display: flex; gap: 16px; margin-top: 14px; }
.kbr-sosyal a { font-size: 14px; border-bottom: 1px solid rgba(var(--kbr-altin-rgb), .5); padding-bottom: 2px; }

.kbr-footer-alt { border-top: 1px solid rgba(255, 255, 255, .1); padding: 20px 0; font-size: 13.5px; }
.kbr-footer-alt-ic { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.kbr-gelistirici a { color: var(--kbr-altin); }

/* Yüzen butonlar ---------------------------------------------------------- */

.kbr-wa {
	position: fixed; right: 20px; bottom: 20px; z-index: 80;
	width: 56px; height: 56px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: #25d366; color: #fff;
	box-shadow: 0 10px 26px rgba(37, 211, 102, .38);
	transition: transform .2s ease;
}
.kbr-wa:hover { transform: scale(1.07); color: #fff; }

.kbr-mobil-bar { display: none; }

/* Menü karartma katmanı yalnızca mobil menü açıkken görünür. Taban kuralı
   şart: stilleri sadece mobil medya sorgusunda tanımlıyken masaüstünde
   tarayıcının varsayılan boş butonu sayfanın altında görünüyordu. */
.kbr .kbr-menu-karartma { display: none; }

/* Görünürlük animasyonu --------------------------------------------------- */

.kbr-goster { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.kbr-goster.kbr-gorunur { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.kbr *, .kbr *::before, .kbr *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
	.kbr-goster { opacity: 1; transform: none; }
}

/* ==========================================================================
   Tablet
   ========================================================================== */

@media (max-width: 1024px) {
	.kbr-bolum { padding: 72px 0; }
	.kbr-izgara-4 { grid-template-columns: repeat(2, 1fr); }
	.kbr-adimlar { grid-template-columns: repeat(2, 1fr); gap: 30px 0; }
	.kbr-adim:nth-child(3) { padding-left: 0; border-left: 0; }
	.kbr-hero-ic { gap: 40px; }
	.kbr-hero-kart { left: 18px; right: 18px; bottom: 18px; max-width: calc(100% - 36px); }
	.kbr-footer-ic { grid-template-columns: 1fr 1fr; gap: 34px; }
	.kbr-yazi-listesi { grid-template-columns: repeat(2, 1fr); }

	.kbr-header-btn { display: none; }
	.kbr-menu-buton { display: block; }
	/* Menü katmanı: ekran boyutunda, taşmayı kırpar.

	   Panel kapalıyken sağda ekran dışında bekliyor. Daha önce bu
	   "right: -100%" ile yapılıyordu ve sayfa yatay kayıyordu (382 piksellik
	   ekranda sayfa 764 piksel oluyordu). Sadece transform'a geçmek de
	   yetmedi; tarayıcı dönüştürülmüş öğeyi de kaydırma alanına katıyor.
	   Bu katman ekranı tam kapladığı ve taşmayı kırptığı için panel artık
	   sayfa genişliğini hiç etkilemiyor. */
	.kbr-menu-katman {
		display: block;
		position: fixed; top: 0; left: 0; right: 0;
		height: 100vh;
		overflow: hidden;
		pointer-events: none;
		z-index: 95;
	}

	.kbr-menu {
		position: absolute; top: 0; right: 0; height: 100%;
		width: min(360px, 86vw);
		transform: translateX(100%);
		visibility: hidden;
		pointer-events: auto;
		background: #fff; box-shadow: -10px 0 40px rgba(0, 0, 0, .16);
		padding: 78px 28px 40px; overflow-y: auto;
		/* Alt çubuk ve telefon çentiği için ek boşluk */
		padding-bottom: calc(48px + env(safe-area-inset-bottom, 0px));
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		transition: transform .3s ease, visibility .3s ease; z-index: 95;
	}
	/* iOS Safari 100vh değerine tarayıcının alt çubuğunu da katıyor; panelin
	   son öğesi (WhatsApp butonu) çubuğun arkasında kalıyordu. */
	@supports (height: 100dvh) {
		.kbr-menu-katman { height: 100dvh; }
	}
	.kbr-menu-acik .kbr-menu { transform: none; visibility: visible; }
	.kbr-menu-liste { flex-direction: column; align-items: stretch; gap: 0; }
	.kbr-menu-liste > li { border-bottom: 1px solid var(--kbr-cizgi); }
	.kbr-menu-liste > li > a { display: block; padding: 15px 0; font-size: 16.5px; }
	.kbr-menu-liste .sub-menu {
		position: static; opacity: 1; visibility: visible; transform: none;
		box-shadow: none; border-top: 0; padding: 0 0 10px 14px;
	}
	.kbr-menu-kapat {
		display: flex; align-items: center; justify-content: center;
		position: absolute; top: 18px; right: 18px;
		width: 40px; height: 40px; padding: 0;
		background: var(--kbr-krem); color: var(--kbr-koyu);
		border: 1px solid var(--kbr-cizgi); border-radius: 50%;
		cursor: pointer; z-index: 2;
		transition: background .2s ease, color .2s ease;
	}
	.kbr-menu-kapat:hover { background: var(--kbr-koyu); color: #fff; border-color: var(--kbr-koyu); }
	.kbr-menu-alt { display: block; margin-top: 26px; }
	.kbr-menu-alt .kbr-btn { width: 100%; }
	.kbr .kbr-menu-alt .kbr-btn-altin { color: #16212b; }
	.kbr-menu-buton { position: relative; z-index: 3; }

	/* Karartma katmanı: menünün ve başlığın altında kalmalı.
	   .kbr-header sticky + z-index ile kendi katman bağlamını oluşturduğu için
	   menü açıkken başlık karartmanın üzerine alınır. */
	.kbr-menu-acik .kbr-header { z-index: 96; }
	.kbr-menu-acik .kbr-ustbar { position: relative; z-index: 96; }
	.kbr .kbr-menu-karartma { display: block; }
	.kbr-menu-karartma {
		position: fixed; inset: 0; background: rgba(10, 26, 41, .5);
		opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease;
		z-index: 94; border: 0; padding: 0; cursor: pointer;
	}
	.kbr-menu-acik .kbr-menu-karartma { opacity: 1; visibility: visible; }
}

/* ==========================================================================
   Mobil
   ========================================================================== */

@media (max-width: 768px) {
	body.kbr { font-size: 15.5px; }
	.kbr-kap { padding: 0 18px; }
	.kbr-bolum { padding: 56px 0; }
	.kbr-bolum-basligi { margin-bottom: 34px; }

	.kbr-ustbar-metin { display: none; }
	.kbr-ustbar-ic { justify-content: center; }
	.kbr-ustbar-iletisim { gap: 14px; font-size: 13px; }
	.kbr-header-ic { min-height: 68px; }
	.kbr-logo-yazi strong { font-size: 24px; }
	.kbr-logo-yazi small { font-size: 10.5px; }
	.kbr .kbr-logo-img { height: var(--kbr-logo-h-mobil, 44px); }

	.kbr-hero { padding: 46px 0 40px; }
	.kbr-hero-ic { grid-template-columns: 1fr; gap: 34px; }
	.kbr-hero-metin { font-size: 16px; }
	.kbr-hero-kart {
		position: static; margin-top: 14px;
		width: auto; max-width: none;
		background: var(--kbr-koyu);
	}
	.kbr-rozetler { grid-template-columns: 1fr; margin-top: 40px; }
	.kbr-rozet { padding: 20px 0; border-right: 0; border-bottom: 1px solid var(--kbr-cizgi); }
	.kbr-rozet:last-child { border-bottom: 0; }

	.kbr-izgara-2,
	.kbr-izgara-3,
	.kbr-izgara-4 { grid-template-columns: 1fr; gap: 20px; }
	.kbr-ikili { grid-template-columns: 1fr; gap: 30px; }
	.kbr-ikili-ters .kbr-ikili-yazi,
	.kbr-ikili-ters .kbr-ikili-gorsel { order: initial; }
	.kbr-liste-2 { columns: 1; }
	.kbr-adimlar { grid-template-columns: 1fr; gap: 24px; }
	.kbr-adim { padding: 0 0 0 0; border-left: 0; border-top: 1px solid var(--kbr-cizgi); padding-top: 20px; }
	.kbr-adim:first-child { border-top: 0; padding-top: 0; }
	.kbr-adim-no { font-size: 34px; }

	.kbr-paket-fiyat strong { font-size: 34px; }
	.kbr-iletisim-form { padding: 24px 20px; }
	.kbr-form-satir { grid-template-columns: 1fr; }
	.kbr-iletisim-liste li { flex-direction: column; align-items: flex-start; gap: 4px; }
	.kbr-iletisim-liste a,
	.kbr-iletisim-liste strong { text-align: left; }

	.kbr-cta { padding: 42px 0; }
	.kbr-cta-ic { flex-direction: column; align-items: flex-start; }
	.kbr-butonlar .kbr-btn { flex: 1 1 100%; }

	.kbr-yazi-listesi { grid-template-columns: 1fr; }
	.kbr-footer-ic { grid-template-columns: 1fr; gap: 28px; }
	.kbr-footer { padding-top: 48px; }
	.kbr-footer-alt-ic { flex-direction: column; text-align: center; align-items: center; }

	.kbr-sayfa-basligi { padding: 48px 0 42px; }

	/* Alt iletişim çubuğu */
	.kbr-mobil-bar {
		display: grid; grid-template-columns: repeat(3, 1fr);
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 85;
		background: var(--kbr-koyu); border-top: 1px solid rgba(255, 255, 255, .12);
	}
	.kbr-mobil-bar a {
		padding: 14px 6px; text-align: center; color: #fff;
		font-size: 13.5px; font-weight: 600;
		border-right: 1px solid rgba(255, 255, 255, .12);
	}
	.kbr-mobil-bar a:last-child { border-right: 0; }
	.kbr-mobil-bar a:hover { color: var(--kbr-altin); }
	/* Menü açıkken alt çubuk gizlenir: menünün kendi butonuyla üst üste
	   biniyor ve aynı işi iki kez yapıyorlardı. */
	.kbr-menu-acik .kbr-mobil-bar,
	.kbr-menu-acik .kbr-wa,
	.kbr-menu-acik .kbr-yukari {
		opacity: 0; visibility: hidden;
		transition: opacity .2s ease, visibility .2s ease;
	}
	.kbr-footer { padding-bottom: 54px; }
	.kbr-wa { bottom: 68px; right: 16px; width: 50px; height: 50px; }
}

@media (max-width: 420px) {
	.kbr-baslik { font-size: 26px; }
	.kbr-hero-baslik { font-size: 30px; }
	.kbr-susleme-govde { padding: 22px 18px; }
}

/* ==========================================================================
   1.0.3 — tek sayfa akışı, yeni bölümler
   ========================================================================== */

/* Çapa bağlantılarında sabit başlığın altında kalmasın */
.kbr [id] { scroll-margin-top: 96px; }

.kbr-butonlar-orta { justify-content: center; margin-top: 34px; }

/* Tek seferlik bakım ------------------------------------------------------ */

.kbr-tekbakim-fiyat {
	display: inline-flex; align-items: baseline; gap: 12px;
	background: var(--kbr-krem);
	border: 1px dashed rgba(var(--kbr-altin-rgb), .55);
	border-radius: var(--kbr-radius);
	padding: 14px 22px; margin: 0 0 24px;
}
.kbr-tekbakim-fiyat strong { font-family: var(--kbr-serif); font-size: 32px; color: var(--kbr-koyu); line-height: 1; }
.kbr-tekbakim-fiyat span { font-size: 14px; color: var(--kbr-gri); letter-spacing: .04em; }

/* Mermer temizleme fiyat listesi ------------------------------------------ */

.kbr-fiyat-liste { margin: 0 0 26px; border-top: 1px solid var(--kbr-cizgi); }
.kbr-fiyat-liste li {
	display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
	padding: 14px 0; border-bottom: 1px solid var(--kbr-cizgi);
}
.kbr-fiyat-liste span { font-size: 16px; color: var(--kbr-yazi); }
.kbr-fiyat-liste strong { font-family: var(--kbr-serif); font-size: 26px; color: var(--kbr-koyu); line-height: 1; }

/* Hizmet bölgemiz --------------------------------------------------------- */

.kbr-yakalar { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.kbr-yaka-baslik {
	display: flex; align-items: baseline; gap: 12px;
	font-size: 22px; color: var(--kbr-koyu);
	padding-bottom: 12px; margin-bottom: 20px;
	border-bottom: 1px solid var(--kbr-cizgi);
}
.kbr-yaka-baslik span {
	font-family: var(--kbr-sans); font-size: 12px; font-weight: 600;
	letter-spacing: .12em; text-transform: uppercase; color: var(--kbr-altin);
}
.kbr-bolgeler .kbr-bolge-liste { margin-bottom: 0; }

/* Hakkımızda -------------------------------------------------------------- */

.kbr-deger-izgara { margin-top: 56px; }
.kbr-deger {
	background: var(--kbr-krem);
	border-left: 2px solid var(--kbr-altin);
	border-radius: 0 var(--kbr-radius) var(--kbr-radius) 0;
	padding: 26px 24px;
}
.kbr-deger h3 { font-size: 20px; color: var(--kbr-koyu); margin-bottom: 6px; }
.kbr-deger p { font-size: 15px; color: var(--kbr-gri); margin: 0; }

/* Krem zeminde iletişim kartı beyaz kalsın */
.kbr-iletisim.kbr-bolum-krem .kbr-iletisim-form { background: #fff; }

@media (max-width: 1024px) {
	.kbr-izgara-3 { grid-template-columns: repeat(2, 1fr); }
	.kbr-yakalar { gap: 32px; }
}

@media (max-width: 768px) {
	.kbr [id] { scroll-margin-top: 78px; }
	.kbr-yakalar { grid-template-columns: 1fr; gap: 28px; }
	.kbr-deger-izgara { margin-top: 36px; }
	.kbr-tekbakim-fiyat { width: 100%; justify-content: space-between; }
	.kbr-fiyat-liste strong { font-size: 22px; }
	.kbr-butonlar-orta { margin-top: 26px; }

	.kbr-mobil-bar-2 { grid-template-columns: repeat(2, 1fr); }
	.kbr-mobil-bar-3 { grid-template-columns: repeat(3, 1fr); }
}

/* Efekt seviyesi "Kapalı" iken hiçbir giriş animasyonu çalışmaz */
.kbr-efekt-kapali .kbr-goster { opacity: 1; transform: none; transition: none; }

/* ==========================================================================
   1.0.5 — rakam okunurluğu

   Cormorant Garamond eski usul (old-style) rakamlar kullanıyor: 1 küçük harf
   boyunda kalıyor, 3-4-7-9 satır altına sarkıyor. Fiyat ve sayı gibi hızlı
   okunması gereken yerlerde "14" ifadesi "I4" gibi görünüyordu. Rakamların
   geçtiği tüm alanlar gövde fontuna (Inter) alındı; Inter'in rakamları düz
   hizalı ve eşit genişlikte.
   ========================================================================== */

:root { --kbr-rakam: var(--kbr-sans); }

/* Fiyatlar ve sayılar */
.kbr .kbr-paket-fiyat strong,
.kbr .kbr-susleme-fiyat,
.kbr .kbr-tekbakim-fiyat strong,
.kbr .kbr-fiyat-liste strong,
.kbr .kbr-harf-fiyat strong,
.kbr .kbr-rakam strong,
.kbr .kbr-adim-no,
.kbr .kbr-sira,
.kbr .kbr-hero-kart b,
.kbr .page-numbers {
	font-family: var(--kbr-rakam);
	font-variant-numeric: lining-nums tabular-nums;
	font-feature-settings: "lnum" 1, "tnum" 1;
}

/* Sans-serif aynı punto ile daha iri durduğu için ölçüler yeniden dengelendi */
.kbr .kbr-paket-fiyat strong { font-size: 34px; font-weight: 700; letter-spacing: -.02em; }
.kbr .kbr-susleme-fiyat { font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
.kbr .kbr-tekbakim-fiyat strong { font-size: 27px; font-weight: 700; letter-spacing: -.02em; }
.kbr .kbr-fiyat-liste strong { font-size: 21px; font-weight: 700; letter-spacing: -.01em; }
.kbr .kbr-harf-fiyat strong { font-size: 21px; font-weight: 700; }
.kbr .kbr-adim-no { font-size: 38px; font-weight: 700; letter-spacing: -.02em; }
.kbr .kbr-sira { font-size: 13px; font-weight: 700; letter-spacing: .12em; }

/* Başlık ve metin içinde geçen rakamlar da düz hizalı olsun
   (örn. "2026 - 2027 yılı için", "3-4 kişilik") */
.kbr h1, .kbr h2, .kbr h3, .kbr h4,
.kbr .kbr-rozet strong,
.kbr .kbr-logo-yazi strong,
.kbr .kbr-footer-baslik {
	font-variant-numeric: lining-nums;
	font-feature-settings: "lnum" 1;
}

@media (max-width: 768px) {
	.kbr .kbr-paket-fiyat strong { font-size: 30px; }
	.kbr .kbr-adim-no { font-size: 30px; }
	.kbr .kbr-fiyat-liste strong { font-size: 19px; }
}

/* ==========================================================================
   1.0.9 — menü düzeni

   Dokuz üst madde tek satıra sığmıyor, "Periyodik Bakım Ücretleri" gibi uzun
   başlıklar üç satıra bölünüyordu. Hizmet bölümleri "Hizmetler" başlığı
   altında açılır menüye alındı; üst seviyede beş madde kaldı.
   ========================================================================== */

/* Menü maddeleri kelime ortasından bölünmesin */
.kbr-menu-liste > li > a { white-space: nowrap; }
.kbr-menu-liste .sub-menu a { white-space: nowrap; }

/* Açılır menüsü olan maddeye ok işareti.

   Seçiciler ".kbr-menu-liste > li > a" ile aynı ya da daha yüksek özgüllükte
   olmalı; aksi hâlde oradaki "padding: 10px 0" kuralı sağ boşluğu eziyor ve
   ok yazının üstüne biniyor. Ok, bağlantının kendisine göre konumlanıyor
   (li değil), çünkü li bağlantıdan geniş olabiliyor. */
.kbr-menu-liste > li.kbr-alt-menulu > a,
.kbr-menu-liste > li.menu-item-has-children > a {
	position: relative;
	padding-right: 16px;
}
.kbr-menu-liste > li.kbr-alt-menulu > a::before,
.kbr-menu-liste > li.menu-item-has-children > a::before {
	content: "";
	position: absolute; right: 1px; top: 50%;
	width: 6px; height: 6px; margin-top: -5px;
	border-right: 1.6px solid currentColor;
	border-bottom: 1.6px solid currentColor;
	transform: rotate(45deg);
	opacity: .5;
	transition: transform .25s ease, opacity .25s ease;
	pointer-events: none;
}
.kbr-menu-liste > li.kbr-alt-menulu:hover > a::before,
.kbr-menu-liste > li.menu-item-has-children:hover > a::before,
.kbr-menu-liste > li.kbr-alt-menulu:focus-within > a::before,
.kbr-menu-liste > li.menu-item-has-children:focus-within > a::before {
	transform: rotate(-135deg); margin-top: -2px; opacity: 1;
}

/* Açılır menü: fare menü ile başlık arasındaki boşlukta gezerken kapanmasın */
.kbr-menu-liste .sub-menu { padding-top: 8px; margin-top: 6px; }
.kbr-alt-menulu::after,
.kbr-menu-liste .menu-item-has-children::after {
	content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 10px;
}
.kbr-menu-liste .sub-menu li { border: 0; }
.kbr-menu-liste .sub-menu a { font-size: 14.5px; color: var(--kbr-yazi); }
.kbr-menu-liste .sub-menu a:hover { color: var(--kbr-altin); background: var(--kbr-krem); }

/* Klavye ile gezinenler için de açılsın */
.kbr-menu-liste li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }

@media (min-width: 1025px) and (max-width: 1200px) {
	.kbr-menu-liste { gap: 22px; }
	.kbr-menu-liste a { font-size: 14.5px; }
	.kbr-header-btn { padding: 12px 18px; font-size: 13.5px; }
}

@media (max-width: 1024px) {
	/* Mobil menüde ok işareti ve boşluk köprüsü gereksiz */
	.kbr-menu-liste > li.kbr-alt-menulu > a::before,
	.kbr-menu-liste > li.menu-item-has-children > a::before,
	.kbr-alt-menulu::after,
	.kbr-menu-liste .menu-item-has-children::after { display: none; }
	.kbr-menu-liste .sub-menu { padding-top: 0; margin-top: 0; }
	.kbr-menu-liste .sub-menu a { padding: 11px 0; display: block; font-size: 15px; }
	.kbr-menu-liste .sub-menu li + li { border-top: 1px solid var(--kbr-cizgi); }
	.kbr-menu-liste > li > a,
	.kbr-menu-liste .sub-menu a { white-space: normal; }
}

/* ==========================================================================
   1.1.1 — mobil menü, paket görselleri, notlar
   ========================================================================== */

/* Mobil menüde kapatma butonu yalnızca mobil menü açılırken görünür.
   Gizleme kuralı masaüstü genişliğine kilitlendi: medya sorgusu özgüllük
   eklemediği için, dosya sonundaki koşulsuz "display: none" kuralı
   yukarıdaki mobil "display: flex" kuralını eziyordu. */
@media (min-width: 1025px) {
	.kbr-menu-kapat { display: none; }
}

/* Paket kartlarında kabir tipi görseli.
   "Çift mezar" ifadesi cenaze sayısı sanıldığı için kabirin kaç bölmeli
   olduğu görselle anlatılıyor. */
.kbr-paket-bilgi {
	text-align: center; margin: -14px 0 30px;
	font-size: 15px; color: rgba(255, 255, 255, .68);
}
.kbr-paket { display: flex; flex-direction: column; }
.kbr-paket-gorsel {
	margin: -26px -24px 18px;
	border-radius: var(--kbr-radius) var(--kbr-radius) 0 0;
	overflow: hidden; background: rgba(255, 255, 255, .06);
}
.kbr-paket-gorsel img {
	display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
}

/* Sol hizalı uyarı notu (mermer fiyat listesi altı) */
.kbr-not-sol { text-align: left; margin: 0 0 22px; }

/* ==========================================================================
   1.1.3 — mobilde tekrar eden iletişim çağrıları

   Mobilde aynı "WhatsApp'tan yazın" çağrısı üst barda, başlıktaki butonda,
   giriş bölümünde, alt çubukta ve yüzen butonda beş kez tekrar ediyordu.
   Üst bar ve başlık butonu mobilde varsayılan olarak gizlendi; ikisi de
   panelden açılabiliyor.

   Not: Buton kuralları ".kbr .kbr-btn" (0-2-0) özgüllüğünde tanımlı olduğu
   için gizleme kuralları da aynı önekle yazılmalı; tek sınıflı bir
   "display: none" bu kuralı ezemiyor.
   ========================================================================== */

@media (max-width: 1024px) {
	.kbr .kbr-header-btn { display: none; }
	.kbr-headerbtn-mobil .kbr-header-btn { display: inline-flex; }
	.kbr-headerbtn-mobil .kbr-header-btn {
		padding: 11px 16px; font-size: 13px; letter-spacing: .02em;
	}
}

@media (max-width: 768px) {
	.kbr-ustbar { display: none; }
	.kbr-ustbar-mobil .kbr-ustbar { display: block; }
	/* Üst bar mobilde açıksa metin de görünsün, tek satırda kalsın */
	.kbr-ustbar-mobil .kbr-ustbar-metin {
		display: block; font-size: 12.5px;
		overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	}
}

/* ==========================================================================
   1.1.4 — logo yükseklikleri, mobil menü logosu, yatay taşma koruması
   ========================================================================== */

/* Logo yüksekliği panelden geliyor: masaüstü, mobil ve alt bilgi ayrı ayrı */
.kbr .kbr-logo-img {
	height: var(--kbr-logo-h, 52px);
	width: auto; max-width: 100%; display: block; object-fit: contain;
}

/* Mobil menü panelindeki logo (masaüstünde gizli) */
.kbr-menu-logo { display: none; }

/* Not: Buraya bir dönem "overflow-x: clip" koruması konmuştu. Kaldırıldı —
   iki sebeple: (1) yatay kaymanın gerçek sebebi menü karartma katmanıydı ve
   1.1.5'te kaynağında düzeltildi, (2) html/body üzerindeki clip değeri sabit
   (fixed) konumlu öğelerin referansını değiştirdiği için menü açıkken
   uygulanan kaydırma kilidiyle çakışıyor, menü ekran dışına kayıyordu.
   Taşma olursa öğenin kendisi düzeltilmeli. */

/* Gömülü ve geniş içerikler kutusunu aşmasın */
.kbr img,
.kbr canvas,
.kbr video,
.kbr iframe,
.kbr embed,
.kbr object { max-width: 100%; }
.kbr iframe { max-width: 100%; }
.kbr pre,
.kbr table { max-width: 100%; overflow-x: auto; }

@media (max-width: 1024px) {
	/* Menü panelinin üstünde logo ve kapatma butonu yan yana durur */
	.kbr-menu-logo {
		display: block; position: absolute; top: 16px; left: 28px;
		max-width: calc(100% - 90px); z-index: 2;
	}
	.kbr-menu-logo img {
		height: var(--kbr-logo-h-mobil, 44px);
		width: auto; max-width: 100%; display: block; object-fit: contain;
	}
	.kbr-menu-logo strong {
		font-family: var(--kbr-serif); font-size: 22px; color: var(--kbr-koyu);
		letter-spacing: .04em;
	}
	/* Logo eklendiği için menü listesi biraz aşağıdan başlar */
	.kbr-menu { padding-top: calc(var(--kbr-logo-h-mobil, 44px) + 40px); }
}

/* ==========================================================================
   1.1.6 — menü açıkken sayfa kaymasın

   iOS Safari'de gövdeye "overflow: hidden" vermek arka plandaki kaydırmayı
   durdurmuyor. Gövde sabitleniyor, mevcut kaydırma konumu JS tarafından
   negatif üst boşluk olarak veriliyor; menü kapanınca sayfa aynı noktaya
   döndürülüyor.
   ========================================================================== */

body.kbr-kaydirma-kilitli {
	position: fixed;
	left: 0; right: 0; width: 100%;
	overflow: hidden;
	overscroll-behavior: none;
}

/* Menü paneli kendi içinde kayar, taşma sayfaya aktarılmaz */
.kbr-menu {
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

/* ==========================================================================
   1.2.0 — süsleme kartları esnek ızgara

   Paket sayısı 2'den 4'e çıktı. Sabit iki sütun yerine esnek ızgara
   kullanılıyor: masaüstünde dört paket yan yana, iki paket varsa iki geniş
   sütun olarak diziliyor. Panelden paket eklenip çıkarıldığında düzen
   kendiliğinden uyum sağlıyor.
   ========================================================================== */

.kbr-susleme-izgara {
	grid-template-columns: repeat(auto-fit, minmax(248px, 1fr));
	align-items: stretch;
}

/* Dört kart yan yanayken kart içi ölçüler biraz sıkılaştırılıyor */
@media (min-width: 1025px) {
	.kbr-susleme-izgara .kbr-susleme-govde { padding: 24px 20px; }
	.kbr-susleme-izgara .kbr-susleme-govde h3 { font-size: 19px; }
	.kbr-susleme-izgara .kbr-liste li { font-size: 14.5px; line-height: 1.55; }
	.kbr-susleme-izgara .kbr-susleme-etiket { font-size: 11px; letter-spacing: .1em; }
	.kbr .kbr-susleme-izgara .kbr-susleme-fiyat { font-size: 20px; }
	.kbr-susleme-izgara .kbr-btn { padding: 12px 14px; font-size: 13.5px; }
}

@media (max-width: 1024px) and (min-width: 641px) {
	/* Tablette iki sütun */
	.kbr-susleme-izgara { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
	.kbr-susleme-izgara { grid-template-columns: 1fr; }
}

/* Kartların madde sayısı farklı; fiyat kutusu ve buton her kartta aynı
   hizada dursun diye liste esnek, fiyat kutusu alta yaslanıyor. */
.kbr-susleme-izgara .kbr-susleme-govde > .kbr-liste { flex: 1 0 auto; margin-bottom: 18px; }
.kbr .kbr-susleme-izgara .kbr-susleme-fiyat { margin-top: auto; }

/* Uzun paket adlarında etiket iki satıra düşebiliyor; görselin alt kenarına
   yaslanıp okunur kalması için satır aralığı ve genişlik sınırı veriliyor. */
.kbr-susleme-izgara .kbr-susleme-etiket {
	line-height: 1.35; max-width: calc(100% - 32px);
}

/* ==========================================================================
   1.2.2 — dar ekranlarda taşma

   320 piksellik ekranlarda hizmet kartları ve değer kutuları iki sütun
   kalıyor ve sayfayı 40 piksel yana kaydırıyordu. İki sebebi vardı:
   768 piksellik tek sütun kuralı dosyada daha önce yazıldığı için ilerideki
   1024 piksellik iki sütun kuralı onu eziyordu; ayrıca ızgara kutularının
   içeriği kendi sütununu genişletebiliyordu.
   ========================================================================== */

/* Izgara kutuları sütunlarından taşamasın */
.kbr-izgara > * { min-width: 0; }

@media (max-width: 640px) {
	.kbr .kbr-izgara-2,
	.kbr .kbr-izgara-3,
	.kbr .kbr-izgara-4,
	.kbr .kbr-deger-izgara { grid-template-columns: 1fr; }
	.kbr .kbr-rakam-izgara { grid-template-columns: repeat(2, 1fr); }
}

/* Negatif kenar boşluğuyla yerleştirilen paket görseli kartın dışına
   taşmasın */
.kbr-paket { overflow: hidden; }

/* Panelden eklenen harita gömüsü kutusunu aşmasın */
.kbr-harita iframe { width: 100%; max-width: 100%; border: 0; display: block; }

/* ==========================================================================
   1.3.1 — mezar yapımı şeridi (tam genişlik)

   Sayfanın en altında, alt bilgiden hemen önce duran tam genişlik şerit.
   Görsel fon olarak kullanılıyor, üzerine koyu geçiş bindiriliyor; yazılar
   soldaki okunaklı alanda kalıyor. Şeridin tamamı bağlantı.
   ========================================================================== */

.kbr-yapim { display: block; }

.kbr-yapim-serit {
	position: relative; display: block;
	min-height: 460px;
	color: #fff;
	overflow: hidden;
	isolation: isolate;
}

/* Fon görseli */
.kbr-yapim-zemin { position: absolute; inset: 0; z-index: 0; }
.kbr-yapim-zemin img,
.kbr-yapim-zemin .kbr-gorsel-yok {
	width: 100%; height: 100%;
	object-fit: cover; object-position: center 42%;
	display: block; border-radius: 0;
	transition: transform 1.2s cubic-bezier(.22, .61, .36, 1);
}
.kbr-kart-efekti .kbr-yapim-serit:hover .kbr-yapim-zemin img { transform: scale(1.04); }

/* Yazının okunması için koyu geçiş */
.kbr-yapim-serit::before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(
		100deg,
		rgba(var(--kbr-koyu-rgb), .95) 0%,
		rgba(var(--kbr-koyu-rgb), .88) 38%,
		rgba(var(--kbr-koyu-rgb), .55) 62%,
		rgba(var(--kbr-koyu-rgb), .28) 100%
	);
}

/* Üstte ince altın çizgi — alt bilgiden ayrışsın */
.kbr-yapim-serit::after {
	content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; z-index: 2;
	background: linear-gradient(90deg, var(--kbr-altin), rgba(var(--kbr-altin-rgb), 0));
}

.kbr-yapim-serit .kbr-kap { position: relative; z-index: 3; }

.kbr-yapim-yazi {
	max-width: 620px;
	padding: 86px 0;
}
.kbr-yapim-yazi .kbr-etiket { color: var(--kbr-altin); }
.kbr-yapim-yazi .kbr-etiket::before { background: var(--kbr-altin); }
.kbr-yapim-yazi .kbr-baslik { color: #fff; font-size: clamp(28px, 3.4vw, 40px); margin-bottom: 16px; }
.kbr-yapim-yazi .kbr-bolum-metin { color: rgba(255, 255, 255, .82); margin-bottom: 22px; }

/* Maddeler tek satırlık etiketler hâlinde */
.kbr-yapim-maddeler {
	display: flex; flex-wrap: wrap; gap: 10px;
	margin: 0 0 34px;
	padding: 0; list-style: none;
}
.kbr-yapim-maddeler li {
	padding: 8px 14px;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 999px;
	font-size: 14px; color: rgba(255, 255, 255, .9);
	background: rgba(255, 255, 255, .06);
}

.kbr .kbr-yapim-btn { cursor: pointer; }
.kbr .kbr-yapim-btn svg { flex: 0 0 auto; }

@media (max-width: 1024px) {
	.kbr-yapim-serit { min-height: 420px; }
	.kbr-yapim-yazi { max-width: 560px; padding: 66px 0; }
	.kbr-yapim-serit::before {
		background: linear-gradient(
			100deg,
			rgba(var(--kbr-koyu-rgb), .95) 0%,
			rgba(var(--kbr-koyu-rgb), .9) 55%,
			rgba(var(--kbr-koyu-rgb), .6) 100%
		);
	}
}

@media (max-width: 768px) {
	/* Telefonda görsel yine fon olarak kalıyor; dikey geçiş üstte görseli
	   gösterip aşağı doğru koyulaşıyor. Görseli kesip yazıyı altına almak
	   ikisinin arasında sert bir bant oluşturuyordu. */
	.kbr-yapim-serit { min-height: 0; }
	.kbr-yapim-zemin img,
	.kbr-yapim-zemin .kbr-gorsel-yok { object-position: center 38%; }
	.kbr-yapim-serit::before {
		background: linear-gradient(
			180deg,
			rgba(var(--kbr-koyu-rgb), .3) 0%,
			rgba(var(--kbr-koyu-rgb), .78) 36%,
			rgba(var(--kbr-koyu-rgb), .95) 62%,
			var(--kbr-koyu) 100%
		);
	}
	.kbr-yapim-yazi { max-width: none; padding: 150px 0 46px; }
	.kbr-yapim-maddeler { gap: 8px; margin-bottom: 26px; }
	.kbr-yapim-maddeler li { font-size: 13px; padding: 7px 12px; }
	.kbr .kbr-yapim-btn { width: 100%; }
}

/* ==========================================================================
   1.4.0 — usta başvurusu

   Form sunucuya kayıt yapmaz; girilenler WhatsApp mesajına dönüştürülür.
   ========================================================================== */

.kbr-usta-alt-baslik {
	font-size: 18px; color: var(--kbr-koyu);
	margin: 26px 0 12px;
}

.kbr-usta-form {
	background: #fff;
	border: 1px solid var(--kbr-cizgi);
	border-radius: var(--kbr-radius);
	padding: 32px;
	box-shadow: var(--kbr-golge-yumusak);
}

/* Onay kutusu satırı.
   Önek zorunlu: ".kbr-form label { display: block }" kuralı daha yüksek
   özgüllükte olduğu için tek sınıflı bir flex tanımını eziyor. */
.kbr-form .kbr-onay,
.kbr-onay {
	display: flex; align-items: flex-start; gap: 10px;
	margin: 4px 0 20px;
}
.kbr .kbr-onay input {
	width: 18px; height: 18px; flex: 0 0 auto;
	margin-top: 2px; padding: 0;
	accent-color: var(--kbr-altin);
}
.kbr .kbr-form .kbr-onay span,
.kbr .kbr-onay span {
	display: inline; margin: 0; font-size: 14px; font-weight: 400;
	color: var(--kbr-gri); line-height: 1.5;
}

.kbr-form-not {
	margin: 12px 0 0;
	font-size: 13.5px; color: var(--kbr-gri);
}

/* Uzun listelerde tarayıcı önerisi için işaret */
.kbr-usta-form-alani input[list] { background-image: none; }

@media (max-width: 1024px) {
	.kbr-usta-form { padding: 26px 22px; }
	.kbr-usta-alt-baslik { margin-top: 22px; }
}

@media (max-width: 640px) {
	.kbr-usta-form { padding: 22px 18px; }
}

/* Menüdeki usta başvurusu bağlantısı ayrışsın: hizmet değil, ilan */
@media (min-width: 1025px) {
	.kbr-menu-liste .kbr-menu-usta > a {
		padding-left: 14px; margin-left: 2px;
		border-left: 1px solid var(--kbr-cizgi);
		color: var(--kbr-gri);
	}
	.kbr-menu-liste .kbr-menu-usta > a:hover { color: var(--kbr-altin); }
}
