/* Public subpage openings — one responsive gap beneath the fixed navbar.
   Matches Energy Efficiency's 36px phone clearance and ~116px desktop
   clearance, without allowing image height or copy length to recenter it.
   Explicit opt-in excludes the homepage, Hub and portrait-first vCards. */
body[data-public-hero] {
  --fmc-hero-gap: clamp(36px, 8vw, 120px);
}
body[data-public-hero] > main { padding-top: 0; }

/* Legacy editorial pages used main padding; newer pages included the
   navbar in their own hero padding. Count the navbar exactly once. */
body[data-public-hero] .khero,
body[data-public-hero] main > .hero,
body[data-public-hero] #get-in-touch,
body[data-public-hero] #the-work {
  padding-top: calc(var(--nav-h, 56px) + var(--fmc-hero-gap));
}
body[data-public-hero] .khero__grid,
body[data-public-hero] .ss-hero-layout { align-items: start; }

/* Keep the proposal's two-row handoff and EMS illustration/pinning. Only
   the opening copy's vertical alignment changes; no model/JS changes. */
body[data-public-hero] .ee-tools #fund.phase--opening {
  --fund-pad: var(--fmc-hero-gap);
  padding-top: calc(var(--nav-h, 56px) + var(--fmc-hero-gap));
}
body[data-public-hero] .ee-tools #fund .intro {
  align-self: start;
  top: 0;
}
body[data-public-hero] .ems-hero__copy,
body[data-public-hero] .ems[data-ready] .ems-hero__copy {
  align-self: start;
  justify-content: flex-start;
}

/* Service needs its original full-height reading stage. Put the opening
   whitespace OUTSIDE that stage: it scrolls away naturally before pinning,
   so matching the hero gap cannot disable the short-phone page turns. */
body[data-public-hero] .sp-story {
  --fmc-service-inset: 10px;
  margin-top: calc(var(--fmc-hero-gap) - var(--fmc-service-inset));
}
body[data-public-hero] .sp-stage {
  padding-top: calc(var(--nav-h, 56px) + var(--fmc-service-inset));
}
@media (max-width: 860px) {
  body[data-public-hero] .sp-story { --fmc-service-inset: 6px; }
}
@media (min-width: 1024px) {
  body[data-public-hero] .sp-story { --fmc-service-inset: 20px; }
  body[data-public-hero] .sp-chapter { align-items: start; }
  body[data-public-hero] .sp-story.is-enhanced .sp-stage {
    grid-template-rows: 0 auto auto minmax(0, 1fr) auto;
    align-content: stretch;
  }
}