/* STEP32 — SzczecinTut Design System 1.0
   Управляется из админки: Дизайн сайта → Настройки дизайна.
   Слой только переопределяет визуальную систему, функционал не трогает. */

:root {
    --st-title-font: "Source Serif 4", Georgia, serif;
    --st-body-font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --st-ui-font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --st-title-weight: 650;
    --st-title-size-desktop: 58px;
    --st-title-size-tablet: 48px;
    --st-title-size-mobile: 38px;
    --st-title-line-height: 1.12;
    --st-title-letter-spacing: -0.018em;
    --st-body-size: 19px;
    --st-body-weight: 400;
    --st-body-line-height: 1.52;
    --st-h2-size: 30px;
    --st-h2-weight: 700;
    --st-density: 1;
    --st-card-radius: 18px;
    --st-image-radius: 18px;
    --st-card-shadow: 0 12px 34px rgba(15, 23, 42, .06);
    --st-text: #22252b;
    --st-muted: #6b7280;
    --st-accent: #c1121f;
    --st-border: #e5e7eb;
    --st-surface: #fff;
    --st-page-bg: #f6f7f9;
}

body {
    background: var(--st-page-bg) !important;
    color: var(--st-text) !important;
    font-family: var(--st-ui-font) !important;
}

.site-main,
.site-container {
    color: var(--st-text);
}

/* Единая типографика материалов */
.post-detail-title,
.article-title,
.entry-title,
.knowledge-article-title,
.knowledge-title,
.guide-title,
.guide-chapter-title,
.userblog-post-title,
.catalog-detail-title,
.mediahub-album-title,
.mediahub-title,
h1.editorial-title,
.post-detail h1,
.article-detail h1,
.knowledge-detail h1,
.guide-detail h1,
.guide-chapter h1,
.userblog-detail h1 {
    font-family: var(--st-title-font) !important;
    font-size: var(--st-title-size-desktop) !important;
    font-weight: var(--st-title-weight) !important;
    line-height: var(--st-title-line-height) !important;
    letter-spacing: var(--st-title-letter-spacing) !important;
    color: var(--st-text) !important;
    text-wrap: balance;
}

.post-content,
.article-content,
.entry-content,
.knowledge-content,
.guide-content,
.guide-chapter-content,
.userblog-content,
.catalog-detail-description,
.mediahub-album-description,
.editorial-content {
    font-family: var(--st-body-font) !important;
    font-size: var(--st-body-size) !important;
    font-weight: var(--st-body-weight) !important;
    line-height: var(--st-body-line-height) !important;
    color: var(--st-text) !important;
}

.post-content p,
.article-content p,
.entry-content p,
.knowledge-content p,
.guide-content p,
.guide-chapter-content p,
.userblog-content p,
.catalog-detail-description p,
.editorial-content p {
    margin-bottom: calc(1.05em * var(--st-density)) !important;
}

.post-content h2,
.article-content h2,
.entry-content h2,
.knowledge-content h2,
.guide-content h2,
.guide-chapter-content h2,
.userblog-content h2,
.editorial-content h2 {
    font-family: var(--st-ui-font) !important;
    font-size: var(--st-h2-size) !important;
    font-weight: var(--st-h2-weight) !important;
    line-height: 1.18 !important;
    letter-spacing: -0.018em !important;
    color: var(--st-text) !important;
    margin-top: calc(2rem * var(--st-density)) !important;
    margin-bottom: calc(.75rem * var(--st-density)) !important;
}

.post-content h3,
.article-content h3,
.entry-content h3,
.knowledge-content h3,
.guide-content h3,
.guide-chapter-content h3,
.userblog-content h3,
.editorial-content h3 {
    font-family: var(--st-ui-font) !important;
    color: var(--st-text) !important;
    line-height: 1.22 !important;
    letter-spacing: -0.012em !important;
}

/* Meta, крошки, подписи */
.breadcrumbs,
.breadcrumbs a,
.editorial-breadcrumbs,
.editorial-breadcrumbs a,
.post-meta,
.article-meta,
.entry-meta,
.knowledge-meta,
.guide-meta,
.userblog-meta,
.catalog-meta,
.mediahub-meta,
.image-caption,
.photo-caption,
figcaption {
    font-family: var(--st-ui-font) !important;
    color: var(--st-muted) !important;
    font-weight: 400 !important;
}

