/*
 * S11 · Sıkça Sorulan Sorular (#s11-sss) — Figma 14:117 (1440) / 15:374 (390), soru durumları 46:1444.
 * DOM sırası başlık → sorular → panel (odak sırası = ≤1024 görsel sırası, 2026-10-12). Masaüstü: 456fr / 680fr ızgara
 * (aralık 64); başlık ve panel sol sütunda alt alta (aralık 32), sorular sağda iki satırı kaplar. Sol sütun yapışkan
 * (üst bilgi + 24 px): script.js başlık ve panel yüksekliğini --s11-head-h / --s11-panel-h olarak yazar ve
 * [data-s11-sticky] verir; ikisi tek ızgara alanında üst üste yapışır (panel başlık + 32 aşağıda, birlikte durur), eski
 * .s11-aside sarmalayıcısıyla aynı devinim. Betik yoksa düzen aynı, yapışma yok. ≤1024 px: tek sütun (DOM sırası;
 * panel yapışkan değil). Yalnız .bt-hs--s11-sss kapsamında.
 * Hareket: yalnız üzerine gelme renk geçişleri (150 ms); azaltılmış harekette home-base kapatır.
 */

/* ---------------------------------------------------------------- Düzen */

.bt-hs--s11-sss .s11-split {
	--s11-sticky-top: calc(var(--bt-header-h, 64px) + var(--bt-admin-bar, 0px) + 24px);
	display: grid;
	grid-template-columns: minmax(0, 456fr) minmax(0, 680fr);
	grid-template-rows: auto 1fr;
	column-gap: 64px;
	row-gap: 32px;
	align-items: start;
}

.bt-hs--s11-sss .s11-head {
	grid-column: 1;
	grid-row: 1;
	gap: 16px;
	min-width: 0;
}

.bt-hs--s11-sss .s11-panel {
	grid-column: 1;
	grid-row: 2;
	min-width: 0;
}

.bt-hs--s11-sss .s11-split--nohead .s11-panel {
	grid-row: 1;
}

.bt-hs--s11-sss .s11-faq {
	grid-column: 2;
	grid-row: 1 / -1;
}

/* Yapışkan sol sütun (betik ölçtükten sonra): başlık ve panel aynı tek satırlık alanda; panelin üst boşluğu başlık + 32,
   başlığın alt boşluğu panel + 32 (yapışkan kutu kenar boşluğuyla birlikte alanda kalır: ikisi aynı anda durur). */
@media (min-width: 1025px) {
	.bt-hs--s11-sss .s11-split[data-s11-sticky] {
		grid-template-rows: auto;
	}

	.bt-hs--s11-sss .s11-split[data-s11-sticky] > .s11-head,
	.bt-hs--s11-sss .s11-split[data-s11-sticky] > .s11-panel,
	.bt-hs--s11-sss .s11-split[data-s11-sticky] > .s11-faq {
		grid-row: 1;
	}

	.bt-hs--s11-sss .s11-split[data-s11-sticky] > .s11-head {
		position: sticky;
		top: var(--s11-sticky-top);
		margin-bottom: calc(var(--s11-panel-h, 0px) + 32px);
	}

	.bt-hs--s11-sss .s11-split[data-s11-sticky] > .s11-panel {
		position: sticky;
		top: calc(var(--s11-sticky-top) + var(--s11-head-h, 0px) + 32px);
		margin-top: calc(var(--s11-head-h, 0px) + 32px);
	}

	.bt-hs--s11-sss .s11-split--nohead[data-s11-sticky] > .s11-panel {
		top: var(--s11-sticky-top);
		margin-top: 0;
	}
}

/* Figma metin kutusu tam piksele yuvarlanır (41.75 → 42, 29.12 → 30); destek yoksa taban 1.12 kalır. */
.bt-hs--s11-sss .s11-h2 {
	color: var(--hs-ink);
	line-height: round(up, calc(var(--hs-fs-h2) * 1.12), 1px);
}

.bt-hs--s11-sss .s11-intro {
	color: var(--hs-muted);
}

/* ---------------------------------------------------------------- İletişim paneli (Panel/Sticky contact mini) */

.bt-hs--s11-sss .s11-panel {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 24px;
	border: 1px solid var(--hs-line);
	border-radius: var(--hs-radius-glass);
	background: var(--hs-white);
	/* Figma Shadow/Card çizimi yayılmayı (−12) uygulamaz; ref ile eşleşen değer yayılmasızdır. */
	box-shadow: 0 1px 2px rgba(25, 25, 25, 0.06), 0 12px 32px 0 rgba(27, 42, 74, 0.18);
}

.bt-hs--s11-sss .s11-panel__line {
	color: var(--hs-ink);
	font-size: var(--hs-fs-body);
	line-height: var(--hs-lh-body);
}

.bt-hs--s11-sss .s11-panel__line strong {
	font-weight: 700;
}

.bt-hs--s11-sss .s11-ctas {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 12px;
}

