/*
 * PMAP Core — main.css
 *
 * F19 REFACTOR: Bu dosya artik YALNIZ layout wrapper'i + sayfaya ozgu
 * (chip, breadcrumb, lead-form input, testimonial blockquote, lab-voices avatar
 * mono) detaylari icerir. Tum gorsel kimlik (kart, gradient, hero tipografi,
 * proofbar, buton) ana sayfa pmap-brand-override.css component'lerine
 * delege edilmistir.
 *
 * F18-4 yerel BEM gorsel tabakasi (1209 satir) AGRESIF kuculmustur:
 *   - .blog-hero__bg, __glow, __headline, __eyebrow, __subhead, __proof,
 *     __proof-chip, __cta-row, __cta KALDIRILDI (bg-gradient-purple-header,
 *     hero-headline--pmap, hero-proofbar, btn-teal reuse).
 *   - .blog-latest__card, __media, __body, __card-title, __excerpt, __cta
 *     KALDIRILDI (pmap-card reuse).
 *   - .blog-featured__card, __media, __body, __card-title, __card-excerpt
 *     KALDIRILDI (pmap-card--media + feature reuse).
 *   - .blog-topic-grid__card, __icon, __desc KALDIRILDI (pmap-card reuse).
 *   - .blog-related-ebooks__card, __title, __cta KALDIRILDI.
 *   - .ebooks-* karsiliklari (hero, featured, grid card, use-cases card,
 *     lab-voices card, related-blog card, final-cta cta) KALDIRILDI.
 *   - .blog-newsletter__submit ve .ebooks-lead-form__submit yerel renk
 *     ovveride'lari KALDIRILDI (btn-teal reuse).
 *   - --f18-* token bloklari KALDIRILDI; marka token'lari (--color-teal-1,
 *     --color-anthracite, --color-almost-black) dogrudan kullanilir.
 *
 * Bu dosya `functions.php` icinde page-blog.php / page-ebooks.php / single.php
 * gorulduginde kosullu olarak enqueue edilir (K-U18-5).
 *
 * Responsive kirim noktalari:
 *   mobile  : < 640px
 *   tablet  : 640-1023
 *   desktop : >= 1024
 */

/* =========================================================================
 * 1. Site main wrapper — sadece zemin token referansi.
 * ========================================================================= */
.site-main--blog-hub,
.site-main--ebooks-landing {
	background: #ffffff;
	color: #041361;
}

/* =========================================================================
 * 2. Section layout wrapper (padding + max-width).
 * Tum bloklarda paylasilan dis layout — gorsel kimlik dahil degildir.
 * ========================================================================= */
.blog-hero,
.blog-featured,
.blog-category-chips,
.blog-topic-grid,
.blog-author-spotlight,
.blog-newsletter,
.blog-final-cta,
.blog-related-ebooks,
.blog-latest,
.ebooks-hero,
.ebooks-why,
.ebooks-featured,
.ebooks-grid,
.ebooks-use-cases,
.ebooks-testimonial,
.ebooks-lab-voices,
.ebooks-lead-form,
.ebooks-final-cta,
.ebooks-related-blog,
.ebooks-layers-wrap {
	position: relative;
	padding: 5rem 1.25rem;
}
.blog-hero,
.ebooks-hero {
	padding-top: 6rem;
	padding-bottom: 6rem;
	overflow: hidden;
}
@media (max-width: 639px) {
	.blog-hero,
	.blog-featured,
	.blog-category-chips,
	.blog-topic-grid,
	.blog-author-spotlight,
	.blog-newsletter,
	.blog-final-cta,
	.blog-related-ebooks,
	.blog-latest,
	.ebooks-hero,
	.ebooks-why,
	.ebooks-featured,
	.ebooks-grid,
	.ebooks-use-cases,
	.ebooks-testimonial,
	.ebooks-lab-voices,
	.ebooks-lead-form,
	.ebooks-final-cta,
	.ebooks-related-blog,
	.ebooks-layers-wrap {
		padding: 3.5rem 1rem;
	}
}

.blog-hero__inner,
.blog-featured__inner,
.blog-category-chips__inner,
.blog-topic-grid__inner,
.blog-author-spotlight__inner,
.blog-newsletter__inner,
.blog-final-cta__inner,
.blog-related-ebooks__inner,
.blog-latest__inner,
.ebooks-hero__inner,
.ebooks-why__inner,
.ebooks-featured__inner,
.ebooks-grid__inner,
.ebooks-use-cases__inner,
.ebooks-testimonial__inner,
.ebooks-lab-voices__inner,
.ebooks-lead-form__inner,
.ebooks-final-cta__inner,
.ebooks-related-blog__inner,
.ebooks-breadcrumb__inner {
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

/* =========================================================================
 * 3. Hero subhead wrapper (marka hero-body icinde paragraf max-width).
 * pmap-brand-override.css .hero-body p font ayari verir; biz sadece
 * okunabilirlik icin max-width belirleriz.
 * ========================================================================= */
.blog-hero__subhead-wrap,
.ebooks-hero__subhead-wrap {
	max-width: 60ch;
	margin: 1.5rem 0 1.75rem;
}
.blog-hero__subhead-wrap p,
.ebooks-hero__subhead-wrap p {
	color: rgba(255, 255, 255, 0.85);
	margin: 0;
	font-size: 1.05rem;
	line-height: 1.65;
}
.blog-hero__cta-row,
.ebooks-hero__cta-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 1.5rem;
	margin-top: 2rem;
}

/* =========================================================================
 * 4. Ortak section header (.pmap-eyebrow uzerine layout + .blog-section-title
 *    + .blog-section-lede). Beyaz zemin (default) ve koyu zemin (--on-dark)
 *    varyantlari.
 * ========================================================================= */
.blog-section-header {
	margin: 0 auto 3rem;
	max-width: 760px;
	text-align: center;
}
.pmap-eyebrow {
	display: inline-block;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #3138A8;
	margin: 0 0 0.75rem;
}
.blog-section-title {
	font-size: clamp(1.75rem, 3vw, 2.6rem);
	line-height: 1.2;
	font-weight: 800;
	color: #041361;
	margin: 0 0 1rem;
	letter-spacing: -0.01em;
}
.blog-section-lede {
	font-size: 1.05rem;
	line-height: 1.6;
	color: #2A2F45;
	margin: 0 auto;
	max-width: 56ch;
	font-weight: 300;
}
/* Koyu zemin (hero gradient, dark-gray gradient) uzerinde tipografi. */
.blog-section-header--on-dark .blog-section-title,
.blog-section-title--on-dark {
	color: #ffffff;
}
.blog-section-lede--on-dark {
	color: rgba(255, 255, 255, 0.82);
}

/* =========================================================================
 * 5. Latest filter aktif rozeti (bolum 4).
 * ========================================================================= */
.blog-latest__filter-active {
	font-size: 0.92rem;
	color: #2A2F45;
	margin: 0.5rem 0 0;
}
.blog-latest__filter-active strong {
	color: #3138A8;
}

/* =========================================================================
 * 6. PMAP card grid — 4 kolon varyant (blog-topic-grid icin).
 * Ana sayfa .pmap-card-grid default 3 kolon; blog topics 4 kart icin
 * override.
 * ========================================================================= */
