/**
 * yazi-detay.css — Yazı Detay Sayfası
 *
 * Kaynak: views/front/yazi.php satır 679-1479 inline <style> bloğundan çıkarıldı.
 * Sonsuz scroll CSS'leri (#yuklenen-yazilar, .ias-*, .ajax-*) SİLİNDİ.
 * Görsel kimlik 1:1 korunuyor (Sezai 2026-04-25 refactor).
 */

/* Yazı detay container — tüm site 1200px */
.yazi-container { max-width: 1200px; }

/* 3-kolon grid — named areas ile kesin yerleşim
   Mobil: tek kolon (sidebar'lar lg:hidden)
   Desktop:
     Satır 1 → [kapak resmi sol+orta] [sağ kolon]
     Satır 2 → [sol kolon] [içerik]   [sağ devam]  */
.yazi-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}
@media (min-width: 1024px) {
    .yazi-grid {
        grid-template-columns: 170px minmax(0, 1fr) 300px;
        grid-template-rows: auto 1fr;
        grid-template-areas:
            "kapak kapak  sag"
            "sol   orta   sag";
        column-gap: 2.5rem;
        row-gap: 2rem;
    }
    .yazi-kapak { grid-area: kapak; }
    .yazi-sag   { grid-area: sag; }
    .yazi-sol   { grid-area: sol; }
    .yazi-orta  { grid-area: orta; }

    /* Sağ kolon: AdSense my-6 margin'ini sıfırla */
    .yazi-sag .reklam-blok { margin-top: 0; }

    /* Sol kolon paylaş butonları — kolon genişliğine yay */
    .sol-paylasim > div { justify-content: center; }
    .sol-paylasim a,
    .sol-paylasim button { width: 30px !important; height: 30px !important; }
    .sol-paylasim svg { width: 16px; height: 16px; }
}

/* ============================================================
   Meta bar — mobilde 2 satır, masaüstünde tek satır (display:contents)
   ============================================================ */
.meta-bar {
    display: flex;
    flex-direction: column;
    row-gap: 14px;
}
.meta-ust {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.meta-yazar {
    flex: 1 1 auto;
    min-width: 0;
}
.meta-tarih-grup {
    margin-left: auto;
}
.meta-alt {
    display: flex;
    align-items: center;
    column-gap: 14px;
    row-gap: 8px;
    flex-wrap: wrap;
}
@media (min-width: 640px) {
    /* Masaüstü: tek satır — eski sistem */
    .meta-bar {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        column-gap: 24px;
        row-gap: 12px;
    }
    /* Üst ve alt grupları layout'tan çıkar, çocuklarını parent'a ver */
    .meta-bar > .meta-ust,
    .meta-bar > .meta-alt {
        display: contents;
    }
    /* Tarih grubunun ml-auto'sunu masaüstünde sıfırla */
    .meta-tarih-grup {
        margin-left: 0;
    }
    /* Yazar grubunun flex-grow'unu sıfırla — sıradaki öğelerle aynı satırda */
    .meta-yazar {
        flex: 0 0 auto;
    }
}

/* TOC link aktif durumu */
#toc-liste a.aktif {
    color: #00d4ff;
    font-weight: 700;
    border-left-color: #00d4ff;
}
#toc-liste a {
    display: block;
    color: rgb(var(--fb-yazi) / 0.85);
    padding: 0.4rem 0.6rem;
    border-left: 2px solid transparent;
    transition: all 0.15s;
    line-height: 1.45;
    font-weight: 500;
    font-size: 12px;
}
#toc-liste a:hover { color: rgb(var(--fb-neon)); border-left-color: rgb(var(--fb-neon) / 0.4); }

/* Link kopya feedback */
#link-kopyala.kopyalandi { background: rgba(16, 185, 129, 0.25); color: #10b981; }

