:root {
  --kb-ink: #172033;
  --kb-muted: #667085;
  --kb-line: rgba(23, 32, 51, 0.1);
  --kb-surface: #ffffff;
  --kb-soft: #f5f7fb;
  --kb-primary: #3949ab;
}

[data-md-color-scheme="slate"] {
  --kb-ink: #f4f6fb;
  --kb-muted: #aeb8cc;
  --kb-line: rgba(255, 255, 255, 0.12);
  --kb-surface: #1b2233;
  --kb-soft: #222b3e;
  --kb-primary: #9da9ff;
}

.md-header {
  background: linear-gradient(115deg, #303f9f 0%, #5668d8 100%);
}

.md-tabs { background: rgba(34, 48, 130, 0.86); }

.md-main__inner { max-width: 1380px; }
.md-content { max-width: 980px; }
.md-content h1 { font-size: 2.5rem; letter-spacing: -0.035em; }
.md-content h2 { margin-top: 2.6rem; letter-spacing: -0.02em; }

.kb-hero {
  position: relative;
  overflow: hidden;
  margin: 0 0 2.2rem;
  padding: 2.8rem 3rem 2.7rem;
  border: 1px solid var(--kb-line);
  border-radius: 24px;
  background: radial-gradient(circle at 90% 5%, rgba(139, 157, 255, .32), transparent 35%), linear-gradient(135deg, var(--kb-soft), var(--kb-surface));
  box-shadow: 0 18px 45px rgba(35, 48, 95, .1);
}

.kb-hero h1 { max-width: 680px; margin: .55rem 0 1rem; color: var(--kb-ink); font-size: clamp(2.25rem, 5vw, 4.2rem); line-height: 1.05; }
.kb-hero p { max-width: 650px; color: var(--kb-muted); font-size: 1.08rem; }
.kb-kicker, .kb-meta { color: var(--kb-primary); font-size: .72rem; font-weight: 800; letter-spacing: .14em; }
.kb-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.5rem; }

.kb-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.kb-card { min-height: 160px; padding: 1.35rem 1.45rem 1.15rem; border: 1px solid var(--kb-line); border-radius: 17px; background: var(--kb-surface); box-shadow: 0 8px 25px rgba(35, 48, 95, .06); transition: transform .18s ease, box-shadow .18s ease; }
.kb-card:hover { transform: translateY(-3px); box-shadow: 0 15px 32px rgba(35, 48, 95, .13); }
.kb-card h3 { margin: 0 0 .55rem; font-size: 1.16rem; }
.kb-card h3 a { color: var(--kb-ink); }
.kb-card p { margin-bottom: 1rem; color: var(--kb-muted); font-size: .92rem; }
.kb-card--blue { border-top: 4px solid #4f63d8; }
.kb-card--amber { border-top: 4px solid #e0a12f; }
.kb-card--rose { border-top: 4px solid #d46a87; }
.kb-card--violet { border-top: 4px solid #9068d6; }
.kb-card--green { border-top: 4px solid #3eaa83; }
.kb-meta { display: block; opacity: .8; font-size: .64rem; }
.kb-strip { margin: .8rem 0 1.6rem; padding: 1rem 1.2rem; border: 1px solid var(--kb-line); border-radius: 13px; background: var(--kb-soft); font-size: .9rem; line-height: 2; }
.kb-footer-note { color: var(--kb-muted); font-size: .78rem; text-align: center; }

@media (max-width: 700px) {
  .kb-hero { padding: 2rem 1.35rem; border-radius: 18px; }
  .kb-grid { grid-template-columns: 1fr; }
  .md-content h1 { font-size: 2rem; }
}