@media (min-width: 1024px) {
	.pmap-card-grid--4col {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}
@media (min-width: 640px) and (max-width: 1023px) {
	.pmap-card-grid--4col {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* =========================================================================
 * 7. PMAP card — FEATURE varyanti (yatay 2-kolon featured layout).
 * Sadece featured writeup / featured playbook icin grid-template overrride.
 * ========================================================================= */
@media (min-width: 768px) {
	.pmap-card--feature {
		display: grid;
		grid-template-columns: 1.05fr 1fr;
	}
	.pmap-card--feature .pmap-card__visual {
		aspect-ratio: auto;
		min-height: 320px;
	}
	.pmap-card--feature .pmap-card__body {
		padding: 2.5rem 2.25rem;
	}
}

/* =========================================================================
 * 8. Chip filtreleri (blog kategori + ebook topic). Ana sayfada birebir
 * muadili olmadigi icin yerel kaldi, marka token'lariyla uyumlu.
 * ========================================================================= */
.blog-category-chips__list,
.ebooks-grid__chips {
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem 0.6rem;
}
.blog-category-chips__chip,
.ebooks-grid__chip {
	display: inline-flex;
	padding: 0.5rem 1.1rem;
	border: 1px solid rgba(4, 19, 97, 0.15);
	border-radius: 999px;
	font-size: 0.85rem;
	font-weight: 600;
	color: #041361;
	text-decoration: none;
	background: #ffffff;
	transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.blog-category-chips__chip:hover,
.ebooks-grid__chip:hover {
	border-color: #3138A8;
	color: #3138A8;
	box-shadow: 0 4px 12px rgba(0, 180, 216, 0.15);
}
.blog-category-chips__chip.is-active,
.ebooks-grid__chip.is-active {
	background: linear-gradient(to right, #232A86, #3138A8);
	color: #ffffff;
	border-color: #3138A8;
}
.blog-category-chips__chip:focus-visible,
.ebooks-grid__chip:focus-visible {
	outline: 2px solid #3138A8;
	outline-offset: 2px;
}

/* =========================================================================
 * 9. Ebook breadcrumb.
 * ========================================================================= */
.ebooks-breadcrumb {
	padding: 1.25rem;
	border-bottom: 1px solid rgba(4, 19, 97, 0.08);
	background: #f7f8fc;
}
.ebooks-breadcrumb__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	font-size: 0.85rem;
	color: #6b7280;
}
.ebooks-breadcrumb__link {
	color: #041361;
	text-decoration: none;
}
.ebooks-breadcrumb__link:hover {
	color: #3138A8;
}
.ebooks-breadcrumb__item--current {
	color: #041361;
	font-weight: 600;
}

/* =========================================================================
 * 10. Ebook featured — chapter listesi (pmap-card__body icinde sade ol).
 * ========================================================================= */
.ebooks-featured__chapters {
	margin: 1rem 0 1.5rem;
	padding-left: 1.1rem;
	color: #2A2F45;
}
.ebooks-featured__chapter {
	font-size: 0.92rem;
	line-height: 1.55;
	margin-bottom: 0.45rem;
}
.ebooks-featured__cta-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1.25rem;
	margin-top: auto;
}

/* =========================================================================
 * 11. Testimonial blockquote (bolum 8 — ebook landing).
 * Koyu gradient zemin uzerinde.
 * ========================================================================= */
.ebooks-testimonial__quote {
	max-width: 760px;
	margin: 0 auto;
	padding: 2.5rem 2rem;
	background: rgba(255, 255, 255, 0.05);
	border-left: 4px solid #3138A8;
	border-radius: 14px;
	font-style: italic;
}
.ebooks-testimonial__quote-text {
	font-size: 1.15rem;
	line-height: 1.65;
	color: #ffffff;
	margin: 0 0 1rem;
	font-weight: 300;
}
.ebooks-testimonial__attr {
	font-style: normal;
	font-size: 0.85rem;
	color: rgba(255, 255, 255, 0.7);
	letter-spacing: 0.04em;
}

/* =========================================================================
 * 12. Lab voices — avatar mono karakter (pmap-card__visual icine
 *     yerlestirildi; mono harf konumu).
 * ========================================================================= */
.ebooks-lab-voices__avatar-mono {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 3rem;
	font-weight: 800;
	color: rgba(255, 255, 255, 0.95);
	pointer-events: none;
	z-index: 1;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* =========================================================================
 * 13. Author spotlight — 6 kart, kucuk avatar grid (sayfa ozeti).
 * pmap-card kullanmak kucuk avatar layout icin agir; bu yuzden
 * yerel hafif kart kaldi, marka token'lariyla uyumlu.
 * ========================================================================= */
.blog-author-spotlight__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.25rem;
}
@media (min-width: 768px) {
	.blog-author-spotlight__list {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (min-width: 1024px) {
	.blog-author-spotlight__list {
		grid-template-columns: repeat(6, 1fr);
	}
}
.blog-author-spotlight__card {
	background: #ffffff;
	border: 1px solid rgba(4, 19, 97, 0.1);
	border-radius: 14px;
	padding: 1.5rem 1rem;
	text-align: center;
	transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
.blog-author-spotlight__card:hover {
	transform: translateY(-3px);
	border-color: #3138A8;
	box-shadow: 0 12px 32px rgba(4, 19, 97, 0.1);
}
.blog-author-spotlight__avatar {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	overflow: hidden;
	background: linear-gradient(135deg, #041361, #1E2C7A);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 0.9rem;
}
.blog-author-spotlight__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.blog-author-spotlight__avatar-mono {
	font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
	color: #ffffff;
	font-weight: 800;
	font-size: 1.5rem;
}
.blog-author-spotlight__name {
	font-size: 0.98rem;
	margin: 0 0 0.25rem;
	font-weight: 700;
	color: #041361;
}
.blog-author-spotlight__name a {
	color: inherit;
	text-decoration: none;
}
.blog-author-spotlight__name a:hover {
	color: #3138A8;
}
.blog-author-spotlight__role {
	font-size: 0.8rem;
	color: #6b7280;
	margin: 0 0 0.5rem;
}
.blog-author-spotlight__bio {
	font-size: 0.82rem;
	color: #2A2F45;
	line-height: 1.5;
	margin: 0;
}

/* =========================================================================
 * 14. Newsletter inline form (bolum 8 — blog hub).
 * Koyu gradient zemin uzerinde input + submit (btn-teal reuse).
 * ========================================================================= */
.blog-newsletter__form {
	max-width: 560px;
	margin: 0 auto;
}
.blog-newsletter__field {
	margin-bottom: 1rem;
}
.blog-newsletter__label {
	display: block;
	font-size: 0.85rem;
	font-weight: 600;
	margin-bottom: 0.5rem;
	color: rgba(255, 255, 255, 0.85);
}
.blog-newsletter__row {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}
.blog-newsletter__input {
	flex: 1 1 220px;
	min-width: 0;
	padding: 0.85rem 1rem;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 10px;
	color: #ffffff;
	font-size: 1rem;
}
.blog-newsletter__input::placeholder {
	color: rgba(255, 255, 255, 0.5);
}
.blog-newsletter__input:focus {
	outline: 2px solid #3138A8;
	outline-offset: 1px;
	border-color: #3138A8;
	background: rgba(255, 255, 255, 0.12);
}
.blog-newsletter__footnote {
	font-size: 0.82rem;
	color: rgba(255, 255, 255, 0.7);
	margin: 0.85rem 0 0;
	text-align: center;
	line-height: 1.5;
}

/* =========================================================================
 * 15. Ebook lead-magnet form (bolum 10).
 * Koyu gradient zemin uzerinde kart icinde 5 alan; submit btn-teal reuse.
 * ========================================================================= */
.ebooks-lead-form__form {
	max-width: 720px;
	margin: 0 auto;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 20px;
	padding: 2.25rem 1.85rem;
}
.ebooks-lead-form__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-bottom: 1.5rem;
}
@media (min-width: 640px) {
	.ebooks-lead-form__grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.ebooks-lead-form__field--full {
		grid-column: 1 / -1;
	}
}
.ebooks-lead-form__field {
	display: flex;
	flex-direction: column;
}
.ebooks-lead-form__label {
	font-size: 0.85rem;
	font-weight: 600;
	color: rgba(255, 255, 255, 0.88);
	margin-bottom: 0.45rem;
}
.ebooks-lead-form__req {
	color: #3138A8;
}
.ebooks-lead-form__input,
.ebooks-lead-form__select {
	padding: 0.8rem 0.95rem;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 10px;
	color: #ffffff;
	font-size: 0.95rem;
	font-family: inherit;
}
.ebooks-lead-form__input::placeholder {
	color: rgba(255, 255, 255, 0.5);
}
.ebooks-lead-form__input:focus,
.ebooks-lead-form__select:focus {
	outline: 2px solid #3138A8;
	outline-offset: 1px;
	border-color: #3138A8;
	background: rgba(255, 255, 255, 0.12);
}
.ebooks-lead-form__privacy {
	margin: 1rem 0 0;
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.7);
	line-height: 1.5;
}
.ebooks-lead-form__status {
	max-width: 720px;
	margin: 0 auto 1rem;
	padding: 1rem 1.25rem;
	border-radius: 10px;
	font-size: 0.95rem;
	font-weight: 600;
}
.ebooks-lead-form__status--success {
	background: rgba(0, 180, 216, 0.18);
	border: 1px solid #3138A8;
	color: #ffffff;
}
.ebooks-lead-form__status--error {
	background: rgba(216, 30, 70, 0.18);
	border: 1px solid #ff6b6b;
	color: #ffd2d2;
}
.ebooks-grid__empty {
	max-width: 560px;
	margin: 2rem auto;
	padding: 1.5rem;
	text-align: center;
	color: #2A2F45;
	border: 1px dashed rgba(4, 19, 97, 0.2);
	border-radius: 14px;
	font-size: 1rem;
	line-height: 1.55;
}

/* =========================================================================
 * 16. Ebook layers intro wrap (PMAP Layers ust basligi override).
 * ========================================================================= */
.ebooks-layers-wrap {
	padding-bottom: 0;
}
.ebooks-layers-wrap__intro {
	max-width: 760px;
	margin: 0 auto 2.5rem;
	text-align: center;
}

/* =========================================================================
 * 17. Final CTA banner — blog + ebook (bg-gradient-dark-gray zemin).
 * Tipografi marka cizgisinde: buyuk beyaz headline, teal eyebrow,
 * btn-teal + hero-cta-secondary (zaten ana sayfa kutuphanesinde).
 * ========================================================================= */
.blog-final-cta,
.ebooks-final-cta {
	text-align: center;
}
.blog-final-cta__eyebrow,
.ebooks-final-cta__eyebrow {
	margin: 0 0 1rem;
}
.blog-final-cta__headline,
.ebooks-final-cta__headline {
	font-size: clamp(1.8rem, 3vw, 2.6rem);
	font-weight: 800;
	line-height: 1.2;
	color: #ffffff;
	margin: 0 0 1rem;
	letter-spacing: -0.01em;
}
.blog-final-cta__subhead,
.ebooks-final-cta__subhead {
	font-size: 1.05rem;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.82);
	max-width: 60ch;
	margin: 0 auto 2rem;
	font-weight: 300;
}
.blog-final-cta__row,
.ebooks-final-cta__row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 1rem 1.5rem;
}

/* =========================================================================
 * 18. single.php (blog detay) — marka tasarim dili.
 *
 * Yuzlerce yaziya olceklenecek tekil yazi duzeni:
 *   purple gradient hero -> overlapping featured image -> okunabilir tek
 *   kolon prose (~760px) -> taxonomy chip'leri -> blog-index-card related
 *   grid -> dark gradient CTA serit.
 *
 * Token'lar: navy #041361 / deep #020A3D / dark #0E1322,
 *            teal #3138A8 / #232A86 / hover #1B1F66, ink #2A2F45.
 * ========================================================================= */
.site-main--single {
	background: #ffffff;
	color: #041361;
}

/* (index.php fallback loop'u icin korunur — content.php hala kullanir.) */
.entry-reading-time {
	display: inline-block;
	margin-left: 0.75rem;
	font-size: 0.82rem;
	color: #6b7280;
	letter-spacing: 0.04em;
}

/* 18.1 Hero ------------------------------------------------------------- */
.single-hero {
	position: relative;
	overflow: hidden;
	color: #ffffff;
	padding: 4rem 1.25rem 3.25rem;
}
@media (max-width: 639px) {
	.single-hero {
		padding: 3rem 1rem 2.25rem;
	}
}
.single-hero__inner {
	max-width: 960px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.single-breadcrumb {
	margin: 0 0 1.5rem;
}
.single-breadcrumb__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.45rem;
	font-size: 0.82rem;
}
.single-breadcrumb__item {
	display: inline-flex;
	align-items: center;
}
.single-breadcrumb__link {
	color: rgba(255, 255, 255, 0.72);
	text-decoration: none;
	transition: color 160ms ease;
}
.single-breadcrumb__link:hover,
.single-breadcrumb__link:focus-visible {
	color: #3138A8;
}
.single-breadcrumb__sep {
	color: rgba(255, 255, 255, 0.35);
}
.single-breadcrumb__item--current span {
	color: rgba(255, 255, 255, 0.92);
	font-weight: 600;
}
.single-hero__eyebrow {
	color: #A7AEEC;
	margin: 0 0 0.85rem;
}
.single-hero__title {
	font-size: clamp(1.9rem, 3.6vw, 3rem);
	line-height: 1.16;
	font-weight: 800;
	letter-spacing: -0.015em;
	color: #ffffff;
	margin: 0 0 1.25rem;
	max-width: 24ch;
}
.single-hero__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.55rem;
	font-size: 0.92rem;
	color: rgba(255, 255, 255, 0.78);
}
.single-hero__author-name {
	color: #ffffff;
	font-weight: 600;
}
.single-hero__dot {
	color: rgba(255, 255, 255, 0.4);
}
.single-hero__reading {
	color: rgba(255, 255, 255, 0.62);
	letter-spacing: 0.03em;
}

/* 18.2 Featured image (hero altina hafif tasan cerceve) ----------------- */
.single-featured {
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 1.25rem;
}
.single-featured__frame {
	margin-top: -2.75rem;
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	background: #0E1322;
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow: 0 24px 60px -28px rgba(4, 19, 97, 0.45);
}
@media (max-width: 639px) {
	.single-featured__frame {
		margin-top: 1.75rem;
		border-radius: 14px;
	}
}
.single-featured__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
.single-featured__caption {
	margin: 0.85rem 0 0;
	text-align: center;
	font-size: 0.82rem;
	color: #6b7280;
}

/* 18.3 Body / prose ----------------------------------------------------- */
.single-body {
	max-width: 760px;
	margin: 0 auto;
	padding: 3.5rem 1.25rem 1rem;
}
@media (max-width: 639px) {
	.single-body {
		padding: 2.5rem 1rem 0.5rem;
	}
}
.single-body .entry-content {
	color: #2A2F45;
	font-size: 1.075rem;
	line-height: 1.75;
}
.single-body .entry-content > *:first-child {
	margin-top: 0;
}
.single-body .entry-content p {
	margin: 0 0 1.4rem;
}
.single-body .entry-content > p:first-of-type {
	font-size: 1.2rem;
	line-height: 1.65;
	color: #1f2540;
}
.single-body .entry-content h2 {
	font-size: clamp(1.4rem, 2.4vw, 1.85rem);
	line-height: 1.25;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: #041361;
	margin: 2.75rem 0 1rem;
}
.single-body .entry-content h3 {
	font-size: clamp(1.2rem, 1.8vw, 1.45rem);
	line-height: 1.3;
	font-weight: 800;
	color: #041361;
	margin: 2.25rem 0 0.85rem;
}
.single-body .entry-content h4 {
	font-size: 1.1rem;
	font-weight: 700;
	color: #041361;
	margin: 1.9rem 0 0.6rem;
}
.single-body .entry-content strong {
	color: #041361;
	font-weight: 700;
}
.single-body .entry-content a {
	color: #232A86;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	transition: color 160ms ease;
}
.single-body .entry-content a:hover,
.single-body .entry-content a:focus-visible {
	color: #1B1F66;
}
.single-body .entry-content ul,
.single-body .entry-content ol {
	margin: 0 0 1.4rem;
	padding-left: 1.4rem;
}
.single-body .entry-content li {
	margin: 0.4rem 0;
}
.single-body .entry-content ul li::marker {
	color: #3138A8;
}
.single-body .entry-content ol li::marker {
	color: #3138A8;
	font-weight: 700;
}
.single-body .entry-content blockquote {
	margin: 2rem 0;
	padding: 0.25rem 0 0.25rem 1.5rem;
	border-left: 3px solid #3138A8;
	color: #041361;
	font-size: 1.15rem;
	line-height: 1.6;
	font-style: italic;
}
.single-body .entry-content blockquote p:last-child {
	margin-bottom: 0;
}
.single-body .entry-content blockquote cite {
	display: block;
	margin-top: 0.5rem;
	font-size: 0.9rem;
	font-style: normal;
	font-weight: 600;
	color: #6b7280;
}
.single-body .entry-content code {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.9em;
	background: rgba(4, 19, 97, 0.06);
	padding: 0.15em 0.4em;
	border-radius: 5px;
	color: #041361;
}
.single-body .entry-content pre {
	margin: 1.75rem 0;
	padding: 1.25rem 1.4rem;
	background: #0E1322;
	color: #e6ecff;
	border-radius: 14px;
	overflow-x: auto;
	font-size: 0.9rem;
	line-height: 1.6;
}
.single-body .entry-content pre code {
	background: transparent;
	padding: 0;
	color: inherit;
	font-size: inherit;
}
.single-body .entry-content img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: 14px;
}
.single-body .entry-content figure {
	margin: 2rem 0;
}
/* E-kitap detayinda govde figuru, datasheet band'i gibi tam genislik 16:9 serit
   olsun (kaynak foto portre/3:2 olsa da). Sadece ebook'a scope; datasheet/guide
   etkilenmez. */
.single-article--ebook .entry-content figure img {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	object-fit: cover;
	object-position: center;
}
.single-body .entry-content figcaption {
	margin-top: 0.6rem;
	text-align: center;
	font-size: 0.82rem;
	color: #6b7280;
}
.single-body .entry-content hr {
	border: 0;
	height: 1px;
	background: rgba(4, 19, 97, 0.12);
	margin: 2.5rem 0;
}
.single-body .entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.75rem 0;
	font-size: 0.95rem;
}
.single-body .entry-content th,
.single-body .entry-content td {
	padding: 0.7rem 0.9rem;
	border: 1px solid rgba(4, 19, 97, 0.12);
	text-align: left;
}
.single-body .entry-content th {
	background: rgba(4, 19, 97, 0.04);
	color: #041361;
	font-weight: 700;
}
.single-pagelinks {
	margin-top: 2rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.single-pagelinks a,
.single-pagelinks > span {
	display: inline-flex;
	min-width: 2.2rem;
	height: 2.2rem;
	align-items: center;
	justify-content: center;
	padding: 0 0.7rem;
	border-radius: 10px;
	border: 1px solid rgba(4, 19, 97, 0.14);
	font-weight: 700;
	color: #041361;
	text-decoration: none;
}
.single-pagelinks > span {
	background: #3138A8;
	border-color: #3138A8;
	color: #ffffff;
}

/* 18.4 Taxonomy chip satiri --------------------------------------------- */
.single-taxonomy {
	margin: 3rem 0 0;
	padding-top: 2rem;
	border-top: 1px solid rgba(4, 19, 97, 0.10);
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}
.single-taxonomy__group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6rem;
}
.single-taxonomy__label {
	font-size: 0.72rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: #6b7280;
}
.single-taxonomy__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.single-chip {
	display: inline-flex;
	align-items: center;
	padding: 0.4rem 0.85rem;
	border-radius: 999px;
	border: 1px solid rgba(4, 19, 97, 0.14);
	background: #ffffff;
	color: #041361;
	font-size: 0.84rem;
	font-weight: 600;
	text-decoration: none;
	transition: border-color 160ms ease, color 160ms ease, transform 160ms ease;
}
.single-chip:hover,
.single-chip:focus-visible {
	border-color: #3138A8;
	color: #232A86;
	transform: translateY(-1px);
}
.single-chip--category {
	background: rgba(0, 180, 216, 0.08);
	border-color: rgba(0, 180, 216, 0.30);
}

