.bb-hero { position: relative; overflow: hidden; background: #fff; min-height: 640px; }
.bb-hero-in { position: relative; z-index: 1; padding: 112px 0 96px; }
.bb-copy { max-width: 820px; }
.bb-trail { margin: 0 0 22px; font-size: 22px; color: var(--c-red); }
.bb-trail a { color: var(--c-red); }
.bb-title span { white-space: nowrap; }
.bb-title { display: flex; flex-direction: column; margin: 0; font-size: 88px; line-height: 1.12; font-weight: 800; letter-spacing: -.025em; color: #0b2a6f; }
.bb-lead { margin: 30px 0 0; max-width: 34ch; font-size: 23px; line-height: 1.65; color: #23262d; }
.bb-cta { margin-top: 42px; height: 72px; padding: 0 30px; border-radius: 2px; font-size: 23px; font-weight: 600; gap: 18px; }
.bb-cta svg { width: 28px; height: 28px; }
.bb-art { position: absolute; right: 0; bottom: 0; width: 470px; height: auto; }

.bb-strip { background: #eef2f8; padding: 50px 0; }
.bb-feats { display: grid; grid-template-columns: repeat(3, 1fr); }
.bb-feat { display: flex; align-items: center; gap: 22px; padding: 6px 24px; }
.bb-feat:first-child { padding-left: 0; }
.bb-feat + .bb-feat { border-left: 1px solid #cfd6e3; }
.bb-feat .cp-ico { width: 88px; height: 88px; background: #0b2f86; }
.bb-feat h3 { margin: 0 0 8px; font-size: 22px; font-weight: 700; color: #0b1a3c; }
.bb-feat p { margin: 0; font-size: 17px; line-height: 1.6; color: #23262d; }

@media (max-width: 1100px) {
    .bb-art { width: 340px; opacity: .25; }
    .bb-title { font-size: 64px; }
}
@media (max-width: 800px) {
    .bb-feats { grid-template-columns: 1fr; gap: 20px; }
    .bb-feat + .bb-feat { border-left: 0; }
    .bb-feat { padding: 0; }
}