/* Store blog / article other pages */
.site-article-section--blog {
	position: relative;
	padding-top: clamp(2rem, 4vw, 3rem);
	padding-bottom: clamp(3rem, 6vw, 5rem);
	background: #eef2f8;
	overflow: hidden;
}

.site-article-section--blog::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--primary-color, #717fe0) 16%, transparent) 0%, transparent 42%),
		radial-gradient(circle at 88% 18%, rgba(99, 102, 241, 0.1) 0%, transparent 38%),
		linear-gradient(180deg, #f8fafc 0%, #eef2f8 48%, #e8edf5 100%);
}

.site-article-section--blog .other-page-wrapper {
	position: relative;
	z-index: 1;
	max-width: 1320px;
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(280px, 1fr);
	column-gap: 24px;
	row-gap: 20px;
	align-items: start;
}

.site-article-section--blog .other-page-wrapper > .row {
	display: contents;
	margin: 0;
}

.site-article-section--blog .other-page-main-col,
.site-article-section--blog .other-page-sidebar-col {
	width: 100%;
	max-width: 100%;
	flex: none;
	padding-left: 0;
	padding-right: 0;
}

.site-article-section--blog .other-page-main-col {
	grid-column: 1;
	grid-row: 2;
}

.site-article-section--blog .other-page-sidebar-col {
	grid-column: 2;
	grid-row: 2;
	align-self: start;
}

.site-article-breadcrumb {
	grid-column: 1;
	grid-row: 1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 0;
	font-size: 14px;
	line-height: 1.45;
	color: #64748b;
}

.site-article-breadcrumb a {
	color: #475569;
	font-weight: 600;
	text-decoration: none;
	transition: color 0.2s ease;
}

.site-article-breadcrumb a:hover {
	color: #0f172a;
	text-decoration: none;
}

.site-article-breadcrumb-sep {
	color: #cbd5e1;
}

.site-article-breadcrumb-current {
	color: #334155;
	font-weight: 700;
}

.site-article-surface {
	background: #fff;
	border: 1px solid #efefef;
	border-radius: 14px;
	box-shadow: 0 12px 28px rgba(17, 24, 39, 0.05);
	overflow: hidden;
}

.site-article-section--blog .site-article-surface.other-page-main-surface {
	padding: 0;
}

.site-article-body {
	padding: clamp(22px, 3.5vw, 36px);
}

.site-article-meta {
	display: block;
	margin-bottom: 24px;
	padding-bottom: 20px;
	border-bottom: 1px solid #e5e7eb;
}

.site-article-meta-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.site-article-meta-row + .site-article-meta-row {
	margin-top: 12px;
}

.site-article-chip {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 6px 13px;
	border-radius: 999px;
	background: #f6f7fb;
	border: 1px solid #eceef6;
	font-size: 14px;
	line-height: 1.35;
	color: #374151;
}

.site-article-chip .chip-label {
	color: #6b7280;
	font-weight: 600;
	margin-right: 5px;
}

.site-article-chip--tag {
	color: #4e5563;
}

.site-article-title {
	margin: 0 0 18px;
	font-family: var(--accent-font, Georgia, serif);
	font-size: clamp(2rem, 4vw + 0.5rem, 2.5rem);
	font-weight: 700;
	color: #111827;
	line-height: 1.2;
	letter-spacing: -0.02em;
}

.site-article-summary {
	margin: 0 0 32px;
	font-family: var(--main-font, Poppins, sans-serif);
	font-size: clamp(1.125rem, 0.5vw + 1.05rem, 1.3125rem);
	line-height: 1.75;
	color: #374151;
	font-weight: 400;
}

.site-article-prose {
	--article-size: 18px;
	--article-line: 1.8;
	font-family: var(--main-font, Poppins, sans-serif) !important;
	font-size: var(--article-size) !important;
	line-height: var(--article-line) !important;
	font-weight: 400 !important;
	color: #1f2937 !important;
	word-wrap: break-word;
}

.site-article-prose :where(p, li, span, font, div, td, th, em, i, u, s, small, cite, label) {
	font-size: 1em !important;
	line-height: var(--article-line) !important;
	font-family: inherit !important;
}

.site-article-prose p {
	margin: 0 0 1.2em;
}

.site-article-prose p:last-child {
	margin-bottom: 0;
}

.site-article-prose h1,
.site-article-prose h2,
.site-article-prose h3,
.site-article-prose h4 {
	font-family: var(--accent-font, Georgia, serif) !important;
	color: #111827 !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	margin: 1.75em 0 0.6em;
	letter-spacing: -0.015em;
}

.site-article-prose h2 {
	font-size: 1.55em !important;
}

.site-article-prose h3 {
	font-size: 1.3em !important;
	padding-top: 0.25em;
}

.site-article-prose h4 {
	font-size: 1.15em !important;
}

.site-article-prose h2:first-child,
.site-article-prose h3:first-child,
.site-article-prose h4:first-child,
.site-article-prose > :first-child {
	margin-top: 0;
}

.site-article-prose strong,
.site-article-prose b {
	font-weight: 600 !important;
	color: #111827 !important;
}

.site-article-prose ul,
.site-article-prose ol {
	margin: 0.75em 0 1.5em;
	padding-left: 0;
	list-style: none;
}

