/* ==========================================================================
   Fast Tree Removal — Design System
   Enterprise static site. The masthead and footer live outside <main> and are
   stripped by the WordPress exporters, where the host theme supplies its own.
   Token layer -> reset -> primitives -> components -> shell -> a11y/print
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens
   -------------------------------------------------------------------------- */
:root {
  /* Colour */
  --ink:          #10201a;
  --ink-2:        #2c3d34;
  --muted:        #5a6b60;
  --surface:      #ffffff;
  --surface-2:    #f4f7f4;
  --surface-3:    #eaf0eb;
  --brand:        #17603a;
  --brand-deep:   #0e3f26;
  --brand-tint:   #e8f2eb;
  --signal:       #c2410c;
  --signal-tint:  #fdf1ea;
  --signal-line:  #f0c4a8;
  --line:         #dbe4dd;
  --line-strong:  #c3d1c8;

  /* Space scale */
  --s1: 0.25rem;  --s2: 0.5rem;   --s3: 0.75rem;  --s4: 1rem;
  --s5: 1.5rem;   --s6: 2rem;     --s7: 3rem;     --s8: 4rem;   --s9: 6rem;

  /* Radius + elevation */
  --r-sm: 4px;  --r-md: 10px;  --r-lg: 18px;
  --e1: 0 1px 2px rgba(16, 32, 26, .06), 0 1px 1px rgba(16, 32, 26, .04);
  --e2: 0 2px 4px rgba(16, 32, 26, .05), 0 10px 30px -12px rgba(16, 32, 26, .18);
  --e3: 0 4px 8px rgba(16, 32, 26, .06), 0 24px 48px -20px rgba(16, 32, 26, .28);

  /* Type */
  --font: system-ui, -apple-system, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
  --t-xs:  0.8125rem;
  --t-sm:  0.9375rem;
  --t-base: 1.0625rem;
  --t-md:  clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
  --t-lg:  clamp(1.25rem, 1.13rem + 0.55vw, 1.5rem);
  --t-xl:  clamp(1.5rem, 1.31rem + 0.9vw, 2rem);
  --t-2xl: clamp(1.875rem, 1.5rem + 1.7vw, 2.75rem);
  --t-3xl: clamp(2.125rem, 1.6rem + 2.4vw, 3.25rem);

  /* Layout */
  --measure: 68ch;
  --container: 1140px;
  --gutter: 1.25rem;

  --ring: 0 0 0 3px #ffffff, 0 0 0 6px var(--brand);

  /* ------------------------------------------------------------------------
     Brand system v2 — additive. Existing pages keep their palette; the
     homepage composition in home.css is built entirely on these tokens.
     Contrast (verified): ink/ivory 14.9:1 · forest/ivory 9.6:1 ·
     signal-text/ivory 5.9:1 · white/signal 4.6:1 · white/forest-black 14.8:1 ·
     fresh/forest-black 5.0:1. All AA or better.
     ------------------------------------------------------------------------ */
  --forest-black: #0b2e1e;   /* authority surfaces, final CTA, hero base */
  --forest-deep:  #0e3f26;
  --forest:       #124a2f;   /* dominant brand green */
  --forest-mid:   #17603a;
  --fresh:        #3fa96b;   /* positive / completed states */
  --fresh-soft:   #6fd39b;   /* accents on dark only */
  --ivory:        #faf7f0;   /* warm off-white page background */
  --ivory-2:      #f3ede1;
  --ivory-3:      #ebe3d3;
  --sand-line:    #e2d9c6;
  --signal-text:  #a83a05;   /* orange that passes AA for body text on ivory */
  --signal-mid:   #cc4a08;   /* orange fill, white text */
  --signal-deep:  #b03d05;   /* urgent badge fill — white on this is 5.97:1 */

  /* Display type — heavier and tighter than the body scale */
  --t-display: clamp(2.4rem, 1.5rem + 3.9vw, 4.35rem);
  --t-hero-sub: clamp(1.0625rem, 1rem + 0.42vw, 1.3125rem);

  /* Enterprise grid */
  --container-wide: 1360px;
  --r-xl: 26px;

  --e-brand: 0 2px 6px rgba(11, 46, 30, .07), 0 18px 44px -22px rgba(11, 46, 30, .34);
  --e-lift:  0 4px 10px rgba(11, 46, 30, .08), 0 34px 64px -28px rgba(11, 46, 30, .42);
}

/* --------------------------------------------------------------------------
   2. Reset / base
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 1.5rem;
}

body {
  margin: 0;
  font-family: var(--font);
  font-size: var(--t-base);
  line-height: 1.65;
  color: var(--ink);
  background: var(--surface);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

h1, h2, h3, h4 {
  margin: 0 0 var(--s3);
  line-height: 1.18;
  letter-spacing: -0.018em;
  font-weight: 700;
  color: var(--ink);
  text-wrap: balance;
}

h1 { font-size: var(--t-3xl); letter-spacing: -0.028em; }
h2 { font-size: var(--t-xl); }
h3 { font-size: var(--t-lg); letter-spacing: -0.012em; }
h4 { font-size: var(--t-md); }

p, li { text-wrap: pretty; }
p { margin: 0 0 var(--s4); max-width: var(--measure); }
ul, ol { margin: 0 0 var(--s4); padding-left: 1.35rem; }
li { margin-bottom: var(--s2); max-width: var(--measure); }
li:last-child { margin-bottom: 0; }
strong { font-weight: 650; color: var(--ink); }

a { color: var(--brand-deep); text-underline-offset: 0.18em; text-decoration-thickness: from-font; }
a:hover { color: var(--brand); }

img, svg { max-width: 100%; height: auto; display: block; }

:where(a, button, summary, [tabindex]):focus-visible {
  outline: none;
  box-shadow: var(--ring);
  border-radius: var(--r-sm);
}

::selection { background: var(--brand-tint); color: var(--brand-deep); }

/* --------------------------------------------------------------------------
   3. Layout primitives
   -------------------------------------------------------------------------- */
