/*
 * S05 · Belge Rotası (#s05-belgeler) — Figma 14:111 (1440) / 15:368 (390); spec figma-home/build/s05-belgeler.
 *
 * Masaüstü (≥1025): üst satır (metin 576 + cam panel 576, alta hizalı) ve iki sütunlu rota: panelin alt ortasından
 * S kıvrımıyla inen omurga (x = %50), gruplar sol/sağ, Araç grubu iki yana çatal, uç halka + hub bağlantısı. Çizgiler
 * grup başına sözde öğelerdir (metin yüksekliği değişse de hizalı kalır).
 * Tablet ve mobil (≤1024): tek omurga (x 16), her satırda 40 px dekor sütunu.
 * Figma metin kutusu yükseklikleri tam piksele yukarı yuvarlanır (ör. 2 × 21.7 = 43.4 → 44); dolgudaki küçük kesirler
 * bunu karşılar ki rota dikey ritmi 1:1 kalsın. Birkaç satır yüksekliği belirteçten ≤0,05 px sapar (H2 1.1212, giriş
 * 1.5476 / 1.5528, belge satırı 21.75 / 3 satırda da): Chrome satır taban çizgisini tam piksele oturtur, bu değerlerle her satır
 * Figma görüntüsündeki pikselde durur (ölçülerek seçildi).
 */

.bt-hs--s05-belgeler {
	--hs-pad-top: 96px;
	--hs-pad-bottom: 96px;
	--s05-line: var(--hs-navy);
	--s05-lit: var(--hs-gold);
}

/* ---------------------------------------------------------------- Üst satır: başlık, giriş, belge paneli */

.bt-hs--s05-belgeler :where(.s05-top, .s05-route) *,
.bt-hs--s05-belgeler :where(.s05-top, .s05-route) *::before,
.bt-hs--s05-belgeler :where(.s05-top, .s05-route) *::after {
	box-sizing: border-box;
}

.bt-hs--s05-belgeler .s05-top {
	display: flex;
	align-items: flex-end;
	gap: 48px;
}

.bt-hs--s05-belgeler .s05-text {
	display: flex;
	flex: none;
	width: calc((100% - 48px) / 2);
	flex-direction: column;
	gap: 19.609375px;
	min-width: 0;
}

/* H2: Figma kutusu 520 px; dengeli kırılım Figma'daki 3 satırı verir ("… Resmî / Başvurular İçin / Yeminli Tercüme"). */
.bt-hs--s05-belgeler .s05-h2 {
	max-width: 520px;
	padding-top: 1px;
	line-height: 1.1212;
	text-wrap: balance;
}

.bt-hs--s05-belgeler .s05-intro {
	padding-bottom: 0.5px;
	line-height: 1.5476;
}

@media (min-width: 1280px) {
	.bt-hs--s05-belgeler .s05-h2 {
		line-height: 41.796875px;
	}

	.bt-hs--s05-belgeler .s05-intro {
		line-height: 32.5px;
	}
}

/* Cam panel (Glass/Light panel): 576 × 220, dolgu 28 + 1 px beyaz çerçeve, köşe 24. */
.bt-hs--s05-belgeler .s05-origin {
	display: flex;
	flex: none;
	width: calc((100% - 48px) / 2);
	flex-direction: column;
	gap: 16px;
	min-width: 0;
	padding: 28px;
	border: 1px solid var(--hs-white);
	border-radius: var(--hs-radius-bento);
	background: var(--hs-white-a86);
	box-shadow: var(--hs-shadow-light-panel);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
}

.bt-hs--s05-belgeler .s05-origin__label {
	padding-bottom: 0.40625px;
	color: var(--hs-navy);
	font-size: var(--hs-fs-badge);
	font-weight: 700;
	line-height: 15.6px;
}

.bt-hs--s05-belgeler .s05-docs {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	align-items: start;
	gap: 14px 16px;
}

.bt-hs--s05-belgeler .s05-doc {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	color: var(--hs-ink);
	font-size: var(--hs-fs-chip);
	font-weight: 600;
	line-height: 16.8px;
}

.bt-hs--s05-belgeler .s05-glyph {
	display: block;
	flex: none;
	width: 28px;
	height: 28px;
}

.bt-hs--s05-belgeler .s05-doc__name {
	flex: 1 1 auto;
	min-width: 0;
	padding-bottom: 0.40625px;
}

.bt-hs--s05-belgeler a.s05-doc__link {
	color: var(--hs-ink);
	text-decoration: none;
}