/* 18.5 Back link -------------------------------------------------------- */
.single-backlink {
	margin: 2rem 0 0;
}
.single-backlink__link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: #232A86;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
}
.single-backlink__link:hover,
.single-backlink__link:focus-visible {
	color: #1B1F66;
}
.single-backlink__link svg {
	transition: transform 160ms ease;
}
.single-backlink__link:hover svg {
	transform: translateX(-3px);
}

/* 18.6 Related (blog-index-card grid'ini yeniden kullanir) -------------- */
.single-related {
	margin-top: 3.5rem;
	padding: 4rem 1.25rem;
	background: #fbfcff;
	border-top: 1px solid rgba(4, 19, 97, 0.08);
}
@media (max-width: 639px) {
	.single-related {
		padding: 2.75rem 1rem;
	}
}
.single-related__inner {
	max-width: 1200px;
	margin: 0 auto;
}
.single-related__header {
	margin: 0 0 2rem;
}
.single-related__eyebrow {
	color: #3138A8;
	margin: 0 0 0.5rem;
}
.single-related__title {
	font-size: clamp(1.4rem, 2.2vw, 1.9rem);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: #041361;
	margin: 0;
}

/* 18.7 Dark CTA serit --------------------------------------------------- */
.single-cta {
	padding: 4.5rem 1.25rem;
	color: #ffffff;
	text-align: center;
}
@media (max-width: 639px) {
	.single-cta {
		padding: 3.25rem 1rem;
	}
}
.single-cta__inner {
	max-width: 720px;
	margin: 0 auto;
}
.single-cta__eyebrow {
	color: #A7AEEC;
	margin: 0 0 1rem;
}
.single-cta__headline {
	font-size: clamp(1.7rem, 3vw, 2.4rem);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #ffffff;
	margin: 0 0 1rem;
}
.single-cta__subhead {
	font-size: 1.02rem;
	line-height: 1.65;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.82);
	margin: 0 auto 2rem;
	max-width: 56ch;
}
.single-cta__row {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 1.5rem;
	justify-content: center;
	align-items: center;
}