.wrap {
  width: min(100% - (var(--gutter) * 2), var(--container));
  margin-inline: auto;
}
.wrap--narrow { --container: 860px; }

main { display: block; }

.band {
  padding-block: clamp(2.5rem, 1.6rem + 3.6vw, 4.5rem);
  border-top: 1px solid var(--line);
}
.band:first-child { border-top: 0; }
.band--tint  { background: var(--surface-2); }
.band--brand { background: var(--brand-deep); color: #eaf3ee; border-top-color: var(--brand-deep); }
.band--brand h2, .band--brand h3 { color: #ffffff; }
.band--brand p, .band--brand li { color: #cfe3d8; }
.band--brand a:not(.btn) { color: #ffffff; }

.band__head { margin-bottom: var(--s5); }
.band__head p { color: var(--muted); font-size: var(--t-md); }
.band--brand .band__head p { color: #cfe3d8; }

.eyebrow {
  display: inline-block;
  margin: 0 0 var(--s3);
  font-size: var(--t-xs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--brand);
}
.band--brand .eyebrow { color: #86c7a3; }

.grid { display: grid; gap: var(--s4); }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16.5rem), 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); }

.scroll-x { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* --------------------------------------------------------------------------
   4. Page opener (replaces a hero; carries orientation, never navigation)
   -------------------------------------------------------------------------- */
.page-open {
  position: relative;
  display: flex;
  align-items: center;
  min-height: clamp(36rem, 72vh, 48rem);
  padding-block: clamp(3.25rem, 2rem + 4.5vw, 6rem);
  background: #0b3220;
  color: #e9f3ed;
  isolation: isolate;
  overflow: hidden;
}
.page-open::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(7, 28, 18, .94) 0%, rgba(7, 28, 18, .87) 36%, rgba(7, 28, 18, .48) 64%, rgba(7, 28, 18, .25) 100%),
    linear-gradient(0deg, rgba(5, 24, 15, .52), transparent 52%);
  pointer-events: none;
}
.page-open::after {
  content: "";
  position: absolute; inset: 0;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 68px 68px;
  mask-image: radial-gradient(80% 70% at 78% 15%, #000 0%, transparent 72%);
  z-index: -1;
  opacity: .35;
  pointer-events: none;
}
.page-open__media {
  position: absolute;
  inset: 0;
  z-index: -2;
  background: #173a27;
}
.page-open__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.page-open .wrap { position: relative; z-index: 1; }
.page-open__content {
  width: min(100%, 47rem);
  padding: clamp(1.25rem, 1rem + 1vw, 2rem);
  margin-inline: clamp(-2rem, -2vw, -1rem) 0;
  border-left: 3px solid rgba(130, 211, 165, .78);
  border-radius: 0 var(--r-lg) var(--r-lg) 0;
  background: linear-gradient(100deg, rgba(5, 27, 17, .38), rgba(5, 27, 17, 0));
}
.page-open h1 { color: #ffffff; margin-bottom: var(--s4); }
.page-open .lead {
  font-size: var(--t-md);
  color: #d3e7dc;
  max-width: 62ch;
  margin-bottom: var(--s5);
}
.page-open .eyebrow { color: #8fd0ab; }

@media (max-width: 559px) {
  .page-open {
    min-height: 42rem;
    align-items: flex-end;
    padding-block: 3rem;
  }
  .page-open::before {
    background:
      linear-gradient(0deg, rgba(5, 25, 15, .97) 0%, rgba(5, 25, 15, .9) 47%, rgba(5, 25, 15, .36) 82%, rgba(5, 25, 15, .16) 100%);
  }
  .page-open__media img { object-position: 62% center; }
  .page-open__content {
    padding: var(--s5) 0 0;
    margin: 0;
    border: 0;
    border-top: 2px solid rgba(130, 211, 165, .7);
    border-radius: 0;
    background: none;
  }
}

.scope-line {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2) var(--s4);
  margin: 0 0 var(--s5);
  padding: 0;
  list-style: none;
  font-size: var(--t-sm);
  color: #bcd8c8;
}
.scope-line li {
  margin: 0;
  display: flex;
  align-items: center;
  gap: .45rem;
}
.scope-line li::before {
  content: "";
  width: .4rem; height: .4rem;
  border-radius: 50%;
  background: #6bbd8d;
  flex: none;
}

/* --------------------------------------------------------------------------
   5. Buttons / actions
   -------------------------------------------------------------------------- */
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s3);
  margin: 0 0 var(--s2);
}

.btn {
  --btn-bg: var(--brand);
  --btn-fg: #ffffff;
  --btn-line: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-height: 3rem;
  padding: .8rem 1.4rem;
  border: 1.5px solid var(--btn-line);
  border-radius: var(--r-md);
  background: var(--btn-bg);
  color: var(--btn-fg);
  font: inherit;
  font-size: var(--t-sm);
  font-weight: 650;
  letter-spacing: .005em;
  text-decoration: none;
  cursor: pointer;
  box-shadow: var(--e1);
  transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.btn:hover { color: var(--btn-fg); transform: translateY(-1px); box-shadow: var(--e2); }
.btn:active { transform: translateY(0); }
.btn svg { width: 1.05em; height: 1.05em; flex: none; fill: currentColor; }

.btn--call    { --btn-bg: var(--signal); }
.btn--call:hover { --btn-bg: #a8380b; }
.btn--secondary   { --btn-bg: #ffffff; --btn-fg: var(--brand-deep); --btn-line: var(--line-strong); }
.btn--secondary:hover { --btn-bg: var(--brand-tint); }
.btn--solid   { --btn-bg: var(--brand); }
.btn--solid:hover { --btn-bg: var(--brand-deep); }
.btn--ghost   { --btn-bg: transparent; --btn-fg: var(--brand-deep); --btn-line: var(--line-strong); box-shadow: none; }
.btn--ghost:hover { --btn-bg: var(--surface-2); }

.page-open .btn--secondary { --btn-bg: rgba(255,255,255,.08); --btn-fg: #ffffff; --btn-line: rgba(255,255,255,.42); }
.page-open .btn--secondary:hover { --btn-bg: rgba(255,255,255,.16); }
.band--brand .btn--secondary { --btn-bg: rgba(255,255,255,.08); --btn-fg: #ffffff; --btn-line: rgba(255,255,255,.42); }
.band--brand .btn--secondary:hover { --btn-bg: rgba(255,255,255,.16); }

/* One channel, one button.

   The call button used to be half of a pair with an email action beside it.
   The phone is now the only way to reach the business, so the lone button
   carries the weight both used to share: a larger tap target and a size step
   up, which on a phone-shaped screen is the difference between a control the
   thumb lands on and one it aims at. */
.actions--single .btn--call {
  min-height: 3.4rem;
  padding: .9rem 1.7rem;
  font-size: var(--t-base);
}

.actions__note {
  font-size: var(--t-xs);
  color: #b7d2c3;
  margin: var(--s3) 0 0;
}
.band:not(.page-open):not(.band--brand) .actions__note { color: var(--muted); }

/* --------------------------------------------------------------------------
   6. Callouts (safety / note) — never colour-only
   -------------------------------------------------------------------------- */
.callout {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--s3) var(--s4);
  margin: 0 0 var(--s5);
  padding: var(--s5);
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand);
  border-radius: var(--r-md);
  background: var(--surface-2);
}
.callout > svg {
  width: 1.5rem; height: 1.5rem;
  fill: var(--brand);
  margin-top: .15rem;
}
.callout__body { min-width: 0; }
.callout__label {
  display: block;
  margin: 0 0 var(--s2);
  font-size: var(--t-xs);
  font-weight: 750;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--brand-deep);
}
.callout p:last-child, .callout ul:last-child { margin-bottom: 0; }

.callout--warning {
  border-left-color: var(--signal);
  border-color: var(--signal-line);
  background: var(--signal-tint);
}
.callout--warning > svg { fill: var(--signal); }
.callout--warning .callout__label { color: #8f2c08; }

.callout--note { background: var(--brand-tint); border-color: #cbe0d3; }

/* --------------------------------------------------------------------------
   7. Cards
   -------------------------------------------------------------------------- */
.card {
  display: flex;
  flex-direction: column;
  gap: var(--s3);
  padding: var(--s5);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--surface);
  box-shadow: var(--e1);
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.card:hover { box-shadow: var(--e2); transform: translateY(-2px); border-color: var(--line-strong); }
.card h3 { margin: 0; font-size: var(--t-md); }
.card p { margin: 0; font-size: var(--t-sm); color: var(--ink-2); }
.card__cue {
  font-size: var(--t-xs);
  color: var(--muted);
  padding-top: var(--s3);
  border-top: 1px dashed var(--line);
}
.card__link {
  margin-top: auto;
  padding-top: var(--s2);
  font-weight: 650;
  font-size: var(--t-sm);
  text-decoration: none;
  color: var(--brand-deep);
}
.card__link::after { content: " \2192"; }
.card__link:hover { text-decoration: underline; }
.card__media {
  display: block;
  overflow: hidden;
  margin: calc(var(--s5) * -1) calc(var(--s5) * -1) var(--s2);
  border-radius: var(--r-lg) var(--r-lg) 0 0;
  background: var(--surface-3);
}
.card__media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  transition: transform .28s ease;
}
.card--service:hover .card__media img { transform: scale(1.025); }

.card--stat { align-items: flex-start; gap: var(--s2); }
.card--stat dt { font-size: var(--t-xs); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 700; }
.card--stat dd { margin: 0; font-size: var(--t-md); font-weight: 650; }

/* --------------------------------------------------------------------------
   8. Signal / factor / checklist lists
   -------------------------------------------------------------------------- */
.signals, .factors, .checklist {
  list-style: none;
  margin: 0 0 var(--s5);
  padding: 0;
  display: grid;
  gap: var(--s3);
}
.signals li, .factors li, .checklist li {
  position: relative;
  margin: 0;
  padding-left: 1.85rem;
  max-width: var(--measure);
}
.signals li::before {
  content: "";
  position: absolute; left: .1rem; top: .58em;
  width: .55rem; height: .55rem;
  border-radius: 2px;
  background: var(--signal);
  transform: rotate(45deg);
}
.factors li::before {
  content: "";
  position: absolute; left: .1rem; top: .5em;
  width: .7rem; height: .7rem;
  border: 2px solid var(--brand);
  border-radius: 50%;
}
.checklist li::before {
  content: "";
  position: absolute; left: .2rem; top: .42em;
  width: .42rem; height: .8rem;
  border: solid var(--brand);
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(42deg);
}
.signals--2, .factors--2, .checklist--2 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
}

/* --------------------------------------------------------------------------
   9. Decision panel
   -------------------------------------------------------------------------- */
.decide {
  display: grid;
  gap: var(--s4);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
  margin-bottom: var(--s5);
}
.decide__col {
  padding: var(--s5);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
}
.decide__col h3 {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  margin-bottom: var(--s3);
  font-size: var(--t-md);
}
.decide__col h3 span {
  font-size: var(--t-xs);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
}
.decide__col ul { margin: 0; padding-left: 1.1rem; font-size: var(--t-sm); }
.decide__col li { color: var(--ink-2); }
.decide__col--a { border-top: 3px solid var(--brand); }
.decide__col--b { border-top: 3px solid var(--signal); }

/* --------------------------------------------------------------------------
   10. Process timeline
   -------------------------------------------------------------------------- */
.timeline {
  counter-reset: step;
  list-style: none;
  margin: 0 0 var(--s5);
  padding: 0;
  display: grid;
  gap: var(--s4);
}
.timeline li {
  counter-increment: step;
  position: relative;
  margin: 0;
  padding-left: 3.25rem;
  max-width: var(--measure);
}
.timeline li::before {
  content: counter(step);
  position: absolute; left: 0; top: -.1rem;
  display: grid;
  place-items: center;
  width: 2.25rem; height: 2.25rem;
  border-radius: 50%;
  background: var(--brand-tint);
  color: var(--brand-deep);
  border: 1.5px solid #cbe0d3;
  font-size: var(--t-sm);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.timeline li::after {
  content: "";
  position: absolute; left: 1.125rem; top: 2.35rem; bottom: -1.15rem;
  width: 1.5px;
  background: var(--line);
}
.timeline li:last-child::after { display: none; }
.timeline strong { display: block; margin-bottom: .15rem; }
.timeline p { margin: 0; font-size: var(--t-sm); color: var(--ink-2); }

/* --------------------------------------------------------------------------
   11. FAQ (native details — no JS required)
   -------------------------------------------------------------------------- */
.faq { display: grid; gap: var(--s3); margin-bottom: var(--s5); }

.faq-item {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
}
.faq-item + .faq-item { margin-top: 0; }
.faq-item > summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--s4);
  padding: var(--s4) var(--s5);
  min-height: 3rem;
  font-size: var(--t-base);
  font-weight: 650;
  color: var(--ink);
  cursor: pointer;
  list-style: none;
  transition: background-color .15s ease;
}
.faq-item > summary::-webkit-details-marker { display: none; }
.faq-item > summary:hover { background: var(--surface-2); }
.faq-item > summary::after {
  content: "";
  flex: none;
  width: .65rem; height: .65rem;
  margin-top: .45rem;
  border: solid var(--brand);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  transition: transform .18s ease;
}
.faq-item[open] > summary { background: var(--surface-2); border-bottom: 1px solid var(--line); }
.faq-item[open] > summary::after { transform: rotate(-135deg); margin-top: .7rem; }
.faq-item__body { padding: var(--s5); }
.faq-item__body > :last-child { margin-bottom: 0; }
.faq-item:target { border-color: var(--brand); box-shadow: var(--e2); }

/* --------------------------------------------------------------------------
   12. Location hub blocks
   -------------------------------------------------------------------------- */
.loc {
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--surface);
  box-shadow: var(--e1);
  overflow: hidden;
}
.loc + .loc { margin-top: var(--s4); }
.loc__head {
  display: grid;
  gap: var(--s4);
  padding: var(--s5);
}
.loc__head h2 { font-size: var(--t-lg); margin-bottom: var(--s2); }
.loc__head p { font-size: var(--t-sm); color: var(--ink-2); margin-bottom: 0; }
.loc__media {
  display: block;
  overflow: hidden;
  border-radius: var(--r-md);
  background: var(--surface-3);
}
.loc__media img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
@media (min-width: 840px) {
  .loc__head {
    grid-template-columns: 17rem 1fr;
    align-items: center;
  }
}

.loc__disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s4);
  padding: var(--s3) var(--s5);
  min-height: 3rem;
  border-top: 1px solid var(--line);
  background: var(--surface-2);
  font-size: var(--t-sm);
  font-weight: 650;
  color: var(--brand-deep);
  cursor: pointer;
  list-style: none;
}
.loc__disclosure > summary::-webkit-details-marker { display: none; }
.loc__disclosure > summary::after {
  content: "";
  width: .6rem; height: .6rem;
  border: solid var(--brand);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  transition: transform .18s ease;
}
.loc__disclosure[open] > summary::after { transform: rotate(-135deg); }
.loc__disclosure > summary:hover { background: var(--surface-3); }

