.blog-page { font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; }
.blog-hero { padding: 34px 0 68px; background: #101315; color: #f6f6f2; }
.blog-hero .breadcrumbs { display: flex; gap: 12px; margin-bottom: 44px; color: #b4bac0; font-size: 14px; }
.blog-hero .section-label { color: #e0c48d; }
.blog-hero h1 { font-size: clamp(48px, 6vw, 80px); letter-spacing: -.04em; margin-bottom: 22px; }
.blog-hero p:last-child { color: #b4bac0; max-width: 700px; font-size: 21px; margin: 0; }
.blog-posts { padding: 56px 0 88px; background: #f7f8f9; }
.blog-posts h2 { font-size: 28px; margin-bottom: 28px; }
.blog-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); background: white; border: 1px solid #e0e4e7; border-radius: 16px; overflow: hidden; }
.blog-card-image { display: flex; align-items: center; padding: 24px; background: #fff; }
.blog-card-image img { width: 100%; height: 310px; object-fit: contain; }
.blog-card-copy { padding: 38px; align-self: center; }
.blog-card-meta { color: #72551f; font-size: 12px; letter-spacing: .06em; }
.blog-card-meta span { margin: 0 8px; }
.blog-card h3 { font-size: clamp(25px, 2.4vw, 34px); line-height: 1.25; letter-spacing: -.02em; }
.blog-card-copy > p:not(.blog-card-meta) { color: #606b75; }
.blog-card h3 a:hover { color: #72551f; }
.blog-page a:focus-visible { outline: 3px solid #9c742f; outline-offset: 5px; }
@media (max-width: 700px) {
  .blog-hero { padding-bottom: 40px; }
  .blog-hero p:last-child { font-size: 18px; }
  .blog-card { grid-template-columns: 1fr; }
  .blog-card-copy { padding: 24px; }
  .blog-card-image img { height: 240px; }
  .blog-posts { padding-block: 36px 52px; }
}