:root {
    --blog-paper: #fbf9f6;
    --blog-ink: var(--color-editorial-black);
    --blog-muted: #62605b;
    --blog-rule: #d9d4cc;
    --blog-accent: #8b5a2b;
    --blog-container: 1200px;
    --blog-reading: 720px;
    --blog-gap: 36px;
}
.blog-main { background: var(--blog-paper); color: var(--blog-ink); padding-bottom: 100px; }
.blog-container { width: min(calc(100% - 48px), var(--blog-container)); margin-inline: auto; }
.blog-intro { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 48px; padding-block: 56px 44px; }
.blog-intro h1 { font: 400 clamp(54px, 7vw, 92px)/1.05 var(--font-serif); letter-spacing: -.03em; max-width: 22ch; overflow-wrap: anywhere; }
.blog-intro__description { max-width: 580px; margin-top: 22px; color: var(--blog-muted); font-size: 18px; line-height: 1.8; }
.blog-categories { display: flex; flex-wrap: wrap; gap: 10px 28px; border-block: 1px solid var(--blog-rule); padding-block: 18px; margin-bottom: 48px; }
.blog-categories a { color: var(--blog-muted); font-size: 12px; line-height: 1.5; padding-block: 6px; }
.blog-categories a:hover, .blog-categories a[aria-current] { color: var(--blog-ink); text-decoration: underline; text-underline-offset: 6px; }
.featured-post { display: grid; grid-template-columns: 1.15fr 1fr; gap: 52px; align-items: center; margin-bottom: 64px; padding-bottom: 64px; border-bottom: 0; }
.featured-post:not(:has(.featured-post__image)) { grid-template-columns: 1fr; }
.featured-post__image { display: block; overflow: hidden; aspect-ratio: 1.3; }
.featured-post__image img, .post-card__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--jw-ease); }
.featured-post__image:hover img, .post-card__image:hover img { transform: scale(1.025); }
.featured-post h2 { font: 400 clamp(32px, 3.2vw, 46px)/1.14 var(--font-serif); letter-spacing: -.025em; margin-block: 22px; text-wrap: pretty; }
.featured-post h2 a:hover, .post-card__title a:hover { color: var(--blog-accent); }
.featured-post__content > p { font-size: 16px; line-height: 1.8; color: var(--blog-muted); }
.post-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; color: var(--blog-muted); font-size: 11px; line-height: 1.6; }
.post-meta a { color: var(--blog-accent); }
.post-meta a:hover { text-decoration: underline; text-underline-offset: 4px; }
.article-link { display: inline-flex; align-items: center; gap: 18px; min-height: 44px; margin-top: 16px; border-bottom: 1px solid var(--blog-ink); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.post-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 40px; }
.post-card { min-width: 0; }
.post-card__image { display: block; overflow: hidden; aspect-ratio: 1.52; margin-bottom: 22px; }
.post-card__title { font: 400 32px/1.22 var(--font-serif); letter-spacing: -.02em; margin-top: 14px; text-wrap: pretty; }
.post-card__excerpt { max-width: none; margin-top: 14px; color: var(--blog-muted); font-size: 14px; line-height: 1.8; }
.blog-empty { padding-block: 48px; color: var(--blog-muted); }
.blog-main .pagination { margin-top: 64px; padding-top: 28px; border-top: 1px solid var(--blog-rule); }
.blog-main .nav-links { display: flex; flex-wrap: wrap; gap: 12px; }
.blog-main .page-numbers { display: grid; place-items: center; min-width: 44px; min-height: 44px; padding: 8px 14px; border: 1px solid var(--blog-rule); font-size: 13px; }
.blog-main .page-numbers.current { color: var(--blog-paper); background: var(--blog-ink); border-color: var(--blog-ink); }
.blog-main a.page-numbers:hover { border-color: var(--blog-ink); }
.article-header { padding-block: 40px 48px; }
.article-back { display: inline-block; margin-bottom: 36px; color: var(--blog-muted); font-size: 12px; padding-block: 8px; text-decoration: underline; text-underline-offset: 5px; }
.article-header h1 { font: 400 clamp(38px, 5.6vw, 76px)/1.1 var(--font-serif); letter-spacing: -.03em; max-width: 1050px; margin-top: 22px; text-wrap: pretty; overflow-wrap: anywhere; }
.article-lead { max-width: var(--blog-reading); font-size: 20px; line-height: 1.75; color: var(--blog-muted); margin-top: 28px; }
.article-cover { margin-bottom: 56px; }
.article-cover img { display: block; width: 100%; max-height: 580px; aspect-ratio: 2.05; object-fit: cover; }
.article-body { width: min(calc(100% - 48px), var(--blog-reading)); margin-inline: auto; font-size: 18px; line-height: 1.8; overflow-wrap: break-word; }
.article-body > * + * { margin-top: 24px; }
.article-body h2 { margin-top: 52px; font-size: clamp(28px, 3vw, 36px); font-weight: 400; line-height: 1.25; letter-spacing: -.02em; }
.article-body h3 { margin-top: 36px; font-size: 27px; font-weight: 400; line-height: 1.3; }
.article-body h4, .article-body h5, .article-body h6 { font-size: 22px; line-height: 1.4; }
.article-body a { text-decoration: underline; text-underline-offset: 4px; color: var(--blog-accent); }
.article-body ul { list-style: disc; padding-left: 24px; }
.article-body ol { list-style: decimal; padding-left: 24px; }
.article-body li + li { margin-top: 10px; }
.article-body strong { font-weight: 600; }
.article-body blockquote { margin-block: 36px; padding-block: 24px; border-block: 1px solid var(--blog-rule); font: italic 28px/1.5 var(--font-serif); }
.article-body blockquote cite { display: block; margin-top: 16px; font: 13px/1.5 var(--font-sans); }
.article-body img { height: auto; max-width: 100%; }
.article-body figure { max-width: 100%; }
.article-body figcaption { color: var(--blog-muted); font-size: 13px; line-height: 1.6; margin-top: 12px; }
.article-body .wp-block-table { overflow-x: auto; }
.article-body table { width: 100%; border-collapse: collapse; font-size: 15px; }
.article-body td, .article-body th { padding: 12px; border: 1px solid var(--blog-rule); text-align: left; }
.article-body pre { overflow-x: auto; padding: 20px; background: #eee9e2; font-size: 14px; }
.article-body .wp-block-button__link { color: white; background: var(--blog-ink); border-radius: 999px; padding: 12px 24px; font-size: 14px; text-decoration: none; }
.article-footer { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--blog-rule); }
.article-tags { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; }
.related-posts { padding-top: 72px; margin-top: 72px; border-top: 1px solid var(--blog-rule); }
.related-posts > h2 { font: 400 40px/1.2 var(--font-serif); margin-bottom: 36px; letter-spacing: -.02em; }
@media (max-width: 1023px) {
    .featured-post { gap: 32px; }
    .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .blog-categories { column-gap: 20px; }
}
@media (max-width: 767px) {
    .blog-intro { grid-template-columns: 1fr; gap: 18px; padding-block: 36px 32px; }
    .blog-intro__description { font-size: 16px; }
    .blog-categories { margin-bottom: 32px; }
    .featured-post { grid-template-columns: 1fr; gap: 28px; margin-bottom: 40px; padding-bottom: 40px; }
    .featured-post__image { aspect-ratio: 1.45; }
    .featured-post h2 { font-size: 36px; }
    .article-header { padding-top: 24px; }
    .article-back { margin-bottom: 24px; }
    .article-lead { font-size: 18px; }
    .article-body { font-size: 17px; line-height: 1.85; }
    .article-cover img { aspect-ratio: 1.45; }
    .related-posts { padding-top: 48px; margin-top: 48px; }
}
@media (max-width: 639px) {
    .post-grid { grid-template-columns: 1fr; gap: 40px; }
    .post-card__title { font-size: 29px; }
    .article-footer .nav-links { grid-template-columns: 1fr; }
    .article-footer .nav-next { grid-column: auto; }
}