.linklist {
  list-style: none;
  margin: 0;
  padding: var(--s4) var(--s5) var(--s5);
  display: grid;
  gap: var(--s1);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
}
.linklist li { margin: 0; max-width: none; }
.linklist a {
  display: block;
  padding: .7rem .85rem;
  min-height: 2.9rem;
  border-radius: var(--r-sm);
  font-size: var(--t-sm);
  text-decoration: none;
  color: var(--ink-2);
  border: 1px solid transparent;
  transition: background-color .14s ease, color .14s ease, border-color .14s ease;
}
.linklist a:hover {
  background: var(--brand-tint);
  border-color: #cbe0d3;
  color: var(--brand-deep);
}

/* --------------------------------------------------------------------------
   13. Closing CTA + permitted nav actions
   -------------------------------------------------------------------------- */
.cta {
  padding: clamp(1.75rem, 1.2rem + 2.4vw, 3rem);
  border-radius: var(--r-lg);
  background: linear-gradient(135deg, #0e3f26 0%, #16593a 58%, #1a6c46 100%);
  color: #e9f3ed;
  box-shadow: var(--e3);
}
.cta h2 { color: #ffffff; }
.cta p { color: #cfe3d8; max-width: 58ch; }
.cta .actions { margin-top: var(--s5); }
.cta .btn--secondary { --btn-bg: rgba(255,255,255,.1); --btn-fg: #ffffff; --btn-line: rgba(255,255,255,.45); }
.cta .btn--secondary:hover { --btn-bg: rgba(255,255,255,.18); }

.contact-lines {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2) var(--s6);
  margin: var(--s5) 0 0;
  padding: var(--s4) 0 0;
  border-top: 1px solid rgba(255,255,255,.18);
  list-style: none;
  font-size: var(--t-sm);
}
.contact-lines li { margin: 0; color: #cfe3d8; }
.contact-lines a { color: #ffffff; font-weight: 600; }

.nav-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s3);
  margin: 0;
  padding: 0;
  list-style: none;
}
.nav-actions li { margin: 0; max-width: none; }

/* --------------------------------------------------------------------------
   14. Sticky call bar (mobile, emergency-intent pages only; JS-enhanced)
   -------------------------------------------------------------------------- */
.callbar {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 40;
  display: none;
  gap: var(--s2);
  padding: .6rem var(--gutter) calc(.6rem + env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, .96);
  backdrop-filter: saturate(1.4) blur(8px);
  border-top: 1px solid var(--line);
  box-shadow: 0 -6px 24px -12px rgba(16, 32, 26, .3);
}
.callbar .btn { flex: 1; min-height: 3rem; }
.callbar[data-visible="true"] { display: flex; }
@media (min-width: 840px) { .callbar[data-visible="true"] { display: none; } }
body:has(.callbar[data-visible="true"]) { padding-bottom: 4.5rem; }
@media (min-width: 840px) { body:has(.callbar[data-visible="true"]) { padding-bottom: 0; } }

/* --------------------------------------------------------------------------
   15. Utilities
   -------------------------------------------------------------------------- */
.lead { font-size: var(--t-md); color: var(--ink-2); max-width: 62ch; }
.muted { color: var(--muted); }
.small { font-size: var(--t-sm); }
.xs { font-size: var(--t-xs); }
.mb-0 { margin-bottom: 0; }
.mt-5 { margin-top: var(--s5); }
.stack > * + * { margin-top: var(--s4); }

.figure { margin: 0; }
.figure__media {
  display: block;
  overflow: hidden;
  border-radius: var(--r-lg);
  background: var(--surface-2);
  box-shadow: var(--e3);
}
.figure img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  background: var(--surface-2);
}
.figure figcaption { margin-top: var(--s2); font-size: var(--t-xs); color: var(--muted); }

.media-split {
  display: grid;
  gap: clamp(var(--s5), 4vw, var(--s8));
  align-items: center;
}
.media-split__content > :last-child { margin-bottom: 0; }
.media-split__visual { min-width: 0; }
@media (min-width: 840px) {
  .media-split { grid-template-columns: minmax(0, 1.05fr) minmax(20rem, .95fr); }
  .media-split--reverse { grid-template-columns: minmax(20rem, .95fr) minmax(0, 1.05fr); }
  .media-split--reverse .media-split__content { order: 2; }
  .media-split--reverse .media-split__visual { order: 1; }
}

.disclaimer {
  margin: var(--s6) 0 0;
  padding-top: var(--s4);
  border-top: 1px solid var(--line);
  font-size: var(--t-xs);
  color: var(--muted);
  max-width: 76ch;
}

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* --------------------------------------------------------------------------
   15b. Company and legal pages

   Utility pages. They carry no hero photograph, so the opener drops to a height
   that suits a block of text, and the reading column stays narrow throughout.
   -------------------------------------------------------------------------- */

.page-open--compact {
  min-height: 0;
  padding-block: clamp(2.75rem, 2rem + 3vw, 4.5rem);
}
.page-open--compact h1 { font-size: var(--t-2xl); }
.page-open--compact .lead { max-width: 60ch; }

/* Phone and address, where a page needs them to hand rather than in the footer. */
.factbox {
  margin: var(--s5) 0 0;
  padding: var(--s4) var(--s5);
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand);
  border-radius: var(--r-md);
  background: var(--surface-2);
}
.factbox__list { margin: 0; padding: 0; list-style: none; }
.factbox__list li {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  margin: 0 0 .5rem;
  max-width: none;
  font-size: var(--t-sm);
}
.factbox__list li:last-child { margin-bottom: 0; }
.factbox__list svg { width: 1.15em; height: 1.15em; flex: none; margin-top: .18em; color: var(--brand); }
.factbox__list a { font-weight: 650; }

.effective {
  margin: var(--s5) 0 0;
  padding-top: var(--s3);
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: var(--t-xs);
}
.band--tint .effective { border-top-color: var(--line-strong); }

/* --------------------------------------------------------------------------
   16. Site shell — masthead and footer

   Emitted outside <main> by build/lib/shell.js. Both are CSS-only: the mega
   menus are <details>, the mobile panel is a checkbox, and every control is
   reachable and operable with JavaScript blocked. site.js only adds dismissal
   and the condensed-on-scroll state.
   -------------------------------------------------------------------------- */

.skip-link {
  position: absolute;
  left: var(--s4);
  top: var(--s4);
  z-index: 100;
  padding: .7rem 1.1rem;
  border-radius: var(--r-md);
  background: var(--forest-black);
  color: #ffffff;
  font-size: var(--t-sm);
  font-weight: 650;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform .16s ease;
}
.skip-link:focus-visible { transform: translateY(0); color: #ffffff; }

/* ---- brand lockup (shared by masthead and footer) ---- */

.brand {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .22rem;
  background: #ffffff;
  border: 1px solid rgba(16, 32, 26, .18);
  border-radius: .35rem;
  box-shadow: 0 2px 8px rgba(6, 29, 17, .1);
  text-decoration: none;
  color: var(--forest);
  flex: none;
}
.brand__mark {
  display: block;
  width: clamp(9rem, 18vw, 14rem);
  height: auto;
  flex: none;
}
.brand__text { display: flex; flex-direction: column; line-height: 1.12; }
.brand__name {
  color: var(--ink);
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -.012em;
}
.brand__sub {
  margin-top: .12rem;
  color: var(--muted);
  font-size: .6875rem;
  font-weight: 650;
  letter-spacing: .085em;
  text-transform: uppercase;
}
.brand:hover .brand__name { color: var(--brand-deep); }

/* ---- masthead ---- */

.mast { position: relative; z-index: 50; }

.mast__strip {
  background: var(--forest-black);
  color: rgba(250, 247, 240, .74);
}
.mast__strip-in {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s2) var(--s5);
  padding-top: .45rem;
  padding-bottom: .45rem;
}
.mast__fact {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin: 0;
  min-width: 0;
  max-width: none;
  font-size: var(--t-xs);
  font-weight: 550;
  letter-spacing: .005em;
}
.mast__fact svg { width: 1.05em; height: 1.05em; flex: none; color: var(--fresh-soft); }
.mast__fact span { min-width: 0; }
/* The season line is the first thing worth losing when the strip runs out of
   room — the county line carries the coverage fact, which matters more. */
@media (max-width: 700px) { .mast__fact--season { display: none; } }

.mast__bar {
  position: sticky;
  top: 0;
  background: rgba(255, 255, 255, .94);
  backdrop-filter: saturate(1.5) blur(10px);
  border-bottom: 1px solid var(--line);
  transition: box-shadow .18s ease;
}
.mast[data-stuck="true"] .mast__bar { box-shadow: var(--e2); }

/* Wraps, so the opened mobile panel takes a row of its own below the brand
   rather than being squeezed in beside it as a third flex item. */
.mast__bar-in {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s3) var(--s5);
  padding-top: .6rem;
  padding-bottom: .6rem;
}

