/* Shared page hero (19 October 2026): the About page's hero for pages outside the Corporate design (Case Studies,
   Showreel, Blog, Contact). A full-width image with the Corporate shade and the page title vertically centred on the
   left; 600px tall, 680px on phones. Loaded on every page (inc/corporate.php); only .cx-page-hero uses it, and it
   carries no data-screen-label so the older pages' hero rules leave it alone. */
.cx-page-hero{position:relative;display:flex;align-items:center;min-height:600px;overflow:hidden;background:#0f1a30;color:#fff}
.cx-page-hero .cx-page-hero__img,.cx-page-hero .cx-page-hero__img img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.cx-page-hero .cx-page-hero__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,26,48,.85) 0%,rgba(15,26,48,.55) 45%,rgba(15,26,48,.15) 100%)}
.cx-page-hero .cx-page-hero__inner{position:relative;box-sizing:content-box;width:100%;max-width:1360px;margin-inline:auto;padding:100px clamp(18px,4vw,56px) clamp(80px,9vw,120px)}
.cx-page-hero .cx-page-hero__inner h1{max-width:900px;margin:0;color:#fff;font:700 clamp(40px,5vw,76px)/1.04 'Roboto Slab',Georgia,serif;letter-spacing:-.02em;text-wrap:balance}
@media(max-width:700px){.cx-page-hero{min-height:680px}}
/* Over this hero the header is transparent until the page scrolls, as on the Corporate pages (client request,
   27 October 2026); other shared-header pages keep the navy bar behind it (corporate-header.css). */
.archvi-shared-header:not(.cx-menu-open):has(.cx-page-hero) .cx-header:not(.is-scrolled):not(.is-mega-open){background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}