/* Kalistack — SSL Nedir? sayfası widget'ları (ktp-)
 *
 * Sayfanın kendi dili: bir başvuru kitabı. Beyaz kâğıt, serif başlıklar,
 * geniş okuma sütunu, kenarda not rayı, tuğla kırmızısı vurgu. Sitedeki
 * diğer sayfaların hiçbiri serif kullanmıyor; bu sayfanın işi okutmak.
 */

.ktp-kap { background: #FFFFFF; }

.ktp {
	--ktp-vurgu: #8A2B24;
	--ktp-ink: #1A1A1A;
	--ktp-sus: #5A5750;
	--ktp-cizgi: #E4E1D9;
	--ktp-kagit: #F5F3EE;
	max-width: 1060px;
	margin: 0 auto;
}

.ktp-serif {
	font-family: Georgia, 'Times New Roman', 'Noto Serif', serif;
}

.ktp-tepe { margin-bottom: 30px; }
.ktp-tepe--orta { text-align: center; }
.ktp-etiket {
	display: inline-block; margin: 0 0 12px;
	font-size: 11.5px; font-weight: 700;
	letter-spacing: .18em; text-transform: uppercase; color: var(--ktp-vurgu);
}
.ktp-bas {
	margin: 0 0 12px;
	font-family: Georgia, 'Times New Roman', 'Noto Serif', serif;
	font-size: 32px; line-height: 1.24; font-weight: 700; color: var(--ktp-ink);
}
.ktp-ack { margin: 0; font-size: 15.5px; line-height: 1.75; color: var(--ktp-sus); }
.ktp-tepe--orta .ktp-ack { max-width: 640px; margin-left: auto; margin-right: auto; }

.ktp-btn {
	display: inline-block;
	padding: 13px 24px; border-radius: 3px;
	font-size: 14.5px; font-weight: 700; text-decoration: none;
	border: 1px solid var(--ktp-vurgu);
	background: var(--ktp-vurgu); color: #fff;
	transition: filter .18s ease, background-color .18s ease, color .18s ease;
}
.ktp-btn:hover { filter: brightness(1.12); }
.ktp-btn--ikinci { background: transparent; color: var(--ktp-vurgu); }
.ktp-btn--ikinci:hover { background: rgba(138, 43, 36, .06); filter: none; }
.ktp-dugmeler { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }

/* =====================================================================
 * 1) Açılış — kısa cevap + anlatım + not rayı
 * ================================================================== */
.ktp-h1 {
	margin: 0 0 20px;
	font-family: Georgia, 'Times New Roman', 'Noto Serif', serif;
	font-size: 42px; line-height: 1.2; font-weight: 700; color: var(--ktp-ink);
	max-width: 16ch;
}
.ktp-govde {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
	gap: 52px;
	align-items: start;
}
.ktp-kisa {
	margin: 0 0 26px;
	padding: 20px 24px;
	background: var(--ktp-kagit);
}
.ktp-ketiket {
	display: block; margin-bottom: 7px;
	font-size: 10.5px; font-weight: 700;
	letter-spacing: .14em; text-transform: uppercase; color: var(--ktp-vurgu);
}
.ktp-kmetin {
	display: block;
	font-family: Georgia, 'Times New Roman', 'Noto Serif', serif;
	font-size: 19px; line-height: 1.6; color: var(--ktp-ink);
}
.ktp-paragraf {
	margin: 0 0 18px;
	font-size: 16px; line-height: 1.82; color: #2E2C28;
	max-width: 64ch;
}
.ktp-paragraf:last-child { margin-bottom: 0; }

/* Kenardaki not rayı */
.ktp-ray { position: sticky; top: 100px; }
.ktp-not {
	padding: 18px 20px;
	border-top: 2px solid var(--ktp-ink);
	background: var(--ktp-kagit);
}
.ktp-not + .ktp-not { margin-top: 14px; }
.ktp-nbas {
	margin: 0 0 6px;
	font-size: 11px; font-weight: 700;
	letter-spacing: .12em; text-transform: uppercase; color: var(--ktp-vurgu);
}
.ktp-nmetin { margin: 0; font-size: 13.5px; line-height: 1.68; color: var(--ktp-sus); }

/* =====================================================================
 * 2) Kablodan ne geçiyor?
 * ================================================================== */
.ktp-tel {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 22px;
	align-items: stretch;
}
.ktp-kutu {
	display: flex; flex-direction: column;
	padding: 24px;
	border: 1px solid var(--ktp-cizgi);
	background: #fff;
}
.ktp-kust {
	display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
	margin: 0 0 6px;
}
.ktp-krotwo {
	font-size: 11px; font-weight: 700;
	letter-spacing: .12em; text-transform: uppercase; color: var(--ktp-sus);
}
.ktp-kbas {
	margin: 0 0 4px;
	font-family: Georgia, 'Times New Roman', 'Noto Serif', serif;
	font-size: 20px; font-weight: 700; color: var(--ktp-ink);
}
.ktp-kack { margin: 0 0 18px; font-size: 13.5px; line-height: 1.65; color: var(--ktp-sus); }

/* Kablo içeriği */
.ktp-veri {
	flex: 1 1 auto;
	padding: 16px;
	background: var(--ktp-kagit);
	border: 1px dashed var(--ktp-cizgi);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 12.5px; line-height: 1.9;
	color: var(--ktp-ink);
	overflow-wrap: anywhere;
	word-break: break-word;
}
.ktp-kutu--sifreli .ktp-veri { color: var(--ktp-sus); }
.ktp-vsatir { display: block; }

.ktp-anahtar {
	display: inline-flex; align-items: center; gap: 10px;
	margin: 18px 0 0;
	padding: 9px 14px;
	border: 1px solid var(--ktp-cizgi);
	background: #fff;
	color: var(--ktp-ink);
	font-size: 13.5px; font-weight: 700;
	cursor: pointer;
}
.ktp-anahtar:hover { border-color: var(--ktp-vurgu); }
.ktp-anahtar:focus-visible { outline: 2px solid var(--ktp-vurgu); outline-offset: 2px; }
.ktp-lamba {
	width: 10px; height: 10px; border-radius: 50%;
	background: #C6C2B8;
}
.ktp-anahtar[aria-pressed="true"] .ktp-lamba { background: var(--ktp-vurgu); }
.ktp-telnot { margin: 16px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--ktp-sus); }