/* ========== SSS Accordion (IcerikService::sssAccordionDonustur) ========== */
.yazi-icerik .sss-liste {
    margin: 2rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.yazi-icerik .sss-item {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 14px;
    overflow: hidden;
    transition: border-color .25s ease, background .25s ease, transform .2s ease;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.yazi-icerik .sss-item:hover {
    border-color: rgba(0,212,255,0.28);
    background: rgba(0,212,255,0.04);
    transform: translateY(-1px);
}
.yazi-icerik .sss-item[open] {
    border-color: rgba(0,212,255,0.45);
    background: linear-gradient(180deg, rgba(0,212,255,0.06), rgba(0,212,255,0.02));
    box-shadow: 0 4px 18px rgba(0,212,255,0.08);
}
.yazi-icerik .sss-item > summary {
    list-style: none;
    cursor: pointer;
    padding: 1rem 3.2rem 1rem 1.3rem;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.45;
    position: relative;
    color: var(--fb-baslik, #ffffff);
    user-select: none;
    transition: color .2s ease;
}
.yazi-icerik .sss-item > summary::-webkit-details-marker { display: none; }
.yazi-icerik .sss-item > summary::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, #00d4ff, #7c3aed);
    opacity: 0;
    transition: opacity .25s ease;
}
.yazi-icerik .sss-item[open] > summary::before { opacity: 1; }
.yazi-icerik .sss-item > summary::after {
    content: "";
    position: absolute;
    right: 1.1rem; top: 50%;
    width: 18px; height: 18px;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300d4ff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-size: 18px 18px;
    background-repeat: no-repeat;
    transition: transform .28s ease;
}
.yazi-icerik .sss-item[open] > summary::after {
    transform: translateY(-50%) rotate(180deg);
}
.yazi-icerik .sss-item > summary:hover { color: #00d4ff; }
.yazi-icerik .sss-item > summary:focus-visible {
    outline: 2px solid rgba(0,212,255,0.6);
    outline-offset: -2px;
}
.yazi-icerik .sss-cevap {
    padding: 0 1.3rem 1.15rem 1.3rem;
    color: rgba(255,255,255,0.78);
    font-size: 0.97rem;
    line-height: 1.65;
    animation: sss-ac-animasyon 0.3s ease-out;
}
.yazi-icerik .sss-cevap > :first-child { margin-top: 0; }
.yazi-icerik .sss-cevap > :last-child  { margin-bottom: 0; }
.yazi-icerik .sss-cevap p { margin: 0.5rem 0; }
.yazi-icerik .sss-cevap ul, .yazi-icerik .sss-cevap ol { margin: 0.5rem 0 0.5rem 1.25rem; }
.yazi-icerik .sss-cevap strong { color: rgba(255,255,255,0.95); }
@keyframes sss-ac-animasyon {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .yazi-icerik .sss-item, .yazi-icerik .sss-item > summary::after, .yazi-icerik .sss-cevap {
        transition: none; animation: none;
    }
}

/* ========== SSS Accordion — LIGHT MODE (html:not(.dark)) ========== */
html:not(.dark) .yazi-icerik .sss-item {
    background: rgba(15, 23, 42, 0.025);
    border-color: rgba(15, 23, 42, 0.08);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
html:not(.dark) .yazi-icerik .sss-item:hover {
    border-color: rgba(14, 165, 233, 0.35);
    background: rgba(14, 165, 233, 0.04);
}
html:not(.dark) .yazi-icerik .sss-item[open] {
    border-color: rgba(14, 165, 233, 0.55);
    background: linear-gradient(180deg, rgba(14, 165, 233, 0.06), rgba(14, 165, 233, 0.02));
    box-shadow: 0 4px 18px rgba(14, 165, 233, 0.08);
}
html:not(.dark) .yazi-icerik .sss-item > summary {
    color: #0f172a;
}
html:not(.dark) .yazi-icerik .sss-item > summary:hover {
    color: #0284c7;
}
html:not(.dark) .yazi-icerik .sss-item > summary::before {
    background: linear-gradient(180deg, #0284c7, #7c3aed);
}
html:not(.dark) .yazi-icerik .sss-item > summary::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
}
html:not(.dark) .yazi-icerik .sss-cevap {
    color: rgba(15, 23, 42, 0.78);
}
html:not(.dark) .yazi-icerik .sss-cevap strong {
    color: rgba(15, 23, 42, 0.95);
}

/* ============================================================
 * İÇERİK ELEMENTLERİ v2.2 — Callout + Drop Cap + H2 + Listeler + Tablo
 * Dark/light iki modda da uyumlu (pastel bg + koyu fg = her iki modda okunaklı)
 * ============================================================ */

/* ---- 12 CALLOUT RENK PALETİ ---- */
:root {
    --c-note-bg: #dbeafe;    --c-note-fg: #1e3a8a;
    --c-info-bg: #cffafe;    --c-info-fg: #0e7490;
    --c-tip-bg: #d1fae5;     --c-tip-fg: #14532d;
    --c-success-bg: #dcfce7; --c-success-fg: #14532d;
    --c-warning-bg: #fef3c7; --c-warning-fg: #78350f;
    --c-danger-bg: #fee2e2;  --c-danger-fg: #7f1d1d;
    --c-question-bg: #ede9fe;--c-question-fg: #581c87;
    --c-example-bg: #f1f5f9; --c-example-fg: #1e293b;
    --c-quote-bg: #f4f4f5;   --c-quote-fg: #27272a;
    --c-summary-bg: #e0e7ff; --c-summary-fg: #312e81;
    --c-bug-bg: #ffe4e6;     --c-bug-fg: #881337;
    --c-todo-bg: #e0f2fe;    --c-todo-fg: #0c4a6e;
}

/* ---- CALLOUT — KEPANO TARZI (YALIN) ---- */
.yazi-icerik .callout {
    padding: 12px 16px;
    margin: 16px 0;
    border-left: 4px solid var(--c-fg);
    background: var(--c-bg);
    border-radius: 0 6px 6px 0;
}
.yazi-icerik .callout .etiket {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--c-fg);
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 4px;
    letter-spacing: 0.2px;
}
.yazi-icerik .callout .ikon {
    display: inline-block;
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0;
    color: var(--c-fg);
    vertical-align: -3px;
    line-height: 1;
}
.yazi-icerik .callout .ikon svg {
    display: block;
    width: 18px !important;
    height: 18px !important;
    max-width: 18px;
    max-height: 18px;
    stroke: currentColor;
    stroke-width: 1.7;
    fill: none;
}
/* Agent eski yapıyı kullandığında (ikon + etiket kardeş span'lar) */
.yazi-icerik .callout > .ikon + .etiket {
    display: inline;
    margin-left: 6px;
}
.yazi-icerik .callout > .ikon + .etiket::before {
    content: "";
}
.yazi-icerik .callout strong { color: #f1f5f9; font-weight: 700; }
.yazi-icerik .callout p { margin: 4px 0 0; line-height: 1.65; color: #cbd5e1; }
.yazi-icerik .callout p:first-child { margin-top: 0; }
.yazi-icerik .callout a { color: var(--c-fg); text-decoration: underline; }
.yazi-icerik .callout.c-quote p { font-style: italic; }
.yazi-icerik .callout.c-quote p strong { font-style: normal; }

/* 12 renk — YALIN (border+bg+text tek tonlu, saydam bg) */
.yazi-icerik .c-note     { --c-fg: #60a5fa; --c-bg: rgba(59,130,246,0.08); }
.yazi-icerik .c-info     { --c-fg: #22d3ee; --c-bg: rgba(6,182,212,0.08); }
.yazi-icerik .c-tip      { --c-fg: #34d399; --c-bg: rgba(16,185,129,0.08); }
.yazi-icerik .c-success  { --c-fg: #4ade80; --c-bg: rgba(34,197,94,0.08); }
.yazi-icerik .c-warning  { --c-fg: #fbbf24; --c-bg: rgba(245,158,11,0.08); }
.yazi-icerik .c-danger   { --c-fg: #f87171; --c-bg: rgba(239,68,68,0.1); }
.yazi-icerik .c-question { --c-fg: #a78bfa; --c-bg: rgba(139,92,246,0.08); }
.yazi-icerik .c-example  { --c-fg: #94a3b8; --c-bg: rgba(148,163,184,0.06); }
.yazi-icerik .c-quote    { --c-fg: #9ca3af; --c-bg: rgba(156,163,175,0.06); }
.yazi-icerik .c-summary  { --c-fg: #818cf8; --c-bg: rgba(99,102,241,0.08); }
.yazi-icerik .c-bug      { --c-fg: #fb7185; --c-bg: rgba(244,63,94,0.08); }
.yazi-icerik .c-todo     { --c-fg: #38bdf8; --c-bg: rgba(14,165,233,0.08); }

/* ---- DROP CAP (YALIN — daha küçük) ---- */
.yazi-icerik .drop-cap::first-letter {
    float: left;
    font-family: Georgia, 'Merriweather', serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 1;
    padding: 4px 10px 0 0;
    color: var(--fb-baslik, #f1f5f9);
}

/* ---- LİSTE — NOKTALI (hem ol hem ul için) ---- */
.yazi-icerik ol.fb-liste,
.yazi-icerik .yazi-prose > ol,
.yazi-icerik .yazi-prose > ul {
    list-style: none;
    padding-left: 0;
    margin: 14px 0;
}
.yazi-icerik ol.fb-liste > li,
.yazi-icerik .yazi-prose > ol > li,
.yazi-icerik .yazi-prose > ul > li {
    position: relative;
    padding: 4px 0 4px 22px;
    line-height: 1.75;
    color: #cbd5e1;
}
.yazi-icerik ol.fb-liste > li::before,
.yazi-icerik .yazi-prose > ol > li::before,
.yazi-icerik .yazi-prose > ul > li::before {
    content: "•";
    position: absolute;
    left: 2px;
    top: 0;
    color: #22d3ee;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
}
.yazi-icerik ol.fb-liste > li strong,
.yazi-icerik .yazi-prose > ol > li strong,
.yazi-icerik .yazi-prose > ul > li strong { color: #f1f5f9; }

/* ---- CHECKBOX LİSTESİ — YALIN ---- */
.yazi-icerik ul.check-liste { list-style: none; padding-left: 0; margin: 14px 0; }
.yazi-icerik ul.check-liste > li {
    position: relative;
    padding: 5px 0 5px 28px;
    line-height: 1.7;
    color: #cbd5e1;
}
.yazi-icerik ul.check-liste > li::before {
    content: "";
    position: absolute;
    left: 0; top: 10px;
    width: 14px; height: 14px;
    border: 1.5px solid #64748b;
    border-radius: 3px;
    background: transparent;
}
.yazi-icerik ul.check-liste > li.done { color: #64748b; text-decoration: line-through; }
.yazi-icerik ul.check-liste > li.done::before { background: #10b981; border-color: #10b981; }
.yazi-icerik ul.check-liste > li.done::after {
    content: "✓";
    position: absolute;
    left: 2px; top: 3px;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

/* ---- BULLET LİSTE — NOKTALI (ol.fb-liste ile aynı) ---- */
.yazi-icerik ul.bullet-liste { list-style: none; padding-left: 0; margin: 14px 0; }
.yazi-icerik ul.bullet-liste > li {
    position: relative;
    padding: 4px 0 4px 22px;
    line-height: 1.75;
    color: #cbd5e1;
}
.yazi-icerik ul.bullet-liste > li::before {
    content: "•";
    position: absolute;
    left: 2px;
    top: 0;
    color: #22d3ee;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
}

/* ---- TABLO — YALIN ---- */
.yazi-icerik table.fb-tablo,
.yazi-icerik .yazi-prose > table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 15px;
}
.yazi-icerik table.fb-tablo th,
.yazi-icerik table.fb-tablo td,
.yazi-icerik .yazi-prose > table th,
.yazi-icerik .yazi-prose > table td {
    padding: 10px 14px;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.yazi-icerik table.fb-tablo th,
.yazi-icerik .yazi-prose > table th {
    font-weight: 700;
    color: #cbd5e1;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1.5px solid rgba(255, 255, 255, 0.14);
}
.yazi-icerik table.fb-tablo tbody tr:hover,
.yazi-icerik .yazi-prose > table tbody tr:hover { background: rgba(255, 255, 255, 0.02); }

/* ============================================================
 * LIGHT MODE OVERRIDE'LARI — İçerik Elementleri v2.2
 * ============================================================ */

/* Callout metin rengi light override */
html:not(.dark) .yazi-icerik .callout strong { color: #0f172a; }
html:not(.dark) .yazi-icerik .callout p { color: rgba(15, 23, 42, 0.82); }

/* Liste light */
html:not(.dark) .yazi-icerik ol.fb-liste > li,
html:not(.dark) .yazi-icerik .yazi-prose > ol > li,
html:not(.dark) .yazi-icerik .yazi-prose > ul > li { color: rgba(15, 23, 42, 0.82); }
html:not(.dark) .yazi-icerik ol.fb-liste > li strong,
html:not(.dark) .yazi-icerik .yazi-prose > ol > li strong,
html:not(.dark) .yazi-icerik .yazi-prose > ul > li strong { color: #0f172a; }
html:not(.dark) .yazi-icerik ol.fb-liste > li::before,
html:not(.dark) .yazi-icerik .yazi-prose > ol > li::before,
html:not(.dark) .yazi-icerik .yazi-prose > ul > li::before { color: #0891b2; }

/* Checkbox listesi light */
html:not(.dark) .yazi-icerik ul.check-liste > li { color: rgba(15, 23, 42, 0.82); }
html:not(.dark) .yazi-icerik ul.check-liste > li::before { border-color: #94a3b8; }
html:not(.dark) .yazi-icerik ul.check-liste > li.done { color: #94a3b8; }

/* Bullet liste light */
html:not(.dark) .yazi-icerik ul.bullet-liste > li { color: rgba(15, 23, 42, 0.82); }
html:not(.dark) .yazi-icerik ul.bullet-liste > li::before { color: #0891b2; }

/* Tablo light */
html:not(.dark) .yazi-icerik table.fb-tablo th,
html:not(.dark) .yazi-icerik .yazi-prose > table th {
    color: rgba(15, 23, 42, 0.95);
    border-bottom-color: rgba(15, 23, 42, 0.14);
}
html:not(.dark) .yazi-icerik table.fb-tablo td,
html:not(.dark) .yazi-icerik .yazi-prose > table td {
    color: rgba(15, 23, 42, 0.82);
    border-bottom-color: rgba(15, 23, 42, 0.06);
}
html:not(.dark) .yazi-icerik table.fb-tablo tbody tr:hover,
html:not(.dark) .yazi-icerik .yazi-prose > table tbody tr:hover { background: rgba(0, 0, 0, 0.02); }

/* Drop cap light */
html:not(.dark) .yazi-icerik .drop-cap::first-letter { color: #0f172a; }

/* ---- MAKALE SONU BENZER İÇERİKLER (yatay list) ---- */
.makale-sonu-benzer {
    margin: 36px 0 20px;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,0.08);
}
.makale-sonu-benzer .mso-baslik {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #94a3b8;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
}
.makale-sonu-benzer .mso-item {
    display: flex;
    gap: 14px;
    padding: 10px 8px;
    text-decoration: none;
    border-radius: 8px;
    transition: background .2s;
}
.makale-sonu-benzer .mso-item + .mso-item { border-top: 1px solid rgba(255,255,255,0.04); }
.makale-sonu-benzer .mso-item:hover { background: rgba(0,212,255,0.04); }
.makale-sonu-benzer .mso-kapak {
    flex-shrink: 0;
    width: 110px;
    height: 62px;
    border-radius: 6px;
    overflow: hidden;
    background: rgba(255,255,255,0.03);
}
.makale-sonu-benzer .mso-kapak img,
.makale-sonu-benzer .mso-kapak picture { width: 100%; height: 100%; object-fit: cover; display: block; }
.makale-sonu-benzer .mso-sag {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.makale-sonu-benzer .mso-kategori {
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #22d3ee;
    margin-bottom: 3px;
    font-weight: 700;
}
.makale-sonu-benzer .mso-baslik-metin {
    color: #e2e8f0;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.makale-sonu-benzer .mso-item:hover .mso-baslik-metin { color: #22d3ee; }

/* Light mode */
html:not(.dark) .makale-sonu-benzer { border-top-color: rgba(15,23,42,0.1); }
html:not(.dark) .makale-sonu-benzer .mso-item + .mso-item { border-top-color: rgba(15,23,42,0.06); }
html:not(.dark) .makale-sonu-benzer .mso-item:hover { background: rgba(14,165,233,0.06); }
html:not(.dark) .makale-sonu-benzer .mso-baslik { color: #64748b; }
html:not(.dark) .makale-sonu-benzer .mso-kategori { color: #0891b2; }
html:not(.dark) .makale-sonu-benzer .mso-baslik-metin { color: #0f172a; }
html:not(.dark) .makale-sonu-benzer .mso-item:hover .mso-baslik-metin { color: #0891b2; }

/* ---- SONRAKİ YAZI BANDI (statik UI — sonsuz scroll değil) ---- */
.sonraki-yazi-bloku {
    display: flex;
    gap: 24px;
    align-items: stretch;
    padding: 20px;
    background: linear-gradient(135deg, rgba(0,212,255,0.06), rgba(124,58,237,0.04));
    border: 1px solid rgba(0,212,255,0.2);
    border-radius: 14px;
    text-decoration: none;
    transition: background .25s, border-color .25s, transform .2s;
}
.sonraki-yazi-bloku:hover {
    background: linear-gradient(135deg, rgba(0,212,255,0.1), rgba(124,58,237,0.08));
    border-color: rgba(0,212,255,0.45);
    transform: translateY(-2px);
}
.sonraki-yazi-bloku .sy-sol {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
}
.sonraki-yazi-bloku .sy-etiket {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #22d3ee;
    font-weight: 700;
}
.sonraki-yazi-bloku .sy-kategori {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #94a3b8;
    font-weight: 600;
}
.sonraki-yazi-bloku .sy-baslik {
    font-size: 20px;
    font-weight: 700;
    color: #f1f5f9;
    line-height: 1.35;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sonraki-yazi-bloku:hover .sy-baslik { color: #22d3ee; }
.sonraki-yazi-bloku .sy-ok {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    color: #22d3ee;
    margin-top: 6px;
}
.sonraki-yazi-bloku .sy-ok svg {
    transition: transform .25s;
}
.sonraki-yazi-bloku:hover .sy-ok svg {
    transform: translateX(4px);
}
.sonraki-yazi-bloku .sy-kapak {
    flex-shrink: 0;
    width: 180px;
    aspect-ratio: 16 / 10;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(255,255,255,0.03);
}
.sonraki-yazi-bloku .sy-kapak img,
.sonraki-yazi-bloku .sy-kapak picture { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Light mode sonraki yazı */
html:not(.dark) .sonraki-yazi-bloku {
    background: linear-gradient(135deg, rgba(14,165,233,0.06), rgba(124,58,237,0.04));
    border-color: rgba(14,165,233,0.25);
}
html:not(.dark) .sonraki-yazi-bloku:hover {
    background: linear-gradient(135deg, rgba(14,165,233,0.1), rgba(124,58,237,0.08));
    border-color: rgba(14,165,233,0.5);
}
html:not(.dark) .sonraki-yazi-bloku .sy-etiket { color: #0891b2; }
html:not(.dark) .sonraki-yazi-bloku .sy-kategori { color: #64748b; }
html:not(.dark) .sonraki-yazi-bloku .sy-baslik { color: #0f172a; }
html:not(.dark) .sonraki-yazi-bloku:hover .sy-baslik { color: #0891b2; }
html:not(.dark) .sonraki-yazi-bloku .sy-ok { color: #0891b2; }

/* Mobil */
@media (max-width: 640px) {
    .yazi-icerik .callout { padding: 10px 14px; }
    .yazi-icerik .drop-cap::first-letter { font-size: 40px; padding-right: 8px; }
    .makale-sonu-benzer .mso-kapak { width: 90px; height: 52px; }
    .makale-sonu-benzer .mso-baslik-metin { font-size: 14px; }
    .sonraki-yazi-bloku { flex-direction: column-reverse; gap: 14px; padding: 16px; }
    .sonraki-yazi-bloku .sy-kapak { width: 100%; }
    .sonraki-yazi-bloku .sy-baslik { font-size: 17px; }
}