body {
    color: #25352e;
    background:
        linear-gradient(rgba(253, 250, 241, 0.9), rgba(253, 250, 241, 0.9)),
        repeating-linear-gradient(90deg, rgba(55, 102, 83, 0.06) 0, rgba(55, 102, 83, 0.06) 1px, transparent 1px, transparent 68px);
}

.blog-shell {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    padding: 56px 0 92px;
}

.article-intro {
    max-width: 880px;
    margin: 0 auto 38px;
    text-align: center;
}

.article-category,
.article-eyebrow,
.rail-label,
.article-rail > p,
.ad-wrap > span {
    color: #19715c;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.article-category {
    display: inline-block;
    margin-bottom: 21px;
    padding-bottom: 4px;
    border-bottom: 2px solid #e26d4d;
    color: #1c5c4d;
    text-decoration: none;
}

.article-category:hover,
.article-body a:hover,
.blog-footer a:hover { color: #c45339; }

.article-eyebrow { margin-bottom: 13px; color: #c45339; }

.article-intro h1,
.article-body h2 {
    color: #183b32;
    font-family: 'DM Serif Display', Georgia, serif;
    font-weight: 400;
}

.article-intro h1 {
    max-width: 840px;
    margin: 0 auto 19px;
    font-size: clamp(2.6rem, 5vw, 4.8rem);
    letter-spacing: 0;
    line-height: 1.03;
}

.article-deck {
    max-width: 650px;
    margin: 0 auto 27px;
    color: #65756c;
    font-size: 1.05rem;
    line-height: 1.8;
}

.article-byline {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    text-align: left;
}

.author-mark {
    display: grid;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    place-items: center;
    background: #183b32;
    color: #fffaf1;
    font-size: 0.7rem;
    font-weight: 700;
}

.article-byline strong,
.article-byline span { display: block; }
.article-byline strong { font-size: 0.78rem; }
.article-byline span { margin-top: 2px; color: #75847c; font-size: 0.7rem; }

.hero-image { margin: 0 0 64px; }
.hero-image img {
    display: block;
    width: 100%;
    height: min(52vw, 590px);
    object-fit: cover;
    border-radius: 7px;
}

.hero-image figcaption,
.inline-image figcaption {
    margin-top: 9px;
    color: #728078;
    font-size: 0.72rem;
    text-align: right;
}

.article-layout {
    display: grid;
    grid-template-columns: 175px minmax(0, 650px) 200px;
    justify-content: space-between;
    gap: 42px;
}

.article-rail { align-self: start; position: sticky; top: 138px; }
.article-rail > p { margin-bottom: 14px; }
.article-rail a {
    display: block;
    padding: 8px 0;
    border-top: 1px solid #d9ded4;
    color: #63736a;
    font-size: 0.75rem;
    line-height: 1.4;
    text-decoration: none;
}
.article-rail a:last-child { border-bottom: 1px solid #d9ded4; }
.article-rail a:hover { color: #1c5c4d; }

.article-body { min-width: 0; }
.article-lead {
    margin-bottom: 40px;
    color: #385247;
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: 1.52rem;
    line-height: 1.48;
}

.article-body section { margin-bottom: 45px; }
.article-body h2 {
    margin-bottom: 16px;
    font-size: 2rem;
    letter-spacing: 0;
    line-height: 1.14;
}
.article-body p {
    margin-bottom: 18px;
    color: #45574d;
    font-size: 0.95rem;
    line-height: 1.9;
}
.article-body a {
    color: #17614f;
    font-weight: 700;
    text-decoration-color: #e26d4d;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.inline-image { margin: 30px 0; }
.inline-image img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 5px;
}

.article-body blockquote {
    margin: 32px 0;
    padding: 6px 0 6px 24px;
    border-left: 3px solid #e26d4d;
    color: #1e4a3d;
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: 1.55rem;
    font-style: italic;
    line-height: 1.38;
}

.ad-wrap {
    display: grid;
    min-height: 142px;
    margin: 42px 0;
    padding: 12px;
    border-top: 1px solid #d9ded4;
    border-bottom: 1px solid #d9ded4;
    place-items: center;
}
.ad-wrap > span { color: #99a39b; font-size: 0.58rem; }
.ad-wrap ins { width: 100%; }
.ad-placeholder {
    display: grid;
    width: 100%;
    min-height: 68px;
    margin-top: 5px;
    place-items: center;
    border: 1px dashed #cbd2c8;
    color: #99a39b;
    font-size: 0.7rem;
}

.article-close {
    padding-top: 31px;
    border-top: 1px solid #cbd4ca;
}
.article-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 25px; }
.primary-action {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 10px 17px;
    border-radius: 4px;
    background: #183b32;
    color: #fffaf1 !important;
    font-size: 0.76rem;
    text-decoration: none !important;
    transition: background 0.2s ease, transform 0.2s ease;
}
.primary-action:hover { background: #c45339; transform: translateY(-2px); }
.text-action { font-size: 0.8rem; }
.text-action span { margin-left: 4px; }

.related-rail { align-self: start; padding-top: 2px; }
.rail-label { margin-bottom: 14px; }
.related-link {
    display: grid;
    gap: 6px;
    padding: 14px 0;
    border-top: 1px solid #d9ded4;
    color: #28473c;
    text-decoration: none;
}
.related-link:last-child { border-bottom: 1px solid #d9ded4; }
.related-link span { color: #c45339; font-size: 0.64rem; font-weight: 700; }
.related-link strong { font-size: 0.78rem; line-height: 1.45; }
.related-link:hover strong { color: #c45339; }

.blog-footer {
    display: flex;
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    padding: 24px 0 34px;
    border-top: 1px solid #cbd4ca;
    gap: 20px;
    color: #2d4a40;
    font-size: 0.74rem;
}
.blog-footer p { margin-right: auto; font-family: 'DM Serif Display', Georgia, serif; font-size: 1rem; }
.blog-footer a { color: #5e7167; text-decoration: none; }

@media (max-width: 1080px) {
    .article-layout { grid-template-columns: 155px minmax(0, 650px); justify-content: center; }
    .related-rail { display: none; }
}

@media (max-width: 760px) {
    .blog-shell { width: min(100% - 32px, 620px); padding-top: 35px; }
    .article-intro { margin-bottom: 27px; text-align: left; }
    .article-intro h1 { font-size: 2.65rem; }
    .article-deck { margin-left: 0; }
    .hero-image { margin-bottom: 40px; }
    .hero-image img { height: 56vw; min-height: 260px; }
    .article-layout { display: block; }
    .article-rail { display: none; }
    .article-lead { font-size: 1.35rem; }
    .article-body h2 { font-size: 1.75rem; }
    .article-body blockquote { font-size: 1.35rem; }
    .blog-footer { width: min(100% - 32px, 620px); }
}

@media (max-width: 430px) {
    .article-intro h1 { font-size: 2.3rem; }
    .article-body p { font-size: 0.9rem; }
    .article-actions { align-items: flex-start; flex-direction: column; gap: 14px; }
}