/* =====================================================================
 * 3) Terimler — süzgeçli
 * ================================================================== */
/* Etiket blok olmazsa içindeki %100 genişlik satır kutusuna göre hesaplanır. */
.ktp-suzgec-alan { display: block; }
.ktp-suzgec {
	display: block;
	width: 100%; max-width: 420px; margin: 0 auto 26px;
	padding: 12px 16px;
	border: 1px solid var(--ktp-cizgi);
	background: #fff;
	color: var(--ktp-ink);
	font-size: 15px;
	outline: 0;
}
.ktp-suzgec:focus { border-color: var(--ktp-vurgu); }

.ktp-terimler {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
	gap: 0 40px;
}
.ktp-terim {
	padding: 18px 0;
	border-bottom: 1px solid var(--ktp-cizgi);
}
.ktp-tad {
	margin: 0 0 5px;
	font-family: Georgia, 'Times New Roman', 'Noto Serif', serif;
	font-size: 17px; font-weight: 700; color: var(--ktp-ink);
}
.ktp-ttanim { margin: 0; font-size: 14px; line-height: 1.7; color: var(--ktp-sus); }
.ktp-bos {
	margin: 26px 0 0;
	font-size: 14px; color: var(--ktp-sus); text-align: center;
}

/* =====================================================================
 * 4) Sorular — açılır kapanır
 * ================================================================== */
.ktp-sorular { max-width: 800px; margin: 0 auto; }
.ktp-soru {
	border-bottom: 1px solid var(--ktp-cizgi);
}
.ktp-soru > summary {
	position: relative;
	padding: 20px 44px 20px 0;
	list-style: none;
	cursor: pointer;
	font-family: Georgia, 'Times New Roman', 'Noto Serif', serif;
	font-size: 18px; font-weight: 700; line-height: 1.45; color: var(--ktp-ink);
}
.ktp-soru > summary::-webkit-details-marker { display: none; }
.ktp-soru > summary::after {
	content: '';
	position: absolute; right: 8px; top: 50%;
	width: 12px; height: 12px;
	border-right: 2px solid var(--ktp-vurgu);
	border-bottom: 2px solid var(--ktp-vurgu);
	transform: translateY(-70%) rotate(45deg);
	transition: transform .2s ease;
}
.ktp-soru[open] > summary::after { transform: translateY(-30%) rotate(-135deg); }
.ktp-soru > summary:focus-visible { outline: 2px solid var(--ktp-vurgu); outline-offset: -2px; }
.ktp-cevap {
	margin: 0; padding: 0 44px 22px 0;
	font-size: 15px; line-height: 1.78; color: var(--ktp-sus);
}

.ktp-kapanis {
	max-width: 800px; margin: 34px auto 0;
	padding: 26px 28px;
	background: var(--ktp-kagit);
}
.ktp-kbaslik {
	margin: 0 0 8px;
	font-family: Georgia, 'Times New Roman', 'Noto Serif', serif;
	font-size: 21px; font-weight: 700; color: var(--ktp-ink);
}
.ktp-kmetin2 { margin: 0; font-size: 14.5px; line-height: 1.72; color: var(--ktp-sus); }
.ktp-kapanis .ktp-dugmeler { margin-top: 20px; }

/* =====================================================================
 * Duyarlı
 * ================================================================== */
@media ( max-width: 1024px ) {
	.ktp-govde { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	.ktp-ray { position: static; }
	.ktp-h1 { font-size: 34px; max-width: none; }
	.ktp-bas { font-size: 27px; }
	.ktp-tel { grid-template-columns: minmax(0, 1fr); }
}

@media ( max-width: 620px ) {
	.ktp-h1 { font-size: 28px; }
	.ktp-bas { font-size: 23px; }
	.ktp-kmetin { font-size: 17px; }
	.ktp-paragraf { font-size: 15.5px; }
	.ktp-dugmeler .ktp-btn { flex: 1 1 100%; text-align: center; }
	.ktp-kutu { padding: 18px 16px; }
	.ktp-kisa { padding: 16px 18px; }
	.ktp-soru > summary { font-size: 16px; padding-right: 36px; }
	.ktp-cevap { padding-right: 0; font-size: 14.5px; }
	.ktp-kapanis { padding: 20px 18px; }
}

@media ( prefers-reduced-motion: reduce ) {
	.ktp-btn, .ktp-soru > summary::after { transition: none; }
}