.bt-hs--s05-belgeler a.s05-doc__link:hover {
	color: var(--hs-navy);
	text-decoration: underline 2px var(--s05-lit);
	text-underline-offset: 4px;
}

/* ---------------------------------------------------------------- Rota (masaüstü) */

.bt-hs--s05-belgeler .s05-map {
	position: relative;
	isolation: isolate;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: start;
	row-gap: 59px;
	padding-top: 112px;
}

/* Panel çıkışı: panelin alt ortası (x = %75 + 12) → r24 kıvrım → y 40 yatay → r24 kıvrım → omurga (x = %50). */
.bt-hs--s05-belgeler .s05-map::before,
.bt-hs--s05-belgeler .s05-map::after {
	content: "";
	position: absolute;
	z-index: 1;
	box-sizing: border-box;
	border: 0 solid var(--s05-line);
	pointer-events: none;
}

.bt-hs--s05-belgeler .s05-map::before {
	top: -1.5px;
	right: calc(25% - 13.5px);
	left: calc(50% + 24px);
	height: 43px;
	border-right-width: 3px;
	border-bottom-width: 3px;
	border-bottom-right-radius: 25.5px;
}

.bt-hs--s05-belgeler .s05-map::after {
	top: 38.5px;
	left: calc(50% - 1.5px);
	width: 40px;
	height: 30px;
	border-top-width: 3px;
	border-left-width: 3px;
	border-top-left-radius: 25.5px;
}

.bt-hs--s05-belgeler .s05-spine {
	position: absolute;
	z-index: 1;
	top: 64px;
	bottom: 0;
	left: calc(50% - 1.5px);
	width: 3px;
	background: var(--s05-line);
	pointer-events: none;
}

/* Grup: üst kenar = istasyon (dal) çizgisi; ilk durak 40 aşağıda. Sağ grup sol eşinden 56 aşağıda başlar. */
.bt-hs--s05-belgeler .s05-group {
	position: relative;
	padding-top: 40px;
}

.bt-hs--s05-belgeler .s05-group--r {
	margin-top: 56px;
}

/* Çatal: ikinci satırın altından 98 px (59 satır aralığı + 39). */
.bt-hs--s05-belgeler .s05-group--fork {
	grid-column: 1 / -1;
	margin-top: 39px;
}

/* Dal: istasyondan yatay, r24 dirsek, ilk durak noktasının merkezine kadar dikey (sonrası durak ::after). */
.bt-hs--s05-belgeler .s05-group::before,
.bt-hs--s05-belgeler .s05-group--fork::after {
	content: "";
	position: absolute;
	z-index: 1;
	top: -1.5px;
	box-sizing: border-box;
	height: 52.75px;
	border: 0 solid var(--s05-line);
	pointer-events: none;
	transition: border-color var(--hs-dur-fast) ease;
}

.bt-hs--s05-belgeler .s05-group--l::before,
.bt-hs--s05-belgeler .s05-group--fork::before {
	left: 10.5px;
	right: 0;
	border-top-width: 3px;
	border-left-width: 3px;
	border-top-left-radius: 25.5px;
}

.bt-hs--s05-belgeler .s05-group--fork::before {
	right: 50%;
}

.bt-hs--s05-belgeler .s05-group--r::before,
.bt-hs--s05-belgeler .s05-group--fork::after {
	left: -1.5px;
	width: 67px;
	border-top-width: 3px;
	border-right-width: 3px;
	border-top-right-radius: 25.5px;
}

.bt-hs--s05-belgeler .s05-group--fork::after {
	left: calc(50% - 1.5px);
}

/* İstasyon: 20 px halka (4 px lacivert iç kontur, beyaz dolgu), omurga üzerinde; çatalda 40 × 20 aktarma. */
.bt-hs--s05-belgeler .s05-station {
	position: absolute;
	z-index: 3;
	top: -10px;
	box-sizing: border-box;
	width: 20px;
	height: 20px;
	border: 4px solid var(--s05-line);
	border-radius: 50%;
	background: var(--hs-white);
	pointer-events: none;
	transition: border-color var(--hs-dur-fast) ease;
}

.bt-hs--s05-belgeler .s05-group--l .s05-station {
	left: calc(100% - 10px);
}

.bt-hs--s05-belgeler .s05-group--r .s05-station {
	left: -10px;
}

