/*
Theme Name: Medine
Theme URI: https://halisahamaliyeti.com.tr
Description: Medine Spor Yapı — halisahamaliyeti.com.tr kurumsal onepage teması. Bordo/krem palet, Source Sans 3, geleneksel kurumsal düzen, slider, interaktif maliyet hesaplayıcı, hizmet detay pencereleri, ölçüye göre maliyet blokları, Ankara hizmet bölgesi ve diğer spor zeminleri bölümleri.
Author: Medine Spor Yapı
Version: 3.3.2
Requires PHP: 7.4
Text Domain: medine
*/

/* ═══════════ Yazı tipi: Source Sans 3 (self-host, değişken) ═══════════ */
@font-face {
	font-family: "Source Sans 3";
	src: url("assets/fonts/source-sans-3-latin.woff2") format("woff2");
	font-weight: 200 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Source Sans 3";
	src: url("assets/fonts/source-sans-3-latin-ext.woff2") format("woff2");
	font-weight: 200 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Source Sans 3";
	src: url("assets/fonts/source-sans-3-italic-latin.woff2") format("woff2");
	font-weight: 200 900;
	font-style: italic;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Source Sans 3";
	src: url("assets/fonts/source-sans-3-italic-latin-ext.woff2") format("woff2");
	font-weight: 200 900;
	font-style: italic;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ═══════════ Tasarım token'ları ═══════════ */
:root {
	--msy-bordo: #7A1F2B;
	--msy-bordo-koyu: #5A141F;
	--msy-bordo-acik: #F5EAEA;
	--msy-krem: #FAF6EF;
	--msy-beyaz: #FFFFFF;
	--msy-murekkep: #2B2427;
	--msy-gri: #6C6266;
	--msy-cizgi: #E6DDD0;
	--msy-radius: 4px;
	--msy-govde: 17px;
	--msy-yazi: "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;
	--msy-golge: 0 1px 3px rgba(43, 36, 39, 0.07);
	--msy-gecis: 160ms ease;
}

/* ═══════════ Taban ═══════════ */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition: none !important; animation: none !important; }
}
body {
	font-family: var(--msy-yazi);
	font-size: var(--msy-govde);
	line-height: 1.65;
	color: var(--msy-murekkep);
	background: var(--msy-beyaz);
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
dialog { margin: auto; } /* genel reset dialog'un otomatik ortalamasını ezmesin */
a { color: var(--msy-bordo); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--msy-bordo-koyu); }
abbr[title] { text-decoration: none; color: var(--msy-bordo); }
:focus-visible { outline: 2px solid var(--msy-bordo); outline-offset: 2px; }

.orta { max-width: 1140px; margin-inline: auto; padding-inline: 24px; }
.orta-dar { max-width: 880px; }
.ortala { text-align: center; }
.hiza-sag { text-align: right; }
.rakam { font-variant-numeric: tabular-nums; }
.gorunmez {
	position: absolute; width: 1px; height: 1px; margin: -1px;
	clip-path: inset(50%); overflow: hidden; white-space: nowrap;
}
.atlama-baglantisi {
	position: absolute; left: -9999px; top: 0; z-index: 100;
	background: var(--msy-bordo-koyu); color: #fff; padding: 10px 18px;
}
.atlama-baglantisi:focus { left: 0; }