/* 18.8 Reduced motion --------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.single-chip,
	.single-breadcrumb__link,
	.single-backlink__link,
	.single-backlink__link svg,
	.single-body .entry-content a {
		transition: none;
	}
}

/* =========================================================================
 * 19. Reduced motion: marka kutuphanesi zaten icine reduced-motion korur;
 * burada sadece sayfaya ozgu transition'lar icin tamamlayici sifirlama.
 * ========================================================================= */
@media (prefers-reduced-motion: reduce) {
	.blog-author-spotlight__card,
	.blog-category-chips__chip,
	.ebooks-grid__chip,
	.blog-index-card,
	.blog-index-chip,
	.blog-index-pagination__list a {
		transition: none;
	}
}

/* =========================================================================
 * 20. Blog Index (/blog/) — paginated arsiv sablonu (home.php).
 *
 * Marka rengi tokenleri:
 *   primary navy   : #041361
 *   teal           : #3138A8
 *   teal hover     : #0096b6
 *   ink            : #2A2F45
 *   border         : rgba(4,19,97,0.10)
 *   surface        : #ffffff
 *
 * Goz onunde bulundurulan kullanim: yuzlerce yazinin paginate edilecegi
 * uretim ortami. Listeleme grid'i 1 kolon (mobile) -> 2 kolon (>=768)
 * -> 3 kolon (>=1200) seklinde olceklenir.
 * ========================================================================= */
