/* Page header: compact dark band with breadcrumb, kicker, H1 and the logo's arc. */
.ex.pagehead { position: relative; overflow: hidden; padding: calc(var(--ex-hdr) + clamp(40px, 5vw, 72px)) 0 clamp(40px, 5vw, 64px); background: var(--ex-ink); color: var(--ex-text); }
.ex.pagehead::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--ex-arc); }
.ex.pagehead .pagehead-arc { position: absolute; right: -6%; top: 10%; width: min(780px, 70%); height: auto; opacity: .5; pointer-events: none; }
.ex.pagehead .pagehead-in { position: relative; }
.ex.pagehead .pagehead-crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 22px; font-size: 13.5px; color: var(--ex-text-dim); }
.ex.pagehead .pagehead-crumbs li + li::before { content: "/"; margin-right: 6px; opacity: .5; }
.ex.pagehead .pagehead-crumbs a { color: var(--ex-text); }
.ex.pagehead .pagehead-crumbs a:hover { color: var(--ex-green); }
.ex.pagehead .pagehead-kicker { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px; font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ex-green); }
.ex.pagehead .pagehead-kicker::before { content: ""; width: 34px; height: 3px; background: var(--ex-arc); transform: skewX(-24deg); }
.ex.pagehead .pagehead-h { max-width: 18ch; font-size: clamp(36px, 5vw, 72px); line-height: .94; font-weight: 880; font-stretch: 122%; font-style: italic; letter-spacing: -.02em; text-transform: uppercase; color: #fff; }
.ex.pagehead .lead { margin-top: 18px; }
.ex.pagehead .pagehead-acts { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }

@media (max-width: 640px) {
	.ex.pagehead { padding-top: calc(var(--ex-hdr) + 28px); }
	.ex.pagehead .pagehead-arc { width: 120%; right: -40%; opacity: .35; }
	.ex.pagehead .pagehead-h { font-size: clamp(32px, 10vw, 44px); }
	.ex.pagehead .pagehead-acts .btn { flex: 1 1 100%; }
}