/* Shared photo/video headers. Padding follows Missionary Training; interior
   titles follow Journey to the Field; supporting copy and CTAs follow Home. */
html body #main [data-site-hero][data-site-hero]{
  --page-hero-gutter:max(24px,calc((100% - 1180px)/2));
  box-sizing:border-box!important;
  position:relative;
  isolation:isolate;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
  padding:100px var(--page-hero-gutter)!important;
  color:#fff;
  text-align:left!important;
}
html body #main [data-site-hero][data-site-hero] [data-hero-content]{
  box-sizing:border-box!important;
  position:relative;
  z-index:1;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-align:left!important;
}
html body #main [data-site-hero][data-site-hero] [data-hero-title]{
  font-family:'Inter',Arial,sans-serif!important;
  font-size:clamp(48px,6.6vw,88px)!important;
  font-weight:800!important;
  font-style:normal!important;
  line-height:.99!important;
  letter-spacing:-.045em!important;
  text-transform:none!important;
  text-wrap:balance;
  max-width:850px!important;
  margin:0 0 30px!important;
  padding:0!important;
  color:#fff!important;
}
html body #main [data-site-hero][data-site-hero] [data-hero-title] :is(strong,em,span){
  font:inherit!important;
  color:inherit!important;
  letter-spacing:inherit!important;
}
html body #main [data-site-hero][data-site-hero] [data-hero-eyebrow]{
  font:700 12px/1.5 'Inter',Arial,sans-serif!important;
  letter-spacing:2px!important;
  text-transform:uppercase!important;
  color:#ffb36a!important;
  margin:0 0 24px!important;
  padding:0!important;
  border:0!important;
}
html body #main [data-site-hero][data-site-hero] [data-hero-copy]{
  font:400 clamp(1.07rem,1.55vw,1.35rem)/1.6 Georgia,'Times New Roman',serif!important;
  letter-spacing:normal!important;
  text-transform:none!important;
  color:#fff!important;
  max-width:650px!important;
  margin:0 0 34px!important;
  padding:0!important;
  border:0!important;
}
html body #main [data-site-hero][data-site-hero] [data-hero-actions]{
  display:flex!important;
  flex-flow:row wrap!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:14px!important;
  margin:0!important;
  padding:0!important;
}
html body #main [data-site-hero][data-site-hero] [data-hero-action]{
  --cta-height:50px;
  box-sizing:border-box!important;
  display:inline-flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:flex-start!important;
  justify-self:start!important;
  gap:14px!important;
  width:max-content!important;
  min-width:0!important;
  max-width:100%!important;
  height:50px!important;
  min-height:50px!important;
  padding:0 20px!important;
  margin:0!important;
  border:1px solid #c45508!important;
  border-radius:12px!important;
  background:#c45508!important;
  color:#fff!important;
  font:700 12.5px/1.2 'Inter',Arial,sans-serif!important;
  letter-spacing:.04em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  box-shadow:none!important;
  transition:filter .2s,transform .2s,background .2s;
}
html body #main [data-site-hero][data-site-hero] [data-hero-action="secondary"]{
  background:transparent!important;
  border-color:#ffffff9e!important;
}
html body #main [data-site-hero][data-site-hero] [data-hero-action]:is(:before,:after){content:none!important}
html body #main [data-site-hero][data-site-hero] [data-hero-action] .site-cta-arrow{
  width:18px!important;height:18px!important;min-width:18px!important;
  display:block!important;flex:0 0 18px!important;
  position:static!important;margin:0!important;transform:none!important;
  fill:none!important;stroke:currentColor!important;
  stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
}
html body #main [data-site-hero][data-site-hero] [data-hero-action]:hover{filter:brightness(1.05);transform:translateY(-2px)}
html body #main [data-site-hero][data-site-hero] [data-hero-action="secondary"]:hover{background:#ffffff1f!important}
html body #main [data-site-hero][data-site-hero] [data-hero-action]:focus-visible{outline:3px solid #ffb36a;outline-offset:5px}
html body #main [data-site-hero][data-site-hero] [data-hero-note]{margin:24px 0 0!important}
/* This page now uses the same full-width image, transparent content, and
   dark photo overlay as the other editorial headers. */
