
/*
  SzczecinTut Step 15: unified editorial rhythm.
  Applies to news, knowledge, guides and user blogs. Does NOT touch ads.
*/

/* Normal editorial breadcrumbs: like Guides, not blue/uppercase. */
.clean-breadcrumbs,
.guide-breadcrumbs,
.blog-editorial-breadcrumbs,
.kb-breadcrumbs {
    align-items: center !important;
    border-bottom: 1px solid #e5e7eb !important;
    color: #6b7280 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: .95rem !important;
    font-weight: 400 !important;
    gap: 8px 12px !important;
    letter-spacing: 0 !important;
    line-height: 1.45 !important;
    margin: 0 0 20px !important;
    padding: 0 0 14px !important;
    text-transform: none !important;
}

.clean-breadcrumbs a,
.guide-breadcrumbs a,
.blog-editorial-breadcrumbs a,
.kb-breadcrumbs a {
    color: #6b7280 !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    text-transform: none !important;
}

.clean-breadcrumbs span,
.guide-breadcrumbs span,
.blog-editorial-breadcrumbs span,
.kb-breadcrumbs span {
    color: #9ca3af !important;
    font-weight: 400 !important;
}

.clean-breadcrumbs a:hover,
.guide-breadcrumbs a:hover,
.blog-editorial-breadcrumbs a:hover,
.kb-breadcrumbs a:hover {
    color: #b91c1c !important;
}

/* One headline language everywhere: clear, modern, not a heap of serif letters. */
.clean-article-title,
.guide-detail-header h1,
.guide-chapter-header h1,
.blog-detail-header h1,
.editorial-page-title {
    color: #111827 !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: clamp(2.2rem, 6vw, 4.2rem) !important;
    font-weight: 800 !important;
    letter-spacing: -0.045em !important;
    line-height: 1.03 !important;
    margin: 0 0 14px !important;
    max-width: 980px !important;
    text-wrap: balance;
}

.clean-article-meta,
.guide-meta-line,
.blog-detail-author__meta,
.editorial-meta-line {
    color: #6b7280 !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: .98rem !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    line-height: 1.45 !important;
    text-transform: none !important;
}

.clean-article-meta a,
.guide-meta-line a,
.blog-detail-author__meta a,
.editorial-meta-line a {
    color: #6b7280 !important;
    font-weight: 400 !important;
    text-decoration: none !important;
}

.clean-article-meta a:hover,
.guide-meta-line a:hover,
.blog-detail-author__meta a:hover,
.editorial-meta-line a:hover {
    color: #b91c1c !important;
}

/* News intro/lead is intentionally not shown in news pages. */
.clean-article-lead,
.news-intro,
.news-article-intro,
.blog-post-intro,
.post-intro,
.article-lead.news-lead {
    display: none !important;
}

/* Keep covers newspaper-clean. */
.clean-article-cover,
.guide-cover,
.blog-detail-cover {
    margin-top: 18px !important;
}

.clean-article-cover figcaption,
.guide-cover figcaption,
.guide-inline-figure figcaption,
.blog-detail-cover-caption,
.article-gallery figcaption,
.article-gallery-section figcaption {
    color: #6b7280 !important;
    font-size: .92rem !important;
    line-height: 1.35 !important;
    margin-top: 8px !important;
}

/* User blog detail adopts editorial article shell without changing reactions/comments. */
.blog-detail-page--pro {
    max-width: 980px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.blog-detail-header {
    border-bottom: 1px solid #e5e7eb !important;
    margin-bottom: 20px !important;
    padding-bottom: 18px !important;
}

.blog-detail-cover {
    border-radius: 0 !important;
    display: block !important;
    height: auto !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Guide editor rendered quotes. */
.guide-content blockquote,
.clean-article-content blockquote,
.blog-detail-content blockquote {
    border-left: 4px solid #d1d5db !important;
    color: #111827 !important;
    font-size: 1.08em !important;
    font-weight: 500 !important;
    line-height: 1.48 !important;
    margin: 1.35em 0 !important;
    padding: .15em 0 .15em 1em !important;
}

@media (max-width: 760px) {
    .clean-breadcrumbs,
    .guide-breadcrumbs,
    .blog-editorial-breadcrumbs,
    .kb-breadcrumbs {
        font-size: .95rem !important;
        margin-bottom: 18px !important;
        padding-bottom: 12px !important;
    }

    .clean-article-title,
    .guide-detail-header h1,
    .guide-chapter-header h1,
    .blog-detail-header h1,
    .editorial-page-title {
        font-size: clamp(2.55rem, 10.5vw, 3.6rem) !important;
        line-height: 1.03 !important;
        letter-spacing: -0.05em !important;
        margin-bottom: 13px !important;
    }

    .clean-article-meta,
    .guide-meta-line,
    .blog-detail-author__meta,
    .editorial-meta-line {
        font-size: .98rem !important;
    }
}

@media (max-width: 420px) {
    .clean-article-title,
    .guide-detail-header h1,
    .guide-chapter-header h1,
    .blog-detail-header h1,
    .editorial-page-title {
        font-size: clamp(2.35rem, 10vw, 3.05rem) !important;
        line-height: 1.04 !important;
    }
}
