/* MD Accounting colors for the Drivon family kit (see KIT.md).
   Brand: the petrol blue of the old site (--md-bg-deep #013849, header #022b3b) and the logo's tile (#005169).
   Accent: a deeper shade of the logo's mint-to-teal green (the old site's #1acf8a / #b5ff74 fail with white
   text), so white button text reaches 5.3:1 and links on white or mist stay above 4.5:1. */
:root {
  --brand: #013849; --brand-rgb: 1, 56, 73;     /* deep band: dark sections, page heroes, header text */
  --brand-deep: #022b3b;                        /* footer */
  --accent: #0e7a55; --accent-dark: #0a6b4f;    /* buttons, kickers, rules; hover (white text: 5.3:1 / 6.5:1) */
  --accent-soft: #e7f5ee; --on-accent: #ffffff; /* light tint; text on the accent */
  --lime: #b5ff74;                              /* the logo's light green, for marks on the deep bands only */
}

/* On the petrol bands the deep green marks are too dim; use the logo's light green for bullets, ticks and rules. */
.tone-dark .checklist li::before { border-color: var(--lime); }
.tone-dark .prose li::marker { color: var(--lime); }
.tone-dark .rule { background: var(--lime); }

/* The kit's contact details assume a light section; MD Accounting's consultation band is dark. */
.tone-dark .contact-details li { border-color: rgba(255, 255, 255, .16); }
.tone-dark .contact-details strong { color: var(--white); }
.tone-dark .contact-details svg { color: var(--lime); }
.tone-dark .form-card h3 { color: var(--brand); } /* the white form card keeps a dark heading */

/* In-page anchors (#services, #about, #details) sit on headings inside prose blocks, because kit sections
   other than "contact" take no id; keep them clear of the sticky header. */
h2[id], h3[id] { scroll-margin-top: 110px; }
/* A kicker directly above such a heading stays attached to it. */
.section-head:has(+ .prose > h2:first-child) { margin-bottom: 0; }
/* A heading-less cards section continues the prose section above it (same tone): one block, not two. */
.section.tone-light:has(+ .section.tone-light > .wrap > .cards:first-child) { padding-bottom: 0; }
.section.tone-light + .section.tone-light:has(> .wrap > .cards:first-child) { padding-top: clamp(32px, 4vw, 48px); }