.blog-hero{padding-block:clamp(1.5rem,4vh,3rem) 0;border-top:1px solid var(--line)}
.blog-hero .crumbs{margin-bottom:clamp(1.5rem,4vh,2.5rem)}
.blog-hero__row{align-items:end}
.blog-hero__copy{--col:1/span 7}
.blog-hero h1{font-size:clamp(3rem,9vw,7.5rem);font-weight:700;font-stretch:118%;line-height:.9;letter-spacing:-.04em}
.blog-hero .lede{margin-top:1.5rem}
.blog-search{--col:8/-1}
.blog-search label{display:block;margin-bottom:.5rem;font-size:.9375rem;font-weight:600}
.blog-search__row{display:flex;gap:.5rem}
.blog-search input{flex:1;min-width:0;min-height:3.25rem;padding:.7rem 1rem;border:1.5px solid #7A8199;border-radius:4px;background:#fff}
.blog-search input:hover{border-color:var(--slate)}
.cats{margin-top:clamp(2rem,5vw,3rem);border-bottom:1px solid var(--line)}
.cats ul{display:flex;gap:.25rem 1.75rem;overflow-x:auto;scrollbar-width:none}
.cats a{display:block;padding-block:1rem;border-bottom:3px solid transparent;font-weight:600;white-space:nowrap;color:var(--slate);text-decoration:none;transition:color .2s,border-color .2s}
.cats a:hover{color:var(--navy)}
.cats a:focus-visible{outline-offset:-3px}
.cats [aria-current]{border-color:var(--blue);color:var(--navy)}

.posts .b-mist{fill:#fff}
.b-navy{fill:var(--navy)}.b-blue{fill:var(--blue)}.b-mist{fill:var(--mist)}.b-amber{fill:var(--amber)}.b-w{fill:#fff}
.b-ring-w{fill:none;stroke:#fff;stroke-opacity:.5;stroke-width:3}

.fpost{align-items:center}
.fpost__img{--col:1/span 7;display:block;border-radius:4px;overflow:hidden}
.fpost__img figure{margin:0;aspect-ratio:600/380;transition:transform .4s}
.fpost__img:hover figure{transform:scale(1.02)}
.fpost__img svg,.post__img svg,.fpost__img img,.post__img img{display:block;width:100%;height:100%;object-fit:cover}
.fpost__body{--col:9/-1}
.fpost h3{margin-top:.75rem;font-size:clamp(1.75rem,3vw,2.5rem);font-weight:650;font-stretch:112%;line-height:1.1;letter-spacing:-.02em}
.fpost h3 a{text-decoration:none}
.fpost h3 a:hover{color:var(--blue);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.15em}
.fpost__ex{margin-top:1rem;color:var(--fg-muted)}
.post__cat{font-size:.8125rem;font-weight:600;color:var(--blue)}
.post__meta{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;margin-top:1.25rem;font-size:.875rem;color:var(--slate)}
.post__meta .ph{color:var(--slate)}

.posts-title{max-width:none;margin-bottom:2rem;font-size:clamp(1.75rem,3vw,2.25rem)}
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3rem var(--gutter)}
.post a{display:flex;flex-direction:column;height:100%;text-decoration:none}
.post__img{margin:0;aspect-ratio:600/380;border-radius:4px;overflow:hidden}
.post__img>*{transition:transform .4s}
.post a:hover .post__img>*{transform:scale(1.04)}
.post .post__cat{margin-top:1.25rem}
.post h3{margin-top:.5rem;font-size:1.3125rem;line-height:1.3;transition:color .2s}
.post a:hover h3{color:var(--blue)}
.post__ex{margin-top:.6rem;font-size:.9375rem;color:var(--fg-muted)}
.post .post__meta{margin-top:auto;padding-top:1rem}
.pager{margin-top:clamp(3rem,6vw,4rem)}
.pager ul{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.pager a,.pager span{display:grid;place-items:center;min-width:2.75rem;height:2.75rem;padding-inline:.9rem;border:1.5px solid var(--line);border-radius:4px;background:#fff;font-weight:600;text-decoration:none;transition:border-color .2s}
.pager a:hover{border-color:var(--navy)}
.pager [aria-current],.pager .current{border-color:var(--navy);background:var(--navy);color:#fff}
.pager__next{margin-left:.5rem}

.two-way{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter)}
.two-way>div{display:flex;flex-direction:column;align-items:flex-start;padding:clamp(1.75rem,3.5vw,3rem);border:1px solid var(--rule);border-radius:4px}
.two-way h3{font-size:clamp(1.75rem,3vw,2.5rem);font-weight:650;font-stretch:115%;line-height:1.05;letter-spacing:-.02em}
.two-way p{margin-top:1rem;max-width:42ch;color:var(--fg-muted)}
.two-way .btn{margin-top:2rem}
.pager .dots{border:0;background:none}
.posts-section .lede a{color:var(--blue)}

@media (max-width:59.99rem){
  .posts{grid-template-columns:1fr 1fr}
  .two-way{grid-template-columns:1fr}
}
@media (max-width:47.99rem){
  .posts{grid-template-columns:1fr}
  .cats{margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter)}
}