/* Altın hap (228 × 52, çerçevesiz, gölgesiz: kullanıcı kararı 2026-10-12). */
.bt-hs--s11-sss .s11-btn--wa {
	min-height: 52px;
	border-width: 0;
}

/* Çerçeveli mürekkep hap (150 × 46): 1,5 px iç çerçeve; Figma dolgusu (22) çerçevenin dışından ölçülür, etiket kutusu
   (80) yazı mürekkebinden geniştir: simge kenardan 23, etiket simgeden 9 px, sağda 22 px. Chrome 1,5 px kenarlığı 1 px'e
   yuvarlar (Figma çizgisi daha kalın görünür); çerçeve bu yüzden 1,5 px iç gölgeyle çizilir, kenarlık 0. */
.bt-hs--s11-sss .s11-btn--call {
	gap: 9px;
	min-height: 46px;
	padding: 0 23px 0 22.5px;
	border-width: 0;
	box-shadow: inset 0 0 0 1.5px var(--hs-ink);
}

/* ---------------------------------------------------------------- Sorular (Accordion/FAQ item) */

.bt-hs--s11-sss .s11-faq {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.bt-hs--s11-sss .s11-item {
	border-bottom: 1px solid var(--hs-line);
}

.bt-hs--s11-sss .s11-item__q {
	display: flex;
	align-items: center;
	gap: 24px;
	min-height: 48px;
	padding: 20px 0;
	border-radius: 8px;
	color: var(--hs-ink);
	font-size: var(--hs-fs-h4);
	font-weight: 600;
	/* 17/23.8; Figma metin kutularını tam piksele yuvarlar (2 satır 48, 3 satır 72): satır 24 px. */
	line-height: 24px;
	list-style: none;
	cursor: pointer;
}

.bt-hs--s11-sss .s11-item__q::-webkit-details-marker {
	display: none;
}

.bt-hs--s11-sss .s11-item__q::marker {
	content: "";
}

.bt-hs--s11-sss .s11-item__text {
	flex: 1 1 auto;
	min-width: 0;
	transition: color var(--hs-dur-fast) ease;
}

.bt-hs--s11-sss .s11-item__icon {
	display: grid;
	flex: none;
	place-items: center;
	box-sizing: border-box;
	width: 32px;
	height: 32px;
	border: 1px solid var(--hs-line);
	border-radius: var(--hs-radius-pill);
	color: var(--hs-navy);
	transition: border-color var(--hs-dur-fast) ease, background-color var(--hs-dur-fast) ease;
}

.bt-hs--s11-sss .s11-item__glyph {
	display: block;
	width: 18px;
	height: 18px;
}

.bt-hs--s11-sss .s11-item[open] .s11-icon__v {
	display: none;
}

/* Üzerine gelme (46:1409): soru lacivert, halka #3D5A96 (dolgu bant rengi). */
.bt-hs--s11-sss .s11-item__q:hover .s11-item__text {
	color: var(--hs-navy);
}

.bt-hs--s11-sss .s11-item__q:hover .s11-item__icon {
	border-color: var(--hs-navy-400);
	background: var(--hs-surface);
}

/* Odak (46:1421): satırın tamamında 3 px #4A3F9F, köşe 8, aralık 0. */
.bt-hs--s11-sss .s11-item__q:focus-visible {
	outline: 3px solid var(--hs-focus);
	outline-offset: 0;
	border-radius: 8px;
}

.bt-hs--s11-sss .s11-item__a {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 0 48px 24px 0;
}

.bt-hs--s11-sss .s11-item__p {
	max-width: 44rem;
	color: var(--hs-ink);
	font-size: var(--hs-fs-body);
	line-height: var(--hs-lh-body);
}

.bt-hs--s11-sss .s11-item__p a:where(:not([class])) {
	text-decoration-skip-ink: none;
}

/* ---------------------------------------------------------------- Tablet ve mobil: tek sütun */

@media (max-width: 1024px) {
	.bt-hs--s11-sss .s11-split {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 24px;
	}
}

@media (max-width: 767px) {
	.bt-hs--s11-sss .s11-head {
		gap: 12px;
	}

	.bt-hs--s11-sss .s11-ctas {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
	}

	.bt-hs--s11-sss .s11-btn {
		width: 100%;
	}
}

@media (forced-colors: active) {
	.bt-hs--s11-sss .s11-item__icon {
		border-color: CanvasText;
	}

	/* Zorlanmış renklerde gölge çizilmez: çerçeve yeniden kenarlık (home-base: 1px solid ButtonText). */
	.bt-hs--s11-sss .s11-btn--call {
		padding: 0 22px 0 21.5px;
		border-width: 1px;
	}
}

@media print {
	.bt-hs--s11-sss .s11-split[data-s11-sticky] > .s11-head,
	.bt-hs--s11-sss .s11-split[data-s11-sticky] > .s11-panel {
		position: static;
	}
}

/* EN başlık: son satıra tek sözcük düşmesin (1280–1440 ve 320–360 "Frequently Asked / Questions"). 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--s11-sss:lang(en) h2 {
	text-wrap: balance;
}
