/**
 * SovrNovosti 0.4.5 — Air & Hierarchy
 * Author: Illia Abel
 */

/* =========================================================
   GLOBAL EDITORIAL RULES
   One strong line for section starts.
   Whitespace replaces unnecessary borders.
   ========================================================= */

.sn-editorial-section-header {
    margin-bottom: 1rem;
}

.sn-section-rule {
    min-height: 34px;

    border-top:
        2px solid
        var(--sn-text);

    border-bottom: 0;
}

.sn-section-rule > span {
    font-weight: 760;
}

.sn-section-rule > a {
    font-weight: 620;
}

/* =========================================================
   HERO
   Keep geometry, soften framing.
   ========================================================= */

.sn-top-news {
    padding-bottom: 2.35rem;
}

.sn-hero-main-feature {
    border-color: #d9dee5;
}

.sn-hero-side-stack {
    border: 0;
}

.sn-hero-side-item
+ .sn-hero-side-item {
    border-top:
        1px solid #e8ebef;
}

.sn-hero-side-copy h2 {
    font-weight: 540;
}

.sn-hero-side-copy time {
    color: #818995;
}

.sn-top-briefs {
    margin-top: 1.1rem;

    border-top:
        1px solid #e4e8ed;

    border-bottom: 0;
}

.sn-brief-story
+ .sn-brief-story {
    border-left-color: #e8ebef;
}

/* =========================================================
   LATEST NEWS
   Separators remain functional, but quieter.
   ========================================================= */

.sn-news-stream {
    padding-block: 2.45rem;
}

.sn-stream-list {
    border-top:
        1px solid #e7eaee;
}

.sn-stream-row {
    border-bottom:
        1px solid #e8ebef;
}

.sn-stream-row h2 {
    font-weight: 560;
}

/* =========================================================
   KEY SECTIONS
   Remove table-like vertical dividers.
   ========================================================= */

.sn-sections-block {
    padding-top: 2.9rem;
    padding-bottom: 2.1rem;
}

.sn-section-columns {
    column-gap: 1.65rem;
}

.sn-section-column,
.sn-section-column:first-child,
.sn-section-column:last-child {
    padding-inline: 0;
}

.sn-section-column
+ .sn-section-column {
    border-left: 0;
}

.sn-section-column > header {
    border-bottom:
        1px solid #cfd5dc;
}

.sn-section-brief {
    border-top:
        1px solid #eceef1;
}

/* =========================================================
   ALL NEWS CATEGORIES
   Remove repetitive horizontal ruling.
   ========================================================= */

.sn-all-categories {
    padding-top: 1.45rem;
    padding-bottom: 2.55rem;

    border-bottom: 0;
}

.sn-category-index {
    column-gap: 1.25rem;
    row-gap: 0;
}

.sn-category-index a {
    min-height: 42px;

    padding:
        0.62rem
        0
        0.62rem;

    border-bottom: 0;

    color: #303846;
}

.sn-category-index a:hover {
    color: var(--sn-accent);
}

.sn-category-index-archive {
    color:
        var(--sn-accent) !important;
}

/* =========================================================
   PUBLICATIONS
   Same softer treatment as hero.
   ========================================================= */

.sn-publications-block {
    padding-top: 3.35rem;
    padding-bottom: 3rem;
}

.sn-publication-main-feature {
    border-color: #d9dee5;
}

.sn-publication-side-stack {
    border: 0;
}

.sn-publication-grid-item
+ .sn-publication-grid-item {
    border-top:
        1px solid #e8ebef;
}

.sn-publication-grid-copy h3 {
    font-weight: 540;
}

/* =========================================================
   FOOTER
   Keep structure, reduce vertical bulk.
   ========================================================= */

.sn-footer-compact {
    padding-top: 2.05rem;
    padding-bottom: 1.75rem;
}

.sn-footer-compact-brand > p {
    margin-top: 0.65rem;
    margin-bottom: 0.5rem;
}

.sn-footer-utility {
    margin-top: 0.9rem;
    padding-top: 0.7rem;

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            0.09
        );
}

.sn-footer-compact-categories h2 {
    margin-bottom: 0.65rem;
}

.sn-footer-compact-category-columns li
+ li {
    margin-top: 0.44rem;
}

