/* Blog şablonu v2 */

/* ---------- Liste hero + arama ---------- */
.bhero { background: linear-gradient(100deg, #f4f9ff 0%, #e4f0fd 55%, #d9eafc 100%); padding: clamp(44px, 6vw, 80px) 0 clamp(56px, 6vw, 88px); text-align: center; }
.bhero h1 { font-family: var(--font-head); font-size: clamp(2.4rem, 1.4rem + 3.4vw, 4rem); font-weight: 300; letter-spacing: -.03em; color: #0b2a5c; margin: 0 0 12px; }
.bhero h1 b { font-weight: 800; color: var(--brand); }
.bhero p { font-size: clamp(1.02rem, .95rem + .3vw, 1.2rem); color: #233844; max-width: 680px; margin: 0 auto 28px; }
.bsearch { display: flex; align-items: center; gap: 12px; max-width: 620px; margin: 0 auto; background: #fff; border: 1px solid #d6e2f2; border-radius: 999px; padding: 6px 8px 6px 22px; box-shadow: 0 18px 40px -24px rgba(0, 50, 120, .45); }
.bsearch svg { width: 22px; height: 22px; color: var(--brand); flex: none; }
.bsearch input { flex: 1; min-width: 0; border: 0; outline: 0; font: inherit; font-size: 17px; padding: 14px 4px; background: none; color: #000; }
.bsearch:focus-within { border-color: var(--brand); box-shadow: 0 0 0 4px var(--brand-50), 0 18px 40px -24px rgba(0, 50, 120, .45); }
.bsec { padding-top: 36px; }

/* Kategori çipleri */
.chips-cat { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin: 0 0 36px; }
.chip-cat { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px 9px 16px; border-radius: 999px; background: #fff; border: 1px solid #e2e6ee; font-weight: 600; font-size: 15px; color: #233844; transition: border-color .15s, background-color .15s, color .15s; }
.chip-cat span { font-size: 12px; font-weight: 700; background: #eef2f8; color: #4b5466; padding: 2px 8px; border-radius: 999px; }
.chip-cat:hover { border-color: var(--brand); color: var(--brand); }
.chip-cat.is-active { background: var(--brand); border-color: var(--brand); color: #fff; }
.chip-cat.is-active span { background: rgba(255, 255, 255, .22); color: #fff; }

/* ---------- Kartlar ---------- */
.bgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 26px; }
.bgrid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bcard { display: flex; flex-direction: column; background: #fff; border-radius: 18px; overflow: hidden; border: 1px solid #e8ecf2; transition: transform .2s, box-shadow .2s, border-color .2s; color: inherit; }
.bcard:hover { transform: translateY(-4px); box-shadow: 0 22px 44px -24px rgba(0, 40, 90, .35); border-color: transparent; }
.bcard__img { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #e6f1fd, #cfe3fb); overflow: hidden; }
.bcard__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.bcard:hover .bcard__img img { transform: scale(1.05); }
.bcard__cat { position: absolute; left: 14px; top: 14px; background: rgba(255, 255, 255, .95); color: var(--brand); font-size: 12px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; padding: 5px 10px; border-radius: 999px; box-shadow: 0 4px 12px rgba(0, 0, 0, .12); }
.bcard__body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.bcard h3 { font-family: var(--font-head); font-size: 21px; line-height: 1.3; font-weight: 700; color: #000; margin: 0; letter-spacing: -.01em; }
.bcard:hover h3 { color: var(--brand); }
.bcard p { margin: 0; font-size: 15.5px; line-height: 1.55; color: #4b5466; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; flex: 1; }
.bcard__meta { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #737b8c; padding-top: 12px; border-top: 1px solid #f0f2f6; }
.bcard__go { margin-left: auto; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--brand-50); color: var(--brand); transition: background-color .2s, color .2s, transform .2s; }
.bcard__go svg { width: 16px; height: 16px; }
.bcard:hover .bcard__go { background: var(--brand); color: #fff; transform: translateX(3px); }

/* Öne çıkan büyük kart */
.bfeatured { margin-bottom: 30px; }
.bcard--big { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.bcard--big .bcard__img { aspect-ratio: auto; min-height: 340px; }
.bcard--big .bcard__body { padding: clamp(24px, 3vw, 44px); justify-content: center; gap: 14px; }
.bcard--big h3 { font-size: clamp(26px, 2.2vw, 36px); }
.bcard--big p { font-size: 17px; -webkit-line-clamp: 4; flex: none; }
.bempty { text-align: center; font-size: 17px; color: #4b5466; padding: 40px 0; }

/* ---------- Yazı sayfası ---------- */
.readbar { position: fixed; top: 0; left: 0; right: 0; height: 4px; z-index: 80; background: transparent; }
.readbar span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--brand), var(--sky)); transition: width .1s linear; }
.phero { background: linear-gradient(100deg, #f4f9ff 0%, #e4f0fd 55%, #d9eafc 100%); padding: clamp(32px, 4vw, 56px) 0 clamp(36px, 4vw, 60px); }
.phero__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.crumbs--left { justify-content: flex-start; margin-bottom: 18px; }
.phero__cat { display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #fff; background: var(--brand); padding: 6px 12px; border-radius: 999px; margin-bottom: 16px; }
.phero h1 { font-family: var(--font-head); font-size: clamp(2.1rem, 1.3rem + 2.6vw, 3.4rem); line-height: 1.12; font-weight: 700; letter-spacing: -.025em; color: #0b1a33; margin: 0 0 16px; }
.phero__lead { font-size: clamp(1.05rem, 1rem + .3vw, 1.22rem); line-height: 1.6; color: #233844; margin: 0 0 22px; }
.phero__author { display: inline-flex; align-items: center; gap: 12px; }
.phero__author img { width: 42px; height: 42px; border-radius: 12px; background: #fff; padding: 7px; box-shadow: 0 4px 12px rgba(0, 40, 90, .12); }
.phero__author b { display: block; font-size: 15px; color: #000; }
.phero__author small { font-size: 14px; color: #4b5466; }
.phero__img img { width: 100%; border-radius: 20px; box-shadow: 0 30px 60px -30px rgba(0, 40, 90, .5); aspect-ratio: 16 / 10; object-fit: cover; background: #dbe8f8; }
.psec { padding-top: 48px; }
.article .tldr { margin-bottom: 30px; }
.article .post-meta, .article .article__cover { display: none; }

/* Yazı içi tipografi */
.prose { font-size: 18.5px; line-height: 1.85; color: #1d2633; max-width: 740px; }
.prose > p:first-of-type::first-letter { font-family: var(--font-head); float: left; font-size: 3.4em; line-height: .9; font-weight: 800; color: var(--brand); margin: 6px 10px 0 0; }
.prose h2 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2rem); font-weight: 700; color: #000; margin: 2.2em 0 .6em; padding-top: .4em; border-top: 1px solid #edf0f5; letter-spacing: -.015em; }
.prose h3 { font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem); font-weight: 700; color: #0b1a33; margin: 1.8em 0 .5em; }
.prose h4 { font-size: 1.15rem; color: #0b1a33; }
.prose ul { list-style: none; padding-left: 0; }
.prose ul li { position: relative; padding-left: 30px; margin-bottom: .6em; }
.prose ul li::before { content: ""; position: absolute; left: 6px; top: .72em; width: 9px; height: 9px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 4px var(--brand-50); }
.prose ol { padding-left: 1.4em; }
.prose ol li::marker { color: var(--brand); font-weight: 800; }
.prose blockquote { border-left: 4px solid var(--brand); background: #f4f8ff; border-radius: 0 14px 14px 0; padding: 18px 24px; font-size: 1.05em; color: #0b1a33; }
.prose strong { color: #000; font-weight: 700; }
.prose a { color: var(--brand); text-decoration-thickness: 1.5px; }
.prose img { border-radius: 16px; box-shadow: 0 16px 40px -24px rgba(0, 40, 90, .4); }
.prose table { border-radius: 12px; overflow: hidden; border: 1px solid #e6eaf0; }
.prose th { background: #f4f8ff; }

/* Yazı içi CTA */
.inline-cta { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 2em 0; padding: 22px 26px; border-radius: 18px; background: linear-gradient(135deg, #002c5f, #0068d9); color: #e3efff; }
.inline-cta b { display: block; font-family: var(--font-head); font-size: 20px; color: #fff; margin-bottom: 4px; line-height: 1.3; }
.inline-cta span { font-size: 15.5px; line-height: 1.5; }
.inline-cta .btn { background: #fff; color: var(--brand); border: 0; flex: none; }
.prose .inline-cta a { text-decoration: none; }

/* Paylaş */
.share { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 36px 0 0; padding: 18px 0; border-top: 1px solid #edf0f5; border-bottom: 1px solid #edf0f5; max-width: 740px; }
.share > span { font-weight: 700; color: #000; margin-right: 6px; }
.share a, .share button { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: #f3f5f8; color: #29303d; border: 0; cursor: pointer; transition: background-color .15s, color .15s, transform .15s; }
.share a svg, .share button svg { width: 20px; height: 20px; }
.share a:hover, .share button:hover { background: var(--brand); color: #fff; transform: translateY(-2px); }
.share a.share--wa:hover { background: var(--whatsapp); color: var(--whatsapp-ink); }
.share__copy { width: auto !important; padding: 0 14px; display: inline-flex !important; gap: 6px; font: inherit; font-size: 14px; font-weight: 600; }
.share__copy em { font-style: normal; }

/* Önceki / sonraki */
.pnav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 32px; max-width: 740px; }
.pnav__a { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; border-radius: 16px; border: 1px solid #e6eaf0; background: #fff; transition: border-color .15s, box-shadow .15s; }
.pnav__a:hover { border-color: var(--brand); box-shadow: 0 12px 28px -18px rgba(0, 40, 90, .4); }
.pnav__a small { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--brand); text-transform: uppercase; letter-spacing: .03em; }
.pnav__a small svg { width: 14px; height: 14px; }
.pnav__a b { font-family: var(--font-head); font-size: 17px; line-height: 1.35; color: #000; }
.pnav__a--next { text-align: right; align-items: flex-end; }

/* Yan sütun */
.aside .toc { background: #fff; box-shadow: 0 4px 20px rgba(77, 148, 192, .1); border-color: transparent; }
.toc a.is-current { color: var(--brand); font-weight: 700; }

/* ---------- Duyarlı ---------- */
@media (max-width: 1024px) { .bgrid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .bcard--big { grid-template-columns: 1fr; }
  .bcard--big .bcard__img { min-height: 0; aspect-ratio: 16 / 9; }
  .phero__grid { grid-template-columns: 1fr; }
  .phero__img { order: -1; }
}
@media (max-width: 620px) {
  .bgrid--3 { grid-template-columns: 1fr; }
  .chips-cat { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; margin-left: calc(-1 * var(--gutter)); margin-right: calc(-1 * var(--gutter)); padding: 0 var(--gutter) 6px; scrollbar-width: none; }
  .chips-cat::-webkit-scrollbar { display: none; }
  .chip-cat { flex: none; }
  .prose { font-size: 17.5px; }
  .prose > p:first-of-type::first-letter { font-size: 3em; }
  .pnav { grid-template-columns: 1fr; }
  .pnav__a--next { text-align: left; align-items: flex-start; }
  .inline-cta .btn { width: 100%; }
}

/* v2.1 düzeltmeler */
.bcard--big { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.bcard--big .bcard__img { min-height: 0; aspect-ratio: 16 / 10; }
.toc ol { list-style: none; padding-left: 0; gap: 4px; }
.toc li { position: relative; padding-left: 14px; }
.toc li::before { content: ""; position: absolute; left: 0; top: .7em; width: 6px; height: 6px; border-radius: 50%; background: #c9d6e8; }
.toc .toc--h3 { margin-left: 14px; list-style: none; }
.toc .toc--h3::before { width: 5px; height: 2px; border-radius: 1px; top: .8em; }
.toc a.is-current { color: var(--brand); }
.toc li:has(a.is-current)::before { background: var(--brand); }
.phero h1 { margin-bottom: 22px; }