﻿.blog-landing-page{--chron-paper:#f4efe5;--chron-panel:#faf7f0;--chron-ink:#211b17;--chron-muted:#665c53;--chron-copper:#b9825c;--chron-line:#d8cdbf;background:var(--chron-paper);color:var(--chron-ink)}
.blog-landing-page main{overflow:hidden}
.blog-landing-page .blog-index-hero{padding:72px 0 70px;background:#2b211b;border-block:1px solid #49372a;color:#faf5eb}
.blog-landing-page .blog-index-hero .series{margin:0 0 20px;color:#d0a17e;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.blog-landing-page .blog-index-hero h1{max-width:880px;margin:0;color:#fbf5eb;font:400 clamp(64px,8vw,100px)/.87 "Libre Caslon Display",Georgia,serif;letter-spacing:-.035em}
.blog-landing-page .blog-index-hero h1 span{color:#d0a17e;font-style:italic}
.blog-landing-page .blog-index-hero .shell>p:last-child{max-width:650px;margin:22px 0 0;color:#e3d7ca;font-size:18px;line-height:1.65}
.blog-landing-page .chronicle-landing-content{padding-top:49px;padding-bottom:90px}
.blog-landing-page .chronicle-start-here{margin:0 0 45px;padding-bottom:17px;border-bottom:1px solid var(--chron-line);color:#66594d;font-size:13px;letter-spacing:.035em}
.blog-landing-page .chronicle-start-here a{color:#794a31;font-weight:700;text-underline-offset:4px}
.blog-landing-page .chronicle-landing-intro{display:grid;grid-template-columns:1fr minmax(260px,.65fr);gap:44px;align-items:end;margin-bottom:28px}
.blog-landing-page .chronicle-landing-intro .eyebrow{margin:0 0 9px;color:#8b6044;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.blog-landing-page .chronicle-landing-intro h2{margin:0;color:var(--chron-ink);font:400 clamp(45px,5vw,62px)/.95 "Libre Caslon Display",Georgia,serif}
.blog-landing-page .chronicle-landing-intro>p{max-width:440px;margin:0 0 4px;color:var(--chron-muted);font-size:15px;line-height:1.7}
.blog-landing-page .chronicle-post-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important}
.blog-landing-page .chronicle-post-card,.blog-landing-page .chronicle-post-card:first-child{display:flex!important;min-width:0;flex-direction:column!important;grid-column:auto!important;grid-template-columns:none!important;overflow:hidden;background:var(--chron-panel)!important;border:1px solid var(--chron-line)!important;color:var(--chron-ink)!important;text-decoration:none;box-shadow:none!important;transition:border-color .18s ease,transform .18s ease}
.blog-landing-page .chronicle-post-card:hover{border-color:#a88a70!important;transform:translateY(-2px)}
.blog-landing-page .chronicle-post-image,.blog-landing-page .chronicle-post-card:first-child .chronicle-post-image{display:block!important;height:auto!important;min-height:0!important;aspect-ratio:1.72;overflow:hidden;background:#33241b}
.blog-landing-page .chronicle-post-image img,.blog-landing-page .chronicle-post-card:first-child .chronicle-post-image img{display:block!important;width:100%!important;height:100%!important;min-height:0!important;object-fit:cover!important}
.blog-landing-page .chronicle-post-card-body,.blog-landing-page .chronicle-post-card:first-child .chronicle-post-card-body{display:flex!important;flex:1;flex-direction:column!important;align-items:flex-start;padding:19px 20px 21px!important}
.blog-landing-page .chronicle-card-number{color:#8b6044!important;font-size:9px;font-weight:700;letter-spacing:.1em;line-height:1.5;text-transform:uppercase}
.blog-landing-page .chronicle-post-card-body h2{margin:12px 0 8px!important;color:var(--chron-ink)!important;font:400 clamp(25px,2.5vw,32px)/1.02 "Libre Caslon Display",Georgia,serif!important;letter-spacing:-.02em}
.blog-landing-page .chronicle-post-card-body p{margin:0 0 17px!important;color:var(--chron-muted)!important;font-size:14px;line-height:1.55}
.blog-landing-page .chronicle-post-card-body .text-link{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:auto!important;padding-top:13px;border-top:1px solid #e3d9cd;color:#75472e!important;font-size:13px;font-weight:700;text-decoration:none}
.blog-landing-page .chronicle-post-card-body .text-link span{font-size:18px}
/* The shared Chronicle article rules predate this index treatment and use important declarations. Keep these stronger overrides local to the listing page. */
.blog-landing-page.chronicle-page .blog-index-hero{background:#2b211b!important;color:#faf5eb!important}
.blog-landing-page.chronicle-page .blog-index-hero h1{color:#fbf5eb!important}
.blog-landing-page.chronicle-page .blog-index-hero h1 span{color:#d0a17e!important}
.blog-landing-page.chronicle-page .blog-index-hero .shell>p:last-child{color:#e3d7ca!important}
.blog-landing-page.chronicle-page .chronicle-post-image,.blog-landing-page.chronicle-page .chronicle-post-card:first-child .chronicle-post-image{aspect-ratio:16/9!important}
.blog-landing-page.chronicle-page .chronicle-post-image img,.blog-landing-page.chronicle-page .chronicle-post-card:first-child .chronicle-post-image img{object-fit:contain!important}
.blog-landing-page.chronicle-page .chronicle-post-card:not(:first-child) .chronicle-post-image{display:block!important;height:auto!important;min-height:0!important;aspect-ratio:1.72;overflow:hidden}
.blog-landing-page.chronicle-page .chronicle-post-card:not(:first-child) .chronicle-post-image{aspect-ratio:16/9!important}
.blog-landing-page.chronicle-page .chronicle-post-card:not(:first-child) .chronicle-post-image img{display:block!important;width:100%!important;height:100%!important;min-height:0!important;object-fit:contain!important}
.blog-landing-page.chronicle-page .chronicle-post-card:not(:first-child) .chronicle-post-card-body{display:flex!important;grid-template-columns:none!important;flex-direction:column!important;align-items:flex-start!important;gap:0!important;padding:19px 20px 21px!important}
.blog-landing-page.chronicle-page .chronicle-post-card:not(:first-child) .chronicle-post-card-body h2{margin:12px 0 8px!important}
.blog-landing-page.chronicle-page .chronicle-post-card:not(:first-child) .chronicle-post-card-body p{margin:0 0 17px!important}
.blog-landing-page.chronicle-page .chronicle-post-card:not(:first-child) .chronicle-post-card-body .text-link{margin-top:auto!important}
@media(max-width:950px){.blog-landing-page .chronicle-post-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.blog-landing-page .blog-index-hero{padding:62px 0}.blog-landing-page .chronicle-landing-content{padding-bottom:70px}}
@media(max-width:650px){.blog-landing-page .blog-index-hero{padding:46px 0 44px}.blog-landing-page .blog-index-hero h1{font-size:clamp(60px,14vw,78px)}.blog-landing-page .blog-index-hero .shell>p:last-child{font-size:16px}.blog-landing-page .chronicle-landing-content{padding-top:34px;padding-bottom:55px}.blog-landing-page .chronicle-start-here{margin-bottom:30px}.blog-landing-page .chronicle-landing-intro{grid-template-columns:1fr;gap:12px;margin-bottom:22px}.blog-landing-page .chronicle-landing-intro h2{font-size:48px}.blog-landing-page .chronicle-post-grid{grid-template-columns:1fr!important;gap:14px!important}.blog-landing-page .chronicle-post-image{aspect-ratio:1.7}.blog-landing-page .chronicle-post-card-body{padding:18px 19px 19px!important}.blog-landing-page .chronicle-post-card-body h2{font-size:30px!important}}
@media(max-width:360px){.blog-landing-page .blog-index-hero h1{font-size:58px}.blog-landing-page .chronicle-landing-intro h2{font-size:43px}.blog-landing-page .chronicle-post-card-body{padding:16px!important}}

/* Post 08 uses a restrained native diagram in place of a reused hero image. */
.blog-landing-page .chronicle-post-image-08{display:grid;place-items:center;background:linear-gradient(135deg,#eee3d3,#c4a582)!important}
.blog-landing-page .message-bus-diagram{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:12px;width:64%;padding:14px 16px;border:1px solid #9b7859;background:#f8f3e9;color:#443328;font-size:13px;text-align:center}
.blog-landing-page .message-bus-diagram i{display:block;height:24px;border:1px solid #bda58b;background:#eee3d3}
.blog-landing-page .message-bus-diagram b{grid-column:1/-1;padding:8px;background:#292b27;color:#f7f2e8;font-weight:600}
.blog-landing-page .chronicle-post-card-08 .chronicle-post-image{position:relative;overflow:hidden}
@media(max-width:600px){.blog-landing-page .message-bus-diagram{width:74%;gap:9px}}
