/**
 * SEO Teşhis Raporu sayfası.
 * Tespit imzası: ba-teshis
 *
 * Sayfa Elementor'la değil düz içerikle kuruldu; bu yüzden tipografi ve
 * aralıklar burada tanımlanıyor. Marka değerleri: başlık #4877bd,
 * CTA #3878C3, bağlantı #DD4D26, hap yarıçapı 100px, Quicksand.
 */

.ba-teshis {
	max-width: 820px;
	margin: 0 auto;
	padding: 0 18px 48px;
	font-family: 'Quicksand', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	color: #2d3748;
}

.ba-teshis h1 {
	font-size: 34px;
	line-height: 1.25;
	color: #4877bd;
	margin: 0 0 14px;
}

.ba-teshis .ba-teshis-giris {
	font-size: 17.5px;
	line-height: 1.7;
	color: #4a5568;
	margin: 0 0 26px;
}

.ba-teshis h2 {
	font-size: 23px;
	line-height: 1.3;
	color: #4877bd;
	margin: 40px 0 14px;
}

.ba-teshis h3 {
	font-size: 17px;
	line-height: 1.4;
	color: #2d3748;
	margin: 0 0 8px;
}

.ba-teshis p,
.ba-teshis li {
	font-size: 16px;
	line-height: 1.75;
}

.ba-teshis a {
	color: #DD4D26;
}

/* Fiyat şeridi */
.ba-teshis-fiyat {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 26px;
	margin: 0 0 8px;
	padding: 22px 26px;
	background: #f6f8fb;
	border: 1px solid #e3e9f2;
	border-radius: 16px;
}

.ba-teshis-fiyat .ba-teshis-tutar {
	font-size: 30px;
	font-weight: 700;
	color: #4877bd;
	line-height: 1.1;
}

.ba-teshis-fiyat .ba-teshis-kdv {
	font-size: 14.5px;
	color: #718096;
}

.ba-teshis-fiyat .ba-teshis-mahsup {
	flex: 1 1 240px;
	font-size: 15px;
	line-height: 1.6;
	color: #2f7d5b;
	font-weight: 600;
}