.site-article-prose ul > li,
.site-article-prose ol > li {
	position: relative;
	margin-bottom: 0.65em;
	padding-left: 1.35em;
	line-height: 1.78;
}

.site-article-prose ul > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.72em;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--primary-color, #717fe0) 0%, #6366f1 100%);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color, #717fe0) 12%, transparent);
}

.site-article-prose ol {
	counter-reset: site-article-ol;
}

.site-article-prose ol > li {
	counter-increment: site-article-ol;
	padding-left: 1.85em;
}

.site-article-prose ol > li::before {
	content: counter(site-article-ol) ".";
	position: absolute;
	left: 0;
	top: 0;
	font-weight: 700;
	color: var(--primary-ink, var(--primary-color, #717fe0));
}

.site-article-prose ul br,
.site-article-prose ol br {
	display: none;
}

.site-article-prose ul > li:empty,
.site-article-prose ol > li:empty,
.site-article-prose ul > li:has(> br:only-child),
.site-article-prose ol > li:has(> br:only-child),
.site-article-prose ul > li:has(> p:only-child:empty),
.site-article-prose ol > li:has(> p:only-child:empty) {
	display: none;
	margin: 0;
	padding: 0;
}

.site-article-prose h2 + ul,
.site-article-prose h3 + ul,
.site-article-prose h4 + ul,
.site-article-prose h2 + ol,
.site-article-prose h3 + ol,
.site-article-prose h4 + ol {
	margin-top: 0.5em;
}

.site-article-prose a {
	color: var(--primary-ink, var(--primary-color, #717fe0));
	text-decoration: underline;
	text-underline-offset: 2px;
}

.site-article-prose img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	margin: 1.25em 0;
}

.site-article-footer-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 20px;
	margin-top: 40px;
	padding-top: 28px;
	border-top: 1px solid #e5e7eb;
}

.site-article-footer-nav a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 600;
	color: #374151;
	text-decoration: none;
	transition: color 0.2s ease;
}

.site-article-footer-nav a:hover {
	color: var(--primary-ink, var(--primary-color, #717fe0));
	text-decoration: none;
}

.site-article-section--blog .other-page-sidebar-surface {
	position: sticky;
	top: 104px;
	background: #fff;
	border: 1px solid #efefef;
	border-radius: 14px;
	box-shadow: 0 10px 24px rgba(17, 24, 39, 0.04);
	padding: 22px 18px;
}

.site-article-section--blog .other-page-sidebar-surface h4 {
	margin-top: 0;
	font-family: var(--main-font, Poppins, sans-serif);
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.35;
	color: #111827;
}

/* Blog kapak — tam görsel (infografik/tasarım kırpılmaz) */
.site-article-section--blog .other-page-cover,
.site-article-section--blog .other-page-gallery {
	width: 100%;
	max-width: none;
	margin: 0 0 8px;
	border-radius: 16px;
	overflow: hidden;
	background: #f1f5f9;
	border: 1px solid rgba(15, 23, 42, 0.06);
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06);
}

.site-article-section--blog .other-page-gallery .wrap-pic-w {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: auto;
	width: 100%;
	height: auto;
	min-height: 0;
	max-height: none;
	padding: 0;
	background:
		radial-gradient(ellipse at 20% 0%, rgba(198, 232, 106, 0.12) 0%, transparent 50%),
		linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}

.site-article-section--blog .other-page-gallery .wrap-pic-w::after {
	display: none;
}

.site-article-section--blog .other-page-gallery .other-page-img {
	position: static;
	inset: auto;
	display: block;
	width: 100%;
	height: auto;
	max-height: min(70vh, 720px);
	object-fit: contain;
	object-position: center top;
	transform: none;
}

/* Tarih zaten meta chip’lerde — kapak üstünde metni örtmesin */
.site-article-section--blog .other-page-date-badge {
	display: none;
}

@media (max-width: 991px) {
	.site-article-section--blog .other-page-wrapper {
		grid-template-columns: 1fr;
		row-gap: 0;
	}

	.site-article-section--blog .other-page-main-col,
	.site-article-section--blog .other-page-sidebar-col {
		grid-column: 1;
	}

	.site-article-section--blog .other-page-main-col {
		grid-row: 2;
	}

	.site-article-section--blog .other-page-sidebar-col {
		grid-row: 3;
	}

	.site-article-breadcrumb {
		grid-row: 1;
		margin-bottom: 4px;
	}

	.site-article-section--blog .other-page-sidebar-surface {
		position: static;
		margin-top: 24px;
	}

	.site-article-section--blog .other-page-cover,
	.site-article-section--blog .other-page-gallery {
		border-radius: 14px;
	}
}

@media (max-width: 767px) {
	.site-article-title {
		font-size: clamp(1.75rem, 7vw + 0.25rem, 2.125rem);
	}

	.site-article-summary {
		font-size: 1.125rem;
		margin-bottom: 26px;
	}

	.site-article-prose {
		--article-size: 17px;
	}

	.site-article-footer-nav {
		flex-direction: column;
		gap: 10px;
	}

	.site-article-section--blog .other-page-cover,
	.site-article-section--blog .other-page-gallery {
		border-radius: 12px;
		margin-bottom: 4px;
	}

	.site-article-section--blog .other-page-gallery .other-page-img {
		max-height: min(62vh, 520px);
	}
}