/* RV Camping Canada: photo page headers (Guides, Trips, Campgrounds, Resources, Services, Search). Loaded after style.css. */
/* Hero: photo at /images/heroes/<province>.jpg when it exists; gradient shows until then. */
.a-hero.cg-hero{position:relative;color:#fff;padding:0;background:
  linear-gradient(90deg,rgba(8,34,44,.70) 0%,rgba(8,34,44,.36) 50%,rgba(8,34,44,.04) 100%),
  var(--hero,none) center var(--pos,50%)/cover no-repeat,
  linear-gradient(135deg,#0e4a5c 0%,#0a3644 60%,#12222b 100%)}
.a-hero.cg-hero::before{display:none}
.a-hero.cg-hero h1,.a-hero.cg-hero .deck,.a-hero.cg-hero .crumbs{text-shadow:0 1px 3px rgba(0,0,0,.5),0 2px 14px rgba(0,0,0,.6)}
@media (max-width:760px){.a-hero.cg-hero{background:
  linear-gradient(180deg,rgba(8,34,44,.40) 0%,rgba(8,34,44,.52) 100%),
  var(--hero,none) center var(--pos,50%)/cover no-repeat,
  linear-gradient(135deg,#0e4a5c 0%,#0a3644 60%,#12222b 100%)}}
/* vertical focal point of each province photo (the header only shows a wide strip) */
.a-hero.cg-hero[style*="/alberta.jpg"]{--pos:47%}
.a-hero.cg-hero[style*="/british-columbia.jpg"]{--pos:35%}
.a-hero.cg-hero[style*="/manitoba.jpg"]{--pos:56%}
.a-hero.cg-hero[style*="/new-brunswick.jpg"]{--pos:52%}
.a-hero.cg-hero[style*="/newfoundland-and-labrador.jpg"]{--pos:55%}
.a-hero.cg-hero[style*="/northwest-territories.jpg"]{--pos:32%}
.a-hero.cg-hero[style*="/nova-scotia.jpg"]{--pos:30%}
.a-hero.cg-hero[style*="/ontario.jpg"]{--pos:78%}
.a-hero.cg-hero[style*="/prince-edward-island.jpg"]{--pos:68%}
.a-hero.cg-hero[style*="/quebec.jpg"]{--pos:50%}
.a-hero.cg-hero[style*="/saskatchewan.jpg"]{--pos:28%}
.a-hero.cg-hero[style*="/yukon.jpg"]{--pos:35%}
.a-hero.cg-hero h1,.a-hero.cg-hero .deck,.a-hero.cg-hero .a-meta,.a-hero.cg-hero .crumbs,.a-hero.cg-hero .crumbs a{color:#fff}
.a-hero.cg-hero .crumbs a{text-decoration:underline;text-underline-offset:2px}
.a-hero.cg-hero .crumbs span{opacity:.7;margin:0 8px}
.a-hero.cg-hero .deck{font-size:1.2rem;max-width:60ch;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.a-hero.cg-hero .a-meta{opacity:.85}
/* Tight vertical rhythm: the base .a-hero .wrap already supplies padding */
.a-hero.cg-hero .wrap{padding:26px 0 24px}
.a-hero.cg-hero .crumbs{margin-bottom:12px}
.a-hero.cg-hero h1{max-width:30ch;font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.12}
.a-hero.cg-hero .deck{margin-top:10px}
.a-hero.cg-hero .a-meta{margin-top:12px;font-size:.88rem}
@media (max-width:640px){.a-hero.cg-hero .wrap{padding:20px 0 18px}}
/* Header pills on the photo header */
.a-hero.cg-hero .region-nav{margin-top:18px}
.a-hero.cg-hero .region-nav a{color:#fff;border-color:rgba(255,255,255,.7);background:rgba(8,34,44,.35)}
.a-hero.cg-hero .region-nav a:hover{background:#fff;color:var(--lake);border-color:#fff}