/*
 * S02 · Biz kimiz (#s02-biz-kimiz) — Figma 14:108 (1440) / 15:365 (390); spec: figma-home/build/s02-biz-kimiz/spec.json.
 * Masaüstü: görsel 464 (4:5, r24) | 64 | metin 672, dikeyde ortalı; metin sütunu aralık 20.
 * Tablet: iki sütun, aralık 40, H2 kırılımı yok; ≤900 px tek sütun. Mobil (≤767): metin → görsel (4:3, r20).
 */

.bt-hs--s02-biz-kimiz .s02-split {
	display: grid;
	grid-template-columns: minmax(0, 464fr) minmax(0, 672fr);
	column-gap: var(--hs-space-64);
	align-items: center;
}

.bt-hs--s02-biz-kimiz .s02-split--text {
	grid-template-columns: minmax(0, 1fr);
}

/* Metin sütunu: altı çocuk arası 20 (üst başlık, H2, p, p, liste, bağlantı). */
.bt-hs--s02-biz-kimiz .s02-text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	min-width: 0;
}

.bt-hs--s02-biz-kimiz .s02-title {
	max-width: none;
	text-wrap: wrap;
}

/*
 * Figma metin kutularının yüksekliği tam piksele yukarı yuvarlanır (ör. 19.5 → 20, 27.2 → 28, 108.8 → 109); sütun
 * konumları (0 / 40 / 144 / 246 / 375 / 783) ve 808 px sütun yüksekliği buna göredir. Kutunun altına küçük dolgu
 * aynı ritmi verir (yazı konumu değişmez).
 */
.bt-hs--s02-biz-kimiz .s02-kicker,
.bt-hs--s02-biz-kimiz .s02-title,
.bt-hs--s02-biz-kimiz .s02-p,
.bt-hs--s02-biz-kimiz .s02-desc {
	padding-bottom: 0.5px;
}

.bt-hs--s02-biz-kimiz .s02-p {
	color: var(--hs-c-text);
	font-size: var(--hs-fs-body);
	line-height: var(--hs-lh-body);
}

/* Vurgu listesi (Figma Icon list/Row, Vertical): satır aralığı 16; işaret 28 + 14 + metin; lead ile metin arası 2. */
.bt-hs--s02-biz-kimiz .s02-list {
	display: flex;
	flex-direction: column;
	gap: var(--hs-space-16);
	width: 100%;
}

.bt-hs--s02-biz-kimiz .s02-item {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr);
	column-gap: 14px;
	row-gap: 2px;
	align-items: start;
	margin: 0;
	padding: 0;
}

/*
 * İşaret: 28 px beyaz daire, 1,5 px altın iç çizgi, ortada 18 px altın tik (Icon/Gold/check 2:275). Çizgi iç gölgedir:
 * Chrome kenarlık kalınlığını aygıt pikseline aşağı yuvarlar (1x ekranda 1,5 → 1 px); gölge yayılımı yuvarlanmaz.
 */
.bt-hs--s02-biz-kimiz .s02-item::before {
	content: "";
	grid-column: 1;
	grid-row: 1 / span 2;
	box-sizing: border-box;
	width: 28px;
	height: 28px;
	border-radius: var(--hs-radius-pill);
	background: var(--hs-white) url("img/icon-check-gold.svg") center / 18px 18px no-repeat;
	box-shadow: inset 0 0 0 1.5px var(--hs-gold);
}

.bt-hs--s02-biz-kimiz .s02-lead {
	grid-column: 2;
	display: block;
	color: var(--hs-c-heading);
	font-size: var(--hs-fs-body);
	font-weight: 700;
	line-height: var(--hs-lh-body);
	padding-bottom: 0.8px;
}

.bt-hs--s02-biz-kimiz .s02-desc {
	grid-column: 2;
	display: block;
	color: var(--hs-c-muted);
	font-size: var(--hs-fs-body);
	line-height: var(--hs-lh-body);
}

/* Hakkında bağlantısı (Button/Text link 5:64, sağ simge yok): etiket kutusu 20 + 3 boşluk + 2 px altın çizgi = 25. */
.bt-hs--s02-biz-kimiz .s02-about {
	display: flex;
}

.bt-hs--s02-biz-kimiz .s02-about .bt-hs-link {
	position: relative;
	padding-bottom: 5.8px;
}

/* 44 px dokunma alanı; yerleşimi değiştirmez. */
.bt-hs--s02-biz-kimiz .s02-about .bt-hs-link::after {
	content: "";
	position: absolute;
	inset: -10px 0;
}

/* Görsel: 464 × 580 (4:5), r24, kapla. DOM'da metinden sonra; masaüstünde solda. */
.bt-hs--s02-biz-kimiz .s02-media {
	order: -1;
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 5;
	margin: 0;
	overflow: hidden;
	border-radius: var(--hs-radius-bento);
}

.bt-hs--s02-biz-kimiz .s02-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}

/* ---------------------------------------------------------------- Tablet */

@media (max-width: 1024px) {
	.bt-hs--s02-biz-kimiz .s02-split {
		column-gap: var(--hs-space-40);
	}

	/* Masaüstü H2 kırılımı yalnız ≥1025 px. */
	.bt-hs--s02-biz-kimiz .s02-br {
		display: none;
	}
}

/* Metin sütunu ~420 px'in altına inmeden tek sütuna geçer (mobil düzeni: metin → görsel 4:3). */
@media (max-width: 900px) {
	.bt-hs--s02-biz-kimiz .s02-split {
		grid-template-columns: minmax(0, 1fr);
		row-gap: var(--hs-space-32);
	}

	.bt-hs--s02-biz-kimiz .s02-media {
		order: 0;
		aspect-ratio: 4 / 3;
	}

	.bt-hs--s02-biz-kimiz .s02-img {
		object-position: 50% 60%;
	}
}

/* ---------------------------------------------------------------- Mobil (Figma 390) */

@media (max-width: 767px) {
	.bt-hs--s02-biz-kimiz .s02-media {
		border-radius: var(--hs-radius-band-mobile);
	}
}

/* EN başlık: son satıra tek sözcük düşmesin (1024–1440 "Since / 2016"). TR'nin Figma'yla aynı açgözlü kırılımı
   değişmez (yalnız :lang(en)); Chrome'un pretty'si bu son satırlara dokunmuyor (yeterince kısa sayılmıyor), bu yüzden balance. 2026-10-12, EN sayfa QA. */
.bt-hs--s02-biz-kimiz:lang(en) h2 {
	text-wrap: balance;
}

/* DE başlık: 1280–1440'ta "… Ankara – seit / 2016" son satırda tek sözcük; balance ile "Ihr Übersetzungsbüro / in Ankara –
   seit 2016". 2026-10-12, DE sayfa QA. */
.bt-hs--s02-biz-kimiz:lang(de) h2 {
	text-wrap: balance;
}