.site-main--blog-index {
	background: #ffffff;
	color: #041361;
}

/* 20.1 Hero (purple gradient, careers olcek paritesi) --------------------- */
/* F-blog-hero-parity (2026-05-31): careers hero referansiyla buyutuldu.
 * Ortali + fotosuz tercih; min-height ile dikey ortali guclu karsilama,
 * iki tonlu baslik (son satir cyan accent) ve arkada hareketli hero-beam
 * isin katmani. Foto / sag sutun YOK (kullanici tercihi). */
.blog-index-hero {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 72vh;
	padding: 6rem 1.25rem 5rem;
	overflow: hidden;
	color: #ffffff;
}
@media (max-width: 1023px) {
	.blog-index-hero {
		min-height: 60vh;
		padding: 5rem 1.25rem 4rem;
	}
}
@media (max-width: 639px) {
	.blog-index-hero {
		min-height: 0;
		padding: 3.5rem 1rem 3rem;
	}
}
.blog-index-hero__inner {
	max-width: 980px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
	text-align: center;
}
.blog-index-hero__eyebrow {
	color: #5EE0F7;
	margin-bottom: 1rem;
}
.blog-index-hero__headline {
	font-size: clamp(2.4rem, 5vw, 4rem);
	line-height: 1.08;
	font-weight: 800;
	letter-spacing: -0.015em;
	margin: 0 auto 1.25rem;
	max-width: 20ch;
	color: #ffffff;
}
/* Iki tonlu baslik: satirlar block olarak yiginlanir; ilk satir disindaki
 * her satir cyan accent (careers hero ikinci satir dilinin ortali karsiligi).
 * Tek satirlik baslik (yalniz first-child) tamamen beyaz kalir. */
.blog-index-hero__headline-line {
	display: block;
}
.blog-index-hero__headline-line:not(:first-child) {
	color: #5EE0F7;
}
.blog-index-hero__subhead {
	font-size: clamp(1.02rem, 1.2vw, 1.15rem);
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.82);
	margin: 0 auto 2rem;
	max-width: 60ch;
	font-weight: 300;
}

/* 20.1b Hareketli isin katmani (careers hero-beam paritesi) --------------- */
/* Keyframe'ler (hero-beam-drift-1..4) brand-override.css icinde global;
 * burada yalniz container scope'u + beam pozisyon/gradient tanimlanir. */
.blog-index-hero__beams {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	z-index: 0;
}
.blog-index-hero__beams .hero-beam {
	position: absolute;
	top: -15%;
	height: 130%;
	width: 260px;
	filter: blur(70px);
	will-change: transform;
}
.blog-index-hero__beams .hero-beam--teal {
	background: linear-gradient(to bottom,
		transparent 0%,
		rgba(94, 229, 255, 0) 10%,
		rgba(94, 229, 255, 0.55) 50%,
		rgba(94, 229, 255, 0) 90%,
		transparent 100%);
	transform: rotate(14deg);
	opacity: 0.7;
	animation: hero-beam-drift-1 28s linear infinite;
}
.blog-index-hero__beams .hero-beam--purple {
	background: linear-gradient(to bottom,
		transparent 0%,
		rgba(167, 139, 250, 0) 10%,
		rgba(167, 139, 250, 0.5) 50%,
		rgba(167, 139, 250, 0) 90%,
		transparent 100%);
	transform: rotate(14deg);
	opacity: 0.55;
	animation: hero-beam-drift-2 36s linear infinite;
	width: 320px;
}
.blog-index-hero__beams .hero-beam--white {
	background: linear-gradient(to bottom,
		transparent 0%,
		rgba(230, 240, 255, 0) 10%,
		rgba(230, 240, 255, 0.32) 50%,
		rgba(230, 240, 255, 0) 90%,
		transparent 100%);
	transform: rotate(14deg);
	opacity: 0.5;
	animation: hero-beam-drift-3 44s linear infinite;
	width: 200px;
}
.blog-index-hero__beams .hero-beam--teal-slow {
	background: linear-gradient(to bottom,
		transparent 0%,
		rgba(13, 186, 197, 0) 15%,
		rgba(13, 186, 197, 0.4) 50%,
		rgba(13, 186, 197, 0) 85%,
		transparent 100%);
	transform: rotate(14deg);
	opacity: 0.45;
	animation: hero-beam-drift-4 52s linear infinite;
	width: 280px;
}
@media (prefers-reduced-motion: reduce) {
	.blog-index-hero__beams .hero-beam {
		animation: none;
	}
}

/* 20.2 Arama formu (hero icinde) ----------------------------------------- */
.blog-index-search {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 999px;
	padding: 0.4rem 0.5rem 0.4rem 1.1rem;
	max-width: 640px;
	margin: 0 auto;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	transition: border-color 160ms ease, background-color 160ms ease;
}
.blog-index-search:focus-within {
	border-color: rgba(0, 180, 216, 0.55);
	background: rgba(255, 255, 255, 0.12);
}
.blog-index-search__icon {
	color: rgba(255, 255, 255, 0.65);
	flex: 0 0 auto;
}
.blog-index-search__input {
	flex: 1 1 auto;
	min-width: 0;
	background: transparent;
	border: 0;
	outline: 0;
	color: #ffffff;
	font-size: 0.98rem;
	font-family: inherit;
	padding: 0.6rem 0.5rem;
}
.blog-index-search__input::placeholder {
	color: rgba(255, 255, 255, 0.55);
}
.blog-index-search__submit {
	flex: 0 0 auto;
	padding: 0.55rem 1.15rem;
	font-size: 0.92rem;
}
@media (max-width: 539px) {
	.blog-index-search {
		flex-wrap: wrap;
		border-radius: 18px;
		padding: 0.5rem;
	}
	.blog-index-search__input {
		flex: 1 1 100%;
		order: 2;
		padding: 0.6rem 0.75rem;
	}
	.blog-index-search__icon {
		order: 1;
		margin: 0 0.25rem 0 0.5rem;
	}
	.blog-index-search__submit {
		order: 3;
		width: 100%;
		margin-top: 0.45rem;
	}
}

/* 20.2b Hero guven rozetleri (careers proofbar paritesi, ortali) --------- */
.blog-index-hero__proof {
	list-style: none;
	margin: 1.5rem auto 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.6rem 1.5rem;
	max-width: 640px;
}
.blog-index-hero__proof-item {
	position: relative;
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: rgba(255, 255, 255, 0.78);
	padding-left: 1.5rem;
}
.blog-index-hero__proof-item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 7px;
	height: 7px;
	margin-top: -3.5px;
	border-radius: 50%;
	background: #5EE0F7;
	box-shadow: 0 0 10px rgba(94, 224, 247, 0.6);
}
@media (max-width: 479px) {
	.blog-index-hero__proof {
		gap: 0.55rem 1rem;
	}
	.blog-index-hero__proof-item {
		font-size: 0.78rem;
	}
}

