/*
 * Tasima CMS - temel kamuya acik stil.
 *
 * Bu dosya temalardan bagimsizdir ve her temada gecerli olan iskeleti kurar:
 * duzen, tipografi olcegi, form gorunumu, erisilebilirlik davranislari.
 * Renkler, yazi tipleri, kose yuvarlakligi ve bolum bosluklari tema
 * degiskenlerinden okunur; tema dosyasi yalnizca bu degiskenleri ve kendi
 * bilesen farklarini tanimlar.
 *
 * Mobil oncelikli yazilmistir: varsayilan kurallar kucuk ekran icindir,
 * genisleyen ekranlar medya sorgulariyla eklenir.
 */

:root {
	--renk-birincil: #12315b;
	--renk-ikincil: #1f5aa6;
	--renk-vurgu: #e2703a;
	--renk-yuzey: #ffffff;
	--renk-metin: #1c2530;
	--yazi-baslik: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--yazi-metin: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--kose-yuvarlakligi: 10px;
	--bolum-boslugu: 72px;

	/* Turetilmis degerler; tema yalnizca ustteki degiskenleri verir. */
	--renk-kenar: rgba(28, 37, 48, 0.16);
	--renk-soluk-zemin: rgba(28, 37, 48, 0.04);
	--renk-soluk-metin: rgba(28, 37, 48, 0.72);
	--kabuk-genisligi: 1180px;
	--kabuk-boslugu: 20px;
}

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: var(--yazi-metin);
	font-size: 1rem;
	line-height: 1.65;
	color: var(--renk-metin);
	background: var(--renk-yuzey);
	/* Yatay tasma kalici bir mobil hatasidir; kokten engellenir. */
	overflow-x: hidden;
}

h1,
h2,
h3,
h4 {
	font-family: var(--yazi-baslik);
	line-height: 1.25;
	margin: 0 0 0.6em;
	text-wrap: balance;
}

h1 {
	font-size: clamp(1.75rem, 1.35rem + 2vw, 2.75rem);
}

h2 {
	font-size: clamp(1.4rem, 1.2rem + 1.1vw, 2rem);
}

h3 {
	font-size: clamp(1.15rem, 1.05rem + 0.5vw, 1.4rem);
}

p,
ul,
ol,
dl,
table,
figure,
blockquote {
	margin: 0 0 1em;
}

img,
picture,
video,
iframe {
	max-width: 100%;
	height: auto;
}

a {
	color: var(--renk-ikincil);
	text-underline-offset: 0.18em;
}

a:hover {
	color: var(--renk-birincil);
}

/* Odak her zaman gorunur olmalidir; kaldirilmaz, belirginlestirilir. */
:focus-visible {
	outline: 3px solid var(--renk-vurgu);
	outline-offset: 2px;
}

/* Yalnizca ekran okuyucuya yonelik metin. */
.gorsel-disi {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.kabuk {
	width: 100%;
	max-width: var(--kabuk-genisligi);
	margin-inline: auto;
	padding-inline: var(--kabuk-boslugu);
}

/* Klavye kullanicisi icin icerige atlama baglantisi. */
.atlama-baglantisi {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
	padding: 12px 18px;
	background: var(--renk-birincil);
	color: #fff;
	text-decoration: none;
}

.atlama-baglantisi:focus {
	left: 8px;
	top: 8px;
}

/* ---------- Baslik ve gezinti ---------- */

.site-basligi {
	border-bottom: 1px solid var(--renk-kenar);
	background: var(--renk-yuzey);
}

.site-basligi-ic {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 68px;
}

.marka {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--yazi-baslik);
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--renk-birincil);
	text-decoration: none;
}

.marka img {
	max-height: 44px;
	width: auto;
}

/* Dokunma hedefleri en az 44 piksel olacak sekilde olculmustur. */
.menu-dugmesi {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 8px 12px;
	font: inherit;
	color: var(--renk-birincil);
	background: transparent;
	border: 1px solid var(--renk-kenar);
	border-radius: var(--kose-yuvarlakligi);
	cursor: pointer;
}

.ana-gezinti {
	display: none;
	flex-basis: 100%;
	padding-bottom: 12px;
}

/* Betik yuklenmezse menu acik kalir; icerik erisilemez olmaz. */
.ana-gezinti.acik,
html:not(.betik-var) .ana-gezinti {
	display: block;
}

