.kgb-page-header { position: relative; background: var(--black); color: var(--white); overflow: hidden; }
.kgb-page-header__bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, #14171A 0%, #1E2328 60%, #1F6D95 160%);
}
.kgb-page-header__inner { position: relative; padding: 5.1552vw var(--gutter) 4.2179vw; }


.kgb-page-header--no-overline .kgb-page-header__inner { padding-top: 6.7955vw; }
.kgb-page-header--has-tags .kgb-page-header__inner { padding-bottom: 2.3433vw; }
.kgb-page-header__desc {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.72);
  margin-top: var(--space-4);
  max-width: 37.4927vw;
}

.kgb-page-header__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-8);
}
.kgb-page-header__tag {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-body);
  font-size: var(--fs-overline);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.2929vw var(--space-3);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.85);
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}
.kgb-page-header__tag:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--text-on-accent);
}

@media (max-width: 1024px) {
  .kgb-page-header__inner {
    padding: clamp(56px, calc(37.5100px + 4.9307vw), 88px) var(--gutter) clamp(48px, calc(34.1325px + 3.6980vw), 72px);
  }
  .kgb-page-header--no-overline .kgb-page-header__inner {
    padding-top: clamp(80px, calc(59.1988px + 5.5470vw), 116px);
  }
  .kgb-page-header--has-tags .kgb-page-header__inner {
    padding-bottom: clamp(24px, calc(14.7550px + 2.4653vw), 40px);
  }
  .kgb-page-header__desc { max-width: 640px; }
  .kgb-page-header__tag { padding: 5px var(--space-3); }
}