/* ═══════════ Üst bar (koyu bordo) ═══════════ */
.ustbar { background: var(--msy-bordo-koyu); color: #fff; font-size: 13.5px; letter-spacing: 0.02em; }
.ustbar-ici { display: flex; justify-content: space-between; align-items: center; min-height: 36px; gap: 16px; }
.ustbar a { color: #fff; text-decoration: none; }
.ustbar a:hover { text-decoration: underline; }
.ustbar-iletisim { display: flex; gap: 10px; flex-wrap: wrap; font-variant-numeric: tabular-nums; }
.ustbar-sag { display: flex; align-items: center; gap: 16px; }
.ustbar-konum { opacity: 0.75; }

/* Kompakt dil seçenekleri (bayrak + ad) */
.dil-secenekleri { display: flex; align-items: center; gap: 4px; }
.dil-secenekleri a {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 3px 8px; border-radius: 999px;
	font-size: 13px; font-weight: 600; text-decoration: none;
	color: rgba(255, 255, 255, 0.75);
	transition: background var(--msy-gecis), color var(--msy-gecis);
}
.dil-secenekleri a:hover { color: #fff; background: rgba(255, 255, 255, 0.12); }
.dil-secenekleri a.secili { color: #fff; background: rgba(255, 255, 255, 0.16); }
.dil-secenekleri .bayrak { border-radius: 2px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); opacity: 0.95; }

/* ═══════════ Başlık: bordo zemin, ortalı gezinme ═══════════ */
.tepe {
	background: var(--msy-bordo);
	color: #fff;
	position: sticky; top: 0; z-index: 50;
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.14);
}
.tepe-ici {
	display: grid; grid-template-columns: auto 1fr auto;
	align-items: center; min-height: 78px; gap: 20px;
}
.marka { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #fff; }
.marka:hover { color: #fff; }
.marka-muhru { color: var(--msy-krem); flex: none; }
.marka-yazi { display: flex; flex-direction: column; line-height: 1.05; }
.marka-yazi strong { font-size: 20px; font-weight: 800; letter-spacing: 0.03em; color: #fff; }
.marka-yazi small { font-size: 10px; font-weight: 600; letter-spacing: 0.36em; color: var(--msy-krem); opacity: 0.85; }

.gezinme { justify-self: center; }
.gezinme ul { display: flex; align-items: center; gap: 24px; list-style: none; }
.gezinme a:not(.tus) {
	color: rgba(255, 255, 255, 0.92); text-decoration: none;
	font-size: 15px; font-weight: 600; padding: 6px 2px;
	border-bottom: 2px solid transparent;
	transition: border-color var(--msy-gecis), color var(--msy-gecis);
}
.gezinme a:not(.tus):hover { color: #fff; border-bottom-color: var(--msy-krem); }
.gezinme-vurgusu { display: none; } /* CTA masaüstünde sağ blokta değil; mobil menüde görünür */

.tepe-sag { display: flex; align-items: center; gap: 12px; justify-self: end; }
/* Başlık CTA'sı — headera oranlı, küçük beyaz buton */
.tepe-cta {
	white-space: nowrap;
	padding: 5px 12px; font-size: 13px; font-weight: 600;
	border-radius: 3px;
	background: #fff; color: var(--msy-bordo-koyu);
}
.tepe-cta:hover { background: var(--msy-krem); color: var(--msy-bordo); }

.menu-anahtari { display: none; }

/* ═══════════ Düğmeler ═══════════ */
.tus {
	display: inline-block; font-family: inherit; font-size: 16px; font-weight: 600;
	padding: 12px 28px; border-radius: var(--msy-radius); border: 1px solid transparent;
	cursor: pointer; text-decoration: none; letter-spacing: 0.01em;
	transition: background var(--msy-gecis), color var(--msy-gecis), border-color var(--msy-gecis);
}
.tus-dolu { background: var(--msy-bordo); color: #fff; }
.tus-dolu:hover { background: var(--msy-bordo-koyu); color: #fff; }
.tus-cizgili { background: transparent; color: var(--msy-bordo); border-color: var(--msy-bordo); }
.tus-cizgili:hover { background: var(--msy-bordo-acik); color: var(--msy-bordo-koyu); }
.tus-krem { background: var(--msy-krem); color: var(--msy-bordo-koyu); }
.tus-krem:hover { background: #fff; color: var(--msy-bordo); }
.tus-seffaf { background: transparent; color: #fff; border-color: rgba(255, 255, 255, 0.7); }
.tus-seffaf:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
.tus-obegi { display: flex; gap: 14px; flex-wrap: wrap; }

/* ═══════════ Sahne (3 slaytlı tanıtım) ═══════════ */
.sahne { position: relative; background: var(--msy-bordo-koyu); overflow: hidden; }
/* Grid yığını: tüm slaytlar aynı hücrede — konteyner en uzun slayt kadar, her slayt tam yükseklik */
.sahne-seridi { display: grid; min-height: clamp(480px, 62vh, 640px); }
.sahne-karesi {
	grid-area: 1 / 1;
	position: relative;
	display: flex; align-items: center;
	opacity: 0; visibility: hidden;
	transition: opacity 600ms ease, visibility 600ms ease;
}
.sahne-karesi.etkin { opacity: 1; visibility: visible; z-index: 1; }
.sahne-fonu {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: cover; z-index: 0;
}
.sahne-golgesi {
	position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(100deg, rgba(56, 13, 20, 0.88) 0%, rgba(56, 13, 20, 0.72) 45%, rgba(56, 13, 20, 0.38) 100%);
}
.sahne-icerigi { position: relative; z-index: 2; width: 100%; padding-block: 84px; color: #fff; }
.sahne-etiketi {
	font-size: 13px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase;
	color: var(--msy-krem); opacity: 0.9; margin-bottom: 14px;
}
.sahne-icerigi h1, .sahne-basligi {
	font-size: clamp(30px, 4.6vw, 46px); font-weight: 800; line-height: 1.14;
	letter-spacing: -0.01em; max-width: 15em; margin-bottom: 18px;
}
.sahne-yazisi { font-size: 18px; max-width: 34em; color: rgba(255, 255, 255, 0.88); margin-bottom: 28px; }
.sahne-yonu {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
	width: 46px; height: 46px; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 50%;
	background: rgba(56, 13, 20, 0.35); color: #fff; font-size: 26px; line-height: 1;
	cursor: pointer; transition: background var(--msy-gecis);
}
.sahne-yonu:hover { background: rgba(56, 13, 20, 0.65); }
.sahne-geri { left: 18px; }
.sahne-ileri { right: 18px; }
.sahne-noktalari {
	position: absolute; left: 0; right: 0; bottom: 10px; z-index: 3;
	display: flex; justify-content: center; gap: 4px;
}
/* Görünen çizgi 34×4px kalır; dokunma alanı dolgu ile 44×32px'e çıkar
   (içerik kutusuna boyanarak görünüm değişmez). */
.sahne-noktalari button {
	width: 34px; height: 4px; border: none; border-radius: 2px;
	padding: 14px 5px; box-sizing: content-box;
	background: rgba(255, 255, 255, 0.35);
	background-clip: content-box;
	cursor: pointer;
	transition: background var(--msy-gecis);
}
.sahne-noktalari button.etkin { background: var(--msy-krem); background-clip: content-box; }
/* Dokunmatik cihazlarda oklar gizli olduğundan slayt kaydırma ile değişir. */
.sahne-seridi { touch-action: pan-y pinch-zoom; }

/* ═══════════ Bölüm iskeleti ═══════════ */
.kesim { padding: 72px 0; }
.kesim-krem { background: var(--msy-krem); border-block: 1px solid var(--msy-cizgi); }
.kesim-krem + .kesim-krem { border-top: none; }
.kesim-basi { text-align: center; max-width: 720px; margin: 0 auto 44px; }
.kesim-basi-sol { text-align: left; margin-inline: 0; }
.kesim-etiketi {
	font-size: 13px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--msy-bordo); margin-bottom: 10px;
}
.kesim-basi h1, .kesim-basi h2 { font-size: clamp(26px, 4vw, 34px); font-weight: 700; line-height: 1.2; }
.kesim-basi h2::after {
	content: ""; display: block; width: 56px; height: 3px;
	border-block: 1px solid var(--msy-bordo); margin: 18px auto 0;
}
.kesim-basi-sol h2::after { margin-inline: 0; }
.kesim-ozeti { margin-top: 18px; color: var(--msy-gri); }
.ferah-yazi { font-size: 18px; }

/* ═══════════ Tablolar ═══════════ */
/* Kenar gölgeleri tablonun yana kaydığını gösterir; uca gelindiğinde söner. */
.cizelge-tasiyici {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
	border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius);
	background:
		linear-gradient(to right, var(--msy-beyaz) 30%, rgba(255, 255, 255, 0)) left center / 30px 100% no-repeat local,
		linear-gradient(to left, var(--msy-beyaz) 30%, rgba(255, 255, 255, 0)) right center / 30px 100% no-repeat local,
		radial-gradient(farthest-side at 0 50%, rgba(43, 36, 39, 0.18), rgba(43, 36, 39, 0)) left center / 13px 100% no-repeat scroll,
		radial-gradient(farthest-side at 100% 50%, rgba(43, 36, 39, 0.18), rgba(43, 36, 39, 0)) right center / 13px 100% no-repeat scroll,
		var(--msy-beyaz);
	box-shadow: var(--msy-golge);
}
.cizelge-ipucu { display: none; }
.cizelge { width: 100%; border-collapse: collapse; font-size: 15.5px; }
.cizelge-genis { min-width: 560px; }
.cizelge th {
	background: var(--msy-bordo); color: #fff; text-align: left; font-weight: 600;
	padding: 12px 18px; font-size: 14px; letter-spacing: 0.04em;
}
.cizelge th.hiza-sag { text-align: right; }
.cizelge td { padding: 12px 18px; border-bottom: 1px solid var(--msy-cizgi); }
.cizelge tbody tr:last-child td { border-bottom: none; }
.cizelge tbody tr:nth-child(even) td { background: var(--msy-krem); }
.cizelge td.rakam { font-weight: 600; }
.cizelge-dipnotu { margin-top: 16px; font-size: 14.5px; color: var(--msy-gri); }

/* ═══════════ Fiyat kartları ═══════════ */
.tarife-dizisi { display: grid; grid-template-columns: repeat(2, minmax(0, 460px)); justify-content: center; gap: 30px; }
.tarife-karti {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-top: 4px solid var(--msy-bordo); border-radius: var(--msy-radius);
	box-shadow: var(--msy-golge); padding: 30px 32px;
	display: flex; flex-direction: column;
}
.tarife-basi { text-align: center; border-bottom: 1px solid var(--msy-cizgi); padding-bottom: 18px; margin-bottom: 18px; }
.tarife-basi h3 { font-size: 21px; font-weight: 800; }
.tarife-alt { font-size: 14px; color: var(--msy-gri); margin-top: 2px; }
.tarife-bandi { font-size: clamp(30px, 3.4vw, 38px); font-weight: 800; color: var(--msy-bordo); margin-top: 10px; line-height: 1.1; }
.tarife-bandi span { font-size: 16px; font-weight: 600; color: var(--msy-gri); }
.tarife-dahil-basi { font-size: 13px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--msy-bordo-koyu); margin-bottom: 10px; }
.tarife-dahil { list-style: none; margin-bottom: 16px; }
.tarife-dahil li {
	position: relative; padding: 5px 0 5px 26px; font-size: 15px;
	border-bottom: 1px dashed var(--msy-cizgi);
}
.tarife-dahil li:last-child { border-bottom: none; }
.tarife-dahil li::before {
	content: "✓"; position: absolute; left: 2px; top: 5px;
	color: var(--msy-bordo); font-weight: 700;
}
.tarife-ornek {
	background: var(--msy-bordo-acik); border-radius: var(--msy-radius);
	padding: 10px 14px; font-size: 14.5px; font-weight: 600; text-align: center;
	margin: auto 0 18px;
}
.tarife-opsiyonel { text-align: center; font-size: 14.5px; color: var(--msy-gri); margin-top: 26px; }
.tarife-alt-satir { margin-top: 14px; display: flex; justify-content: center; align-items: center; gap: 18px; flex-wrap: wrap; font-size: 14.5px; }
.guncel-rozet {
	display: inline-block; background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-radius: 999px; padding: 4px 14px; font-size: 13px; font-weight: 600; color: var(--msy-gri);
}

/* ═══════════ Hesaplayıcı ═══════════ */
.hesap-paneli {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-top: 4px solid var(--msy-bordo); border-radius: var(--msy-radius);
	box-shadow: var(--msy-golge); padding: 34px; max-width: 640px; margin: 0 auto;
}
.hesap-alan { margin-bottom: 20px; border: none; }
.hesap-alan legend, .hesap-alan label { font-size: 15px; font-weight: 600; display: block; margin-bottom: 7px; }
.secim-grubu { display: flex; gap: 12px; flex-wrap: wrap; }
.secim-grubu label {
	flex: 1; min-width: 160px; display: flex; align-items: center; gap: 9px;
	border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius);
	padding: 11px 14px; cursor: pointer; font-weight: 600; margin: 0;
	transition: border-color var(--msy-gecis), background var(--msy-gecis);
}
.secim-grubu label:has(input:checked) { border-color: var(--msy-bordo); background: var(--msy-bordo-acik); }
.secim-grubu input { accent-color: var(--msy-bordo); }
.hesap-paneli select, .hesap-paneli input[type="number"] {
	width: 100%; font-family: inherit; font-size: 15.5px; padding: 11px 12px;
	border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius);
	background: var(--msy-beyaz); color: var(--msy-murekkep);
}
.hesap-ozel-olcu { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hesap-ozel-olcu[hidden] { display: none; }
.hesap-sonuc {
	background: var(--msy-bordo-acik); border-radius: var(--msy-radius);
	padding: 20px 22px; margin-bottom: 22px;
}
.hesap-sonuc-etiket { font-size: 14px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--msy-bordo-koyu); }
.hesap-sonuc-tutar { font-size: clamp(24px, 4vw, 32px); font-weight: 800; color: var(--msy-bordo); font-variant-numeric: tabular-nums; line-height: 1.3; }
.hesap-sonuc-ayrinti { font-size: 14.5px; color: var(--msy-gri); }
.hesap-sonuc-notu { font-size: 13.5px; color: var(--msy-gri); margin-top: 8px; }
.hesap-jsyok { padding: 14px; background: var(--msy-krem); border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius); margin-bottom: 18px; }
.olcu-haplari { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.olcu-haplari label {
	display: flex; align-items: center; gap: 8px;
	border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius);
	padding: 10px 12px; cursor: pointer; font-size: 14.5px; font-weight: 600;
	transition: border-color var(--msy-gecis), background var(--msy-gecis);
}
.olcu-haplari label:has(input:checked) { border-color: var(--msy-bordo); background: var(--msy-bordo-acik); }
.olcu-haplari input { accent-color: var(--msy-bordo); }
.hesap-sonuc-birim { font-size: 14px; color: var(--msy-gri); margin-top: 4px; }
.hesap-dahil {
	border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius);
	background: var(--msy-krem); margin-bottom: 20px;
}
.hesap-dahil summary { cursor: pointer; padding: 11px 16px; font-size: 14.5px; font-weight: 700; color: var(--msy-bordo-koyu); }
.hesap-dahil p { padding: 0 16px 14px; font-size: 14.5px; color: var(--msy-gri); }
.hesap-eylemleri { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
.hesap-nasil { max-width: 640px; margin: 34px auto 0; text-align: center; }
.hesap-nasil h3 { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.hesap-nasil p { font-size: 15px; color: var(--msy-gri); }

/* ═══════════ Etkenler ═══════════ */
.etken-dizilimi {
	list-style: none; counter-reset: etken;
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px;
}
.etken-dizilimi li {
	counter-increment: etken;
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-radius: var(--msy-radius); padding: 26px; box-shadow: var(--msy-golge);
}
.etken-dizilimi li::before {
	content: counter(etken, decimal-leading-zero);
	display: block; font-size: 15px; font-weight: 800; letter-spacing: 0.08em;
	color: var(--msy-bordo); border-bottom: 1px solid var(--msy-cizgi);
	padding-bottom: 10px; margin-bottom: 14px; font-variant-numeric: tabular-nums;
}
.etken-dizilimi h3 { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.etken-dizilimi p { font-size: 15px; color: var(--msy-gri); }

/* ═══════════ Hizmet kartları + detay pencereleri ═══════════ */
.hizmet-dokusu { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.hizmet-levhasi {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-radius: var(--msy-radius); overflow: hidden; box-shadow: var(--msy-golge);
	transition: box-shadow var(--msy-gecis), transform var(--msy-gecis);
}
.hizmet-levhasi:hover { box-shadow: 0 6px 18px rgba(43, 36, 39, 0.14); transform: translateY(-2px); }
.hizmet-acici {
	display: block; width: 100%; text-align: left; border: none; padding: 0;
	background: none; cursor: pointer; font-family: inherit; color: inherit;
}
.hizmet-acici img { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; }
.hizmet-levhasi-yazisi { display: block; padding: 22px 24px 24px; border-top: 3px solid var(--msy-bordo); }
.hizmet-basligi { display: block; font-size: 18.5px; font-weight: 700; margin-bottom: 8px; }
.hizmet-ozeti { display: block; font-size: 15px; color: var(--msy-gri); line-height: 1.55; }
.hizmet-daveti { display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 700; color: var(--msy-bordo); }
.hizmet-acici:hover .hizmet-daveti { text-decoration: underline; text-underline-offset: 3px; }

.hizmet-penceresi {
	border: none; border-radius: var(--msy-radius); padding: 0;
	width: min(94vw, 760px); max-height: 88vh;
	background: var(--msy-beyaz); box-shadow: 0 18px 60px rgba(30, 8, 12, 0.4);
}
.hizmet-penceresi::backdrop { background: rgba(43, 20, 25, 0.8); }
.hizmet-penceresi-icerigi { overflow-y: auto; max-height: 88vh; position: relative; }
.hizmet-penceresi img { width: 100%; aspect-ratio: 5 / 2; object-fit: cover; }
.hizmet-penceresi-yazisi { padding: 30px 36px 36px; }
.hizmet-penceresi p, .hizmet-penceresi li { font-size: 15.5px; color: var(--msy-murekkep); }
/* Pencere içi başlıklar p etiketiyle kurulur (sayfa başlık hiyerarşisini şişirmemek için);
   görünüm eskiden h3/h4 ile aynıdır. Sınıf seçicisi .hizmet-penceresi p kuralını ezer. */
.hizmet-penceresi .pencere-adi {
	font-size: 26px; font-weight: 800; line-height: 1.2; color: var(--msy-murekkep);
	margin-bottom: 6px; padding-bottom: 12px; border-bottom: 2px solid var(--msy-bordo);
}
.hizmet-penceresi .pencere-alt-bas { font-size: 17px; font-weight: 700; color: var(--msy-bordo-koyu); margin: 22px 0 8px; }
.hizmet-penceresi ul { padding-left: 22px; }
.hizmet-penceresi li { margin-bottom: 6px; }
.hizmet-penceresi-cta { margin-top: 26px; }
.pencere-kapat {
	position: absolute; top: 12px; right: 12px; z-index: 2;
	width: 40px; height: 40px; border: none; border-radius: 50%;
	background: var(--msy-bordo); color: #fff; font-size: 22px; cursor: pointer;
	transition: background var(--msy-gecis);
}
.pencere-kapat:hover { background: var(--msy-bordo-koyu); }

/* ═══════════ Süreç ═══════════ */
.asama-akisi { list-style: none; counter-reset: adim; max-width: 680px; margin: 0 auto 26px; }
.asama-akisi li { counter-increment: adim; position: relative; padding: 0 0 30px 66px; }
.asama-akisi li::before {
	content: counter(adim);
	position: absolute; left: 0; top: 0;
	width: 42px; height: 42px; border-radius: 50%;
	background: var(--msy-bordo); color: #fff;
	font-weight: 700; font-size: 18px;
	display: flex; align-items: center; justify-content: center;
}
.asama-akisi li:not(:last-child)::after {
	content: ""; position: absolute; left: 20.5px; top: 46px; bottom: 4px;
	border-left: 1px dashed var(--msy-cizgi);
}
.asama-akisi h3 { font-size: 19px; font-weight: 700; margin-bottom: 6px; }
.asama-akisi p { color: var(--msy-gri); font-size: 15.5px; }

/* ═══════════ Kurumsal ═══════════ */
.firma-yerlesimi { display: grid; grid-template-columns: 1.35fr 1fr; gap: 52px; align-items: start; }
.firma-yazisi p { margin-bottom: 16px; }
.ilke-dizisi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 28px; }
.ilke {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-left: 3px solid var(--msy-bordo); border-radius: var(--msy-radius); padding: 16px 18px;
}
.ilke dt { font-weight: 700; font-size: 15.5px; margin-bottom: 5px; }
.ilke dd { font-size: 14px; color: var(--msy-gri); }
.firma-karesi img { border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius); }

/* ═══════════ Galeri ═══════════ */
.vitrin-dokusu { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.vitrin-karesi { display: block; border-radius: var(--msy-radius); overflow: hidden; border: 1px solid var(--msy-cizgi); }
.vitrin-karesi img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; transition: transform var(--msy-gecis); }
.vitrin-karesi:hover img { transform: scale(1.03); }
.vitrin-buyutec {
	border: none; border-radius: var(--msy-radius); padding: 0;
	max-width: min(92vw, 1100px); background: var(--msy-murekkep);
}
.vitrin-buyutec::backdrop { background: rgba(43, 36, 39, 0.82); }
.vitrin-buyutec img { max-height: 84vh; width: auto; max-width: 100%; margin: 0 auto; }
.vitrin-kapat {
	position: absolute; top: 8px; right: 8px; z-index: 2;
	width: 40px; height: 40px; border: none; border-radius: 50%;
	background: var(--msy-bordo); color: #fff; font-size: 22px; cursor: pointer;
}

/* ═══════════ Videolar ═══════════ */
.film-dokusu { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.film-karti { background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius); overflow: hidden; box-shadow: var(--msy-golge); }
.film-acici {
	position: relative; display: block; width: 100%; border: none; padding: 0;
	background: none; cursor: pointer;
}
.film-acici img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; transition: transform var(--msy-gecis); }
.film-acici:hover img { transform: scale(1.03); }
.film-oynat {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	color: #fff;
}
.film-oynat::before {
	content: ""; position: absolute; width: 64px; height: 64px; border-radius: 50%;
	background: rgba(90, 20, 31, 0.82); border: 2px solid rgba(255, 255, 255, 0.85);
	transition: transform var(--msy-gecis);
}
.film-acici:hover .film-oynat::before { transform: scale(1.08); }
.film-oynat svg { position: relative; margin-left: 4px; }
.film-karti h3 { font-size: 17.5px; font-weight: 700; padding: 16px 20px 4px; }
.film-karti p { font-size: 14.5px; color: var(--msy-gri); padding: 0 20px 20px; }
.film-penceresi {
	border: none; border-radius: var(--msy-radius); padding: 0;
	width: min(94vw, 1000px); background: #000;
}
.film-penceresi::backdrop { background: rgba(20, 6, 9, 0.88); }
.film-penceresi video { display: block; width: 100%; height: auto; }

/* ═══════════ Yatırımcı rehberi ═══════════ */
.rehber-dizisi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.rehber-karti {
	background: var(--msy-krem); border: 1px solid var(--msy-cizgi);
	border-top: 3px solid var(--msy-bordo); border-radius: var(--msy-radius);
	padding: 26px 28px;
}
.rehber-karti h3 { font-size: 18px; font-weight: 700; margin-bottom: 10px; }
.rehber-karti p { font-size: 15px; color: var(--msy-gri); }

/* ═══════════ Ölçüye göre maliyet — açıklama blokları ═══════════ */
.boyut-detaylari { margin-top: 38px; }
.boyut-detay-basi {
	font-size: 13px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
	color: var(--msy-bordo-koyu); text-align: center; margin-bottom: 20px;
}
.boyut-detay {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-left: 3px solid var(--msy-bordo); border-radius: var(--msy-radius);
	padding: 20px 24px; margin-bottom: 14px;
}
.boyut-detay:last-child { margin-bottom: 0; }
.boyut-detay h3 { font-size: 17.5px; font-weight: 700; margin-bottom: 8px; }
.boyut-detay p { font-size: 15px; color: var(--msy-gri); }

/* ═══════════ Diğer spor zeminleri ═══════════ */
.zemin-dizisi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.zemin-karti {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-radius: var(--msy-radius); box-shadow: var(--msy-golge);
	padding: 24px 26px;
}
.zemin-karti h3 {
	font-size: 17.5px; font-weight: 700; margin-bottom: 10px;
	padding-bottom: 10px; border-bottom: 1px solid var(--msy-cizgi);
}
.zemin-karti p { font-size: 15px; color: var(--msy-gri); }

/* ═══════════ Ankara / hizmet bölgesi ═══════════ */
.yerel-dizisi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.yerel-karti {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-top: 3px solid var(--msy-bordo); border-radius: var(--msy-radius);
	padding: 24px 26px;
}
.yerel-karti h3 { font-size: 17.5px; font-weight: 700; margin-bottom: 10px; }
.yerel-karti p { font-size: 15px; color: var(--msy-gri); }

.ilce-kusagi {
	margin-top: 34px; padding: 26px 28px;
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-radius: var(--msy-radius);
}
.ilce-basi {
	font-size: 15.5px; font-weight: 700; text-align: center; margin-bottom: 16px;
	color: var(--msy-bordo-koyu);
}
.ilce-serisi {
	list-style: none; display: flex; flex-wrap: wrap; justify-content: center;
	gap: 8px; margin-bottom: 18px;
}
.ilce-serisi li {
	font-size: 14.5px; padding: 5px 13px;
	background: var(--msy-krem); border: 1px solid var(--msy-cizgi);
	border-radius: 999px; color: var(--msy-murekkep);
}
.ilce-kusagi .cizelge-dipnotu { text-align: center; margin-top: 0; }

/* ═══════════ Maliyet rehberi — makale blokları ═══════════ */
.yazi-dizisi { display: grid; gap: 20px; }
.yazi-maddesi {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-left: 3px solid var(--msy-bordo); border-radius: var(--msy-radius);
	padding: 22px 26px;
}
.yazi-maddesi h3 { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.yazi-maddesi p { font-size: 15.5px; color: var(--msy-gri); }

/* ═══════════ SSS ═══════════ */
.soru-katari { border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius); background: var(--msy-beyaz); box-shadow: var(--msy-golge); }
.soru-maddesi { border-bottom: 1px solid var(--msy-cizgi); }
.soru-maddesi:last-child { border-bottom: none; }
.soru-maddesi summary {
	cursor: pointer; list-style: none; position: relative;
	font-weight: 700; font-size: 16.5px; padding: 18px 52px 18px 22px;
}
.soru-maddesi summary::-webkit-details-marker { display: none; }
/* Soru metni h3 ile işaretli; görünüm summary'nin kendi tipografisini korur. */
.soru-maddesi summary h3 { font: inherit; color: inherit; display: inline; }
.soru-maddesi summary::after {
	content: "+"; position: absolute; right: 20px; top: 50%;
	transform: translateY(-50%); font-size: 22px; font-weight: 400; color: var(--msy-bordo);
}
.soru-maddesi[open] summary::after { content: "−"; }
.soru-maddesi[open] summary { color: var(--msy-bordo-koyu); }
.soru-maddesi p { padding: 0 22px 20px; color: var(--msy-gri); max-width: 72ch; }

/* ═══════════ İletişim ═══════════ */
.basvuru-yerlesimi { display: grid; grid-template-columns: 1.35fr 1fr; gap: 44px; align-items: start; }
.talep-formu {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi);
	border-radius: var(--msy-radius); box-shadow: var(--msy-golge); padding: 30px;
}
.alan-obegi-cift { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.talep-formu p { margin-bottom: 16px; }
.talep-formu label { display: block; font-size: 14.5px; font-weight: 600; margin-bottom: 6px; }
.talep-formu input[type="text"], .talep-formu input[type="tel"], .talep-formu input[type="email"],
.talep-formu select, .talep-formu textarea {
	width: 100%; font-family: inherit; font-size: 15.5px; padding: 11px 12px;
	border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius);
	background: var(--msy-beyaz); color: var(--msy-murekkep);
}
.talep-formu textarea { resize: vertical; }
.riza-kutusu label { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: 14px; color: var(--msy-gri); }
.riza-kutusu input { margin-top: 3px; accent-color: var(--msy-bordo); }
.balkupu { position: absolute; left: -9999px; }
.basvuru-kunyesi h3 { font-size: 18px; font-weight: 700; margin-bottom: 14px; }
.basvuru-kunyesi address { font-style: normal; }
.basvuru-kunyesi address p { margin-bottom: 8px; }
.konum-penceresi { margin-top: 20px; border: 1px solid var(--msy-cizgi); border-radius: var(--msy-radius); overflow: hidden; }
.konum-penceresi iframe { display: block; width: 100%; height: 260px; border: 0; }

/* ═══════════ Yasal / içerik sayfaları ═══════════ */
.duz-sayfa { padding: 64px 0; }
.duz-sayfa h1 { font-size: clamp(26px, 4vw, 34px); margin-bottom: 22px; }
.duzyazi h2 { font-size: 22px; margin: 28px 0 12px; }
.duzyazi h3 { font-size: 18px; margin: 22px 0 10px; }
.duzyazi p, .duzyazi li { margin-bottom: 12px; color: var(--msy-murekkep); }
.duzyazi ul, .duzyazi ol { padding-left: 24px; }
.duzyazi table { width: 100%; border-collapse: collapse; margin: 16px 0; }
.duzyazi th, .duzyazi td { border: 1px solid var(--msy-cizgi); padding: 9px 12px; text-align: left; font-size: 15px; }
.duzyazi th { background: var(--msy-krem); }
.hata-kod { font-size: 68px; font-weight: 800; color: var(--msy-bordo); font-variant-numeric: tabular-nums; }

/* ═══════════ Footer ═══════════ */
.altyapi { background: var(--msy-bordo-koyu); color: #fff; }
.altyapi-ici {
	display: grid; grid-template-columns: 1.5fr 1fr 1.5fr 1.1fr;
	gap: 40px; padding-block: 52px;
}
.altyapi-marka .marka { color: var(--msy-krem); }
.altyapi-marka .marka-yazi strong { color: #fff; }
.altyapi-marka .marka-yazi small { color: var(--msy-krem); opacity: 0.85; }
.altyapi-marka p { margin-top: 16px; font-size: 15px; color: rgba(255, 255, 255, 0.85); max-width: 30ch; }
.altyapi-kolon-basi {
	font-size: 13.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
	color: rgba(255, 255, 255, 0.6); margin-bottom: 14px;
}
.altyapi-sutun ul { list-style: none; }
.altyapi-sutun li { margin-bottom: 9px; font-size: 15px; color: rgba(255, 255, 255, 0.85); }
.altyapi-sutun address { font-style: normal; }
.altyapi-sutun a { color: #fff; text-decoration: none; }
.altyapi-sutun a:hover { text-decoration: underline; }

/* Oklu / ikonlu madde listeleri */
.madde-listesi li { display: flex; align-items: baseline; gap: 9px; }
.madde-oku { flex: none; color: var(--msy-krem); opacity: 0.55; transform: translateY(1px); }
.madde-listesi li:hover .madde-oku { opacity: 1; }

/* Çipli iletişim künyesi */
.kunye-listesi li { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 12px; }
.kunye-cipi {
	flex: none; width: 28px; height: 28px;
	display: inline-flex; align-items: center; justify-content: center;
	background: rgba(255, 255, 255, 0.09);
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 7px; color: var(--msy-krem);
	transform: translateY(-3px);
}
.kunye-listesi li:hover .kunye-cipi { background: rgba(255, 255, 255, 0.16); }
.altyapi-telif { border-top: 1px solid rgba(255, 255, 255, 0.16); padding-block: 16px; font-size: 13.5px; color: rgba(255, 255, 255, 0.65); text-align: center; }

/* ═══════════ WhatsApp bağlantısı ═══════════ */
.ws-hatti {
	position: fixed; right: 20px; z-index: 60;
	bottom: calc(20px + env(safe-area-inset-bottom));
	display: flex; align-items: center; gap: 8px;
	background: var(--msy-bordo); color: #fff; text-decoration: none;
	font-size: 14.5px; font-weight: 600;
	padding: 11px 16px; border-radius: 999px; box-shadow: 0 3px 10px rgba(43, 36, 39, 0.25);
	transition: background var(--msy-gecis);
}
.ws-hatti:hover { background: var(--msy-bordo-koyu); color: #fff; }

/* ═══════════ Duyarlı düzen ═══════════ */
@media (max-width: 1080px) {
	.gezinme ul { gap: 13px; }
	.gezinme a:not(.tus) { font-size: 13.5px; }
}
@media (max-width: 1000px) {
	.etken-dizilimi, .hizmet-dokusu, .film-dokusu, .rehber-dizisi,
	.zemin-dizisi, .yerel-dizisi { grid-template-columns: repeat(2, 1fr); }
	.tarife-dizisi { grid-template-columns: 1fr; }
	.vitrin-dokusu { grid-template-columns: repeat(3, 1fr); }
	.altyapi-ici { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 920px) {
	.firma-yerlesimi, .basvuru-yerlesimi { grid-template-columns: 1fr; }
	.firma-karesi { display: none; }

	/* Mobil başlık: flex düzen (grid hücresi, absolute paneli hapsediyordu) */
	.tepe-ici { display: flex; justify-content: space-between; }

	/* Mobil gezinme: bordo panel */
	.menu-anahtari {
		display: inline-flex; align-items: center; justify-content: center;
		width: 46px; height: 46px; border: 1px solid rgba(255, 255, 255, 0.4);
		border-radius: var(--msy-radius); background: transparent; cursor: pointer;
	}
	.menu-anahtari-cizgileri { display: flex; flex-direction: column; gap: 5px; }
	.menu-anahtari-cizgileri i { display: block; width: 20px; height: 2px; background: #fff; }
	.gezinme {
		display: none; position: absolute; left: 0; right: 0; top: 100%; width: 100%;
		justify-self: auto; background: var(--msy-bordo);
		border-top: 1px solid rgba(255, 255, 255, 0.15);
		box-shadow: 0 12px 24px rgba(30, 8, 12, 0.3);
		max-height: calc(100vh - 78px); overflow-y: auto;
		-webkit-overflow-scrolling: touch; overscroll-behavior: contain;
	}
	/* Mobil tarayıcı araç çubuğu 100vh'yi yanıltıcı kılar. */
	@supports (height: 100dvh) {
		.gezinme { max-height: calc(100dvh - 78px); }
	}
	.gezinme.acik { display: block; }
	.gezinme ul { flex-direction: column; align-items: stretch; gap: 0; padding: 10px 24px 20px; }
	.gezinme li { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
	.gezinme li:last-child { border-bottom: none; }
	.gezinme a:not(.tus) { display: block; padding: 13px 2px; font-size: 16px; border-bottom: none; }
	.gezinme-vurgusu { display: block; padding-top: 14px; }
	.gezinme-vurgusu .tus { display: block; text-align: center; }
	.tepe-cta { display: none; } /* CTA mobilde menü içinde */
	.sahne-yonu { display: none; }
}
@media (max-width: 640px) {
	.kesim { padding: 52px 0; }
	.etken-dizilimi, .hizmet-dokusu, .film-dokusu, .rehber-dizisi, .ilke-dizisi, .alan-obegi-cift, .hesap-ozel-olcu, .olcu-haplari,
	.zemin-dizisi, .yerel-dizisi { grid-template-columns: 1fr; }
	.zemin-karti, .yerel-karti { padding: 20px 22px; }
	.ilce-kusagi { padding: 22px 18px; }
	.boyut-detay { padding: 18px 20px; }
	.vitrin-dokusu { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.altyapi-ici { grid-template-columns: 1fr; gap: 28px; }
	.ustbar-ici { justify-content: center; flex-wrap: wrap; row-gap: 2px; }
	.ustbar-iletisim { justify-content: center; }
	.ustbar-konum { display: none; }
	.hesap-paneli, .talep-formu { padding: 22px; }
	.ws-hatti span { display: none; }
	.ws-hatti { padding: 13px; }
	.sahne-icerigi { padding-block: 64px 84px; }
	.hizmet-penceresi-yazisi { padding: 22px; }
	/* 8,5px marka alt yazısı telefonda okunmuyordu; harf aralığı kısaltılarak
	   aynı genişlikte kalırken punto büyütüldü. */
	.marka-yazi strong { font-size: 17px; }
	.marka-yazi small { font-size: 10px; letter-spacing: 0.22em; }
}

/* ═══════════ Mobil kullanım: dokunma, okunabilirlik, güvenli alan ═══════════ */
@media (max-width: 920px) {
	/* iOS 16px altındaki form alanlarına odaklanınca sayfayı yakınlaştırır. */
	.talep-formu input[type="text"], .talep-formu input[type="tel"],
	.talep-formu input[type="email"], .talep-formu select, .talep-formu textarea,
	.hesap-paneli select, .hesap-paneli input[type="number"] { font-size: 16px; }

	/* Dokunma hedefleri */
	.dil-secenekleri a { padding: 10px 11px; }
	.ustbar-iletisim a { display: inline-block; padding: 9px 0; }

	/* Üst çubukta artık İKİ numara var; e-posta ile birlikte tablet genişliğinde
	   de tek satıra sığmıyor (ölçümde 768px'de çubuk 2 satıra çıkıyordu). E-posta
	   burada düşer — iletişim bölümünde ve alt bilgide zaten yer alıyor.
	   Seçiciler `.ustbar-iletisim` ile kapsanmalı: hemen üstteki
	   `.ustbar-iletisim a` kuralı 0-1-1 özgüllüğünde, yalın `.ustbar-eposta`
	   0-1-0 olduğu için sıradan bağımsız kaybederdi. */
	.ustbar-iletisim .ustbar-ayrac-eposta,
	.ustbar-iletisim .ustbar-eposta { display: none; }
	.altyapi-sutun li { margin-bottom: 2px; }
	.altyapi-sutun li a { display: inline-block; padding: 10px 0; }
	.kunye-listesi li { margin-bottom: 4px; }
	.kunye-listesi li a { display: inline-block; padding: 10px 0; }
	/* Bağlantılara dikey dolgu eklendiğinde ok/çip simgeleri metinle aynı
	   hizada kalsın (taban çizgisi hizası dolgu kadar kayıyordu). */
	.madde-listesi li { align-items: center; }
	.kunye-listesi li:has(a) { align-items: center; }
	.kunye-listesi li:has(a) .kunye-cipi { transform: none; }
	.tarife-alt-satir a { display: inline-block; padding: 9px 0; }
	.sahne-noktalari button { padding-block: 18px; }
	.secim-grubu input, .olcu-haplari input, .riza-kutusu input { width: 20px; height: 20px; flex: none; }
	.riza-kutusu input { margin-top: 2px; }
	.soru-maddesi summary { padding-top: 17px; padding-bottom: 17px; }
	.hesap-dahil summary { padding-top: 14px; padding-bottom: 14px; }
	.marka { min-height: 46px; }

	/* Yatay kaydırmalı tablo yazıyla da bildirilir. */
	.cizelge-ipucu {
		display: block; margin: 0 0 10px;
		font-size: 14px; color: var(--msy-gri); text-align: center;
	}
	.cizelge-ipucu::before { content: "↔ "; color: var(--msy-bordo); font-weight: 700; }
	.cizelge-tasiyici:focus-visible { outline: 2px solid var(--msy-bordo); outline-offset: 2px; }

	a, button, summary, label { -webkit-tap-highlight-color: rgba(122, 31, 43, 0.12); }
}

@media (max-width: 560px) {
	/* E-posta ve ayracı ≤920px bloğunda düşüyor (iki numarayla birlikte tek
	   satıra sığmıyor). Burada yalnızca boşluk daraltılır; `.ustbar-ici` (≤640px)
	   flex-wrap olduğu için iki numara sığmazsa taşma yerine dil seçeneklerini
	   alt satıra sarar. */
	.ustbar-ici { gap: 12px; }

	/* Sahne düğmeleri eşit genişlikte yığılsın — kırık kenar görüntüsü kalmasın. */
	.sahne-icerigi .tus-obegi { flex-direction: column; align-items: stretch; }
	.sahne-icerigi .tus-obegi .tus { text-align: center; }
	.cizelge th, .cizelge td { padding: 10px 12px; }
	.cizelge { font-size: 15px; }
	/* Yasal sayfalardaki tablolar dar ekranda sıkışmasın. */
	/* break-word: yalnızca sığmayan sözcüğü böler. "anywhere" olsaydı sütunun
	   asgari genişliğini de küçültüp sığan sözcükleri de bölerdi. */
	.duzyazi th, .duzyazi td { padding: 7px 8px; font-size: 14px; overflow-wrap: break-word; }
}

@media (max-width: 400px) {
	.orta { padding-inline: 16px; }
	.tarife-karti { padding: 24px 20px; }
	.etken-dizilimi li { padding: 20px; }
	.hizmet-levhasi-yazisi { padding: 18px 18px 20px; }
	.rehber-karti, .yazi-maddesi { padding: 18px 18px; }
	.hesap-paneli, .talep-formu { padding: 18px; }
	.hata-kod { font-size: 54px; }
	.sahne-icerigi { padding-block: 56px 76px; }
}

/* ═══════════ Alt sayfa uzantıları (kapalı saha ısıtma ve enerji maliyeti, 3.4.0) ═══════════
   Yeni bileşen değil: ana sayfa bileşenlerinin (sahne, tarife kartı, çizelge, etken/rehber/zemin
   kartları, aşama akışı) alt sayfada gereken küçük varyantları. */
.sahne-tekil .sahne-seridi { min-height: clamp(460px, 58vh, 600px); }
.sahne-kunyesi {
	list-style: none; display: flex; flex-wrap: wrap; gap: 6px 24px;
	margin: -8px 0 26px; font-size: 15.5px; font-weight: 600; color: rgba(255, 255, 255, 0.92);
}
.sahne-kunyesi li { position: relative; padding-left: 22px; }
.sahne-kunyesi li::before { content: "✓"; position: absolute; left: 0; color: var(--msy-krem); font-weight: 800; }

.kisa-cevap {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi); border-left: 3px solid var(--msy-bordo);
	border-radius: var(--msy-radius); padding: 16px 20px; text-align: left; color: var(--msy-murekkep);
}
.tarife-dizisi-uclu { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.tarife-gorseli { margin: -30px -32px 20px; }
.tarife-gorseli img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.tarife-dizisi-uclu .tarife-bandi { font-size: clamp(22px, 2.2vw, 26px); }
.tarife-dizisi-uclu .tarife-bandi span { display: block; font-size: 14px; margin-top: 2px; }
.tarife-devam { text-align: center; font-size: 14.5px; font-weight: 600; margin: -6px 0 16px; }
.devam-baglantisi { margin-top: 12px; font-size: 15px; font-weight: 600; }
.yazi-maddesi .devam-baglantisi, .rehber-karti .devam-baglantisi { color: inherit; }

.cizelge-cok-genis { min-width: 720px; }
.cizelge td.vurgulu { font-weight: 700; color: var(--msy-bordo-koyu); }
.cizelge .th-alt { display: block; font-size: 12px; font-weight: 400; opacity: 0.85; letter-spacing: 0.02em; }
.ara-baslik { font-size: 19px; font-weight: 700; text-align: center; margin: 44px 0 18px; }

.etken-dizilimi-ikili { grid-template-columns: repeat(2, 1fr); }
.etken-dizilimi .uygun-yapi {
	margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--msy-cizgi);
	font-size: 14.5px; color: var(--msy-murekkep);
}
.firma-yazisi .cizelge-tasiyici { margin-top: 8px; }
/* Alt sayfada görsel sütunu metin sütununun boyuna esner: altta boş kalan şerit olmasın. */
.alt-sayfa .firma-yerlesimi { align-items: stretch; }
.alt-sayfa .firma-karesi { position: relative; min-height: 420px; }
.alt-sayfa .firma-karesi img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.rehber-karti-beyaz { background: var(--msy-beyaz); }
.onlem-kutusu { margin-top: 26px; }
.onlem-listesi { padding-left: 20px; }
.onlem-listesi li { font-size: 15.5px; color: var(--msy-gri); margin-bottom: 7px; }
.varsayim-listesi { columns: 2; column-gap: 36px; }
.varsayim-listesi li { break-inside: avoid; }

.zemin-karti .rakam-karti-degeri {
	font-size: clamp(22px, 2.6vw, 28px); font-weight: 800; color: var(--msy-bordo);
	line-height: 1.2; margin-bottom: 6px; font-variant-numeric: tabular-nums;
}
.zemin-karti.ortala h3 { text-align: center; }
.duz-paragraf { max-width: 780px; margin: 30px auto 0; }
.duz-paragraf p { margin-bottom: 14px; }
.orta-dar .duz-paragraf { max-width: none; }

.formul-dizisi { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-bottom: 22px; }
.formul-dizisi li {
	background: var(--msy-beyaz); border: 1px solid var(--msy-cizgi); border-top: 3px solid var(--msy-bordo);
	border-radius: var(--msy-radius); padding: 14px 16px; text-align: center; font-weight: 600; font-size: 15px;
}
.orta-dar-ic { max-width: 760px; margin: 0 auto; }
.asama-akisi h4 { font-size: 18px; font-weight: 700; margin-bottom: 6px; }

.kart-etiketi {
	display: inline-block; margin-bottom: 10px; padding: 2px 10px; border-radius: 999px;
	font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
	background: var(--msy-krem); border: 1px solid var(--msy-cizgi);
}
.zemin-karti .kart-etiketi { color: var(--msy-gri); font-size: 12px; }
.zemin-karti .kart-etiketi-uyari { background: var(--msy-bordo-acik); border-color: transparent; color: var(--msy-bordo-koyu); }
.cta-obegi { justify-content: center; margin-top: 34px; }

@media (max-width: 1000px) {
	.tarife-dizisi-uclu { grid-template-columns: minmax(0, 560px); }
	.formul-dizisi { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.etken-dizilimi-ikili, .varsayim-listesi { grid-template-columns: 1fr; columns: 1; }
	.ara-baslik { font-size: 17.5px; margin-top: 34px; }
	.cta-obegi { flex-direction: column; align-items: stretch; }
	.cta-obegi .tus { text-align: center; }
}
@media (max-width: 400px) {
	.tarife-gorseli { margin: -24px -20px 18px; }
}

/* Yatay tutulan telefonlarda pencereler ekrana sığsın. */
@media (max-height: 520px) and (orientation: landscape) {
	.hizmet-penceresi, .hizmet-penceresi-icerigi { max-height: 94vh; }
	.hizmet-penceresi img { aspect-ratio: 8 / 2; }
	.vitrin-buyutec img { max-height: 82vh; }
	.sahne-seridi { min-height: 420px; }
}