html body #main [data-site-hero="how-we-do-it"]{overflow:hidden;background:#1a2833}
html body #main [data-site-hero="how-we-do-it"] .how-hero-image{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;z-index:-2}
html body #main [data-site-hero="how-we-do-it"]:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(26,40,51,.86),rgba(26,40,51,.58) 55%,rgba(26,40,51,.22))}
@media(max-width:720px){
  html body #main [data-site-hero][data-site-hero] [data-hero-copy]{font-size:1rem!important}
  html body #main [data-site-hero][data-site-hero] [data-hero-actions]{display:grid!important;justify-items:start!important}
}
@media(max-width:700px){
  html body #main [data-site-hero][data-site-hero] [data-hero-title]{font-size:clamp(44px,11.5vw,64px)!important;max-width:520px!important;margin-bottom:26px!important}
}
@media(max-width:600px){
  html body #main [data-site-hero][data-site-hero] [data-hero-action]{font-size:11.5px!important;padding-inline:12px!important;gap:10px!important}
}
@media(max-width:599px){
  html body #main [data-site-hero][data-site-hero]{padding-block:64px!important}
}
@media(max-width:380px){
  html body #main [data-site-hero][data-site-hero] [data-hero-action]{font-size:11px!important;padding-inline:10px!important;gap:8px!important}
}
/* A header without actions ends at its final line of copy, so its visible
   bottom space is the same 100px/64px as the headers with actions. */
html body #main [data-site-hero][data-site-hero] [data-hero-content]>:last-child{margin-bottom:0!important}
/* Desktop interior title size; Home retains its original responsive title. */
@media(min-width:1024px){
  html body #main [data-site-hero][data-site-hero]:not([data-site-hero="home"]) :is(h1,[data-hero-title]){font-size:75px!important}
  html body #main [data-site-hero][data-site-hero] [data-hero-copy]{font-size:18px!important}
}
/* One overlay layer on every shared header, using Missionary Training's
   original desktop and mobile gradients. Remove prior layers to avoid stacking. */
html body #main [data-site-hero][data-site-hero]{
  --page-hero-overlay:linear-gradient(110deg,rgba(26,40,51,.86),rgba(26,40,51,.7) 56%,rgba(26,40,51,.1));
}
html body #main [data-site-hero][data-site-hero]::after{
  content:''!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:auto!important;
  height:auto!important;
  z-index:0!important;
  pointer-events:none!important;
  background:var(--page-hero-overlay)!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important;
  mix-blend-mode:normal!important;
}
html body #main [data-site-hero="home"] .hero-shade{display:none!important}
html body #main [data-site-hero="how-we-do-it"]::before{content:none!important;background:none!important}
html body #main [data-site-hero="missionary-training"][data-image-surface]{background-image:var(--image-presentation-source)!important}
html body #main [data-site-hero][data-site-hero] .section-photograph[data-image-surface]{background-image:var(--image-presentation-source)!important}
html body #main [data-site-hero="about"]::before{background-image:var(--about-photo)!important}
@media(max-width:800px){
  html body #main [data-site-hero][data-site-hero]{
    --page-hero-overlay:linear-gradient(110deg,rgba(26,40,51,.81),rgba(26,40,51,.68));
  }
}
/* Retain the homepage's original pale sage header eyebrow. */
html body #main [data-site-hero="home"][data-site-hero] [data-hero-eyebrow]{color:#d8e7d2!important}
/* Default reusable image-backed header. Media stays behind the shared overlay
   on every viewport, including pages that formerly split image and text. */
html body #main .page-photo-header[data-site-hero]{background:#1a2833;overflow:hidden}
html body #main [data-site-hero][data-site-hero]>[data-hero-media]{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  object-fit:cover!important;
  object-position:var(--replacement-position,50% 40%)!important;
  aspect-ratio:auto!important;
  transform:none!important;
}

/* Optional subtitle follows What We Do's established header treatment. */
html body #main [data-site-hero][data-site-hero] [data-hero-subtitle]{
  font:700 21px/1.4 'Inter',Arial,sans-serif!important;
  letter-spacing:normal!important;
  text-transform:none!important;
  color:#fff!important;
  margin:0 0 12px!important;
  padding:0!important;
}
@media(max-width:760px){
  html body #main [data-site-hero][data-site-hero] [data-hero-subtitle]{font-size:20px!important}
}