/* CHARM LOG autumn home refresh: seasonal accents are scoped to the public home. */
.blog-home {
    --autumn-forest: #24483e;
    --autumn-moss: #66866d;
    --autumn-leaf: #c96f3d;
    --autumn-gold: #d69d45;
    --autumn-paper: #f7f1e8;
    --autumn-ink: #27332f;
    background:
        radial-gradient(circle at 12% 16%, rgba(214, 157, 69, .08), transparent 22rem),
        linear-gradient(180deg, #fbf7f0 0, #f3eee5 420px, var(--canvas) 900px);
}

.blog-home .topbar {
    border-bottom-color: rgba(36, 72, 62, .20);
    background: rgba(251, 247, 240, .92);
}

.blog-home .wordmark,
.blog-home .topnav a:hover,
.blog-home .nav-button:hover {
    color: var(--autumn-forest);
}

.blog-home .site-search {
    border-color: var(--autumn-moss);
    background: rgba(255, 253, 249, .9);
}

.blog-home .site-search button {
    background: var(--autumn-forest);
}

.blog-home .blog-cover {
    height: clamp(430px, 54vw, 590px);
    background: #162c27;
}

.blog-home .blog-cover > img {
    filter: saturate(.86) sepia(.18) contrast(1.06);
}

.blog-home .cover-shade {
    background:
        linear-gradient(180deg, rgba(18, 40, 34, .16), rgba(18, 32, 27, .82)),
        linear-gradient(90deg, rgba(22, 47, 39, .92), rgba(22, 47, 39, .34) 58%, rgba(91, 49, 29, .52));
}

.blog-home .cover-copy p,
.blog-home .cover-latest span,
.blog-home .eyebrow {
    color: #e4b96f;
}

.blog-home .cover-copy h1 {
    letter-spacing: .01em;
    text-shadow: 0 18px 48px rgba(18, 34, 28, .58);
}

.blog-home .cover-actions .primary-button {
    border-color: #e1b364;
    background: #d17b45;
    box-shadow: 0 10px 24px rgba(101, 48, 25, .26);
}

.blog-home .cover-actions .primary-button:hover,
.blog-home .cover-actions .primary-button:focus-visible {
    background: #b85e30;
}

.blog-home .cover-latest {
    border-color: rgba(231, 190, 119, .36);
    border-left-color: var(--autumn-leaf);
    background: linear-gradient(135deg, rgba(255, 247, 229, .17), rgba(17, 38, 31, .64));
}

.blog-home .cover-news-ticker.is-live {
    border-left-color: #e6b568;
}

.blog-home .cover-news-ticker.is-live span::before {
    background: #e6b568;
    box-shadow: 0 0 0 5px rgba(230, 181, 104, .16);
}

.blog-home .cover-news-controls button:hover,
.blog-home .cover-news-controls button:focus-visible {
    border-color: rgba(230, 181, 104, .9);
    background: rgba(201, 111, 61, .25);
}

.blog-home .cover-stats {
    border-color: rgba(231, 190, 119, .3);
    background: rgba(230, 181, 104, .28);
}

.blog-home .cover-stats span,
.blog-home .cover-stats span:nth-child(odd) {
    background: rgba(15, 38, 31, .6);
}

.blog-home .blog-shell {
    margin-top: 38px;
}

.blog-home .profile-block,
.blog-home .sidebar-section,
.blog-home .post-feed {
    border-color: rgba(105, 91, 70, .18);
    background: rgba(255, 252, 247, .86);
    box-shadow: 0 14px 34px rgba(91, 67, 42, .07);
}

.blog-home .profile-avatar,
.blog-home .byline-avatar,
.blog-home .comment-avatar {
    background: var(--autumn-forest);
}

.blog-home .category-list a.active,
.blog-home .archive-list a.active,
.blog-home .popular-list a:hover,
.blog-home .write-link,
.blog-home .feed-post:hover h3 {
    color: var(--autumn-leaf);
}

.blog-home .write-link {
    border-color: rgba(201, 111, 61, .52);
}

.blog-home .feed-post {
    border-left-color: rgba(201, 111, 61, .25);
}

.blog-home .feed-post:hover {
    border-color: rgba(201, 111, 61, .48);
    box-shadow: 0 18px 42px rgba(117, 73, 39, .12);
}

.blog-home .tag-pill {
    border-color: rgba(102, 134, 109, .35);
    background: rgba(102, 134, 109, .12);
    color: var(--autumn-forest);
}

.blog-home .tag-pill.tag-news {
    border-color: rgba(201, 111, 61, .32);
    background: rgba(201, 111, 61, .12);
    color: #934821;
}

:root[data-theme="dark"] .blog-home {
    --canvas: #101b19;
    --paper: #172521;
    --ink: #edf1e8;
    --muted: #aab7aa;
    --line: #2d4038;
    background:
        radial-gradient(circle at 15% 10%, rgba(201, 111, 61, .12), transparent 22rem),
        linear-gradient(180deg, #13231f 0, #101b19 520px);
}

:root[data-theme="dark"] .blog-home .topbar {
    border-bottom-color: rgba(196, 157, 96, .18);
    background: rgba(14, 26, 22, .92);
}

:root[data-theme="dark"] .blog-home .site-search,
:root[data-theme="dark"] .blog-home .profile-block,
:root[data-theme="dark"] .blog-home .sidebar-section,
:root[data-theme="dark"] .blog-home .post-feed {
    background: rgba(23, 37, 33, .88);
    border-color: rgba(188, 160, 111, .18);
}

:root[data-theme="dark"] .blog-home .wordmark,
:root[data-theme="dark"] .blog-home .topnav a:hover,
:root[data-theme="dark"] .blog-home .nav-button:hover,
:root[data-theme="dark"] .blog-home .category-list a.active,
:root[data-theme="dark"] .blog-home .archive-list a.active,
:root[data-theme="dark"] .blog-home .popular-list a:hover,
:root[data-theme="dark"] .blog-home .write-link,
:root[data-theme="dark"] .blog-home .feed-post:hover h3 {
    color: #e4b96f;
}

:root[data-theme="dark"] .blog-home .tag-pill,
:root[data-theme="dark"] .blog-home .tag-pill.tag-news {
    color: #f0c98d;
}

@media (max-width: 640px) {
    .blog-home .blog-cover {
        height: 540px;
    }
}
