.hero, .post-section { width: min(920px, calc(100% - 40px)); margin-inline: auto; }
.hero { padding: 72px 0 58px; }
.hero .eyebrow { margin-bottom: 20px; color: var(--muted); font: 600 .72rem/1.4 var(--mono); letter-spacing: .02em; text-transform: lowercase; }
.hero .eyebrow span { color: var(--accent); }
.hero h1 { max-width: 790px; margin: 0; font: 500 clamp(2.75rem, 6.5vw, 5.25rem)/.99 Georgia, "Times New Roman", serif; letter-spacing: -.055em; }
.hero h1 em { color: var(--ink); font-style: normal; text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: .08em; text-underline-offset: .12em; }
.hero-copy { max-width: 650px; margin: 30px 0 0; color: var(--muted); font-size: 1.04rem; line-height: 1.7; }
.hero-copy p { margin: 0 0 1em; }
.hero-copy p:last-child { margin-bottom: 0; }
.post-section { padding-bottom: 90px; }
.section-heading { display: flex; justify-content: space-between; align-items: end; padding: 14px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.section-heading h2, .section-heading span { margin: 0; font-family: var(--mono); font-size: .76rem; letter-spacing: 0; text-transform: none; }
.section-heading h2 span { margin-right: 6px; color: var(--accent); }
.section-heading > span { color: var(--muted); }
.post-list { margin: 0; padding: 0; list-style: none; }
.post-list > li { border-bottom: 1px solid var(--line); }
.post-entry { display: grid; grid-template-columns: 44px minmax(0, 1fr) 160px; gap: 20px; align-items: start; padding: 32px 0; }
.post-index { padding-top: 3px; color: var(--muted); font: .72rem/1.4 var(--mono); }
.post-entry .post-meta { display: flex; justify-content: flex-start; gap: 14px; color: var(--muted); font: .7rem/1.4 var(--mono); }
.post-entry .post-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.post-entry h3 { max-width: 720px; margin: 11px 0 9px; font: 500 clamp(1.65rem, 3.2vw, 2.35rem)/1.08 Georgia, serif; letter-spacing: -.025em; }
.post-entry h3 a { transition: color .15s ease; }
.post-entry h3 a:hover { color: var(--accent-hover); }
.post-entry p { max-width: 650px; margin: 0; color: var(--muted); font-size: .95rem; line-height: 1.65; }
.read-more { display: inline-flex; margin-top: 15px; gap: 8px; font: 700 .75rem/1 var(--mono); }
.read-more span { color: var(--accent); transition: transform .15s ease; }
.read-more:hover span { transform: translateX(3px); }
.post-image { display: block; width: 160px; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--line); background: var(--line); }
.post-image img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.82); transition: transform .4s ease; }
.post-image:hover img { transform: scale(1.025); }

@media (max-width: 760px) {
    .hero, .post-section { width: calc(100% - 28px); }
    .hero { padding: 52px 0 44px; }
    .hero h1 { font-size: clamp(2.55rem, 13vw, 4rem); }
    .hero-copy { margin-top: 24px; font-size: 1rem; }
    .post-entry { grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding: 26px 0; }
    .post-entry .post-image { grid-column: 2; width: 100%; max-height: 210px; margin-top: 4px; }
    .post-entry .post-meta { flex-direction: column; gap: 3px; }
    .post-entry h3 { font-size: 1.65rem; }
}