/* ==========================================================================
   Inner-page banner: title, gold star divider, soft glow, gentle wave
   ========================================================================== */

.page-banner {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    overflow: clip;
    padding: calc(var(--header-h) + clamp(3rem, 2rem + 4vw, 5.5rem)) 0 clamp(4.5rem, 3.5rem + 5vw, 7.5rem);
    background: linear-gradient(180deg, var(--color-bg-alt) 0%, var(--color-bg) 85%);
    text-align: center;
}

.page-banner__bg {
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
}

.page-banner__glow {
    position: absolute;
    top: 58%;
    left: 50%;
    width: min(760px, 120vw);
    aspect-ratio: 2 / 1;
    translate: -50% -50%;
    border-radius: 50%;
    background: radial-gradient(closest-side, color-mix(in srgb, var(--color-secondary) 22%, transparent), transparent);
}

.page-banner__star {
    position: absolute;
    fill: var(--color-secondary);
}

.page-banner__star--1 { top: 38%; left: 12%; width: 12px; height: 12px; }
.page-banner__star--2 { top: 30%; right: 14%; width: 16px; height: 16px; }

.page-banner__title {
    margin: 0;
    font-size: clamp(2.5rem, 1.9rem + 3vw, 4.5rem);
}

/* ---------- Optional photo variant (e.g. Contact) ---------- */
.page-banner--image {
    background: var(--color-primary-dark);
}

.page-banner__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-banner__scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgb(22 58 40 / 0.72), rgb(22 58 40 / 0.55));
}

.page-banner--image .page-banner__title,
.page-banner--image .page-banner__title em {
    color: var(--color-bg);
}

.page-banner--image .divider-star {
    color: var(--color-secondary);
}

.page-banner .divider-star {
    margin-bottom: 0;
}

.page-banner__waves {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: clamp(40px, 5vw, 80px);
    overflow: hidden;
    pointer-events: none;
}

/* Wave shapes/fills are shared with the hero (.wave, .wave--1, .wave--3) */