/*
 * Blog — not defteri.
 * Motif: çizgili defter sayfası (kenar çizgisi + satırlar), masaya iğnelenmiş not kartları.
 * Her not, konusu olan hizmetin dünyasını taşır (previews.css → .insight-world-*).
 * Tekil yazıda aynı dünya rengi okuma çubuğuna, başlığa ve metin vurgularına yayılır.
 */
.world-blog {
	--bl-margin: max(18px, calc(50% - 632px));
	--bl-paper:
		linear-gradient(90deg, transparent var(--bl-margin), rgba(239, 68, 68, .22) var(--bl-margin) calc(var(--bl-margin) + 2px), transparent calc(var(--bl-margin) + 2px)),
		repeating-linear-gradient(180deg, transparent 0 31px, rgba(21, 94, 239, .08) 31px 32px),
		#fcfdfe;
}

/* ---------- Dizin hero: defter sayfası + not yığını ---------- */
.world-blog .blog-hero {
	position: relative;
	overflow: hidden;
	padding-block: clamp(56px, 7vw, 96px);
	background: var(--bl-paper);
}
.world-blog .blog-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, 440px);
	align-items: center;
	gap: clamp(32px, 5vw, 80px);
}
.world-blog .blog-hero h1 { margin: 10px 0 14px; font-size: clamp(3rem, 6vw, 5rem); letter-spacing: -.04em; }
.world-blog .blog-hero .lead { max-width: 34rem; margin: 0; color: #435b75; font-size: 1.08rem; }
.world-blog .blog-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 22px 0 0;
}
.world-blog .blog-hero__meta span {
	padding: 5px 11px;
	border: 1px solid rgba(21, 94, 239, .16);
	border-radius: 999px;
	color: #31516a;
	background: #fff;
	font-size: .78rem;
	font-weight: 700;
}