.ana-gezinti ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.ana-gezinti a {
	display: block;
	padding: 12px 4px;
	color: var(--renk-metin);
	text-decoration: none;
	border-bottom: 1px solid var(--renk-kenar);
}

.ana-gezinti a[aria-current="page"] {
	color: var(--renk-birincil);
	font-weight: 700;
}

.basliktaki-eylem {
	display: none;
}

/* ---------- Kirilma ve sayfa basligi ---------- */

.kirilma {
	padding: 14px 0 0;
	font-size: 0.9rem;
	color: var(--renk-soluk-metin);
}

.kirilma ol {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
}

.kirilma li:not(:last-child)::after {
	content: "/";
	margin-left: 6px;
	color: var(--renk-kenar);
}

.sayfa-basligi {
	padding: 28px 0 8px;
}

.sayfa-ozeti {
	font-size: 1.1rem;
	color: var(--renk-soluk-metin);
	max-width: 70ch;
}

.ust-baslik {
	display: block;
	font-size: 0.85rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--renk-vurgu);
}

/* ---------- Bloklar ve bolumler ---------- */

.blok,
.icerik-bolumu {
	padding-block: calc(var(--bolum-boslugu) / 2);
}

.bolum-basligi {
	margin-bottom: 0.4em;
}

.bolum-aciklamasi {
	max-width: 70ch;
	color: var(--renk-soluk-metin);
}

.kisa-cevap {
	padding: 18px 20px;
	background: var(--renk-soluk-zemin);
	border-left: 4px solid var(--renk-vurgu);
	border-radius: var(--kose-yuvarlakligi);
	max-width: 80ch;
}

.kisa-cevap-basligi {
	font-size: 1rem;
	margin-bottom: 0.3em;
}

.zengin-metin {
	max-width: 75ch;
}

.zengin-metin img {
	border-radius: var(--kose-yuvarlakligi);
}

.zengin-metin table {
	width: 100%;
	border-collapse: collapse;
}

.zengin-metin th,
.zengin-metin td {
	padding: 10px 12px;
	border: 1px solid var(--renk-kenar);
	text-align: left;
}

/* Mobilde gizlenmesi secilen bloklar. */
.mobilde-gizli {
	display: none;
}

/* ---------- Dugmeler ---------- */

.dugme {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 12px 22px;
	font: inherit;
	font-weight: 600;
	color: #fff;
	background: var(--renk-vurgu);
	border: 1px solid transparent;
	border-radius: var(--kose-yuvarlakligi);
	text-decoration: none;
	cursor: pointer;
}

.dugme:hover {
	color: #fff;
	filter: brightness(0.94);
}

.dugme-ikincil {
	color: var(--renk-birincil);
	background: transparent;
	border-color: currentColor;
}

.dugme-ikincil:hover {
	color: var(--renk-birincil);
	background: var(--renk-soluk-zemin);
}

/* ---------- Kartlar ve izgaralar ---------- */

.kart-izgarasi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
}

.kart {
	display: flex;
	flex-direction: column;
	padding: 20px;
	background: var(--renk-yuzey);
	border: 1px solid var(--renk-kenar);
	border-radius: var(--kose-yuvarlakligi);
}

.kart-gorselli {
	padding: 0;
	overflow: hidden;
}

.kart-gorselli .kart-basligi,
.kart-gorselli p {
	padding-inline: 20px;
}

.kart-gorselli p:last-child {
	padding-bottom: 20px;
}

.kart-gorseli {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}

.kart-basligi {
	font-size: 1.1rem;
	margin-top: 16px;
	margin-bottom: 0.35em;
}

.kart-gorselli .kart-basligi {
	margin-top: 16px;
}

.kart-basligi a {
	color: var(--renk-birincil);
	text-decoration: none;
}

.kart-basligi a:hover {
	text-decoration: underline;
}

.kart-not {
	font-size: 0.92rem;
	color: var(--renk-soluk-metin);
	margin-bottom: 0.4em;
}

.etiket {
	display: inline-block;
	padding: 2px 8px;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--renk-birincil);
	background: var(--renk-soluk-zemin);
	border-radius: 999px;
}

