/* Article typography and archive, scoped to the posts templates. */
.codepty-posts { --posts-blue: #005293; --posts-red: #d30831; }
.codepty-posts .site-navigation { flex-wrap: wrap; }
.codepty-posts a:focus-visible { outline: 3px solid var(--posts-blue); outline-offset: 5px; }
.posts-archive { width: min(100% - 2.5rem, 1180px); padding-block: clamp(2.5rem, 6vw, 5rem); min-height: 55vh; }
.posts-heading { max-width: 48rem; margin-bottom: 3rem; }
.posts-heading h1 { margin: .35rem 0 1rem; color: var(--posts-blue); }
.posts-intro { font-size: 1.25rem; line-height: 1.6; color: var(--muted); }
.posts-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; align-items: start; }
.post-card { overflow: hidden; border: 1px solid #dce6ef; border-radius: 20px; background: white; box-shadow: 0 8px 30px #00529308; }
.post-card-image { display: block; background: #fff; border-bottom: 1px solid #edf1f5; }
.post-card-image img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: contain; }
.post-card-copy { padding: clamp(1.25rem, 3vw, 2rem); }
.post-category { color: var(--posts-blue); font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.post-card h2 { margin: .7rem 0 1rem; font-size: clamp(1.65rem, 3vw, 2.15rem); line-height: 1.18; }
.post-card h2 a { color: var(--dark); text-decoration: none; }
.post-card h2 a:hover { color: var(--posts-blue); }
.post-card-copy > p:not(.post-category) { color: var(--muted); font-size: 1.05rem; line-height: 1.7; }
.post-read-more { display: inline-block; margin-top: .75rem; color: var(--posts-blue); font-weight: 750; text-underline-offset: 5px; }
.post-read-more span[aria-hidden] { color: var(--posts-red); padding-left: .4rem; }
.post-draft { display: inline-block; padding: .3rem .65rem; border-radius: 6px; background: #fff4dc; color: #694900; font-size: .8rem; }
.posts-pagination, .posts-load-status { margin-top: 2rem; text-align: center; }
.posts-pagination[hidden] { display: none; }
.posts-sentinel { height: 1px; }
.posts-empty { padding-block: 3rem; }
.post-hero { padding: clamp(1.5rem, 4vw, 3rem) 1.25rem; background: linear-gradient(135deg, #edf5ff, #fff 75%); }
.post-hero-inner { max-width: 1180px; }
.post-back { display: inline-block; margin-bottom: 1.5rem; font-size: .95rem; color: var(--muted); text-decoration: none; }
.post-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; align-items: stretch; }
.post-heading { min-width: 0; padding: clamp(1.4rem, 3vw, 2.5rem); }
.post-heading h1 { max-width: 19ch; margin: .8rem 0 1.5rem; font-size: clamp(2.25rem, 4.2vw, 3.8rem); line-height: 1.08; letter-spacing: -.04em; color: var(--posts-blue); text-wrap: balance; }
.post-heading .post-subtitle { margin-bottom: 0; font-size: clamp(1.1rem, 1.6vw, 1.3rem); line-height: 1.65; }
.post-hero-contact { min-width: 0; padding: clamp(1.25rem, 3vw, 2rem); scroll-margin-top: 9rem; }
@media (min-width: 900px) {
    .post-hero-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
}
.post-body { width: min(100% - 2.5rem, 1180px); margin: 0 auto; padding-block: clamp(2rem, 4vw, 3rem) 2rem; font-size: 1.125rem; line-height: 1.85; overflow-wrap: break-word; }
.post-body > p { margin: 0 0 1.35rem; }
.post-body > p:first-child { font-size: 1.35rem; line-height: 1.65; color: #425774; }
.post-body h2 { margin: 3rem 0 1rem; font-size: clamp(1.7rem, 3vw, 2.25rem); line-height: 1.2; letter-spacing: -.025em; color: var(--posts-blue); }
.post-body h3 { margin: 2rem 0 .75rem; font-size: 1.35rem; color: var(--dark); }
.post-body ul { padding-left: 1.4rem; margin-bottom: 1.5rem; }
.post-body li { margin-bottom: .35rem; }
.post-body li::marker { color: var(--posts-red); }
.post-body a { color: var(--posts-blue); text-decoration: underline; text-underline-offset: 3px; }
.post-body figure { margin: 2.5rem 0; }
.post-body figure img { display: block; width: 100%; height: auto; border-radius: 14px; }
.post-body .post-main-image { width: min(100vw - 2.5rem, 1000px); margin-left: 50%; transform: translateX(-50%); border: 1px solid #edf1f5; border-radius: 14px; }
.post-body .post-secondary-image { max-width: 620px; margin-inline: auto; }
.post-contact-return { padding: 0 1.25rem 3.5rem; text-align: center; }
@media (max-width: 650px) {
    .posts-grid { grid-template-columns: minmax(0, 1fr); }
    .post-back { margin-bottom: 1.5rem; }
    .post-body { font-size: 1.0625rem; line-height: 1.75; }
    .post-body > p:first-child { font-size: 1.2rem; }
    .post-body h2 { margin-top: 2.3rem; }
}

.post-subtitle > p { margin: 0 0 1em; }
.post-subtitle > p:last-child { margin-bottom: 0; }

.post-hero-grid.post-hero-grid--no-contact { grid-template-columns: minmax(0, 1fr); }

.post-heading .post-heading-image { margin: 1.5rem 0 0; width: 100%; }
.post-heading-image img { display: block; width: 100%; height: auto; border-radius: 12px; }