.breadcrumbs a:hover,
.editorial-breadcrumbs a:hover {
    color: var(--st-accent) !important;
}

/* Карточки */
.post-card,
.article-card,
.home-card,
.news-card,
.knowledge-card,
.guide-card,
.userblog-card,
.catalog-card,
.mediahub-album-card,
.mediahub-photo-card,
.dashboard-card,
.poll-card {
    background: var(--st-surface) !important;
    border-color: var(--st-border) !important;
    border-radius: var(--st-card-radius) !important;
    box-shadow: var(--st-card-shadow) !important;
}

.post-card img,
.article-card img,
.home-card img,
.news-card img,
.knowledge-card img,
.guide-card img,
.userblog-card img,
.catalog-card img,
.mediahub-album-card img,
.mediahub-photo-card img,
.post-cover img,
.article-cover img,
.guide-cover img,
.knowledge-cover img,
.catalog-cover img,
.mediahub-cover img {
    border-radius: var(--st-image-radius) !important;
}

.post-card-title,
.article-card-title,
.home-card-title,
.news-card-title,
.knowledge-card-title,
.guide-card-title,
.userblog-card-title,
.catalog-card-title,
.mediahub-album-card-title,
.card-title {
    color: var(--st-text) !important;
    font-family: var(--st-ui-font) !important;
    letter-spacing: -0.012em !important;
}

.post-card-meta,
.article-card-meta,
.news-card-meta,
.card-meta,
.mediahub-card-meta {
    color: var(--st-muted) !important;
    font-weight: 400 !important;
}

/* Кнопки и ссылки */
a {
    text-decoration-color: color-mix(in srgb, var(--st-accent), transparent 65%);
}

.btn,
.button,
button:not(.admin-menu-trigger):not(.mediahub-photo-menu-trigger):not(.lightbox-btn),
.admin-submit,
.form-submit {
    border-radius: calc(var(--st-card-radius) * .65) !important;
    font-family: var(--st-ui-font) !important;
}

.btn-primary,
.button-primary,
.admin-submit,
.form-submit {
    background: var(--st-accent) !important;
    border-color: var(--st-accent) !important;
}

/* Редакторские блоки */
.editorial-block,
.guide-block,
.info-block,
.note-block,
.tip-block,
.warning-block,
.important-block,
.error-block,
blockquote {
    border-radius: var(--st-card-radius) !important;
    border-color: var(--st-border) !important;
    font-family: var(--st-body-font) !important;
}

blockquote {
    color: var(--st-text) !important;
    border-left-color: var(--st-accent) !important;
}

/* Галерея */
.mediahub-manager,
.mediahub-gallery,
.mediahub-album-grid,
.mediahub-photo-grid {
    font-family: var(--st-ui-font) !important;
}

.portal-lightbox,
.portal-lightbox * {
    font-family: var(--st-ui-font) !important;
}

@media (max-width: 900px) {
    .post-detail-title,
    .article-title,
    .entry-title,
    .knowledge-article-title,
    .knowledge-title,
    .guide-title,
    .guide-chapter-title,
    .userblog-post-title,
    .catalog-detail-title,
    .mediahub-album-title,
    .mediahub-title,
    h1.editorial-title,
    .post-detail h1,
    .article-detail h1,
    .knowledge-detail h1,
    .guide-detail h1,
    .guide-chapter h1,
    .userblog-detail h1 {
        font-size: var(--st-title-size-tablet) !important;
    }
}

@media (max-width: 640px) {
    .post-detail-title,
    .article-title,
    .entry-title,
    .knowledge-article-title,
    .knowledge-title,
    .guide-title,
    .guide-chapter-title,
    .userblog-post-title,
    .catalog-detail-title,
    .mediahub-album-title,
    .mediahub-title,
    h1.editorial-title,
    .post-detail h1,
    .article-detail h1,
    .knowledge-detail h1,
    .guide-detail h1,
    .guide-chapter h1,
    .userblog-detail h1 {
        font-size: var(--st-title-size-mobile) !important;
    }

    .post-content,
    .article-content,
    .entry-content,
    .knowledge-content,
    .guide-content,
    .guide-chapter-content,
    .userblog-content,
    .catalog-detail-description,
    .mediahub-album-description,
    .editorial-content {
        font-size: max(16px, calc(var(--st-body-size) - 1px)) !important;
    }
}