/* Page banner: photo under a dark sheet with a soft left fade (plain forest band without a photo) — subtitle line,
 * optional gold tag, H1, intro, optional actions (gold CTA + call link). Content sits low in the banner. */
.ocf-page-header {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: var(--ocf-page-header-height);
    padding-top: calc(var(--ocf-page-header-pad) + var(--ocf-grid-gap));
    padding-bottom: calc(var(--ocf-page-header-pad) * 0.75);
    background: var(--dakota-band);
    color: var(--ocf-heading-alt);
}

.ocf-page-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: var(--page-header-image);
    background-size: cover;
    background-position: center 45%;
}

.ocf-page-header::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--dakota-overlay-color) 45%, transparent) 0%, transparent 70%),
        color-mix(in srgb, var(--dakota-overlay-color) 58%, transparent);
}

.ocf-page-header__inner { position: relative; z-index: 1; }
.ocf-page-header__content { max-width: 860px; }

.ocf-page-header__headline { color: inherit; white-space: pre-line; }

.ocf-page-header__eyebrow {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
    color: color-mix(in srgb, var(--ocf-heading-alt) 82%, transparent);
    font-size: var(--ocf-font-small-size);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--dakota-eyebrow-tracking);
    text-transform: uppercase;
}

.ocf-page-header__eyebrow a:hover { color: var(--ocf-secondary); }

.ocf-page-header__tag { color: var(--ocf-secondary); margin-bottom: 16px; }

.ocf-page-header__subtitle {
    max-width: 640px;
    margin-top: 18px;
    color: color-mix(in srgb, var(--ocf-heading-alt) 90%, transparent);
    font-size: calc(var(--font-body-size) * 1.03);
}

.ocf-page-header__actions { margin-top: calc(var(--ocf-grid-gap) * 1.333); gap: calc(var(--ocf-grid-gap) * 1.167); }

.ocf-page-header__editor-image,
.ocf-page-header__divider { display: none; }

@media (max-width: 767px) {
    .ocf-page-header {
        min-height: 0;
        padding-top: calc(var(--ocf-page-header-pad-mobile) + var(--ocf-grid-gap));
        padding-bottom: var(--ocf-page-header-pad-mobile);
    }

    .ocf-page-header::after { background: color-mix(in srgb, var(--dakota-overlay-color) 66%, transparent); }

    .ocf-page-header__actions { flex-direction: column; align-items: stretch; }
    .ocf-page-header__actions .dakota-call { align-self: flex-start; }
}