.blog-main ::selection { background: #e4d9c9; color: #0a0a0a; }
/* Article index: masthead, topic column and a reading-led opening. */
.blog-index .blog-intro { display: flex; justify-content: space-between; align-items: baseline; gap: 48px; padding-block: 42px 36px; border-bottom: 0; }
.blog-index .blog-intro h1 { font-size: 48px; letter-spacing: -.025em; }
.blog-index .blog-intro__description { max-width: 50ch; font-size: 14px; line-height: 1.7; margin: 0; }
.blog-editorial { display: grid; grid-template-columns: 180px minmax(0,1fr); gap: 56px; padding-top: 40px; }
.blog-index .blog-categories { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; border: 0; padding: 0; margin: 0; align-self: start; }
.blog-index .blog-categories a { font-size: 13px; line-height: 1.6; padding-block: 5px; }
.blog-stories { min-width: 0; }
.blog-index .featured-post { display: flex; flex-direction: column; align-items: stretch; gap: 30px; padding-bottom: 48px; margin-bottom: 0; }
.blog-index .featured-post__content { order: 1; }
.blog-index .featured-post__image { order: 2; aspect-ratio: 2.15; }
.blog-index .featured-post h2 { font-size: clamp(36px,4.3vw,58px); line-height: 1.12; margin-block: 22px; max-width: 25ch; }
.blog-index .featured-post__content > p { max-width: 62ch; font-size: 16px; }
.blog-index .post-grid { display: block; }
.blog-index .post-card { display: grid; grid-template-columns: 150px minmax(0,1fr); column-gap: 32px; padding-block: 36px; border-bottom: 0; }
.blog-index .post-card .post-meta { grid-column: 1; grid-row: 1 / span 3; display: flex; flex-direction: column; align-items: start; gap: 8px; padding-top: 6px; }
.blog-index .post-card .post-meta > span[aria-hidden] { display: none; }
.blog-index .post-card__title { grid-column: 2; font-size: 31px; line-height: 1.25; margin: 0; }
.blog-index .post-card__excerpt { grid-column: 2; font-size: 14px; line-height: 1.8; margin-top: 14px; }
.blog-index .pagination { margin-top: 32px; border-top: 0; padding-top: 0; }
@media (max-width: 1023px) {
    .blog-editorial { grid-template-columns: 145px minmax(0,1fr); gap: 32px; }
    .blog-index .post-card { grid-template-columns: 1fr; gap: 0; }
    .blog-index .post-card .post-meta { grid-column: 1; grid-row: auto; flex-direction: row; gap: 6px 10px; margin-bottom: 14px; }
    .blog-index .post-card__title, .blog-index .post-card__excerpt { grid-column: 1; }
}
@media (max-width: 767px) {
    .blog-index .blog-intro { display: block; padding-block: 28px; }
    .blog-index .blog-intro h1 { font-size: 42px; margin-bottom: 16px; }
    .blog-editorial { display: block; padding-top: 0; }
    .blog-index .blog-categories { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; gap: 24px; border-bottom: 0; padding-block: 16px; margin-bottom: 28px; }
    .blog-index .blog-categories a { flex-shrink: 0; }
    .blog-index .featured-post { gap: 24px; padding-bottom: 32px; }
    .blog-index .featured-post h2 { font-size: 38px; margin-block: 16px; }
    .blog-index .featured-post__image { aspect-ratio: 1.65; }
    .blog-index .post-card { padding-block: 28px; }
    .blog-index .post-card__title { font-size: 28px; }
}
@media (max-width: 1023px) { .blog-index .post-card .post-meta > span[aria-hidden] { display: inline; } }

.article-link { border-bottom: 0; text-decoration: none; }
.article-link .text-link-label { text-decoration: underline; text-underline-offset: 3px; }
.article-link:hover { color: #555; }
.blog-index .post-card { grid-template-columns: 220px minmax(0,1fr); column-gap: 32px; align-content: start; }
.blog-index .post-card__image { grid-column: 1; grid-row: 1 / span 3; aspect-ratio: 4/3; margin: 0; }
.blog-index .post-card .post-meta { grid-column: 2; grid-row: 1; flex-direction: row; flex-wrap: wrap; padding: 0; margin: 0 0 12px; }
.blog-index .post-card__title { grid-column: 2; grid-row: 2; }
.blog-index .post-card__excerpt { grid-column: 2; grid-row: 3; }
@media (max-width: 1023px) { .blog-index .post-card { grid-template-columns: 160px minmax(0,1fr); gap: 0 24px; } }
@media (max-width: 767px) {
 .blog-index .post-card { grid-template-columns: 100px minmax(0,1fr); gap: 0 18px; }
 .blog-index .post-card .post-meta { grid-column: 1 / -1; grid-row: 1; margin-bottom: 16px; }
 .blog-index .post-card__title { grid-column: 2; grid-row: 2; font-size: 24px; align-self: center; }
 .blog-index .post-card__excerpt { grid-column: 1 / -1; grid-row: 3; margin-top: 18px; }
 .blog-index .post-card__image { grid-column: 1; grid-row: 2; align-self: start; }
}

/* A single native link opens the whole article; metadata links remain separate. */
.featured-post, .post-card { position: relative; }
.post-open::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.featured-post .post-meta a, .post-card .post-meta a { position: relative; z-index: 2; }
.post-open:focus-visible { outline: none; }
.post-open:focus-visible::after { outline: 2px solid currentColor; outline-offset: 8px; }
.featured-post:hover h2 a, .post-card:hover .post-open { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.blog-index .post-card__excerpt { max-width: none; }
.article-back { margin: 0 0 28px; padding: 0; color: var(--blog-ink); font-size: 11px; text-decoration: none; }
.article-footer { border: 0; padding-top: 0; }
.related-posts { border: 0; padding-top: 0; }
.article-tags { gap: 10px; }
.article-tags a { padding: 7px 13px; border-radius: 999px; background: #f1f1f1; color: #444; font-size: 12px; text-decoration: none; }
.article-tags a:hover { background: #e3e3e3; color: #111; }
