/*
  SzczecinTut Step 5 CSS revision.
  Non-destructive layer: no old files removed, ads section intentionally not targeted.
*/

body {
    background: var(--st-bg, #f6f1e8);
    color: var(--st-ink, #111827);
}

.site-main {
    background:
        linear-gradient(90deg, rgba(185, 28, 28, .035), transparent 30%, transparent 70%, rgba(29, 78, 216, .035)),
        var(--st-bg, #f6f1e8);
}

.site-container {
    max-width: 1180px;
}

/* Newspaper rhythm for content pages. Ads are not touched. */
.news-home-v28,
.belta-paper-home,
.article-layout,
.clean-article-layout,
.blog-layout,
.blog-detail-page,
.kb-article-layout,
.kb-list,
.catalog-page,
.userblogs-page {
    font-family: var(--st-sans, system-ui, sans-serif);
}

.home-section-head,
.newspaper-section-head,
.side-panel-head,
.newspaper-section-title,
.blog-toolbar,
.kb-section-head {
    border-bottom: 1px solid var(--st-line, #ddd6c8);
}

.home-section-head h1,
.home-section-head h2,
.newspaper-section-title h2,
.clean-article-title,
.article-title,
.blog-detail-title,
.kb-title,
.belta-lead-title,
.list-title,
.small-title,
.news-card-title {
    letter-spacing: -.035em;
}

.belta-lead-title,
.clean-article-title,
.article-title,
.blog-detail-title,
.kb-title {
    font-family: var(--st-serif, Georgia, serif);
}

/* Cards: same editorial feel across news, knowledge, blogs, catalog. */
.newspaper-list-card,
.newspaper-small-card,
.news-card-clean,
.content-card,
.kb-list-card,
.kb-category-card,
.blog-feed-card,
.blog-author-card,
.catalog-card,
.side-panel,
.home-poll-widget {
    background: var(--st-paper, #fffdf8);
    border: 1px solid var(--st-line, #ddd6c8);
    border-radius: var(--st-radius, 18px);
    box-shadow: none;
}

.newspaper-list-card:hover,
.newspaper-small-card:hover,
.news-card-clean:hover,
.kb-list-card:hover,
.blog-feed-card:hover,
.catalog-card:hover {
    box-shadow: var(--st-shadow, 0 18px 45px rgba(17, 24, 39, .08));
    transform: translateY(-1px);
}

.news-meta,
.news-meta-clean,
.clean-article-meta,
.kb-meta,
.blog-detail-stats,
.meta-date,
.post-meta-line,
.post-meta-line time {
    color: var(--st-muted, #6b7280) !important;
    font-weight: 400 !important;
}

.meta-category,
.post-meta-line .meta-category {
    color: var(--st-red, #b91c1c);
    font-weight: 700;
}

.post-tag-pill,
.kb-card-tags a,
.tag-list a,
.pill-list a {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    background: var(--st-tag-bg, #eaf3ff);
    color: var(--st-tag-ink, #1d4ed8) !important;
    border: 1px solid rgba(29, 78, 216, .16);
    border-radius: 999px;
    padding: 5px 10px;
    font-size: .82rem;
    font-weight: 700;
    text-decoration: none;
}

.list-card-image img,
.small-card-image img,
.news-card-media img,
.kb-list-image img,
.blog-feed-card__image img,
.catalog-card__image img,
.clean-article-cover img,
.article-cover img,
.blog-detail-cover img,
.kb-featured-image img {
    object-fit: cover;
}

/* Make the top of the home page lighter and more newspaper-like. */
.hot-tags,
.home-category-pills {
    border-bottom: 1px solid var(--st-line, #ddd6c8);
    padding-bottom: 12px;
}

.home-category-pill {
    background: transparent;
    border: 1px solid var(--st-line, #ddd6c8);
    color: var(--st-ink, #111827);
}

.headline-rail,
.belta-main-photo,
.belta-lead-text {
    border-color: var(--st-line, #ddd6c8);
}

/* Article readability. Share buttons are intentionally not targeted. */
.clean-article-content,
.article-content,
.blog-detail-content,
.kb-content {
    font-size: clamp(1.03rem, 1.6vw, 1.16rem);
    line-height: 1.78;
}

.clean-article-content p,
.article-content p,
.blog-detail-content p,
.kb-content p {
    margin-bottom: 1.15em;
}

/* Mobile tightening without changing functionality. */
@media (max-width: 720px) {
    .site-main {
        padding-top: 14px;
    }

    .site-container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .news-home-v28,
    .belta-paper-home {
        gap: 14px;
    }

    .home-section-head h1,
    .home-section-head h2,
    .newspaper-section-title h2 {
        font-size: 1.35rem;
    }

    .belta-lead-title,
    .clean-article-title,
    .article-title,
    .blog-detail-title,
    .kb-title {
        font-size: clamp(2rem, 11vw, 3rem);
        line-height: .98;
    }

    .newspaper-list-card,
    .newspaper-small-card,
    .side-panel,
    .home-poll-widget {
        border-radius: 16px;
    }

    .clean-article-content,
    .article-content,
    .blog-detail-content,
    .kb-content {
        font-size: 1.02rem;
        line-height: 1.68;
    }
}

/* Step 6: typographic tuning for home newspaper cards.
   Non-destructive: only overrides typography/metadata on the news home page. */
.news-home-v28.belta-paper-home .belta-lead-title,
.news-home-v28.belta-paper-home .small-title,
.news-home-v28.belta-paper-home .list-title {
    font-family: "Playfair Display", Georgia, "Times New Roman", serif;
    font-weight: 600 !important;
    letter-spacing: -0.022em !important;
    color: #111827;
}

.news-home-v28.belta-paper-home .belta-lead-title {
    margin-top: 10px;
    font-size: clamp(34px, 3.6vw, 52px);
    line-height: 1.08 !important;
}

.news-home-v28.belta-paper-home .small-title,
.news-home-v28.belta-paper-home .list-title {
    line-height: 1.16 !important;
}

.news-home-v28.belta-paper-home .story-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0;
    margin-bottom: 8px;
    color: #64748b !important;
    font-size: 15px;
    line-height: 1.3;
    font-weight: 400 !important;
    letter-spacing: 0;
}

.news-home-v28.belta-paper-home .story-meta .feed-type,
.news-home-v28.belta-paper-home .story-meta .meta-category {
    color: #b91c1c !important;
    font-weight: 800 !important;
}

.news-home-v28.belta-paper-home .story-meta .meta-date,
.news-home-v28.belta-paper-home .story-meta .meta-sep.meta-date,
.news-home-v28.belta-paper-home .story-meta .meta-sep {
    color: #667085 !important;
    font-size: 15px;
    font-weight: 400 !important;
    opacity: 1;
}

.news-home-v28.belta-paper-home .belta-lead-preview {
    margin-top: 12px;
    color: #374151;
    font-weight: 500;
    line-height: 1.5;
}

@media (max-width: 720px) {
    .news-home-v28.belta-paper-home .story-meta {
        margin-bottom: 8px;
        font-size: 14.5px;
        line-height: 1.35;
    }

    .news-home-v28.belta-paper-home .story-meta .meta-date,
    .news-home-v28.belta-paper-home .story-meta .meta-sep.meta-date,
    .news-home-v28.belta-paper-home .story-meta .meta-sep {
        font-size: 14.5px;
    }

    .news-home-v28.belta-paper-home .belta-lead-title {
        margin-top: 8px;
        font-size: clamp(33px, 9vw, 42px) !important;
        line-height: 1.08 !important;
        letter-spacing: -0.02em !important;
    }

    .news-home-v28.belta-paper-home .belta-lead-preview {
        margin-top: 12px;
        font-size: 16px;
        line-height: 1.5;
        font-weight: 500;
    }
}