/* Publication Detail Page - Gradient Background + Card Layout */
body{
  /* İletişim sayfasına benzer, daha açık ve soft gradyant */
  background:
    radial-gradient(1200px 600px at 0% 0%, rgba(255,255,255,.12), rgba(255,255,255,0)),
    linear-gradient(150deg, #5a3a2a 0%, #724532 35%, #8b5a4a 70%, #8d2f2f 100%);
  min-height:100vh;
  font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.publication-detail{ padding:0 0 80px; background:transparent }
.publication-detail .container{ width:min(1100px,92%); margin:0 auto; padding-top:calc(var(--header-h-sticky) + 120px) }

.breadcrumb{ margin-bottom:32px; font-size:14px; color:#e6edf6 }
.breadcrumb a{ color:#ffd8c2; text-decoration:none }
.breadcrumb a:hover{ text-decoration:underline }
.separator{ margin:0 8px }
.current{ color:#fff; font-weight:600 }

.article-header,
.article-content,
.article-footer,
.related-posts{
  background:#fff; padding:48px; border-radius:16px; margin-bottom:32px;
  box-shadow:0 4px 20px rgba(0,0,0,.08);
}

.article-meta{ display:flex; gap:16px; margin-bottom:24px; align-items:center }
.article-category{ background:linear-gradient(135deg, #8B4513, #A0522D); color:#fff; padding:8px 20px; border-radius:25px; font-size:14px; font-weight:500 }
.article-date{ color:#64748b; font-size:14px; font-weight:500 }
.article-title{ font-size:2.5rem; font-weight:700; color:#1e293b; line-height:1.2 }
.article-image{ width:100%; margin:32px 0; border-radius:12px; overflow:hidden }
.article-image img{ width:100%; max-height:500px; object-fit:cover; display:block }
.content-wrapper{ font-size:18px; line-height:1.8; color:#374151 }

.article-footer{ display:flex; justify-content:space-between; align-items:center; margin-bottom:48px }
.article-tags{ display:flex; align-items:center; gap:12px }
.tag-label{ color:#64748b; font-weight:500 }
.tag{ background:#f1f5f9; color:#8B4513; padding:6px 16px; border-radius:20px; text-decoration:none; font-size:14px; font-weight:500; transition:all .3s ease }
.tag:hover{ background:#8B4513; color:#fff }

.btn{ display:inline-block; padding:12px 24px; border:2px solid #8B4513; background:transparent; color:#8B4513; text-decoration:none; border-radius:25px; font-weight:500; transition:all .3s ease }
.btn:hover{ background:#8B4513; color:#fff }
.btn-secondary{ border-color:#64748b; color:#64748b }
.btn-secondary:hover{ background:#64748b; color:#fff }

.related-posts h2{ font-size:1.5rem; font-weight:700; color:#1e293b; margin-bottom:32px }
.related-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px,1fr)); gap:24px }
.related-card{ padding:24px; border:1px solid #e5e7eb; border-radius:12px; transition:all .3s ease }
.related-card:hover{ box-shadow:0 8px 25px rgba(0,0,0,.1); transform:translateY(-4px) }
.related-meta{ display:flex; gap:12px; margin-bottom:16px; align-items:center }
.related-category{ background:#f1f5f9; color:#8B4513; padding:4px 12px; border-radius:15px; font-size:12px; font-weight:500 }
.related-date{ color:#64748b; font-size:12px }
.related-title{ font-size:1.1rem; font-weight:600; margin-bottom:12px }
.related-title a{ color:#1e293b; text-decoration:none }
.related-title a:hover{ color:#8B4513 }
.related-excerpt{ color:#64748b; font-size:14px; line-height:1.6 }

@media(max-width:768px){
  .publication-detail .container{ padding-top:calc(var(--header-h-sticky) + 90px) }
  .article-header, .article-content, .article-footer, .related-posts{ padding:24px }
  .article-title{ font-size:2rem }
  .content-wrapper{ font-size:16px }
  .article-footer{ flex-direction:column; gap:20px; align-items:flex-start }
  .related-grid{ grid-template-columns:1fr }
}