.etiket-listesi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.etiket-listesi a {
	display: inline-block;
	padding: 8px 14px;
	border: 1px solid var(--renk-kenar);
	border-radius: 999px;
	text-decoration: none;
}

.duz-liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.duz-liste li {
	padding: 8px 0;
	border-bottom: 1px solid var(--renk-kenar);
}

.bos-durum {
	padding: 20px;
	background: var(--renk-soluk-zemin);
	border-radius: var(--kose-yuvarlakligi);
	color: var(--renk-soluk-metin);
}

.guncelleme-bilgisi {
	font-size: 0.88rem;
	color: var(--renk-soluk-metin);
}

/* ---------- Tanitim (kahraman) ---------- */

.tanitim {
	padding-block: calc(var(--bolum-boslugu) / 2);
	background: var(--renk-soluk-zemin);
}

.tanitim-metni {
	max-width: 62ch;
}

.tanitim-basligi {
	margin-bottom: 0.4em;
}

.tanitim-aciklamasi {
	font-size: 1.1rem;
	color: var(--renk-soluk-metin);
}

.tanitim-maddeleri {
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	display: grid;
	gap: 8px;
}

.tanitim-maddeleri li {
	padding-left: 26px;
	position: relative;
}

.tanitim-maddeleri li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 0.62em;
	width: 10px;
	height: 10px;
	background: var(--renk-vurgu);
	border-radius: 2px;
}

.tanitim-butonlari {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.tanitim-gorseli {
	margin-top: 24px;
}

.tanitim-gorseli img {
	width: 100%;
	border-radius: var(--kose-yuvarlakligi);
}

/* ---------- Gorsel + metin ---------- */

.gorsel-metin {
	display: grid;
	gap: 24px;
}

.gorsel-metin-gorseli img {
	width: 100%;
	border-radius: var(--kose-yuvarlakligi);
}

/* ---------- Surec, guven, etkenler ---------- */

.surec-adimlari,
.surec-listesi {
	list-style: none;
	counter-reset: adim;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 18px;
}

.surec-adimi,
.surec-listesi li {
	position: relative;
	padding-left: 52px;
	counter-increment: adim;
}

.surec-adimi::before,
.surec-listesi li::before {
	content: counter(adim);
	position: absolute;
	left: 0;
	top: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	font-family: var(--yazi-baslik);
	font-weight: 700;
	color: #fff;
	background: var(--renk-birincil);
	border-radius: 50%;
}

.adim-basligi {
	font-size: 1.05rem;
	margin-bottom: 0.25em;
}

.guven-listesi,
.etken-listesi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 18px;
}

.guven-ogesi,
.etken-ogesi {
	padding: 18px;
	border: 1px solid var(--renk-kenar);
	border-radius: var(--kose-yuvarlakligi);
}

.guven-basligi,
.etken-basligi {
	font-size: 1.02rem;
	margin-bottom: 0.3em;
}

/* ---------- Tablolar ve gostergeler ---------- */

/* Kaydirilabilir tablo klavyeyle de gezilebilir olmalidir. */
.tablo-sarmali {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.karsilastirma-tablosu {
	width: 100%;
	border-collapse: collapse;
	min-width: 480px;
}

.karsilastirma-tablosu th,
.karsilastirma-tablosu td {
	padding: 12px 14px;
	border: 1px solid var(--renk-kenar);
	text-align: left;
	vertical-align: top;
}

.karsilastirma-tablosu thead th {
	background: var(--renk-soluk-zemin);
}

.gosterge-listesi {
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.gosterge-degeri {
	font-family: var(--yazi-baslik);
	font-size: clamp(1.6rem, 1.3rem + 1.4vw, 2.4rem);
	font-weight: 700;
	color: var(--renk-birincil);
	line-height: 1.1;
}

.gosterge-etiketi {
	margin: 4px 0 0;
	font-size: 0.92rem;
	color: var(--renk-soluk-metin);
}

/* ---------- Gorusler ---------- */

.gorus-listesi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 20px;
}

.gorus-karti {
	padding: 20px;
	background: var(--renk-soluk-zemin);
	border-radius: var(--kose-yuvarlakligi);
}

.gorus-karti blockquote {
	margin: 0 0 12px;
	font-size: 1.02rem;
}

.gorus-sahibi {
	font-weight: 700;
	margin: 0;
}

.gorus-ayrinti,
.gorus-hizmet {
	margin: 2px 0 0;
	font-size: 0.9rem;
	color: var(--renk-soluk-metin);
}

/* ---------- Sikca sorulan sorular ---------- */

.sss-listesi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 12px;
	max-width: 80ch;
}

