/* Site-owned service image cards, never the shared service/promotion stacks.
   Preserve grid columns, image sources/crops, ordering and hover behavior. */
html body .cheers-service-stack:not([data-cheers-component]) .cheers-service-stack__card,
html body .parks-home-services .parks-home-service-card {
  border-radius: var(--cheers-component-radius);
  border-color: var(--cheers-component-border);
  box-shadow: var(--parks-template-shadow);
  background-color: var(--cheers-component-heading);
}
html body .cheers-service-stack:not([data-cheers-component]) .cheers-service-stack__body {
  background-color: var(--cheers-component-heading);
  color: var(--site-final-heading);
}
html body .cheers-service-stack:not([data-cheers-component]) .cheers-service-stack__body::before {
  background: linear-gradient(180deg, transparent, var(--cheers-component-heading));
}
html body .cheers-service-stack:not([data-cheers-component]) .cheers-service-stack__body :is(h3,p,span,a) {
  color: var(--site-final-heading);
}
html body .cheers-service-stack:not([data-cheers-component]) .cheers-service-stack__body h3,
html body .parks-home-services .parks-home-service-card strong {
  font-family: var(--font-display);
  font-size: clamp(24px, 2.2vw, 30px);
  line-height: 1.15;
  font-weight: var(--display-weight);
  letter-spacing: var(--display-tracking);
}
html body .cheers-service-stack:not([data-cheers-component]) .cheers-service-stack__header h2,
html body.home .parks-home-services h2 {
  font-size: clamp(30px, 4vw, 50px);
  line-height: 1.1;
  letter-spacing: var(--display-tracking);
  color: var(--cheers-component-heading);
}
/* Home uses icon cards rather than photo cards. Retain their existing grid
   and icons, but keep labels readable on the same dark template surface. */
html body.home .parks-home-services .parks-home-service-card,
html body.home .parks-home-services .parks-home-service-card :is(strong,.parks-home-icon,.parks-home-icon i),
html body.home .parks-home-services .parks-home-service-card:is(:hover,:focus-visible) strong {
  color: var(--site-final-heading);
}
html body.home .parks-home-service-grid {
  row-gap: 20px;
}
html body .cheers-service-stack:not([data-cheers-component]) .cheers-service-stack__card:focus-visible,
html body .parks-home-services .parks-home-service-card:focus-visible {
  outline: 3px solid var(--cheers-component-focus);
  outline-offset: 4px;
}