/* Hero with stats: gradient shade and frosted stat cards. */
.pb-hero__shade {
    background-image:
        linear-gradient(to bottom, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0) 35%),
        linear-gradient(to bottom, rgba(0,0,0,0) 50%, rgba(0,0,0,0.3) 75%, rgba(0,0,0,0.65) 92%, rgb(0,0,0) 100%);
}
.pb-hero__stat {
    background: rgba(0,0,0,0.25);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

/* Load entrance: the photo settles from a slight zoom (frontend only; off under reduced motion). */
@keyframes pb-hero-zoom { from { transform: scale(1.15); } to { transform: scale(1); } }
.pb-hero__img--zoom { transform-origin: center bottom; animation: pb-hero-zoom 1.8s cubic-bezier(0.22, 0.61, 0.36, 1) both; }
@media (prefers-reduced-motion: reduce) { .pb-hero__img--zoom { animation: none; } }
/* The photo box clips the zoom so the image never shows past its own edge. */
.pb-hero__media { overflow: hidden; }

/* Untransformed guard over the section's bottom edge: no compositing seam against the next black band. */
.pb-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: #000; z-index: 1; pointer-events: none; }
/* Hold the load zoom while the theme's intro overlay is still showing; it starts the moment the overlay begins
   to fade (the overlay gets .is-hidden on proto:intro-complete), together with the text reveals. */
html.proto-intro-active:has(.proto-intro:not(.is-hidden)) .pb-hero__img--zoom { animation-play-state: paused; }