.blog-container{max-width:1440px;margin:0 auto;padding:160px var(--space-margin-desktop) 96px;min-height:55vh}
.blog-header{max-width:800px;padding-bottom:48px}
.blog-header__title{font-size:clamp(40px,5vw,72px);font-weight:800;line-height:1.1;color:var(--color-primary);margin:0 0 28px;letter-spacing:-.02em}
.blog-header__intro{font-size:18px;line-height:1.6;color:var(--color-on-surface-variant);margin:0}
.blog-empty{padding:48px 0 64px;border-top:1px solid var(--color-outline-variant);color:var(--color-on-surface-variant)}
.blog-empty p{font-size:20px;margin:0}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px;border-top:1px solid var(--color-outline-variant);padding-top:48px}
.blog-card{min-width:0}.blog-card__link{display:block;color:var(--color-primary);text-decoration:none}
.blog-card__image{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;margin-bottom:24px}
.blog-card__date{display:block;font-family:var(--font-mono);font-size:12px;color:var(--color-secondary);margin:16px 0}
.blog-card h2{font-size:24px;line-height:1.3;margin:0 0 16px;overflow-wrap:anywhere}
.blog-card p{line-height:1.6;color:var(--color-on-surface-variant)}
.blog-card__link:focus-visible{outline:2px solid var(--color-secondary);outline-offset:6px}
.blog-pagination{display:flex;justify-content:center;gap:16px;padding-top:48px}
@media(max-width:1024px){.blog-container{padding:128px var(--space-margin-tablet) 64px}.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.blog-container{padding:112px var(--space-margin-mobile) 64px}.blog-header{padding-bottom:32px}.blog-header__intro{font-size:16px}.blog-grid{grid-template-columns:minmax(0,1fr)}.blog-empty{padding:32px 0 48px}}