.mast__toggle { position: absolute; }

.burger {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-left: auto;
  padding: .55rem .8rem;
  border: 1.5px solid var(--line-strong);
  border-radius: var(--r-md);
  color: var(--ink);
  font-size: var(--t-sm);
  font-weight: 650;
  cursor: pointer;
}
.burger:hover { background: var(--surface-2); }
.burger__bars { display: grid; gap: 3.5px; width: 1.05rem; }
.burger__bars i { display: block; height: 2px; border-radius: 2px; background: currentColor; }
.mast__toggle:focus-visible + .burger { outline: none; box-shadow: var(--ring); }

.mast__panel { display: none; flex: 0 0 100%; min-width: 0; }
.mast__toggle:checked ~ .mast__panel { display: block; }

.navlist { margin: 0; padding: 0; list-style: none; }
.navlist__item { margin: 0; max-width: none; }

.navlink {
  display: block;
  padding: .95rem 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: var(--t-base);
  font-weight: 700;
  text-decoration: none;
}
.navlink:hover { color: var(--brand-deep); }
.navlink:focus-visible { outline: none; box-shadow: var(--ring); border-radius: var(--r-sm); }
.navlink[data-section="current"] { color: var(--brand-deep); }
.navlink[data-section="current"]::after {
  display: block;
  width: 1.65rem;
  height: 2px;
  margin-top: .2rem;
  background: var(--signal-mid);
  content: "";
}