/* 20.3 Kategori chip nav ------------------------------------------------- */
.blog-index-chips {
	background: #ffffff;
	border-bottom: 1px solid rgba(4, 19, 97, 0.08);
	padding: 1.5rem 1.25rem;
}
.blog-index-chips__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	justify-content: center;
}
.blog-index-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.5rem 1rem;
	border-radius: 999px;
	border: 1px solid rgba(4, 19, 97, 0.14);
	background: #ffffff;
	color: #041361;
	font-size: 0.88rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	text-decoration: none;
	transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, transform 160ms ease;
}
.blog-index-chip:hover,
.blog-index-chip:focus-visible {
	border-color: #3138A8;
	color: #0096b6;
	transform: translateY(-1px);
}
.blog-index-chip.is-active {
	background: #3138A8;
	border-color: #3138A8;
	color: #ffffff;
}
.blog-index-chip__count {
	font-size: 0.75rem;
	font-weight: 700;
	padding: 0.1rem 0.45rem;
	border-radius: 999px;
	background: rgba(4, 19, 97, 0.08);
	color: #2A2F45;
}
.blog-index-chip.is-active .blog-index-chip__count {
	background: rgba(255, 255, 255, 0.22);
	color: #ffffff;
}

/* 20.4 Liste header + meta ----------------------------------------------- */
.blog-index-list {
	padding: 4rem 1.25rem;
	background: #ffffff;
}
@media (max-width: 639px) {
	.blog-index-list {
		padding: 2.75rem 1rem;
	}
}
.blog-index-list__inner {
	max-width: 1200px;
	margin: 0 auto;
}
.blog-index-list__header {
	margin: 0 0 2.25rem;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.5rem 1.5rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid rgba(4, 19, 97, 0.08);
}
.blog-index-list__title {
	font-size: clamp(1.4rem, 2.2vw, 1.9rem);
	font-weight: 800;
	color: #041361;
	margin: 0;
	letter-spacing: -0.01em;
}
.blog-index-list__meta {
	margin: 0;
	color: #2A2F45;
	font-size: 0.92rem;
}
.blog-index-list__meta strong {
	color: #041361;
	font-weight: 800;
}

/* 20.5 Post kart grid'i -------------------------------------------------- */
.blog-index-grid {
	list-style: none;
	margin: 0 0 2.5rem;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}
