.blog-index { padding-bottom: 72px; }
.blog-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 520px); align-items: end; gap: 40px; padding: 42px 0 34px; border-bottom: 2px solid #151914; }
.blog-heading .micro { grid-column: 1 / -1; margin: 0; }
.blog-heading h1 { margin: 0; font-size: clamp(72px, 10vw, 156px); line-height: .8; letter-spacing: -.075em; }
.blog-heading > p:last-child { margin: 0; color: #586053; font-size: clamp(18px, 1.6vw, 24px); line-height: 1.5; }
.blog-feature { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr); min-height: 570px; margin-top: 34px; border: 1px solid #cfd6c4; border-radius: 5px; overflow: hidden; background: #edf1e4; }
.blog-feature-media { min-height: 570px; overflow: hidden; }
.blog-feature-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.blog-feature-media:hover img { transform: scale(1.025); }
.blog-feature-copy { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: clamp(32px, 5vw, 76px); }
.blog-feature-copy h2 { max-width: 620px; margin: 18px 0; font-size: clamp(44px, 5vw, 78px); line-height: .96; letter-spacing: -.06em; }
.blog-feature-copy h2 a:hover { text-decoration: underline; text-decoration-thickness: 4px; text-underline-offset: 8px; }
.blog-feature-copy > p:not(.micro) { max-width: 590px; margin: 0; color: #4f594b; font-size: 18px; line-height: 1.6; }
.blog-feature-meta { display: flex; gap: 8px 22px; flex-wrap: wrap; width: 100%; margin: 30px 0 24px; padding-top: 17px; border-top: 1px solid #c3ccb7; font-size: 13px; font-weight: 750; }
.blog-feature .solid-button, .blog-guide-link .solid-button { border-radius: 5px; }
.blog-more { margin-top: 76px; }
.blog-more .section-head { align-items: end; }
.blog-more .section-head h2 { margin-top: 8px; font-size: clamp(40px, 5vw, 70px); line-height: .98; letter-spacing: -.055em; }
.blog-more .section-head > span { color: #65705e; font-size: 13px; font-weight: 700; }
.blog-more .story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 1000px; }
.blog-guide-link { display: flex; justify-content: space-between; align-items: center; gap: 42px; margin-top: 76px; padding: clamp(30px, 5vw, 60px); border: 1px solid #151914; border-radius: 5px; background: #ceff2f; }
.blog-guide-link div { max-width: 720px; }
.blog-guide-link h2 { margin: 8px 0 12px; font-size: clamp(38px, 5vw, 66px); line-height: .98; letter-spacing: -.055em; }
.blog-guide-link p { margin: 0; font-size: 18px; line-height: 1.55; }
.blog-guide-link .solid-button { flex: 0 0 auto; background: #151914; color: #fff; }

@media (max-width: 900px) {
  .blog-heading { grid-template-columns: 1fr; gap: 22px; }
  .blog-heading .micro { grid-column: auto; }
  .blog-feature { grid-template-columns: 1fr; }
  .blog-feature-media { min-height: min(68vw, 540px); }
  .blog-feature-copy { padding: 34px 28px 40px; }
}

@media (max-width: 620px) {
  .blog-index { padding-bottom: 40px; }
  .blog-heading { padding: 22px 0 26px; }
  .blog-heading h1 { font-size: 72px; }
  .blog-feature { min-height: 0; margin-top: 24px; }
  .blog-feature-media { min-height: 72vw; }
  .blog-feature-copy { padding: 28px 20px 32px; }
  .blog-feature-copy h2 { font-size: 45px; }
  .blog-more { margin-top: 52px; }
  .blog-more .story-grid { grid-template-columns: 1fr; }
  .blog-guide-link { align-items: flex-start; flex-direction: column; margin-top: 52px; padding: 28px 20px; }
  .blog-guide-link .solid-button { width: 100%; justify-content: center; }
}