.drop { border-bottom: 1px solid var(--line); }
.drop__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .95rem 0;
  color: var(--ink);
  font-size: var(--t-base);
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}
.drop__top::-webkit-details-marker { display: none; }
.drop__top:hover { color: var(--brand-deep); }
.drop__top:focus-visible { outline: none; box-shadow: var(--ring); border-radius: var(--r-sm); }
.drop__caret {
  width: .5rem;
  height: .5rem;
  flex: none;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform .18s ease;
}
.drop[open] > .drop__top .drop__caret { transform: rotate(-135deg) translate(-2px, -2px); }
/* The section the visitor is already inside. Weight plus a rule, never colour
   alone — the same standard the callouts are held to. */
.drop__top[data-section="current"] { color: var(--brand-deep); }
.drop__top[data-section="current"] > span:first-child {
  box-shadow: inset 0 -2px 0 0 var(--signal-mid);
}

.mega { display: grid; gap: var(--s5); padding: var(--s5) 0; }
.megacol { min-width: 0; }
.megacol__h {
  margin: 0 0 .3rem;
  max-width: none;
  color: var(--brand-deep);
  font-size: var(--t-xs);
  font-weight: 750;
  letter-spacing: .075em;
  text-transform: uppercase;
}
.megacol__h svg { width: 1.05em; height: 1.05em; margin-right: .35rem; vertical-align: -.14em; }
.megacol__note {
  margin: 0 0 .85rem;
  max-width: 34ch;
  color: var(--muted);
  font-size: var(--t-xs);
  line-height: 1.5;
}
.megacol__list { margin: 0; padding: 0; list-style: none; }
.megacol__list li { margin: 0; max-width: none; }
.megacol__list a {
  display: flex;
  /* Two-line labels keep the glyph on the first line, so the icon column
     stays a straight edge down the list instead of drifting with each label. */
  align-items: flex-start;
  gap: .6rem;
  padding: .45rem .6rem;
  margin-left: -.6rem;
  border-radius: var(--r-md);
  color: var(--ink-2);
  font-size: var(--t-sm);
  font-weight: 600;
  line-height: 1.35;
  text-decoration: none;
}
.megacol__list a:hover { background: var(--brand-tint); color: var(--brand-deep); }
.megacol__list a svg { width: 1.25em; height: 1.25em; flex: none; margin-top: .04em; color: var(--brand); }
.megacol__list--plain a { padding-left: 0; margin-left: 0; }
.megacol__list--plain a:hover { background: none; text-decoration: underline; text-underline-offset: 3px; }
.megacol--end { align-self: start; }
.mega__hub {
  display: inline-block;
  margin-top: .3rem;
  color: var(--brand-deep);
  font-size: var(--t-sm);
  font-weight: 700;
  text-underline-offset: 3px;
}

