/* All service pages: alternate existing page and related-section colours.
   The page classifier follows client-side navigation. Count only sections,
   excluding the injected navigation and script elements. */
html.orbit[data-orbit-page="service"] main > section {
  background-color: var(--background) !important;
}

html.orbit[data-orbit-page="service"] main > section:nth-of-type(even) {
  background-color: var(--muted) !important;
}

/* Reuse the approved homepage palette. Detail pages end the gradient at the
   hero; pages with a separate introductory CTA continue through that CTA. */
html.orbit[data-orbit-page="service"] {
  --service-hero-end: var(--background);
  --service-studio-top: #e5e0d9;
  --service-studio-light: #f5f1eb;
  --service-studio-shade: #d8d0c8;
}

html.orbit[data-orbit-page="service"][data-orbit-theme="dark"] {
  --service-studio-top: #252321;
  --service-studio-light: #35302e;
  --service-studio-shade: #201e20;
}

html.orbit[data-orbit-page="service"] header {
  background: color-mix(in srgb, var(--service-studio-top) 95%, transparent) !important;
}

html.orbit[data-orbit-page="service"] main:has(> section#lead-form, > section#site-lead) {
  --service-hero-end: var(--service-studio-top);
}

html.orbit[data-orbit-page="service"] main > section:first-of-type {
  background:
    linear-gradient(to bottom, transparent 55%, color-mix(in srgb, var(--service-hero-end) 25%, transparent) 73%, color-mix(in srgb, var(--service-hero-end) 80%, transparent) 93%, var(--service-hero-end)),
    radial-gradient(ellipse at 78% 64%, var(--service-studio-light) 0%, transparent 57%),
    linear-gradient(155deg, var(--service-studio-top) 25%, var(--service-studio-shade)) !important;
  border-bottom-color: var(--service-hero-end) !important;
}

html.orbit[data-orbit-page="service"] main > .focus-page-nav {
  background: var(--service-hero-end) !important;
  border-color: var(--service-hero-end) !important;
}

html.orbit[data-orbit-page="service"] main > section:nth-of-type(2):not(:has(h2, h3)) {
  background: linear-gradient(to bottom, var(--service-studio-top), var(--background)) !important;
  border-color: var(--service-studio-top) !important;
}