.sss-oge {
	border: 1px solid var(--renk-kenar);
	border-radius: var(--kose-yuvarlakligi);
	padding: 4px 16px;
}

.sss-oge summary {
	padding: 12px 0;
	font-family: var(--yazi-baslik);
	font-weight: 600;
	cursor: pointer;
}

.sss-yanit {
	padding-bottom: 8px;
	color: var(--renk-soluk-metin);
}

/* ---------- Galeri ---------- */

.galeri-izgarasi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.galeri-ogesi {
	margin: 0;
}

.galeri-ogesi img {
	width: 100%;
	height: auto;
	border-radius: var(--kose-yuvarlakligi);
}

.galeri-ogesi figcaption {
	font-size: 0.86rem;
	color: var(--renk-soluk-metin);
	margin-top: 4px;
}

/* ---------- Video ve harita (tiklamayla yuklenir) ---------- */

.video-alani,
.harita-yer-tutucu {
	position: relative;
	padding: 18px;
	background: var(--renk-soluk-zemin);
	border: 1px solid var(--renk-kenar);
	border-radius: var(--kose-yuvarlakligi);
	text-align: center;
}

.video-kapagi {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--kose-yuvarlakligi);
	margin-bottom: 14px;
}

.video-alani iframe,
.harita-yer-tutucu iframe {
	display: block;
	width: 100%;
	min-height: 320px;
	border: 0;
	border-radius: var(--kose-yuvarlakligi);
}

.harita-notu {
	color: var(--renk-soluk-metin);
}

/* ---------- Yazi ve blog ---------- */

.yazi {
	max-width: 75ch;
}

.yazi-listesi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 22px;
}

.yazi-karti {
	padding-bottom: 20px;
	border-bottom: 1px solid var(--renk-kenar);
}

.yazi-kunyesi {
	font-size: 0.88rem;
	color: var(--renk-soluk-metin);
}

.yazi-kategorisi {
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.yazi-kapagi {
	width: 100%;
	height: auto;
	border-radius: var(--kose-yuvarlakligi);
	margin-bottom: 14px;
}

.yazar-kutusu {
	margin-top: 28px;
	padding: 18px;
	background: var(--renk-soluk-zemin);
	border-radius: var(--kose-yuvarlakligi);
}

.yazar-adi {
	font-size: 1.02rem;
	margin-bottom: 0.2em;
}

.kategori-gezintisi ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.sayfalama {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-block: 28px;
}

.sayfalama a,
.sayfalama span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 6px 12px;
	border: 1px solid var(--renk-kenar);
	border-radius: var(--kose-yuvarlakligi);
	text-decoration: none;
}

.sayfalama [aria-current="page"] {
	color: #fff;
	background: var(--renk-birincil);
	border-color: var(--renk-birincil);
}

.geri-baglantisi {
	display: inline-block;
	margin-block: 18px;
}

/* ---------- Bolge listeleri ---------- */

.bolge-listesi {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 24px;
}

.bolge-grubu ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.bolge-basligi {
	font-size: 1.05rem;
	margin-bottom: 0.4em;
}

/* ---------- Cagrilar ---------- */

.bolum-cagrisi,
.teklif-cagrisi,
.iletisim-cagrisi {
	padding: 26px 22px;
	background: var(--renk-soluk-zemin);
	border-radius: var(--kose-yuvarlakligi);
	text-align: center;
}

.cagri-basligi {
	margin-bottom: 0.35em;
}

.cagri-aciklamasi {
	max-width: 60ch;
	margin-inline: auto;
	color: var(--renk-soluk-metin);
}

.cagri-baglantilari {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}

.ilgili-icerik {
	padding-block: calc(var(--bolum-boslugu) / 2);
}

/* ---------- Formlar ---------- */

.teklif-formu,
.arama-formu {
	max-width: 760px;
}

.teklif-formu fieldset {
	margin: 0 0 26px;
	padding: 20px;
	border: 1px solid var(--renk-kenar);
	border-radius: var(--kose-yuvarlakligi);
}