.mast__cta { padding: var(--s4) 0 var(--s5); }
.mast__cta-note {
  display: block;
  margin-bottom: .4rem;
  color: var(--muted);
  font-size: var(--t-xs);
  font-weight: 600;
}
.mast__call { width: 100%; }

/* Desktop: the panel becomes a row and the menus drop out of the bar. */
@media (min-width: 1040px) {
  .burger { display: none; }
  .mast__bar-in { position: relative; flex-wrap: nowrap; }
  .mast__panel {
    display: flex;
    align-items: center;
    gap: var(--s3);
    flex: 1 1 auto;
  }
  .navlist { display: flex; align-items: center; gap: var(--s1); }
  .navlist__item { position: static; }

  .navlink {
    padding: .55rem .65rem;
    border-bottom: 0;
    border-radius: var(--r-md);
    font-size: var(--t-sm);
    font-weight: 650;
  }
  .navlink:hover { background: var(--surface-2); }
  .navlink[data-section="current"]::after {
    position: absolute;
    width: calc(100% - 1.3rem);
    left: .65rem;
    bottom: .42rem;
    margin: 0;
  }
  .navlist__item--direct { position: relative; }

  .drop { border-bottom: 0; }
  .drop__top {
    padding: .55rem .75rem;
    border-radius: var(--r-md);
    font-size: var(--t-sm);
    font-weight: 650;
  }
  .drop__top:hover { background: var(--surface-2); }
  .drop__panel {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + .6rem);
    padding: 0 var(--s6);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface);
    box-shadow: var(--e3);
  }
  .mega { grid-template-columns: repeat(3, minmax(0, 1fr)) 15rem; gap: var(--s6); padding: var(--s6) 0; }
  .mega--areas { grid-template-columns: repeat(3, minmax(0, 10rem)) 15rem; }
  .megacol--end {
    padding-left: var(--s6);
    border-left: 1px solid var(--line);
  }

  .mast__cta {
    display: flex;
    align-items: center;
    gap: var(--s4);
    margin-left: auto;
    padding: 0;
  }
  .mast__cta-note { display: none; margin: 0; max-width: 9rem; text-align: right; line-height: 1.3; }
  .mast__call { width: auto; }
}