.bt-hs--s05-belgeler .s05-group--fork .s05-station {
	left: calc(50% - 20px);
	width: 40px;
	border-radius: 10px;
}

/* Amaç hapı (Pill/Static, beyaz): dal çizgisinin üstünde, dikey ortası çizgide; sol kenar = durak metni x'i. */
.bt-hs--s05-belgeler .s05-label {
	position: absolute;
	z-index: 3;
	top: -17px;
	left: 40px;
	display: inline-flex;
	align-items: center;
	box-sizing: border-box;
	min-height: 35px;
	padding: 0 14px;
	border: 1px solid var(--hs-line);
	border-radius: var(--hs-radius-pill);
	background: var(--hs-white);
	color: var(--hs-ink);
	font-size: var(--hs-fs-chip);
	font-weight: 600;
	line-height: 16.8px;
	white-space: nowrap;
}

.bt-hs--s05-belgeler .s05-group--r .s05-label {
	left: 92px;
}

.bt-hs--s05-belgeler .s05-group--fork .s05-label {
	top: -64px;
	left: 50%;
	transform: translateX(-50%);
}

/* Duraklar: 500 genişlik (24 dekor + 16 + 460 metin); sağdakiler omurgadan 52 içeride. */
.bt-hs--s05-belgeler .s05-stops {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.bt-hs--s05-belgeler .s05-group--r .s05-stops {
	padding-left: 52px;
}

.bt-hs--s05-belgeler .s05-group--fork .s05-stops {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-flow: row dense;
	gap: 24px 0;
}

.bt-hs--s05-belgeler .s05-stop {
	position: relative;
	margin-right: 100px;
	padding-left: 40px;
}

.bt-hs--s05-belgeler .s05-group--r .s05-stop {
	margin-right: 48px;
}

.bt-hs--s05-belgeler .s05-group--fork .s05-stop--l {
	grid-column: 1;
}

.bt-hs--s05-belgeler .s05-group--fork .s05-stop--r {
	grid-column: 2;
	margin-right: 48px;
	margin-left: 52px;
}

/* Durak noktası: 12 px lacivert + 2 px bant rengi hale. */
.bt-hs--s05-belgeler .s05-dot {
	position: absolute;
	z-index: 2;
	top: 5.25px;
	left: 6px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--s05-line);
	box-shadow: 0 0 0 2px var(--hs-navy-tint);
	pointer-events: none;
	transition: background-color var(--hs-dur-fast) ease;
}

/* Alt çizgi: bu noktanın merkezinden sonraki noktanın merkezine. */
.bt-hs--s05-belgeler .s05-stop:not(.s05-stop--last)::after {
	content: "";
	position: absolute;
	z-index: 1;
	top: 11.25px;
	left: 10.5px;
	width: 3px;
	height: calc(100% + 24px);
	background: var(--s05-line);
	pointer-events: none;
	transition: background-color var(--hs-dur-fast) ease;
}

/* Masaüstü H3 = Heading/Card title 18/22.5, 700, −1 %. */
.bt-hs--s05-belgeler .s05-stop__title {
	display: flow-root;
	min-height: 23px;
	padding-top: 0.75px;
	color: var(--hs-ink);
	font-size: var(--hs-fs-card-title);
	font-weight: 700;
	line-height: 22.5px;
	letter-spacing: -0.01em;
}

.bt-hs--s05-belgeler .s05-stop__docs {
	position: relative;
	top: 0.5px;
	margin-top: 3.75px;
	padding-top: 0.5px;
	color: var(--hs-muted);
	font-size: var(--hs-fs-small);
	line-height: 21.75px;
}

/* H3 bağlantısı: blok, odak halkası H3 kutusundan 6/4 px taşar (2 px #4A3F9F, köşe 6); ::after tüm durağı kaplar. */
.bt-hs--s05-belgeler .s05-stop__link {
	display: block;
	margin: -2px -4px;
	padding: 2px 4px;
	border-radius: 6px;
	color: inherit;
	text-decoration: none;
}

.bt-hs--s05-belgeler .s05-stop__link:hover {
	color: inherit;
	text-decoration: none;
}

/* z-index 1: belge satırı (position: relative) da bağlantı alanında kalsın; tüm durak tıklanır (spec: 71 / 93 px hedef). */
.bt-hs--s05-belgeler .s05-stop__link::after {
	content: "";
	position: absolute;
	z-index: 1;
	inset: 0;
}

