/* ==========================================================================
   ÇayBel — tekil yazı (proje · üretim · işletme · haber · blog)
   Ölçüler mevcut sitedeki yazı sayfalarından alınmıştır.
   ========================================================================== */

/* --- Giriş --------------------------------------------------------------- */
.tk-hero {
	position: relative; isolation: isolate; z-index: 0;
	margin-top: -15px; min-height: 45vh; padding: 0 50px;
	display: flex; align-items: center; justify-content: center; text-align: center;
	border-radius: 0 0 15px 15px; overflow: hidden;
	background: var(--ikincil) center / cover no-repeat;
}
.tk-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #1A1A18; opacity: .35; }
.tk-hero--etiket::before { opacity: .25; }
/* Görselsiz giriş/başlıklı kart: başlık logonun üstüne binmesin → düz zemin */
.tk-hero.gorsel-yok, .tk-kart--baslikli.gorsel-yok { background-image: none !important; }
.tk-hero__baslik {
	font-family: var(--f-unbounded); font-size: 30px; font-weight: 600;
	letter-spacing: 1px; line-height: 28px; color: var(--acik-gri);
}
.tk-hero__etiket {
	font-family: var(--f-unbounded); font-size: 34px; font-weight: 500;
	letter-spacing: 1.5px; line-height: 51px; color: #e1e1e1;
}

/* --- Başlık + özet ------------------------------------------------------- */
.tk-ozet {
	margin-top: -15px; border-radius: 15px 15px 0 0;
	padding-top: 100px; padding-bottom: 75px;
	padding-left: max(75px, calc((100% - 1140px) / 2)); padding-right: max(75px, calc((100% - 1140px) / 2));
	display: flex; flex-direction: column; gap: 50px;
}
.tk-ozet__metin {
	font-family: var(--f-unbounded); font-size: 16px; font-weight: 400;
	letter-spacing: 1px; line-height: 24px; color: var(--ikincil); text-align: center;
}
.tk-ozet__metin p + p { margin-top: 1em; }
.tk-ozet--sol .tk-ozet__metin { font-size: 14px; line-height: 22px; text-align: left; }
.tk-baslik {
	font-family: var(--f-unbounded); font-size: 24px; font-weight: 600;
	letter-spacing: 1px; line-height: 28px; color: var(--ikincil);
}
.tk-ozet:not(:has(> *)) { padding-bottom: 0; }

/* --- Ana görsel ---------------------------------------------------------- */
.tk-gorsel-bolum { padding-bottom: 75px; border-radius: 0 0 15px 15px; }
.tk-gorsel { min-height: 450px; border-radius: 10px; background: var(--ikincil) center / cover no-repeat; }

/* --- İçerik -------------------------------------------------------------- */
.tk-icerik-bolum { padding-bottom: 100px; border-radius: 0 0 15px 15px; display: flex; flex-direction: column; gap: 50px; }
.tk-icerik {
	font-family: var(--f-unbounded); font-size: 14px; font-weight: 300;
	letter-spacing: 1px; line-height: 22px; color: var(--ikincil);
}
.tk-icerik--blog { font-size: 15px; }
.tk-icerik > * + * { margin-top: 1.2em; }
.tk-icerik h2, .tk-icerik h3, .tk-icerik h4 { font-weight: 600; line-height: 1.4; margin-top: 1.6em; }
.tk-icerik h2 { font-size: 20px; }
.tk-icerik h3 { font-size: 17px; }
.tk-icerik h4 { font-size: 15px; }
.tk-icerik strong, .tk-icerik b { font-weight: 600; }
.tk-icerik a { color: var(--turuncu); text-decoration: underline; text-underline-offset: 3px; }
.tk-icerik a:hover { color: var(--yesil); }
.tk-icerik ul, .tk-icerik ol { padding-left: 1.4em; }
.tk-icerik ul { list-style: disc; }
.tk-icerik ol { list-style: decimal; }
.tk-icerik li + li { margin-top: .4em; }
.tk-icerik img { border-radius: 10px; }
.tk-icerik figure { margin-left: 0; margin-right: 0; }
.tk-icerik figcaption { font-size: 12px; color: var(--metin); margin-top: .5em; }
.tk-icerik blockquote { margin: 1.6em 0; padding: 0 0 0 20px; border-left: 3px solid var(--turuncu); }
.tk-icerik .wp-block-gallery, .tk-icerik .gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.tk-icerik .wp-block-gallery figure, .tk-icerik .gallery figure { margin: 0; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 10px; }
.tk-icerik .wp-block-gallery a, .tk-icerik .gallery a { display: block; height: 100%; }
.tk-icerik .wp-block-gallery img, .tk-icerik .gallery img { width: 100%; height: 100%; object-fit: cover; }
.tk-icerik .wp-block-embed iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: 10px; }
@media (max-width: 1024px) { .tk-icerik .wp-block-gallery, .tk-icerik .gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .tk-icerik .wp-block-gallery, .tk-icerik .gallery { grid-template-columns: 1fr; } }

