.doc-header { position: relative; overflow: hidden; background: var(--ink); color: #fff; padding-block: var(--space-8); border-bottom: 3px solid var(--brand-blue); }
.doc-header::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 85% -30%, rgba(51,64,255,.4), transparent 60%); }
.doc-header > .container { position: relative; z-index: 1; }
.doc-header h1 { color: #fff; margin: 0 0 var(--space-3); }
.doc-header__meta { color: rgba(255,255,255,.75); font-family: var(--font-display); font-size: .9rem; margin: 0; }
.crumbs { display: inline-flex; gap: .5ch; font-family: var(--font-display); font-size: .8rem; letter-spacing: .04em; color: #cdd2ff; margin: 0 0 var(--space-4); flex-wrap: wrap; }
.crumbs a { color: #cdd2ff; }
.crumbs a:hover { color: #fff; }
.crumbs span[aria-current] { color: #fff; }
.doc-header .eyebrow { background: rgba(255,255,255,.12); color: #fff; }