@media (min-width: 768px) {
	.blog-index-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.75rem;
	}
}
@media (min-width: 1200px) {
	.blog-index-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
.blog-index-item {
	display: flex;
}
.blog-index-card {
	position: relative;
	width: 100%;
	background: #ffffff;
	border: 1px solid rgba(4, 19, 97, 0.10);
	border-radius: 18px;
	overflow: hidden;
	transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
	box-shadow: 0 1px 2px rgba(4, 19, 97, 0.04);
}
.blog-index-card:hover,
.blog-index-card:focus-within {
	transform: translateY(-3px);
	border-color: rgba(0, 180, 216, 0.55);
	box-shadow: 0 18px 40px -22px rgba(4, 19, 97, 0.35);
}
.blog-index-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
}
.blog-index-card__link:focus {
	outline: 0;
}
.blog-index-card__link:focus-visible {
	outline: 2px solid #3138A8;
	outline-offset: 3px;
}
.blog-index-card__media {
	position: relative;
	aspect-ratio: 16 / 9;
	background: linear-gradient(135deg, #041361 0%, #1d2a8a 60%, #3138A8 140%);
	overflow: hidden;
}
.blog-index-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 320ms ease;
}
.blog-index-card:hover .blog-index-card__img,
.blog-index-card:focus-within .blog-index-card__img {
	transform: scale(1.04);
}
.blog-index-card__media-fallback {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(ellipse at 30% 30%, rgba(0, 180, 216, 0.35) 0%, transparent 60%),
		linear-gradient(135deg, #041361 0%, #1d2a8a 70%);
}
.blog-index-card__media-fallback-mark {
	font-family: inherit;
	font-weight: 800;
	font-size: 1.6rem;
	letter-spacing: 0.18em;
	color: rgba(255, 255, 255, 0.78);
	border: 1px solid rgba(255, 255, 255, 0.22);
	padding: 0.55rem 1rem;
	border-radius: 12px;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
/* Soft varyant: light tinted media zemini */
.blog-index-card--soft .blog-index-card__media {
	background: linear-gradient(135deg, #e9f6fb 0%, #ffffff 60%, #d8eef7 140%);
}
.blog-index-card--soft .blog-index-card__media-fallback {
	background: radial-gradient(ellipse at 30% 30%, rgba(0, 180, 216, 0.25) 0%, transparent 60%),
		linear-gradient(135deg, #e9f6fb 0%, #ffffff 70%);
}
.blog-index-card--soft .blog-index-card__media-fallback-mark {
	color: #041361;
	border-color: rgba(4, 19, 97, 0.2);
}
.blog-index-card--accent .blog-index-card__media {
	background: linear-gradient(135deg, #3138A8 0%, #0096b6 50%, #041361 140%);
}

/* 20.6 Kart body --------------------------------------------------------- */
.blog-index-card__body {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	padding: 1.4rem 1.4rem 1.5rem;
	flex: 1 1 auto;
}
.blog-index-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
	margin: 0;
	font-size: 0.78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: #3138A8;
}
.blog-index-card__category {
	color: #3138A8;
}
.blog-index-card__dot {
	color: rgba(4, 19, 97, 0.35);
}
.blog-index-card__date {
	color: #2A2F45;
}
.blog-index-card__title {
	font-size: 1.2rem;
	line-height: 1.3;
	font-weight: 800;
	color: #041361;
	margin: 0;
	letter-spacing: -0.005em;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.blog-index-card__excerpt {
	margin: 0;
	color: #2A2F45;
	font-size: 0.96rem;
	line-height: 1.6;
	font-weight: 300;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.blog-index-card__footer {
	margin: auto 0 0;
	padding-top: 1rem;
	border-top: 1px solid rgba(4, 19, 97, 0.08);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	font-size: 0.85rem;
}
.blog-index-card__author {
	color: #2A2F45;
	font-weight: 500;
}
.blog-index-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	color: #3138A8;
	font-weight: 700;
}
.blog-index-card:hover .blog-index-card__cta,
.blog-index-card:focus-within .blog-index-card__cta {
	color: #0096b6;
}

/* 20.7 Empty state ------------------------------------------------------- */
.blog-index-empty {
	max-width: 540px;
	margin: 2rem auto 0;
	text-align: center;
	padding: 3rem 1.5rem;
	border: 1px dashed rgba(4, 19, 97, 0.18);
	border-radius: 18px;
	background: #fbfcff;
}
.blog-index-empty__title {
	font-size: 1.15rem;
	font-weight: 800;
	color: #041361;
	margin: 0 0 0.5rem;
}
.blog-index-empty__lede {
	font-size: 0.98rem;
	color: #2A2F45;
	margin: 0 0 1.5rem;
}

/* 20.8 Pagination -------------------------------------------------------- */
.blog-index-pagination {
	margin: 3rem 0 0;
	display: flex;
	justify-content: center;
}
.blog-index-pagination__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	align-items: center;
	justify-content: center;
}
.blog-index-pagination__item {
	display: inline-flex;
}
.blog-index-pagination__item .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	height: 2.5rem;
	padding: 0 0.85rem;
	border-radius: 12px;
	border: 1px solid rgba(4, 19, 97, 0.12);
	background: #ffffff;
	color: #041361;
	font-weight: 700;
	font-size: 0.92rem;
	text-decoration: none;
	transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease;
}
.blog-index-pagination__item a.page-numbers:hover,
.blog-index-pagination__item a.page-numbers:focus-visible {
	border-color: #3138A8;
	color: #0096b6;
}
.blog-index-pagination__item .page-numbers.current {
	background: #3138A8;
	border-color: #3138A8;
	color: #ffffff;
}
.blog-index-pagination__item .page-numbers.dots {
	border: 0;
	background: transparent;
	color: #2A2F45;
	cursor: default;
}
.blog-index-pagination__item .page-numbers.prev,
.blog-index-pagination__item .page-numbers.next {
	padding: 0 1.1rem;
	letter-spacing: 0.01em;
}

/* =======================================================================
 * 19. Resource library (Privia "reports-and-e-books" tasarim dili)
 *
 * 19.1 Kapak (cover) — img veya CSS fallback
 * 19.2 Kapak kart + grid (liste bolumleri + related)
 * 19.3 Liste: resource_type'a gore basliklı bolumler
 * 19.4 Detay: split hero (kapak | indirme formu)
 * 19.5 Indirme formu (dark zemin)
 * ===================================================================== */

/* 19.1 Kapak ------------------------------------------------------------- */
.resource-cover {
	display: block;
	position: relative;
	width: 100%;
	aspect-ratio: 3 / 4;
	border-radius: 18px;
	overflow: hidden;
	background: #0E1322;
}
.resource-cover__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.resource-cover-fallback {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 0.6rem;
	padding: 1.4rem 1.3rem;
	background: linear-gradient(160deg, #041361 0%, #0E1322 100%);
	color: #ffffff;
}
.resource-cover--accent .resource-cover-fallback {
	background: linear-gradient(160deg, #1E2C7A 0%, #041361 60%, #0E1322 100%);
}
.resource-cover--soft .resource-cover-fallback {
	background: linear-gradient(160deg, #00374a 0%, #041361 70%, #0E1322 100%);
}
.resource-cover-fallback::before {
	content: "";
	position: absolute;
	top: -40%;
	right: -30%;
	width: 80%;
	height: 80%;
	background: radial-gradient(circle, rgba(0, 180, 216, 0.32) 0%, rgba(0, 180, 216, 0) 70%);
	pointer-events: none;
}
.resource-cover-fallback__type {
	position: relative;
	align-self: flex-start;
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #3138A8;
}
.resource-cover-fallback__title {
	position: relative;
	font-size: 1.18rem;
	line-height: 1.28;
	font-weight: 700;
	color: #ffffff;
}
.resource-cover-fallback__mark {
	position: absolute;
	top: 1.1rem;
	right: 1.2rem;
	font-size: 0.92rem;
	font-weight: 800;
	letter-spacing: 0.05em;
	color: rgba(255, 255, 255, 0.55);
}

/* 19.2 Kapak kart + grid ------------------------------------------------- */
.resource-cover-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2.5rem 1.75rem;
}
@media (max-width: 900px) {
	.resource-cover-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 2rem 1.25rem;
	}
}
@media (max-width: 560px) {
	.resource-cover-grid {
		grid-template-columns: 1fr;
		gap: 1.75rem;
	}
}
.resource-cover-item {
	margin: 0;
}
.resource-cover-card {
	position: relative;
	display: block;
	text-decoration: none;
	color: inherit;
	transition: transform 200ms ease;
}
.resource-cover-card:hover,
.resource-cover-card:focus-visible {
	transform: translateY(-6px);
	color: inherit;
}
.resource-cover-card__frame {
	position: relative;
	display: block;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 4px 14px rgba(10, 16, 40, 0.06), 0 10px 28px rgba(10, 16, 40, 0.08);
	transition: box-shadow 200ms ease;
}
.resource-cover-card:hover .resource-cover-card__frame,
.resource-cover-card:focus-visible .resource-cover-card__frame {
	box-shadow: 0 20px 40px -16px rgba(4, 19, 97, 0.45), 0 6px 16px rgba(4, 19, 97, 0.15);
}
.resource-cover-card__badge {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 3;
	background: #ffffff;
	color: #041361;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	padding: 5px 11px;
	border-radius: 999px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}
.resource-cover-card__brand {
	position: absolute;
	top: 15px;
	right: 16px;
	z-index: 3;
	height: 22px;
	width: auto;
	opacity: 0.95;
	filter: drop-shadow(0 1px 5px rgba(6, 8, 26, 0.55));
	pointer-events: none;
}
.resource-cover-card__overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(4, 19, 97, 0);
	opacity: 0;
	transition: opacity 200ms ease, background 200ms ease;
}
.resource-cover-card:hover .resource-cover-card__overlay,
.resource-cover-card:focus-visible .resource-cover-card__overlay {
	opacity: 1;
	background: rgba(4, 19, 97, 0.45);
}
.resource-cover-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 1.2rem;
	border-radius: 999px;
	background: #ffffff;
	color: #041361;
	font-weight: 700;
	font-size: 0.92rem;
	box-shadow: 0 6px 18px rgba(4, 19, 97, 0.35);
}
.resource-cover-card__cta svg {
	color: #3138A8;
}
/* Baslik + tarih kapak gorselinin UZERINE bindirilir: marka/baglam
   her zaman gorseldedir, gorsel tek basina baglamsiz kalmaz. */
.resource-cover-card__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 4;
	display: block;
	padding: 2.4rem 1.15rem 1.05rem;
	border-radius: 0 0 18px 18px;
	background: linear-gradient(
		to top,
		rgba(4, 19, 97, 0.94) 0%,
		rgba(4, 19, 97, 0.78) 42%,
		rgba(4, 19, 97, 0) 100%
	);
	pointer-events: none;
}
.resource-cover-card__title {
	display: block;
	font-size: 1.06rem;
	line-height: 1.3;
	font-weight: 700;
	color: #ffffff;
	text-shadow: 0 1px 10px rgba(4, 19, 97, 0.6);
}
.resource-cover-card:hover .resource-cover-card__title,
.resource-cover-card:focus-visible .resource-cover-card__title {
	color: #ffffff;
}
.resource-cover-card__date {
	display: block;
	margin-top: 0.35rem;
	font-size: 0.8rem;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.85);
}

/* 19.3 Liste: resource_type bolumleri ----------------------------------- */
.resource-type-section {
	margin: 0 0 4rem;
}
.resource-type-section:last-of-type {
	margin-bottom: 1rem;
}
.resource-type-section__header {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin: 0 0 1.75rem;
	padding-bottom: 0.85rem;
	border-bottom: 1px solid #E5E7EB;
}
.resource-type-section__title {
	font-size: clamp(1.4rem, 2.4vw, 1.85rem);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: #041361;
	margin: 0;
}
.resource-type-section__all {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	flex: none;
	font-size: 0.9rem;
	font-weight: 600;
	color: #3138A8;
	text-decoration: none;
	transition: gap 160ms ease;
}
.resource-type-section__all:hover,
.resource-type-section__all:focus-visible {
	gap: 0.7rem;
	color: #232A86;
}