.bt-hs--s05-belgeler .s05-stop__link:focus-visible {
	outline: 2px solid var(--hs-focus);
	outline-offset: 0;
	border-radius: 6px;
}

/* Durak ışığı (işaretçi): nokta altın, H3 2 px altın alt çizgi (4 px aralık). */
.bt-hs--s05-belgeler .s05-stop:hover .s05-dot {
	background: var(--s05-lit);
}

.bt-hs--s05-belgeler .s05-stop:hover .s05-stop__title {
	text-decoration: underline 2px var(--s05-lit);
	text-underline-offset: 4px;
}

/* Uç: omurga halkanın merkezinde biter (28 px, 3 px kontur, 10 px altın merkez); hub bağlantısı 12 aşağıda. */
.bt-hs--s05-belgeler .s05-end {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	margin-top: 18px;
	padding-bottom: 1px;
}

.bt-hs--s05-belgeler .s05-end::before {
	content: "";
	position: absolute;
	z-index: 0;
	top: -18px;
	left: calc(50% - 1.5px);
	width: 3px;
	height: 32px;
	background: var(--s05-line);
	pointer-events: none;
}

.bt-hs--s05-belgeler .s05-terminal {
	position: relative;
	z-index: 1;
	flex: none;
	box-sizing: border-box;
	width: 28px;
	height: 28px;
	border: 3px solid var(--s05-line);
	border-radius: 50%;
	background: var(--hs-white);
}

.bt-hs--s05-belgeler .s05-terminal::after {
	content: "";
	position: absolute;
	inset: 6px;
	border-radius: 50%;
	background: var(--hs-gold);
}

/* Hub bağlantısı (Button/Text link): satır 20 (19.2 metin) + 3 + 2 px altın çizgi = 25. */
.bt-hs--s05-belgeler .s05-hub {
	position: relative;
	z-index: 1;
	padding-bottom: 5.8125px;
}

/* Görünmez dokunma alanı: tek satırda 25 px olan bağlantı ≥ 44 px hedef alır (görünüm değişmez). */
.bt-hs--s05-belgeler .s05-hub::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: -10px 0;
}

.bt-hs--s05-belgeler .s05-hub svg {
	display: block;
	flex: none;
	width: 18px;
	height: 18px;
}

/* Grup ışığı (masaüstü, işaretçi): grubun dalı, alt çizgileri ve istasyonu altın; istasyona 32 px hale. */
@media (min-width: 1025px) {
	.bt-hs--s05-belgeler .s05-group:hover::before,
	.bt-hs--s05-belgeler .s05-group--fork:hover::after {
		border-color: var(--s05-lit);
	}

	.bt-hs--s05-belgeler .s05-group:hover .s05-stop:not(.s05-stop--last)::after {
		background: var(--s05-lit);
	}

	.bt-hs--s05-belgeler .s05-group:hover .s05-station {
		border-color: var(--s05-lit);
		outline: 1px solid var(--hs-gold-a50);
		outline-offset: 5px;
	}
}

/* ---------------------------------------------------------------- Tablet ve mobil: tek omurga */