/* Önceki / sonraki */
.tk-gezinme { display: flex; justify-content: space-between; gap: 20px; padding: 0 25px; }
.tk-gezinme a {
	font-family: var(--f-unbounded); font-size: 14px; font-weight: 400; line-height: 21px;
	text-transform: uppercase; color: var(--turuncu); transition: color .2s;
}
.tk-gezinme a:hover { color: var(--yesil); }
.tk-gezinme__sonraki { text-align: right; }

/* --- Yönlendirme kartı ---------------------------------------------------- */
.tk-kart-bolum { padding-bottom: 0; border-radius: 0 0 15px 15px; }
.tk-kart-bolum--bant { margin-top: -15px; border-radius: 15px 15px 0 0; padding-top: 100px; }
.tk-kart-bolum--son { padding-bottom: 100px; }
.tk-kart {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; flex-direction: column; justify-content: flex-end; gap: 50px;
	min-height: 250px; padding: 50px 50px 25px; border-radius: 10px;
	background: var(--ikincil) center / cover no-repeat;
}
.tk-kart::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #1A1A18; opacity: .5; transition: opacity .3s; }
.tk-kart:hover::before { opacity: .4; }
.tk-kart--baslikli { min-height: 0; justify-content: flex-start; }
.tk-kart__baslik {
	font-family: var(--f-unbounded); font-size: 24px; font-weight: 600;
	letter-spacing: 1px; line-height: 28px; color: var(--acik-gri);
}
.tk-kart .dugme-satiri { padding-right: 25px; }
.tk-kart .dugme-satiri__ikon { width: 45px; height: 45px; }

/* --- Alt galeriler ------------------------------------------------------- */
.tk-ikili {
	display: grid; grid-template-columns: 793fr 397fr; column-gap: 10px;
	padding-top: 100px; padding-bottom: 100px;
}
.tk-ikili > * { min-width: 0; }

/* --- Üretim alt bölümü --------------------------------------------------- */
.tk-uretim { border-radius: 15px; padding-bottom: 100px; }
.tk-tanitim { padding-bottom: 50px; }
.tk-son-bosluk { height: 100px; }

/* --- Blog: diğer yazılar ------------------------------------------------- */
.tk-diger { padding-bottom: 100px; border-radius: 0 0 15px 15px; }
.tk-diger__izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 40px; }
.tk-diger__kart { display: flex; flex-direction: column; border-radius: 10px; overflow: hidden; background: var(--gri-2); }
.tk-diger__gorsel { display: block; height: 238px; background: var(--ikincil) center / cover no-repeat; }
.tk-diger__gorsel.gorsel-yok { background-size: 25% auto !important; }
.tk-diger__yazi { display: flex; flex-direction: column; align-items: flex-start; gap: 29px; padding: 20px 25px 30px; }
.tk-diger__baslik { font-family: var(--f-unbounded); font-size: 16px; font-weight: 500; letter-spacing: 1px; line-height: 22px; color: var(--ikincil); }
.tk-diger__baslik a:hover { color: var(--turuncu); }
.tk-diger__oku { font-family: var(--f-unbounded); font-size: 13px; font-weight: 500; letter-spacing: 1px; line-height: 19.5px; color: var(--turuncu); }
.tk-diger__oku:hover { color: var(--yesil); }

/* ==========================================================================
   Mobil ≤767px
   ========================================================================== */
@media (max-width: 767px) {
	.tk-hero { padding: 0 25px; }
	.tk-hero__baslik { font-size: 20px; line-height: 26px; }
	.tk-hero__etiket { font-size: 24px; line-height: 34px; }
	.tk-ozet { padding: 75px 25px 50px; }
	.tk-baslik { font-size: 20px; line-height: 26px; }
	.tk-gorsel { min-height: 400px; }
	.tk-icerik-bolum { padding-bottom: 75px; }
	.tk-gezinme { padding: 0; }
	.tk-kart-bolum--bant { padding-top: 75px; }
	.tk-kart-bolum--son { padding-bottom: 75px; }
	.tk-kart { padding: 50px 25px 25px; }
	.tk-kart__baslik { font-size: 18px; line-height: 24px; }
	.tk-ikili { grid-template-columns: 1fr; row-gap: 75px; padding-top: 75px; padding-bottom: 75px; }
	.tk-uretim { padding-bottom: 75px; }
	.tk-son-bosluk { height: 75px; }
	.tk-diger { padding-bottom: 75px; }
	.tk-diger__izgara { grid-template-columns: 1fr; }
}
