/* LUMEN: accessible colours, retaining the original cream/sage palette. */
:root {
  --muted: #52665e;
  --sage: #456e59;
}

/* Opaque colours also work on the tinted hero, mint cards and photo labels. */
.hero-scroll { color: #435b50; }
.stars { color: #876321; }
.tst-person .check { color: var(--sage-dark); }
.site-header.is-dark .brand-text em,
.footer-brand .brand-text em,
.footer-col h4,
.footer-bottom { color: #b9cbc2; }
.newsletter input::placeholder { color: #b9cbc2; opacity: 1; }
.field input::placeholder,
.field textarea::placeholder { color: var(--muted); opacity: 1; }
.hours-card h4 { color: #d3e1da; }
.ba-label--after { background: var(--sage-dark); }

/* Anchor the directional scrim to the actual text block: long mobile copy
   starts higher than desktop copy. The upper photo remains unshaded. */
.svc-card::after { background: none; }
.svc-body { position: relative; isolation: isolate; }
.svc-body::before {
  content: "";
  position: absolute;
  inset: -32px 0 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(to bottom,
    rgba(18,33,29,0) 0,
    rgba(18,33,29,.68) 64px,
    rgba(18,33,29,.88) 100%);
}
.svc-body p { color: #fff; }
/* Preserve the original logo mark colours independently of text accents. */
.brand-mark { background: linear-gradient(150deg, #20463a, #5e8873); }
.footer-brand .brand-mark { background: linear-gradient(150deg, #5e8873, #c3dacd); }