@media (max-width: 1024px) {
	.bt-hs--s05-belgeler {
		--hs-pad-top: var(--hs-pad-y);
		--hs-pad-bottom: var(--hs-pad-y);
	}

	.bt-hs--s05-belgeler .s05-top {
		flex-direction: column;
		align-items: stretch;
		gap: 24px;
	}

	.bt-hs--s05-belgeler .s05-text {
		width: auto;
		gap: 11.671875px;
	}

	.bt-hs--s05-belgeler .s05-h2 {
		padding-top: 1px;
		line-height: var(--hs-lh-h2);
	}

	.bt-hs--s05-belgeler .s05-intro {
		padding-bottom: 0.4375px;
		line-height: 1.5528;
	}

	.bt-hs--s05-belgeler .s05-origin {
		width: auto;
		padding: 20px;
		border-radius: var(--hs-radius-glass);
	}

	.bt-hs--s05-belgeler .s05-docs {
		gap: 12px 16px;
	}

	.bt-hs--s05-belgeler .s05-glyph {
		width: 24px;
		height: 24px;
	}

	.bt-hs--s05-belgeler .s05-route {
		margin-top: 24px;
	}

	.bt-hs--s05-belgeler .s05-map {
		display: flex;
		flex-direction: column;
		gap: 28px;
		padding-top: 32px;
	}

	.bt-hs--s05-belgeler .s05-map::before,
	.bt-hs--s05-belgeler .s05-map::after,
	.bt-hs--s05-belgeler .s05-group::before,
	.bt-hs--s05-belgeler .s05-group--fork::after,
	.bt-hs--s05-belgeler .s05-stop:not(.s05-stop--last)::after {
		content: none;
	}

	/* Omurga: panelin alt kenarından (rota −24) uç halkanın merkezine; merkez çizgisi x 16. */
	.bt-hs--s05-belgeler .s05-spine {
		top: -24px;
		left: 14.5px;
	}

	.bt-hs--s05-belgeler .s05-group,
	.bt-hs--s05-belgeler .s05-group--r,
	.bt-hs--s05-belgeler .s05-group--fork {
		display: flex;
		flex-direction: column;
		gap: 16px;
		margin-top: 0;
		padding-top: 0;
	}

	.bt-hs--s05-belgeler .s05-group__head {
		position: relative;
		display: flex;
		align-items: center;
		min-height: 35px;
		padding-left: 40px;
	}

	.bt-hs--s05-belgeler .s05-group .s05-station {
		top: calc(50% - 9px);
		left: 7px;
		width: 18px;
		height: 18px;
		border-radius: 50%;
	}

	.bt-hs--s05-belgeler .s05-group .s05-label {
		position: relative;
		top: auto;
		left: auto;
		transform: none;
	}

	.bt-hs--s05-belgeler .s05-stops,
	.bt-hs--s05-belgeler .s05-group--r .s05-stops,
	.bt-hs--s05-belgeler .s05-group--fork .s05-stops {
		display: flex;
		flex-direction: column;
		gap: 16px;
		padding-left: 0;
	}

	.bt-hs--s05-belgeler .s05-group .s05-stop {
		margin: 0;
	}

	.bt-hs--s05-belgeler .s05-dot {
		top: 6.5px;
		left: 11px;
		width: 10px;
		height: 10px;
	}

	/* Mobil H3 = Heading/H4 17/22.95, 600; belge satırı 3 satır (65.1 → 66). */
	.bt-hs--s05-belgeler .s05-stop__title {
		font-size: var(--hs-fs-h4);
		font-weight: 600;
		padding-top: 1px;
		line-height: 22.95px;
		letter-spacing: 0;
	}

	.bt-hs--s05-belgeler .s05-stop__docs {
		top: 0.125px;
		margin-top: 2.921875px;
		padding-top: 0.875px;
	}

	.bt-hs--s05-belgeler .s05-end {
		flex-direction: row;
		gap: 0;
		min-height: 44px;
		margin-top: 28px;
		padding: 0 0 0 40px;
	}

	.bt-hs--s05-belgeler .s05-end::before {
		top: -28px;
		bottom: 50%;
		left: 14.5px;
		height: auto;
	}

	.bt-hs--s05-belgeler .s05-terminal {
		position: absolute;
		top: calc(50% - 14px);
		left: 2px;
	}

	.bt-hs--s05-belgeler .s05-hub {
		padding-bottom: 5.625px;
	}

	/* Tasarlanmamış tablet aralığı: durak metni okunur ölçüde (≤ 640). */
	.bt-hs--s05-belgeler .s05-stop__title,
	.bt-hs--s05-belgeler .s05-stop__docs {
		max-width: 640px;
	}
}

/* Mobil (Figma 390): belge ızgarası 2 × 145; hub bağlantısı 310'u doldurur, ok sağda. */
@media (max-width: 767px) {
	.bt-hs--s05-belgeler .s05-docs {
		grid-template-columns: repeat(auto-fill, 145px);
	}

	.bt-hs--s05-belgeler .s05-hub {
		flex: 1 1 auto;
		justify-content: space-between;
	}
}

/* Dar telefonlar (2 × 145 sığmaz): tek sütun, adlar tek satır. */
@media (max-width: 379px) {
	.bt-hs--s05-belgeler .s05-docs {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------------------------------------------------------------- Zorlanmış renkler */

@media (forced-colors: active) {
	.bt-hs--s05-belgeler .s05-spine,
	.bt-hs--s05-belgeler .s05-dot,
	.bt-hs--s05-belgeler .s05-end::before,
	.bt-hs--s05-belgeler .s05-terminal::after,
	.bt-hs--s05-belgeler .s05-stop::after {
		background: CanvasText;
		forced-color-adjust: none;
	}

	.bt-hs--s05-belgeler .s05-stop__link::after {
		background: none;
	}
}
