/* Blog yazı sayfası bileşenleri. style.css değişkenlerini kullanır; koyu tema değişkenleri de oradan geldiği için ayrıca kural gerekmez. */
.post-article{padding:clamp(18px,3vw,34px)}
.crumbs{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;margin:0 0 10px;font-size:13px;color:var(--muted)}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--primary);text-decoration:underline}
.post-meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin:6px 0 16px;font-size:13.5px}
.post-meta a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.post-cover{margin:0 0 18px}
.post-cover img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;border-radius:14px;background:var(--line)}
.toc{margin:0 0 24px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--primary) 6%,var(--card))}
.toc b{display:block;margin-bottom:6px}
.toc ol{margin:0;padding-left:20px}
.toc li{margin:4px 0}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}
.post-article .content h2{margin:30px 0 10px;scroll-margin-top:90px}
.post-article .content h3{margin:22px 0 8px;scroll-margin-top:90px}
.post-article .content p,.post-article .content li{line-height:1.75}
.post-article .content li{margin:4px 0}
.post-article .content table{display:block;width:100%;margin:16px 0;overflow-x:auto;border-collapse:collapse;font-size:.95em}
.post-article .content th,.post-article .content td{padding:8px 10px;border:1px solid var(--line);text-align:left;vertical-align:top}
.post-article .content th{background:color-mix(in srgb,var(--primary) 8%,var(--card))}
.post-article .content blockquote{margin:16px 0;padding:10px 16px;border-left:4px solid var(--primary);border-radius:0 10px 10px 0;background:color-mix(in srgb,var(--primary) 5%,var(--card))}
.post-faq{margin-top:30px}
.post-faq h2{margin:0 0 12px;scroll-margin-top:90px}
.post-faq .faq p{margin:10px 0 0;line-height:1.7}
.post-cats{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.post-cats a{padding:6px 12px;border:1px solid var(--line);border-radius:999px;font-size:13.5px;text-decoration:none;background:var(--card)}
.post-cats a:hover{border-color:var(--primary)}
.post-related{margin-top:18px}
.post-related h3{margin:0 0 12px}
.rel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.rel-card{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--text);text-decoration:none}
.rel-card:hover{border-color:var(--primary)}
.rel-card img{width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;border-radius:10px}
.rel-card b{font-size:15px;line-height:1.35}
@media (max-width:560px){.post-article .content h2{font-size:1.25em}}