.sn-footer-bottom {
    min-height: 46px;

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            0.08
        );
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1080px) {

    .sn-section-columns {
        column-gap: 1.3rem;
    }
}

@media (max-width: 820px) {

    .sn-section-column
    + .sn-section-column {
        padding-top: 1.4rem;

        border-top:
            1px solid #e7eaee;
    }

    .sn-category-index {
        column-gap: 1rem;
    }
}

@media (max-width: 580px) {

    .sn-editorial-section-header {
        margin-bottom: 0.8rem;
    }

    .sn-section-rule {
        min-height: 31px;
    }

    .sn-footer-compact {
        padding-top: 1.8rem;
        padding-bottom: 1.5rem;
    }
}

/* =========================================================
   Publications / Footer breathing room
   Author: Illia Abel
   ========================================================= */

.sn-publications-block {
    padding-bottom:
        clamp(
            4rem,
            6vw,
            5.25rem
        );
}

@media (max-width: 680px) {

    .sn-publications-block {
        padding-bottom: 2.6rem;
    }
}


/* =========================================================
   SOVRNOVOSTI HOME HERO FLOW FIX
   Desktop:
   - hero height follows its content;
   - 3 side stories get breathing room;
   - briefs always begin below the hero.
   ========================================================= */

@media (min-width: 821px) {

    .sn-hero-media-grid {
        height: auto;
        min-height: 370px;

        align-items: stretch;

        /*
         * Earlier refinement allowed visible overflow.
         * With content-driven height there is no reason for
         * the hero to paint over the briefs below it.
         */
        overflow: visible;
    }

    .sn-hero-main-feature {
        height: 100%;
        min-height: 370px;
    }

    .sn-hero-side-stack {
        min-width: 0;

        display: grid;

        grid-template-rows:
            repeat(
                3,
                minmax(112px, auto)
            );

        gap: 12px;

        align-content: stretch;
    }

    .sn-hero-side-item {
        min-height: 112px;
        overflow: hidden;
    }

    .sn-hero-side-item
    + .sn-hero-side-item {
        border-top: 0;
    }

    .sn-hero-side-media,
    .sn-hero-side-media img {
        min-height: 100%;
    }
}


/*
 * The brief-news strip is a separate editorial block.
 * Keep it visibly and structurally below the hero.
 */
.sn-top-briefs {
    position: relative;
    z-index: 1;

    margin-top: 1.5rem;
}


/*
 * Mobile/tablet already use a one-column hero.
 * Preserve natural content height there and add a little
 * breathing room between side stories as well.
 */
@media (max-width: 820px) {

    .sn-hero-media-grid {
        height: auto;
        overflow: visible;
    }

    .sn-hero-side-stack {
        display: grid;
        gap: 10px;
    }

    .sn-hero-side-item
    + .sn-hero-side-item {
        border-top: 0;
    }
}


/* =========================================================
   SOVRNOVOSTI EDITORIAL HOMEPAGE V1
   News briefs:
   - 3 columns on desktop.
   Publications:
   - same content-driven hero geometry as news;
   - 3 separated side stories.
   ========================================================= */

@media (min-width: 821px) {

    .sn-top-briefs {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }

    .sn-publications-media-grid {
        height: auto;
        min-height: 345px;

        align-items: stretch;
        overflow: visible;
    }

    .sn-publication-main-feature {
        height: 100%;
        min-height: 345px;
    }

    .sn-publication-side-stack {
        min-width: 0;

        display: grid;

        grid-template-rows:
            repeat(
                3,
                minmax(104px, auto)
            );

        gap: 12px;
        align-content: stretch;

        border: 0;
    }

    .sn-publication-grid-item {
        min-height: 104px;
        overflow: hidden;
    }

    .sn-publication-grid-item
    + .sn-publication-grid-item {
        border-top: 0;
    }

    .sn-publication-grid-media,
    .sn-publication-grid-media img {
        min-height: 100%;
    }
}


@media (max-width: 820px) {

    .sn-top-briefs {
        grid-template-columns: 1fr;
    }

    .sn-publications-media-grid {
        height: auto;
        overflow: visible;
    }

    .sn-publication-side-stack {
        display: grid;
        gap: 10px;
        border-left: 0;
    }

    .sn-publication-grid-item
    + .sn-publication-grid-item {
        border-top: 0;
    }
}