.teklif-formu legend {
	padding-inline: 8px;
	font-family: var(--yazi-baslik);
	font-weight: 700;
	color: var(--renk-birincil);
}

.alan {
	margin-bottom: 18px;
}

.alan label {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
}

.alan input,
.alan select,
.alan textarea,
.arama-formu input[type="search"],
.arama-formu input[type="text"] {
	width: 100%;
	min-height: 46px;
	padding: 11px 12px;
	font: inherit;
	color: inherit;
	background: var(--renk-yuzey);
	border: 1px solid var(--renk-kenar);
	border-radius: var(--kose-yuvarlakligi);
}

.alan textarea {
	min-height: 130px;
	resize: vertical;
}

.alan input[aria-invalid="true"],
.alan select[aria-invalid="true"],
.alan textarea[aria-invalid="true"] {
	border-color: #a3231f;
	border-width: 2px;
}

.alan-onay {
	display: grid;
	grid-template-columns: 22px 1fr;
	gap: 10px;
	align-items: start;
	margin-bottom: 18px;
}

.alan-onay input {
	width: 22px;
	height: 22px;
	min-height: 0;
	margin-top: 3px;
}

.alan-onay label {
	margin: 0;
	font-weight: 400;
}

/* Hata rengi tek basina anlam tasimaz; metin de her zaman yazilir. */
.alan-hatasi {
	margin: 6px 0 0;
	font-size: 0.9rem;
	font-weight: 600;
	color: #a3231f;
}

.alan-notu,
.form-notu {
	font-size: 0.9rem;
	color: var(--renk-soluk-metin);
}

.onay-metni {
	max-height: 180px;
	overflow-y: auto;
	padding: 12px 14px;
	margin-bottom: 12px;
	font-size: 0.9rem;
	background: var(--renk-soluk-zemin);
	border-radius: var(--kose-yuvarlakligi);
}

.form-uyarisi {
	padding: 16px 18px;
	margin-bottom: 22px;
	color: #6d1512;
	background: #fdeceb;
	border: 1px solid #a3231f;
	border-radius: var(--kose-yuvarlakligi);
}

.form-eylemleri {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
}

/* Bal kupu alani gorunmez kalir ancak ekranda yer kaplamaz. */
.bal-kupu {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.tesekkur-kutusu {
	padding: 26px 22px;
	background: var(--renk-soluk-zemin);
	border-radius: var(--kose-yuvarlakligi);
	max-width: 640px;
}

.tesekkur-mesaji {
	font-size: 1.08rem;
}

.referans-satiri {
	margin: 0;
}

.referans-kodu {
	font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	font-weight: 700;
	font-size: 1.05rem;
}

.arama-formu {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: flex-end;
}

.arama-formu .alan {
	flex: 1 1 220px;
	margin-bottom: 0;
}

.arama-ozeti {
	color: var(--renk-soluk-metin);
}

.arama-sonuclari {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 18px;
}

/* ---------- Subeler ---------- */

.sube-karti .kart-basligi {
	margin-top: 0;
}

.sube-adresi {
	margin-bottom: 0.4em;
}

.sube-telefonu,
.sube-epostasi {
	margin-bottom: 0.3em;
	font-weight: 600;
}

/* ---------- Altlik ---------- */

.site-altligi {
	margin-top: var(--bolum-boslugu);
	padding-block: 36px 20px;
	color: var(--renk-soluk-metin);
	background: var(--renk-soluk-zemin);
	border-top: 1px solid var(--renk-kenar);
}

.site-altligi-ic {
	display: grid;
	gap: 26px;
}

.altlik-bolum h2,
.altlik-bolum h3 {
	font-size: 1rem;
	color: var(--renk-metin);
}

.altlik-bolum ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 6px;
}

.altlik-marka {
	font-weight: 700;
	color: var(--renk-metin);
}

.altlik-alt {
	margin-top: 24px;
	padding-top: 16px;
	font-size: 0.88rem;
	border-top: 1px solid var(--renk-kenar);
}

/* ---------- Mobil iletisim cubugu ---------- */

/*
 * Cubuk sabit durur; bu nedenle govdeye alt bosluk eklenir ve icerigin son
 * satiri cubugun altinda kalmaz.
 */
