/* Approved Blog hero values shared without changing its presentation. */
body.shd-content-hero-route .shd-content-hero {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    min-height: clamp(20rem, 50svh, 34rem);
    background: #17191c;
    color: #f8f7f4;
}
body.shd-content-hero-route .shd-content-hero__media { position: absolute; inset: 0; z-index: -1; }
body.shd-content-hero-route .shd-content-hero__media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 65% 50%; }
body.shd-content-hero-route .shd-content-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(12,19,27,.78), rgba(12,19,27,.48) 50%, rgba(12,19,27,.12)); }
body.shd-content-hero-route .shd-content-hero__content { width: min(100% - 2 * var(--shd-gutter), var(--shd-container)); margin-inline: auto; padding-block: 3rem; }
body.shd-content-hero-route .shd-content-hero__title { margin: 0; color: inherit; font: 600 clamp(3rem, 5.6vw, 5rem)/1.1 var(--shd-font-display); letter-spacing: -.045em; }

@media (max-width: 767px) {
    body.shd-content-hero-route .shd-content-hero { min-height: clamp(18rem, 45svh, 23rem); }
}

/* Progressive enhancement: static unless this one title's observer is ready. */
body.shd-content-hero-route .shd-content-hero__title { transform: none; filter: none; opacity: 1; transition: none; }
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
    body.shd-content-hero-route .shd-content-hero__title.shd-hero-reveal { transform: translateX(-22px); filter: blur(3px); opacity: .2; }
    body.shd-content-hero-route .shd-content-hero__title.shd-hero-reveal.is-visible {
        transform: translateX(0); filter: blur(0); opacity: 1;
        transition: transform 1500ms cubic-bezier(.16, 1, .3, 1) 100ms, filter 1500ms cubic-bezier(.16, 1, .3, 1) 100ms, opacity 1500ms cubic-bezier(.16, 1, .3, 1) 100ms;
    }
}

/* Long Page titles wrap within the same cinematic proportions. */
body.shd-content-hero-route .shd-content-hero__title { overflow-wrap: anywhere; }
body.shd-content-hero-route.category .bwp-site-footer { background: var(--shd-surface); }