/* Full photographic banners. Image, crop and contrast are independent of page copy. */
.ed-page-hero[data-sff-breadcrumb]{display:flex;align-items:center;isolation:isolate;min-height:510px;background:#172450;color:#fff}
.ed-page-hero[data-sff-breadcrumb] .ed-hero-image,
.ed-page-hero[data-sff-breadcrumb].panorama .ed-hero-image{position:absolute;inset:0;z-index:-2;min-height:0;max-height:none;padding:0;background:transparent;overflow:hidden}
.ed-page-hero[data-sff-breadcrumb] .ed-hero-image img{display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--breadcrumb-position,65% 50%);background:none;opacity:1;filter:none;transform:none}
.ed-page-hero[data-sff-breadcrumb] .ed-hero-image:after{content:none}
.ed-page-hero[data-sff-breadcrumb]:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(12,24,48,.88) 0%,rgba(12,24,48,.74) 36%,rgba(12,24,48,.33) 66%,rgba(12,24,48,.12) 100%)}
.ed-page-hero[data-sff-breadcrumb] .ed-page-title,
.ed-page-hero[data-sff-breadcrumb].panorama .ed-page-title{position:relative;z-index:1;width:min(960px,76%);max-width:100%;padding:70px 40px 76px max(48px,calc((100vw - 1344px)/2));background:none}
.ed-page-hero[data-sff-breadcrumb] h1{color:#fff;font-size:clamp(50px,5.5vw,82px);line-height:1.04;text-shadow:0 3px 18px #08142c70;overflow-wrap:normal;word-break:normal}
.ed-page-hero[data-sff-breadcrumb] .ed-eyebrow{color:#fff;text-shadow:0 2px 8px #08142c99;letter-spacing:.15em;margin-bottom:18px}
.ed-page-hero[data-sff-breadcrumb] .ed-eyebrow:before{background:#fff}

/* Older article headers use a CSS photo, with the same full-bleed behaviour. */
.sff-fresh-page-header{isolation:isolate;position:relative;background-size:cover!important;background-position:var(--breadcrumb-position,50% 45%)!important;background-attachment:scroll!important;overflow:hidden}
.sff-fresh-page-header:before{background:linear-gradient(90deg,rgba(12,24,48,.72),rgba(12,24,48,.67) 55%,rgba(12,24,48,.38))!important;opacity:1!important}
.sff-fresh-page-header .page-header-box{position:relative;z-index:2}
.sff-fresh-page-header .page-header-box h1{color:#fff;text-shadow:0 3px 18px #08142c70;line-height:1.08}
.sff-fresh-page-header .sff-page-label{color:#fff;text-shadow:0 2px 8px #08142c99}

/* White backing keeps trails legible over every photo, including integrated WISE heroes. */
.ed-page-hero[data-sff-breadcrumb] .ed-breadcrumb,
.sff-fresh-page-header .breadcrumb,
.wp-breadcrumb ol,
.ap-breadcrumb{display:inline-flex;flex-wrap:wrap;align-items:center;align-self:flex-start;width:fit-content;max-width:100%;gap:7px 10px;padding:10px 16px!important;border:1px solid #fff;border-radius:14px;background:rgba(255,255,255,.97);color:#27387e!important;font-size:14px!important;line-height:1.55!important;font-weight:600;box-shadow:0 5px 18px #08142c1f;text-shadow:none}
.ed-page-hero[data-sff-breadcrumb] .ed-breadcrumb{margin-bottom:27px}
.ed-page-hero[data-sff-breadcrumb] .ed-breadcrumb a,
.sff-fresh-page-header .breadcrumb .breadcrumb-item,
.sff-fresh-page-header .breadcrumb a,
.wp-breadcrumb ol a,.wp-breadcrumb ol li,
.ap-breadcrumb a,.ap-breadcrumb span{color:#27387e!important;font-size:inherit!important;text-shadow:none}
.ed-page-hero[data-sff-breadcrumb] .ed-breadcrumb a:hover,
.sff-fresh-page-header .breadcrumb a:hover,
.wp-breadcrumb ol a:hover,.ap-breadcrumb a:hover{color:#dc1f25!important;text-decoration:underline}
.ed-page-hero[data-sff-breadcrumb] .ed-breadcrumb span+span:before,
.sff-fresh-page-header .breadcrumb-item+.breadcrumb-item:before,
.wp-breadcrumb ol li+li:before{color:#27387e!important;opacity:.6}
.sff-fresh-page-header .breadcrumb{margin:14px auto 0!important;justify-content:center}
.wp-breadcrumb ol{margin:0}
.ed-breadcrumb a:focus-visible,.breadcrumb a:focus-visible,.wp-breadcrumb a:focus-visible,.ap-breadcrumb a:focus-visible{outline:2px solid #27387e;outline-offset:3px;border-radius:2px}
/* Existing WISE content heroes retain their foreground art and navy copy.
   Their independent full-area photo receives a light veil instead. */
.wp-page.wp-programme-overview .wp-overview-hero-section,
.wp-how-wise-works .hw-hero-section{background-image:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.90) 43%,rgba(255,255,255,.74)),var(--breadcrumb-photo)!important;background-size:cover!important;background-position:60% 45%!important;background-repeat:no-repeat!important}
.vp-hero>.vp-environment{background-image:linear-gradient(90deg,rgba(12,24,48,.87),rgba(12,24,48,.7)),var(--breadcrumb-photo)!important;background-size:cover!important;background-position:60% 45%!important}
.ap-hero .ap-hero-environment{opacity:1;object-position:60% 45%}
.ap-hero:after{background:linear-gradient(90deg,rgba(12,24,48,.9) 10%,rgba(12,24,48,.72) 55%,rgba(12,24,48,.25))}
@media(max-width:991px){
 .ed-page-hero[data-sff-breadcrumb] .ed-page-title,.ed-page-hero[data-sff-breadcrumb].panorama .ed-page-title{width:88%;padding:58px 32px 66px}
 .ed-page-hero[data-sff-breadcrumb]{min-height:465px}
 .ed-page-hero[data-sff-breadcrumb]:after{background:linear-gradient(90deg,rgba(12,24,48,.83),rgba(12,24,48,.64) 55%,rgba(12,24,48,.28))}
}
@media(max-width:767px){
 .ed-page-hero[data-sff-breadcrumb],.ed-page-hero[data-sff-breadcrumb].panorama{min-height:460px;align-items:flex-start}
 .ed-page-hero[data-sff-breadcrumb] .ed-page-title,.ed-page-hero[data-sff-breadcrumb].panorama .ed-page-title{width:100%;padding:35px 22px 110px}
 .ed-page-hero[data-sff-breadcrumb] .ed-hero-image img{object-position:var(--breadcrumb-mobile-position,65% 50%)}
 .ed-page-hero[data-sff-breadcrumb]:after{background:linear-gradient(180deg,rgba(12,24,48,.82) 0%,rgba(12,24,48,.73) 44%,rgba(12,24,48,.37) 78%,rgba(12,24,48,.15) 100%)}
 .ed-page-hero[data-sff-breadcrumb] h1{font-size:clamp(40px,10.2vw,64px);line-height:1.07}
 .ed-page-hero[data-sff-breadcrumb] .ed-eyebrow{font-size:12px;line-height:1.65;letter-spacing:.12em}
 .ed-page-hero[data-sff-breadcrumb] .ed-breadcrumb{margin-bottom:24px}
 .sff-fresh-page-header{background-position:var(--breadcrumb-mobile-position,60% 50%)!important}
 .sff-fresh-page-header:before{background:linear-gradient(180deg,rgba(12,24,48,.82),rgba(12,24,48,.70) 68%,rgba(12,24,48,.3))!important}
 .sff-fresh-page-header .page-header-box h1{font-size:clamp(34px,8.3vw,52px)}
 .ed-page-hero[data-sff-breadcrumb] .ed-breadcrumb,.sff-fresh-page-header .breadcrumb,.wp-breadcrumb ol,.ap-breadcrumb{font-size:12px!important;padding:9px 12px!important;gap:5px 8px;border-radius:11px}
 .wp-page.wp-programme-overview .wp-overview-hero-section,.wp-how-wise-works .hw-hero-section{background-image:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.90) 54%,rgba(255,255,255,.76)),var(--breadcrumb-photo)!important;background-size:cover!important;background-position:60% 50%!important}
 .ap-hero:after{background:linear-gradient(180deg,rgba(12,24,48,.87),rgba(12,24,48,.74) 60%,rgba(12,24,48,.52))}
}