.sbc-blog-wrap { --sbc-accent: #0170b9; --sbc-ink: #12202b; }

.sbc-blog-featured { display: grid; grid-template-columns: 1.1fr 1fr; align-items: stretch; gap: 0; background: #fff; border-radius: 22px; overflow: hidden; box-shadow: 0 24px 60px -20px rgba(1,32,60,.25); margin-bottom: 36px; }
.sbc-blog-featured-media { position: relative; display: block; overflow: hidden; min-height: 320px; }
.sbc-blog-featured-media .sbc-blog-img, .sbc-blog-featured-media .sbc-blog-img-placeholder { width: 100%; height: 100%; object-fit: cover; display: block; background: #ddd; transition: transform .7s cubic-bezier(.22,1,.36,1); }
.sbc-blog-featured:hover .sbc-blog-img, .sbc-blog-featured:hover .sbc-blog-img-placeholder { transform: scale(1.08); }
.sbc-blog-featured-content { padding: 44px 46px; display: flex; flex-direction: column; justify-content: center; }
.sbc-blog-eyebrow { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--sbc-accent); margin-bottom: 14px; }
.sbc-blog-featured-title { margin: 0 0 16px; font-size: 30px; font-weight: 800; line-height: 1.25; letter-spacing: -.01em; color: var(--sbc-ink); }
.sbc-blog-featured-title a { color: inherit; text-decoration: none; background-image: linear-gradient(var(--sbc-accent), var(--sbc-accent)); background-position: 0 100%; background-repeat: no-repeat; background-size: 0% 2px; transition: background-size .35s ease; }
.sbc-blog-featured-title a:hover { background-size: 100% 2px; }
.sbc-blog-featured-content .sbc-blog-excerpt { font-size: 16px; line-height: 1.75; }

.sbc-blog-category { display: inline-flex; align-items: center; background: linear-gradient(135deg, var(--sbc-accent), #024a80); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 7px 15px; border-radius: 30px; box-shadow: 0 8px 16px -4px rgba(1,112,185,.5); }
.sbc-blog-featured-content .sbc-blog-category { position: static; margin-bottom: 18px; width: fit-content; }

.sbc-blog-excerpt { margin: 0 0 22px; font-size: 14.5px; line-height: 1.7; color: #667380; }

.sbc-blog-meta { display: flex; align-items: center; gap: 12px; }
.sbc-blog-avatar { border-radius: 50%; width: 36px; height: 36px; box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(1,112,185,.25); }
.sbc-blog-meta-text { display: flex; flex-direction: column; line-height: 1.35; }
.sbc-blog-author { font-size: 13.5px; font-weight: 700; color: var(--sbc-ink); }
.sbc-blog-meta-sub { font-size: 12.5px; color: #93a0ab; }
.sbc-blog-dot { margin: 0 4px; }

.sbc-blog-readmore-btn { margin-top: 26px; display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; background: var(--sbc-ink); color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; padding: 14px 26px; border-radius: 50px; transition: background .3s ease, transform .3s ease, box-shadow .3s ease; }
.sbc-blog-readmore-btn:hover { background: var(--sbc-accent); transform: translateY(-2px); box-shadow: 0 14px 26px -8px rgba(1,112,185,.55); }
.sbc-blog-readmore-btn svg { width: 15px; height: 15px; fill: currentColor; transition: transform .3s ease; }
.sbc-blog-readmore-btn:hover svg { transform: translateX(4px); }

.sbc-blog-grid { display: grid; grid-template-columns: repeat(var(--sbc-blog-cols, 3), 1fr); gap: 30px; }
.sbc-blog-card { position: relative; background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 14px 34px -16px rgba(1,32,60,.2); border: 1px solid rgba(1,32,60,.05); transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s ease; }
.sbc-blog-card:hover { transform: translateY(-8px); box-shadow: 0 26px 46px -18px rgba(1,112,185,.35); }
.sbc-blog-media { position: relative; display: block; overflow: hidden; height: 210px; }
.sbc-blog-media .sbc-blog-img, .sbc-blog-media .sbc-blog-img-placeholder { width: 100%; height: 100%; object-fit: cover; display: block; background: #ddd; transition: transform .7s cubic-bezier(.22,1,.36,1); }
.sbc-blog-card:hover .sbc-blog-media .sbc-blog-img, .sbc-blog-card:hover .sbc-blog-media .sbc-blog-img-placeholder { transform: scale(1.12); }
.sbc-blog-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(1,32,60,.55), rgba(1,32,60,0) 60%); opacity: 0; transition: opacity .4s ease; }
.sbc-blog-card:hover .sbc-blog-media::after { opacity: 1; }
.sbc-blog-media .sbc-blog-category { position: absolute; top: 16px; left: 16px; z-index: 2; }
.sbc-blog-content { padding: 24px 24px 22px; }
.sbc-blog-title { margin: 0 0 10px; font-size: 18.5px; font-weight: 700; line-height: 1.4; letter-spacing: -.01em; color: var(--sbc-ink); }
.sbc-blog-title a { color: inherit; text-decoration: none; transition: color .25s ease; }
.sbc-blog-card:hover .sbc-blog-title a { color: var(--sbc-accent); }
.sbc-blog-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; padding-top: 18px; border-top: 1px solid #eef1f4; }
.sbc-blog-readmore { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; flex: none; border-radius: 50%; background: #f2f6fa; color: var(--sbc-accent); transition: background .3s ease, color .3s ease, transform .3s ease; }
.sbc-blog-readmore svg { width: 15px; height: 15px; fill: currentColor; }
.sbc-blog-readmore:hover { background: var(--sbc-accent); color: #fff; transform: rotate(-45deg); }

@media (max-width: 991px) { .sbc-blog-grid { grid-template-columns: repeat(2, 1fr); } .sbc-blog-featured { grid-template-columns: 1fr; } .sbc-blog-featured-media { min-height: 260px; } .sbc-blog-featured-content { padding: 34px 30px; } }
@media (max-width: 600px) { .sbc-blog-grid { grid-template-columns: 1fr; } .sbc-blog-featured-title { font-size: 24px; } }