/* Kapsam kartları */
.ba-teshis-kapsam {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ba-teshis-kapsam li {
	margin: 0;
	padding: 20px 22px;
	background: #fff;
	border: 1px solid #e3e9f2;
	border-radius: 14px;
}

.ba-teshis-kapsam li p {
	margin: 0;
	font-size: 15px;
	line-height: 1.65;
	color: #4a5568;
}

/* Kime uygun / uygun değil */
.ba-teshis-kimlik {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.ba-teshis-kimlik > div {
	padding: 20px 22px;
	border-radius: 14px;
}

.ba-teshis-kimlik .ba-teshis-uygun {
	background: #f2f8f4;
	border: 1px solid #d6e9dd;
}

.ba-teshis-kimlik .ba-teshis-uygun-degil {
	background: #fdf5f2;
	border: 1px solid #f5ddd3;
}

.ba-teshis-kimlik ul {
	margin: 10px 0 0;
	padding-left: 20px;
}

.ba-teshis-kimlik li {
	font-size: 15px;
	line-height: 1.65;
	margin-bottom: 6px;
}

/* Akış */
.ba-teshis-akis {
	margin: 0;
	padding-left: 22px;
}

.ba-teshis-akis li {
	margin-bottom: 10px;
}

/* Form */
.ba-teshis-form {
	margin: 40px 0 0;
	padding: 28px;
	background: #f6f8fb;
	border: 1px solid #e3e9f2;
	border-radius: 18px;
}

.ba-teshis-form h2 {
	margin-top: 0;
}

.ba-teshis-form-not {
	font-size: 15px;
	line-height: 1.7;
	color: #4a5568;
	margin: 0 0 22px;
}

.ba-teshis-alanlar p {
	margin: 0 0 16px;
}

.ba-teshis-alanlar label {
	display: block;
	margin-bottom: 6px;
	font-size: 14.5px;
	font-weight: 600;
	color: #2d3748;
}

.ba-teshis-alanlar label span {
	color: #DD4D26;
}

.ba-teshis-alanlar input,
.ba-teshis-alanlar textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 13px 15px;
	/* 16px altı yazı tipi iOS Safari'de otomatik yakınlaştırma tetikliyor
	   ve geri çıkmıyor; bu yüzden 16px'in altına inilmiyor. */
	font-size: 16px;
	font-family: inherit;
	color: #2d3748;
	background: #fff;
	border: 1px solid #d8e0ea;
	border-radius: 12px;
	min-height: 48px;
}

.ba-teshis-alanlar input:focus,
.ba-teshis-alanlar textarea:focus {
	outline: none;
	border-color: #3878C3;
	box-shadow: 0 0 0 3px rgba(56, 120, 195, .14);
}

.ba-teshis-gonder {
	display: inline-block;
	width: 100%;
	min-height: 52px;
	padding: 15px 30px;
	background: #3878C3;
	color: #fff;
	border: none;
	border-radius: 100px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
	transition: background .2s;
}

.ba-teshis-gonder:hover,
.ba-teshis-gonder:focus {
	background: #2c60a0;
}

.ba-teshis-kvkk {
	margin: 14px 0 0;
	font-size: 13px;
	line-height: 1.6;
	color: #718096;
}

.ba-teshis-uyari {
	margin: 0 0 20px;
	padding: 14px 16px;
	background: #fdf0ea;
	border: 1px solid #f5ddd3;
	border-radius: 12px;
	font-size: 15px;
	line-height: 1.6;
	color: #b3400f;
}

/* Bal küpü: görünmez ama ekran okuyucuya da gösterilmiyor (aria-hidden). */
.ba-teshis-gizli {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (max-width: 767px) {
	.ba-teshis {
		padding: 0 16px 36px;
	}

	.ba-teshis h1 {
		font-size: 26px;
	}

	.ba-teshis .ba-teshis-giris {
		font-size: 16.5px;
	}

	.ba-teshis h2 {
		font-size: 20px;
		margin-top: 32px;
	}

	.ba-teshis-kapsam,
	.ba-teshis-kimlik {
		grid-template-columns: minmax(0, 1fr);
	}

	.ba-teshis-fiyat {
		padding: 18px 20px;
		border-radius: 14px;
	}

	.ba-teshis-fiyat .ba-teshis-tutar {
		font-size: 26px;
	}

	.ba-teshis-form {
		padding: 22px 18px;
		border-radius: 14px;
	}
}

/* ---------------------------------------------------------------
   Rapor yollari: ucretsiz otomatik vs ucretli kapsamli tehis.
   /seo-analiz-basvuru-formu/ sayfasinda basilir. Sarmalayici sinif
   'ba-teshis' ile basladigi icin registry imzasi ayrica gerekmiyor.
   --------------------------------------------------------------- */

.ba-teshis-yollar {
	max-width: 900px;
	margin: 0 auto;
	font-family: 'Quicksand', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	/* Blok koyu zeminli bir Elementor bolumune oturuyor. Sarmalayiciya renk
	   verilirse kart disindaki metinler o rengi devralip okunmaz hale
	   geliyor; renk bilerek bolumden miras aliniyor. Kart ICI metinlerin
	   hepsinin kendi rengi var. */
}

.ba-teshis-yollar-giris {
	font-size: 16.5px;
	line-height: 1.75;
	/* Blok koyu (marka mavisi) bir Elementor bolumune oturuyor: kart DISI
	   metinler beyaz. Miras denendi, bolum kendi rengini tanimlamadigi icin
	   siyaha dusuyordu. Blok acik zemine tasinirsa bu iki kural degisir. */
	color: #fff;
	margin: 0 0 26px;
}

.ba-teshis-yollar-kartlar {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
	align-items: stretch;
}

.ba-teshis-yol {
	display: flex;
	flex-direction: column;
	padding: 26px;
	border-radius: 18px;
	background: #fff;
	border: 1px solid #e3e9f2;
}

.ba-teshis-yol--ucretli {
	background: #f6f8fb;
	border-color: #cfdcec;
}

.ba-teshis-yol-etiket {
	align-self: flex-start;
	padding: 5px 14px;
	border-radius: 100px;
	background: #e8f3ec;
	color: #2f7d5b;
	font-size: 13.5px;
	font-weight: 700;
	letter-spacing: .2px;
}

.ba-teshis-yol-etiket--vurgu {
	background: #3878C3;
	color: #fff;
}

.ba-teshis-yol h3 {
	margin: 14px 0 4px;
	font-size: 22px;
	line-height: 1.3;
	color: #4877bd;
}

.ba-teshis-yol-sure {
	margin: 0 0 16px;
	font-size: 14.5px;
	/* #718096 beyaz zeminde 4.02 kontrast veriyordu, AA esigi 4.5. */
	color: #5f6b7d;
}

.ba-teshis-yol ul {
	margin: 0 0 16px;
	padding-left: 20px;
}

.ba-teshis-yol li {
	margin-bottom: 8px;
	font-size: 15.5px;
	line-height: 1.6;
	color: #4a5568;
}

.ba-teshis-yol-not {
	/* Kartlarin butonlari ayni hizada bitsin diye bosluk buraya veriliyor. */
	margin: auto 0 18px;
	padding-top: 4px;
	font-size: 14px;
	line-height: 1.65;
	color: #5f6b7d;
}

.ba-teshis-yol--ucretli .ba-teshis-yol-not {
	color: #2f7d5b;
	font-weight: 600;
}

.ba-teshis-yol-buton {
	display: block;
	box-sizing: border-box;
	min-height: 50px;
	padding: 14px 26px;
	background: #fff;
	color: #3878C3 !important;
	border: 2px solid #3878C3;
	border-radius: 100px;
	font-size: 15.5px;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	transition: background .2s, color .2s;
}

.ba-teshis-yol-buton:hover,
.ba-teshis-yol-buton:focus {
	background: #3878C3;
	color: #fff !important;
}

.ba-teshis-yol-buton--vurgu {
	background: #3878C3;
	color: #fff !important;
}

.ba-teshis-yol-buton--vurgu:hover,
.ba-teshis-yol-buton--vurgu:focus {
	background: #2c60a0;
	color: #fff !important;
}

.ba-teshis-yollar-alt {
	margin: 22px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: #fff;
	opacity: .85;
}

/* Iki sinif + eleman: Elementor'un kendi baglanti rengi (.elementor-kit-255 a)
   tema CSS'inden SONRA yuklendigi icin daha az ozgul secici kaybediyordu. */
.ba-teshis-yollar .ba-teshis-yollar-alt a {
	color: #fff;
	text-decoration: underline;
}

@media (max-width: 767px) {
	.ba-teshis-yollar-kartlar {
		grid-template-columns: minmax(0, 1fr);
	}

	.ba-teshis-yol {
		padding: 22px 20px;
		border-radius: 14px;
	}

	.ba-teshis-yol h3 {
		font-size: 20px;
	}

	.ba-teshis-yol-not {
		margin-bottom: 16px;
	}
}