.mobil-iletisim-cubugu {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 40;
	display: flex;
	background: var(--renk-birincil);
}

.mobil-iletisim-cubugu a {
	flex: 1 1 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 8px;
	font-size: 0.92rem;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	border-right: 1px solid rgba(255, 255, 255, 0.25);
}

.mobil-iletisim-cubugu a:last-child {
	border-right: 0;
}

.mobil-cubuk-var {
	padding-bottom: 52px;
}

/* ---------- Cerez banneri ---------- */

.cerez-banneri {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 60;
	padding: 18px 20px;
	background: var(--renk-yuzey);
	border-top: 2px solid var(--renk-birincil);
	box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.14);
}

.cerez-banneri[hidden] {
	display: none;
}

.cerez-banneri p {
	margin: 0 0 12px;
	font-size: 0.92rem;
	max-width: 70ch;
}

.cerez-dugmeleri {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.cerez-dugmeleri button {
	min-height: 44px;
	padding: 10px 18px;
	font: inherit;
	font-weight: 600;
	color: #fff;
	background: var(--renk-birincil);
	border: 1px solid var(--renk-birincil);
	border-radius: var(--kose-yuvarlakligi);
	cursor: pointer;
}

.cerez-dugmeleri button[data-cerez="zorunlu"] {
	color: var(--renk-birincil);
	background: transparent;
}

/* ---------- Hata sayfasi ---------- */

.hata-sayfasi {
	padding-block: var(--bolum-boslugu);
	text-align: center;
}

/* ---------- Genisleyen ekranlar ---------- */

@media (min-width: 600px) {
	.kart-izgarasi {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.galeri-izgarasi {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.guven-listesi,
	.etken-listesi,
	.gorus-listesi {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.gosterge-listesi {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (min-width: 900px) {
	:root {
		--kabuk-boslugu: 28px;
	}

	.site-basligi-ic {
		min-height: 78px;
	}

	/* Masaustunde menu her zaman goruntudedir; dugmeye gerek kalmaz. */
	.menu-dugmesi {
		display: none;
	}

	.ana-gezinti {
		display: block;
		flex-basis: auto;
		padding-bottom: 0;
	}

	.ana-gezinti ul {
		flex-direction: row;
		align-items: center;
		gap: 22px;
	}

	.ana-gezinti a {
		padding: 8px 0;
		border-bottom: 2px solid transparent;
	}

	.ana-gezinti a[aria-current="page"] {
		border-bottom-color: var(--renk-vurgu);
	}

	.basliktaki-eylem {
		display: inline-flex;
	}

	.kart-izgarasi {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.bolge-listesi {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.gorsel-metin {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: center;
	}

	/* Gorsel saga alinsa bile HTML sirasi metin oncedir. */
	.gorsel-sag .gorsel-metin-gorseli {
		order: 2;
	}

	.gorsel-sol .gorsel-metin-gorseli {
		order: 0;
	}

	.tanitim {
		padding-block: var(--bolum-boslugu);
	}

	.blok,
	.icerik-bolumu,
	.ilgili-icerik {
		padding-block: calc(var(--bolum-boslugu) * 0.75);
	}

	.surec-adimlari,
	.surec-listesi {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.guven-listesi,
	.etken-listesi {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.yazi-listesi {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.site-altligi-ic {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	/* Mobil cubuk yalnizca kucuk ekranlarda gosterilir. */
	.mobil-iletisim-cubugu {
		display: none;
	}

	.mobil-cubuk-var {
		padding-bottom: 0;
	}

	.cerez-dugmeleri {
		justify-content: flex-start;
	}

	/* Mobilde gizlenen bloklar buyuk ekranda gorunur. */
	.mobilde-gizli {
		display: block;
	}
}

@media (min-width: 1200px) {
	.galeri-izgarasi {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.yazi-listesi {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Hareket azaltma tercihi olan ziyaretcide gecisler kaldirilir. */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* Yazdirmada gezinti, cubuk ve banner cikarilir. */
@media print {
	.site-basligi,
	.site-altligi,
	.mobil-iletisim-cubugu,
	.cerez-banneri,
	.atlama-baglantisi,
	.sayfalama {
		display: none !important;
	}

	body {
		color: #000;
		background: #fff;
	}

	a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 0.85em;
	}
}