.blog-container { width:min(1400px,calc(100% - 40px)); margin:0 auto; }
.blog-container--narrow { width:min(860px,calc(100% - 40px)); }
.blog-breadcrumbs { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:20px 0 0; font-size:13px; color:#7a7a7a; }
.blog-breadcrumbs__item { color:#7a7a7a; text-decoration:none; }
.blog-breadcrumbs__item:hover { color:#f1890a; text-decoration:underline; }
.blog-breadcrumbs__sep { color:#c7c7c7; }
.blog-breadcrumbs__current { color:#2f2f2f; font-weight:600; }

.blog-list-page { padding:0 0 64px; }
.blog-list-header { text-align:center; padding:28px 0 34px; }
.blog-list-title { margin:0 0 10px; font-size:36px; font-weight:800; color:#1f1a17; letter-spacing:-0.02em; }
.blog-list-subtitle { margin:0; color:#6b6258; font-size:16px; }
.blog-empty { text-align:center; color:#6b6258; font-size:15px; padding:40px 0; }

.blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.blog-card { display:flex; flex-direction:column; background:#fff; border:1px solid #eee5da; border-radius:18px; overflow:hidden; box-shadow:0 10px 30px rgba(31,26,23,.06); transition:transform .2s ease, box-shadow .2s ease; }
.blog-card:hover { transform:translateY(-3px); box-shadow:0 16px 40px rgba(31,26,23,.1); }
.blog-card__media { display:block; aspect-ratio:16/10; background:#f4ede4; overflow:hidden; }
.blog-card__image { width:100%; height:100%; object-fit:cover; display:block; }
.blog-card__placeholder { display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:#b9874f; font-weight:700; font-size:15px; }
.blog-card__body { display:flex; flex-direction:column; gap:8px; padding:18px 20px 22px; flex:1; }
.blog-card__date { color:#9a9086; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
.blog-card__title { margin:0; font-size:19px; line-height:1.35; font-weight:700; color:#1f1a17; }
.blog-card__title a { color:inherit; text-decoration:none; }
.blog-card__title a:hover { color:#8a5a2b; }
.blog-card__excerpt { margin:0; color:#5a5148; font-size:14px; line-height:1.6; flex:1; }
.blog-card__link { color:#8a5a2b; font-size:14px; font-weight:700; text-decoration:none; margin-top:4px; }
.blog-card__link:hover { text-decoration:underline; }

.blog-pagination { display:flex; align-items:center; justify-content:center; gap:18px; margin-top:40px; }
.blog-pagination__link { color:#8a5a2b; font-weight:700; text-decoration:none; }
.blog-pagination__link:hover { text-decoration:underline; }
.blog-pagination__current { color:#6b6258; font-size:14px; }

.blog-detail-page { padding:0 0 64px; }

/* Sayfa kapsayıcısı diğer sayfalarla aynı genişlikte (1400px) kalır; okunabilirlik
   için başlık/kapak/içerik/geri-dön bloğu kendi içinde ortalanmış dar bir sütuna
   (max 780px, ~65-75 karakter satır uzunluğu) oturtulur — bu, Google'ın önerdiği
   okunabilir satır uzunluğu ve mobil kullanılabilirlik pratiğine uyar. */
.blog-breadcrumbs, .blog-post__header, .blog-post__cover, .blog-post__content, .blog-post__back {
    max-width:780px;
    margin-left:auto;
    margin-right:auto;
}

.blog-post { padding:28px 0 0; }
.blog-post__header { margin-bottom:22px; text-align:center; }
.blog-post__title { margin:0 0 14px; font-size:clamp(1.75rem, 1.35rem + 1.8vw, 2.5rem); line-height:1.2; font-weight:800; color:#1f1a17; letter-spacing:-0.02em; }
.blog-post__meta { display:flex; align-items:center; justify-content:center; gap:10px; color:#9a9086; font-size:13px; font-weight:600; }
.blog-post__author { color:#8a5a2b; }
.blog-post__meta > *:not(:first-child) { position:relative; padding-left:14px; }
.blog-post__meta > *:not(:first-child)::before { content:'•'; position:absolute; left:0; color:#d8cfc3; }
.blog-post__cover { margin:0 auto 32px; border-radius:20px; overflow:hidden; box-shadow:0 16px 40px rgba(31,26,23,.12); background:#f4ede4; }
.blog-post__cover img { display:block; width:100%; height:auto; }

.blog-post__content {
    background:#fff;
    border:1px solid #eee5da;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(31,26,23,.05);
    padding:clamp(20px, 3vw, 44px);
    font-size:clamp(1rem, 0.95rem + 0.2vw, 1.0625rem);
    line-height:1.85;
    color:#403730;
}
.blog-post__content > *:first-child { margin-top:0; }
.blog-post__content > *:last-child { margin-bottom:0; }
.blog-post__content p { margin:0 0 18px; }
.blog-post__content h2 { margin:34px 0 14px; font-size:clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem); line-height:1.3; font-weight:700; color:#1f1a17; }
.blog-post__content h3 { margin:28px 0 12px; font-size:clamp(1.1rem, 1rem + 0.4vw, 1.3rem); line-height:1.35; font-weight:700; color:#241f1b; }
.blog-post__content ul, .blog-post__content ol { margin:0 0 20px 22px; padding:0; }
.blog-post__content li { margin-bottom:10px; }
.blog-post__content strong { color:#1f1a17; }
.blog-post__content a { color:#8a5a2b; text-decoration:none; border-bottom:1px solid rgba(138,90,43,.35); word-break:break-word; }
.blog-post__content a:hover { color:#6f4318; border-bottom-color:rgba(111,67,24,.75); }
.blog-post__content img { display:block; max-width:100%; height:auto; margin:28px auto; border-radius:14px; }
.blog-post__content blockquote { margin:28px 0; padding:18px 22px; background:#fcfaf7; border:1px solid #eadfce; border-left:4px solid #b9874f; border-radius:14px; color:#4a3f36; }

.blog-post__back { margin-top:32px; text-align:center; }
.blog-post__back a { display:inline-flex; align-items:center; gap:6px; padding:12px 22px; border:1px solid #eee5da; border-radius:999px; color:#8a5a2b; font-weight:700; font-size:14px; text-decoration:none; transition:background .2s ease, border-color .2s ease; }
.blog-post__back a:hover { background:#fcf6ee; border-color:#e7d5b8; text-decoration:none; }

@media (max-width:1024px) { .blog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) {
    .blog-post__header { text-align:left; }
    .blog-post__meta { justify-content:flex-start; }
    .blog-post__cover { border-radius:16px; margin-bottom:24px; }
    .blog-post__content { border-radius:16px; }
}
@media (max-width:640px) {
    .blog-grid { grid-template-columns:1fr; }
    .blog-list-title { font-size:28px; }
}