.world-blog .blog-hero__desk {
	position: relative;
	height: 360px;
}
.world-blog .blog-hero__note {
	position: absolute;
	display: grid;
	width: min(290px, 78%);
	padding: 84px 18px 18px;
	overflow: hidden;
	border: 1px solid rgba(15, 39, 69, .1);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 24px 40px -26px rgba(15, 39, 69, .45);
	transition: rotate .4s cubic-bezier(.22, 1, .36, 1), translate .4s cubic-bezier(.22, 1, .36, 1);
}
.world-blog .blog-hero__note::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 66px;
	border-bottom: 1px solid rgba(15, 39, 69, .08);
	content: "";
	background: var(--preview, linear-gradient(180deg, #eef4ff, #f7fafc));
}
.world-blog .blog-hero__note::after {
	position: absolute;
	top: 8px;
	left: 50%;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	content: "";
	background: radial-gradient(circle at 35% 35%, #ff9b9b, #dc2626 60%, #991b1b);
	box-shadow: 0 3px 4px rgba(0, 0, 0, .25);
	translate: -50% 0;
}
.world-blog .blog-hero__note b {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-bottom: 6px;
	color: var(--c, var(--cyan));
	font-size: .66rem;
	font-weight: 850;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.world-blog .blog-hero__note b::before { width: 7px; height: 7px; border-radius: 50%; content: ""; background: var(--c, var(--cyan)); }
.world-blog .blog-hero__note i {
	color: var(--text);
	font-size: .98rem;
	font-style: normal;
	font-weight: 750;
	line-height: 1.3;
}
/* Basamaklı yığın: üstteki not tam görünür, alttakilerin başlıkları altından taşar */
.world-blog .blog-hero__note:nth-child(1) { z-index: 3; top: 0; left: 0; rotate: -3deg; }
.world-blog .blog-hero__note:nth-child(2) { z-index: 2; top: 100px; left: 26%; rotate: 3deg; }
.world-blog .blog-hero__note:nth-child(3) { z-index: 1; top: 200px; left: 6%; rotate: -1.5deg; }
.world-blog .blog-hero__desk:hover .blog-hero__note:nth-child(1) { rotate: -1deg; translate: -4px -6px; }
.world-blog .blog-hero__desk:hover .blog-hero__note:nth-child(3) { rotate: 0deg; translate: 0 6px; }

/* ---------- Dizin kartları ---------- */
.world-blog .insight-index { padding-block: clamp(48px, 6vw, 80px); }
.world-blog .insight-grid .insight-card { border-radius: 16px; }
.world-blog .insight-grid .insight-card:hover { translate: 0 -5px; }

/* ---------- Tekil yazı ---------- */
.world-blog .insight-hero {
	position: relative;
	background: var(--bl-paper);
}
.world-blog[class*="insight-world-"] .insight-hero { padding-top: calc(clamp(56px, 7vw, 90px) + 64px); }
.world-blog[class*="insight-world-"] .insight-hero::after {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 64px;
	border-bottom: 1px solid rgba(15, 39, 69, .08);
	content: "";
	background: var(--preview);
}
.world-blog[class*="insight-world-"] .insight-hero .eyebrow { color: var(--c); }

/* Okuma ilerleme çubuğu (tarayıcı destekliyorsa) */
@supports (animation-timeline: scroll()) {
	.world-blog.single-post::after {
		position: fixed;
		z-index: 1000;
		top: 0;
		right: 0;
		left: 0;
		height: 3px;
		content: "";
		background: var(--c, var(--cyan));
		transform-origin: 0 50%;
		animation: bl-progress linear both;
		animation-timeline: scroll(root);
	}
}
@keyframes bl-progress {
	from { transform: scaleX(0); }
	to { transform: scaleX(1); }
}

/* Metin vurguları dünyanın renginde */
.world-blog .insight-prose > p:first-child { color: #243b55; font-size: 1.14rem; line-height: 1.7; }
.world-blog.single-post .insight-prose h2 { border-bottom-color: color-mix(in srgb, var(--c, var(--cyan)) 30%, transparent); }
.world-blog .insight-prose li::marker { color: var(--c, var(--cyan)); }
.world-blog .insight-prose blockquote {
	margin-inline: 0;
	padding: 14px 18px;
	border-left: 3px solid var(--c, var(--cyan));
	border-radius: 0 12px 12px 0;
	background: color-mix(in srgb, var(--c, var(--cyan)) 7%, #fff);
}

/* Yazının konusu: hizmete giden kart */
.world-blog .insight-world-link { padding-block: 8px 28px; }
.world-blog .insight-world-link a {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 2px 18px;
	padding: 76px 22px 18px;
	overflow: hidden;
	border: 1px solid color-mix(in srgb, var(--c, var(--cyan)) 30%, transparent);
	border-radius: 16px;
	color: var(--text);
	background: linear-gradient(180deg, color-mix(in srgb, var(--c, var(--cyan)) 6%, #fff), #fff 70%);
	text-decoration: none;
	transition: translate .3s cubic-bezier(.22, 1, .36, 1), box-shadow .3s;
}
.world-blog .insight-world-link a::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 58px;
	border-bottom: 1px solid rgba(15, 39, 69, .08);
	content: "";
	background: var(--preview, #f5f8fe);
}
.world-blog .insight-world-link a:hover { translate: 0 -3px; box-shadow: 0 24px 40px -30px color-mix(in srgb, var(--c, var(--cyan)) 70%, transparent); }
.world-blog .insight-world-link small { grid-column: 1; color: var(--muted); font-size: .64rem; font-weight: 850; letter-spacing: .1em; }
.world-blog .insight-world-link strong { grid-column: 1; font-size: 1.2rem; }
.world-blog .insight-world-link span {
	grid-column: 2;
	grid-row: 1 / 3;
	padding: 8px 14px;
	border-radius: 999px;
	color: #fff;
	background: var(--c, var(--cyan));
	font-size: .84rem;
	font-weight: 750;
}

.world-blog .insight-pager__link { border-radius: 14px; }
.world-blog .insight-pager__link:hover { border-color: color-mix(in srgb, var(--c, var(--cyan)) 40%, transparent); }

@media (max-width: 1060px) {
	.world-blog .blog-hero__grid { grid-template-columns: 1fr; }
	.world-blog .blog-hero__desk { width: min(460px, 100%); height: 360px; }
}
@media (max-width: 540px) {
	.world-blog .blog-hero__desk { display: none; }
	.world-blog .insight-world-link a { grid-template-columns: 1fr; }
	.world-blog .insight-world-link span { grid-column: 1; grid-row: auto; justify-self: start; margin-top: 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.world-blog.single-post::after { display: none; }
	.world-blog .blog-hero__note { transition: none; }
}
