.blog-band { background: #17191c; color: #fff; padding: clamp(34px, 6vw, 64px) 0; }
.blog-band h1 { font: 650 clamp(1.85rem, 4vw, 2.75rem)/1.15 Arial, sans-serif; margin: 0 0 12px; }
.blog-band p { color: #d6e0ee; margin: 0; }
.blog-band a { display: inline-block; margin-bottom: 18px; color: #ffd362; }
.blog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; padding-block: clamp(30px, 6vw, 64px); }
.blog-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid #2b313a; border-radius: 12px; background: #141922; color: #fff; text-decoration: none; }
.blog-card:hover, .blog-card:focus-visible { border-color: #c18b26; outline-offset: 4px; }
.blog-card-top { position: relative; isolation: isolate; display: grid; place-items: center; min-height: 160px; overflow: hidden; background: linear-gradient(120deg, #22252b, #1d2026 58%, #292418); }
.blog-card-top::before, .blog-card-top::after { content: ""; position: absolute; width: 210px; height: 84px; right: -42px; border: 1px solid #c18b266b; border-radius: 28px; transform: rotate(-41deg); pointer-events: none; }
.blog-card-top::before { top: 4px; }
.blog-card-top::after { top: 93px; border-color: #ffffff30; }
.blog-number { font: 750 clamp(3.5rem, 7vw, 5rem)/1 Arial, sans-serif; color: #ffffff25; }
.blog-category { position: absolute; z-index: 1; bottom: 16px; left: 16px; background: #ffd362; color: #18191c; padding: 5px 9px; border-radius: 5px; font-size: .72rem; font-weight: 700; }
.blog-arrow { position: absolute; top: 14px; right: 16px; color: #ffd362; }
.blog-card-body { padding: 22px; flex: 1; display: flex; flex-direction: column; }
.blog-card-body h2 { font: 700 1.25rem/1.28 Arial, sans-serif; margin: 0 0 10px; }
.blog-card-body p { color: #d5dfed; margin: 0 0 16px; }
.blog-card-body > span { color: #ffd362; font-size: .86rem; font-weight: 700; margin-top: auto; }
.blog-article { max-width: 790px; padding-block: clamp(32px, 6vw, 64px); }
.blog-article section { margin-bottom: 28px; }
.blog-article h2 { font: 700 1.28rem/1.3 Arial, sans-serif; margin-bottom: 8px; }
.blog-article p { margin: 0; line-height: 1.75; }
@media (max-width: 660px) { .blog-grid { grid-template-columns: minmax(0, 1fr); } }