/* 19.4 Detay: split hero ------------------------------------------------- */
.single-resource-hero {
	position: relative;
	overflow: hidden;
	color: #ffffff;
	padding: 4rem 0;
}
.single-resource-hero__inner {
	/* Nav container'i ile BIREBIR ayni kutu: max-width 1536 (border-box) +
	   px-section yatay padding (masaustu %5, >=1536px 6rem), ortalanmis.
	   Boylece baslik nav logosuyla, form nav CTA'siyla ayni hatta hizalanir. */
	max-width: 1536px;
	margin: 0 auto;
	padding: 0 5%;
	box-sizing: border-box;
	position: relative;
	z-index: 4;
}
@media (min-width: 1536px) {
	.single-resource-hero__inner {
		padding-left: 6rem;
		padding-right: 6rem;
	}
}
/* Hero'ya gomulu kapak gorseli (careers hero deseni, SOL taraf):
   foto soldan baslar, saga gradient mask ile soluur; overlay navy
   gradient ile hem soldaki basligi hem sagdaki formu okunur tutar. */
.single-resource-hero__photo {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 60%;
	background-size: cover;
	background-position: 30% 50%;
	background-repeat: no-repeat;
	filter: saturate(0.9) contrast(1.03);
	-webkit-mask-image: linear-gradient(90deg,
		#000 0%,
		rgba(0, 0, 0, 0.9) 40%,
		rgba(0, 0, 0, 0.5) 64%,
		rgba(0, 0, 0, 0.16) 84%,
		transparent 100%);
	        mask-image: linear-gradient(90deg,
		#000 0%,
		rgba(0, 0, 0, 0.9) 40%,
		rgba(0, 0, 0, 0.5) 64%,
		rgba(0, 0, 0, 0.16) 84%,
		transparent 100%);
	z-index: 1;
	pointer-events: none;
}
.single-resource-hero__overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg,
			rgba(4, 19, 97, 0.74) 0%,
			rgba(4, 19, 97, 0.58) 28%,
			rgba(4, 19, 97, 0.40) 52%,
			rgba(4, 19, 97, 0.55) 76%,
			rgba(4, 19, 97, 0.82) 100%
		),
		radial-gradient(ellipse 55% 75% at 24% 48%, rgba(94, 229, 255, 0.10), transparent 70%);
	z-index: 2;
	pointer-events: none;
}
@media (max-width: 880px) {
	.single-resource-hero__photo {
		width: 100%;
		opacity: 0.28;
		-webkit-mask-image: none;
		        mask-image: none;
	}
	.single-resource-hero__overlay {
		background: linear-gradient(180deg, rgba(4, 19, 97, 0.86) 0%, rgba(4, 19, 97, 0.95) 100%);
	}
}
.single-resource-hero--split .single-resource-hero__inner {
	display: grid;
	/* SOL: baslik (esnek, foto uzerinde) | SAG: sabit genislikte form.
	   Form sag kenara tam yaslanmasin diye sagdan ek bir ic bosluk; baslik
	   sol hizasi (nav logo) korunur. */
	grid-template-columns: minmax(0, 1fr) clamp(360px, 30vw, 460px);
	gap: 3rem;
	align-items: center;
}
@media (max-width: 880px) {
	.single-resource-hero--split .single-resource-hero__inner {
		grid-template-columns: 1fr;
		gap: 2.25rem;
	}
}
@media (max-width: 639px) {
	.single-resource-hero {
		padding: 3rem 0;
	}
	.single-resource-hero__inner {
		padding-left: 1rem;
		padding-right: 1rem;
	}
}
.single-resource-hero__eyebrow {
	color: #aab2ff;
	margin: 0 0 0.75rem;
	text-shadow: 0 1px 12px rgba(4, 19, 97, 0.55);
}
.single-resource-hero__title {
	font-size: clamp(1.8rem, 3.4vw, 2.75rem);
	line-height: 1.18;
	font-weight: 800;
	letter-spacing: -0.015em;
	color: #ffffff;
	margin: 0 0 1.1rem;
	text-shadow: 0 2px 18px rgba(4, 19, 97, 0.6);
}
.single-resource-hero__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.55rem;
	font-size: 0.92rem;
	color: rgba(255, 255, 255, 0.78);
	margin-bottom: 1.75rem;
}
.single-resource-hero__dot {
	color: rgba(255, 255, 255, 0.4);
}
.single-resource-hero .single-breadcrumb {
	margin-bottom: 1.4rem;
}
.single-resource-hero__meta {
	text-shadow: 0 1px 10px rgba(4, 19, 97, 0.5);
}

/* 19.4b About bolumu: SOL sticky kapak + SAG prose ---------------------- */
.single-body--with-cover {
	max-width: 1080px;
	display: grid;
	grid-template-columns: 320px 1fr;
	gap: 3rem;
	align-items: start;
}
@media (max-width: 880px) {
	.single-body--with-cover {
		grid-template-columns: 1fr;
		gap: 2rem;
		max-width: 760px;
	}
}
.single-body__cover {
	position: sticky;
	top: 2rem;
}
@media (max-width: 880px) {
	.single-body__cover {
		position: static;
		max-width: 300px;
	}
}
.single-body__cover .resource-cover {
	box-shadow: 0 24px 60px -28px rgba(4, 19, 97, 0.45);
	border: 1px solid rgba(14, 19, 34, 0.08);
}
.single-body--with-cover .single-body__content {
	min-width: 0;
}

/* 19.5 Indirme formu (dark zemin) --------------------------------------- */
.resource-dl-form {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 18px;
	padding: 2rem 1.75rem;
	backdrop-filter: blur(2px);
}
@media (max-width: 639px) {
	.resource-dl-form {
		padding: 1.5rem 1.25rem;
	}
}
.resource-dl-form__title {
	font-size: 1.5rem;
	font-weight: 800;
	color: #ffffff;
	margin: 0 0 0.5rem;
}
.resource-dl-form__lede {
	font-size: 0.92rem;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.78);
	margin: 0 0 1.4rem;
}
.resource-dl-form__field {
	margin-bottom: 1rem;
}
.resource-dl-form__label {
	display: block;
	font-size: 0.85rem;
	font-weight: 600;
	color: rgba(255, 255, 255, 0.9);
	margin-bottom: 0.4rem;
}
.resource-dl-form__req {
	color: #3138A8;
}
.resource-dl-form__input {
	width: 100%;
	box-sizing: border-box;
	padding: 0.7rem 0.9rem;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(14, 19, 34, 0.55);
	color: #ffffff;
	font-size: 0.95rem;
	font-family: inherit;
	transition: border-color 160ms ease, box-shadow 160ms ease;
}
.resource-dl-form__input::placeholder {
	color: rgba(255, 255, 255, 0.4);
}
.resource-dl-form__input:focus {
	outline: none;
	border-color: #3138A8;
	box-shadow: 0 0 0 3px rgba(0, 180, 216, 0.25);
}
.resource-dl-form__consent {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	margin: 0.5rem 0 1.25rem;
}
.resource-dl-form__checkbox {
	margin-top: 0.2rem;
	flex: none;
	width: 1.05rem;
	height: 1.05rem;
	accent-color: #3138A8;
}
.resource-dl-form__consent-label {
	font-size: 0.82rem;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.72);
}
.resource-dl-form__submit {
	width: 100%;
	justify-content: center;
}
.resource-dl-form__status {
	border-radius: 10px;
	padding: 0.85rem 1rem;
	font-size: 0.9rem;
	line-height: 1.5;
}
.resource-dl-form__status--success {
	background: rgba(31, 138, 76, 0.18);
	border: 1px solid rgba(31, 138, 76, 0.4);
	color: #d6f5e3;
}
.resource-dl-form__status--error {
	background: rgba(192, 57, 43, 0.18);
	border: 1px solid rgba(192, 57, 43, 0.4);
	color: #f7d6d2;
}
.resource-dl-form__status--info {
	background: rgba(0, 180, 216, 0.14);
	border: 1px solid rgba(0, 180, 216, 0.35);
	color: #cdeef6;
}