@media (min-width: 1280px) {
  .mast__cta-note { display: block; }
}

/* ---- footer ---- */

.sitefoot { background: var(--forest-black); color: #cfe3d8; }

.sitefoot__call {
  background: linear-gradient(180deg, var(--forest) 0%, var(--forest-deep) 100%);
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.sitefoot__call-in {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s5);
  padding-top: var(--s6);
  padding-bottom: var(--s6);
}
.sitefoot__call-copy { flex: 1 1 24rem; }
.sitefoot__eyebrow {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: 0 0 .5rem;
  max-width: none;
  color: #ffffff;
  font-size: var(--t-md);
  font-weight: 750;
  letter-spacing: -.01em;
}
.sitefoot__eyebrow svg { width: 1.15em; height: 1.15em; flex: none; color: var(--fresh-soft); }
.sitefoot__lead { margin: 0; color: #cfe3d8; font-size: var(--t-sm); max-width: 62ch; }
.sitefoot__btn { flex: none; min-height: 3.4rem; padding: .9rem 1.7rem; font-size: var(--t-base); }

.sitefoot__main { padding-top: var(--s7); padding-bottom: var(--s7); }
.sitefoot__grid { display: grid; gap: var(--s6); }

.sitefoot .brand--foot {
  /* The logo artwork has a deep green field.  This light keyline keeps it
     distinct from the footer's deep-green background without changing the
     logo colours. */
  background: #ffffff;
  border-color: rgba(184, 226, 193, .78);
  box-shadow: 0 5px 16px rgba(0, 0, 0, .28);
}
.sitefoot .brand--foot .brand__name { color: #ffffff; }
.sitefoot .brand--foot .brand__sub { color: rgba(207, 227, 216, .72); }
.sitefoot .brand--foot { color: var(--fresh); }
.sitefoot .brand--foot:hover .brand__name { color: var(--fresh-soft); }

.sitefoot__blurb { margin: var(--s4) 0 0; color: #b7d2c3; font-size: var(--t-sm); max-width: 42ch; }
.sitefoot__address {
  margin: var(--s4) 0 0;
  color: #cfe3d8;
  font-size: var(--t-sm);
  font-style: normal;
  line-height: 1.65;
}
.sitefoot__contact { margin: var(--s4) 0 0; padding: 0; list-style: none; }
.sitefoot__contact li {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: 0 0 .4rem;
  max-width: none;
  color: #cfe3d8;
  font-size: var(--t-sm);
}
.sitefoot__contact svg { width: 1.1em; height: 1.1em; flex: none; color: var(--fresh); }
.sitefoot__contact a { color: #ffffff; font-weight: 650; }
.sitefoot__directions {
  display: inline-block;
  margin-top: var(--s3);
  color: var(--fresh-soft);
  font-size: var(--t-sm);
  font-weight: 650;
  text-underline-offset: 3px;
}

.sitefoot__h {
  margin: 0 0 var(--s3);
  max-width: none;
  color: #ffffff;
  font-size: var(--t-xs);
  font-weight: 750;
  letter-spacing: .085em;
  text-transform: uppercase;
}
.sitefoot__h--warn { margin-top: var(--s5); display: flex; align-items: center; gap: .45rem; }
.sitefoot__h--warn svg { width: 1.2em; height: 1.2em; flex: none; color: #f0b27a; }
.sitefoot__list { margin: 0; padding: 0; list-style: none; }
.sitefoot__list li { margin: 0 0 .1rem; max-width: none; }
.sitefoot__list a {
  display: block;
  padding: .3rem 0;
  color: #cfe3d8;
  font-size: var(--t-sm);
  text-decoration: none;
}
.sitefoot__list a:hover { color: #ffffff; text-decoration: underline; text-underline-offset: 3px; }
.sitefoot__more {
  display: inline-block;
  margin-top: var(--s3);
  color: var(--fresh-soft);
  font-size: var(--t-sm);
  font-weight: 650;
  text-underline-offset: 3px;
}
.sitefoot__note { margin: 0; color: #a9c4b5; font-size: var(--t-xs); line-height: 1.6; max-width: 44ch; }

.sitefoot__legal {
  border-top: 1px solid rgba(255, 255, 255, .1);
  background: rgba(0, 0, 0, .22);
}
.sitefoot__legal-in { padding-top: var(--s5); padding-bottom: var(--s5); }
.sitefoot__legal-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2) var(--s5);
  margin: var(--s4) 0 0;
  padding: 0;
  list-style: none;
}
.sitefoot__legal-nav li { margin: 0; max-width: none; }
.sitefoot__legal-nav a {
  color: #cfe3d8;
  font-size: var(--t-xs);
  font-weight: 600;
  text-decoration: none;
}
.sitefoot__legal-nav a:hover { color: #ffffff; text-decoration: underline; text-underline-offset: 3px; }
.sitefoot__disclaimer { margin: 0; color: #93b0a1; font-size: var(--t-xs); line-height: 1.6; max-width: 92ch; }
.sitefoot__copy { margin: var(--s3) 0 0; color: #93b0a1; font-size: var(--t-xs); }

@media (min-width: 620px) {
  .sitefoot__list--split { columns: 2; column-gap: var(--s5); }
}
@media (min-width: 860px) {
  .sitefoot__grid { grid-template-columns: 1.5fr 1fr 1fr; }
  .sitefoot__col--notes { grid-column: 2 / -1; }
}
@media (min-width: 1120px) {
  .sitefoot__grid { grid-template-columns: 1.6fr 1fr 1.1fr 1.2fr; }
  .sitefoot__col--notes { grid-column: auto; }
}

/* --------------------------------------------------------------------------
   17. Motion / forced-colors / print
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

@media (forced-colors: active) {
  .btn { border: 1px solid ButtonText; }
  .card, .callout, .faq-item, .loc, .decide__col { border: 1px solid CanvasText; }
  .page-open, .cta, .band--brand { background: Canvas; color: CanvasText; }
  .page-open::before, .page-open::after, .page-open__media { display: none; }
  .mast__bar, .drop__panel, .sitefoot, .sitefoot__call, .sitefoot__legal {
    background: Canvas;
    color: CanvasText;
  }
  .drop__panel, .burger { border: 1px solid CanvasText; }
}

@media print {
  /* The shell is navigation and a link index — neither survives the trip to
     paper. The address and number are kept, since a printed page is often
     carried to the tree. */
  .callbar, .nav-actions, .mast__strip, .mast__panel, .burger, .skip-link,
  .sitefoot__call, .sitefoot__col, .sitefoot__directions { display: none !important; }
  .mast__bar { position: static !important; background: #fff !important; box-shadow: none !important; }
  .sitefoot, .sitefoot__legal { background: #fff !important; color: #000 !important; }
  .sitefoot__blurb, .sitefoot__address, .sitefoot__contact li,
  .sitefoot__disclaimer, .sitefoot__copy { color: #000 !important; }
  .page-open, .cta, .band--brand { background: #fff !important; color: #000 !important; }
  .page-open { min-height: auto !important; }
  .page-open::before, .page-open::after, .page-open__media { display: none !important; }
  .page-open h1, .cta h2, .cta p, .page-open .lead { color: #000 !important; }
  .faq-item__body { display: block !important; }
  body { font-size: 11pt; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; }
}
