/* (The --mkl-warm-* terracotta tokens were deleted 2026-06 with the shadowed MKL
   rules below — mod-legacy's green re-theme at wp_head 210 owns that page now.) */

/* ───────────────────────────────────────────────────────────────────
 * 1. Home CTA promo was WHITE TEXT ON A WHITE SECTION (invisible).
 *    Turn the Divi promo into a dark-green CTA card so its white text shows.
 * ─────────────────────────────────────────────────────────────────── */
#main-content .et_pb_promo {
	background: var(--mod-primary-strong) !important;
	border-radius: var(--mod-radius-lg);
	padding: clamp(36px, 5vw, 64px) clamp(24px, 4vw, 56px) !important;
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
}
#main-content .et_pb_promo h1,
#main-content .et_pb_promo h2,
#main-content .et_pb_promo h3,
#main-content .et_pb_promo .et_pb_promo_description,
#main-content .et_pb_promo .et_pb_promo_description * { color: #fff !important; }
/* visible button: white fill, dark-green label — full pill geometry, not just
   colors (color-only rules left it rendering as a bare white text box) */
#main-content .et_pb_promo .et_pb_promo_button,
#main-content .et_pb_promo .et_pb_promo_button:visited {
	display: inline-block;
	background: #fff !important;
	color: var(--mod-primary-strong) !important;
	border: 2px solid #fff !important;
	border-radius: 999px !important;
	padding: 13px 30px !important;
	font-family: var(--mod-font-body) !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none !important;
	margin-top: 18px;
	transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
#main-content .et_pb_promo .et_pb_promo_button:hover {
	background: var(--mod-accent-soft) !important;
	color: var(--mod-primary-strong) !important;
	border-color: var(--mod-accent-soft) !important;
	transform: translateY(-1px);
}

/* Events page title band: the legacy et_pb_fullwidth_header gets the modernize
 * layer's dark overlay (::before) but its H1 kept the near-black ink color —
 * dark-on-dark. Style it as a proper page-title band: white centered heading
 * above the overlay. */
#main-content .et_pb_fullwidth_header {
	position: relative;
	padding: clamp(44px, 6vw, 84px) 6vw;
	text-align: center;
}
#main-content .et_pb_fullwidth_header .et_pb_row {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
}
#main-content .et_pb_fullwidth_header h1 {
	color: #fff !important;
	text-shadow: 0 2px 24px rgba(0, 0, 0, .35);
	margin: 0 !important;
	font-size: clamp(34px, 4.4vw, 60px);
}

/* The hero CTA (et_pb_more_button — used ONLY on the dark-green Home hero):
 * a green-on-green pill sat flat against the band. Design pass 2026-07: white
 * pill in the site button system (uppercase Inter, .04em tracking, hover lift),
 * warm gold hover matching the promo button. */
#main-content .et_pb_more_button,
#main-content .et_pb_more_button:visited {
	display: inline-block;
	background: #fff !important;
	color: var(--mod-primary-strong) !important;
	border: 2px solid #fff !important;
	border-radius: 999px !important;
	padding: 13px 30px !important;
	font-family: var(--mod-font-body) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	letter-spacing: .04em;
	text-transform: uppercase;
	box-shadow: 0 10px 30px -12px rgba(0, 0, 0, .45);
	transition: background .15s ease, border-color .15s ease, transform .15s ease, box-shadow .2s ease;
}
#main-content .et_pb_more_button::after { display: none; }
#main-content .et_pb_more_button:hover {
	background: var(--mod-accent-soft) !important;
	border-color: var(--mod-accent-soft) !important;
	color: var(--mod-primary-strong) !important;
	transform: translateY(-1px);
	box-shadow: 0 8px 26px -8px rgba(26, 58, 44, .55);
}

/* ───────────────────────────────────────────────────────────────────
 * 2. Divi's light green (#7cc68d) for links / titles on LIGHT backgrounds
 *    only scores ~2:1. Darken to the brand primary green (5.95:1 on white).
 *    Dark sections set their own light link colors and are left alone.
 * ─────────────────────────────────────────────────────────────────── */
#main-content .et_pb_text a:not(.et_pb_button),
#main-content .et_pb_blurb .et_pb_module_header,
#main-content .et_pb_blurb .et_pb_module_header a,
#main-content .et_pb_blurb h4,
#main-content .et_pb_blurb h4 a,
#main-content .et_pb_promo_description a {
	color: var(--mod-primary) !important;
}

/* Project portfolio cards: titles + category meta were light-green on white. */
#main-content .et_pb_portfolio_item h2,
#main-content .et_pb_portfolio_item h2 a,
#main-content .et_pb_portfolio_item h3,
#main-content .et_pb_portfolio_item h3 a,
#main-content .et_pb_portfolio_item .et_pb_module_header,
#main-content .et_pb_portfolio_item .et_pb_module_header a { color: var(--mod-ink) !important; }
#main-content .et_pb_portfolio_item .post-meta,
#main-content .et_pb_portfolio_item .post-meta a,
#main-content .et_pb_portfolio_categories a { color: var(--mod-ink-muted) !important; }

/* "Other projects" cards sit on the dark ink strip but the <a> base colour was the
   light Divi green — force white text (keep the gold eyebrow + arrow accents). */
#main-content .mod-other-card,
#main-content .mod-other-card .mod-other-name { color: #fff !important; }
#main-content .mod-other-card .mod-other-eyebrow { color: var(--mod-accent-soft) !important; }
#main-content .mod-other-card .mod-other-arrow { color: var(--mod-accent) !important; }

/* Divi's single-post navigation ("next/previous project") links were light green on white. */
#main-content .nav-single a,
#main-content .nav-next a,
#main-content .nav-previous a,
#main-content .post-navigation a { color: var(--mod-primary) !important; }

/* .et_color_scheme_green mint leaks (design pass 2026-07): Divi's dynamic CSS ships
 * `.et_color_scheme_green a{color:#7cc68d}` at (0,1,1) which beat these two intended
 * colors — 404/search tile labels washed mint, the project back-link went unreadable. */
.mod-404__tile { color: var(--mod-ink) !important; }
#main-content .mod-back-link { color: rgba(255, 253, 247, .78) !important; }
#main-content .mod-back-link:hover { color: #fff !important; }

/* ───────────────────────────────────────────────────────────────────
 * Legacy About/Contact re-token (design pass 2026-07): those pages' in-DB
 * stylesheets carry a pre-modernize green family (#6fb46f / #3d7a3d, faux-800
 * Inter stat numbers, mint feature tiles) that reads as a different site next
 * to the token palette. !important because the in-DB <style> prints in <body>.
 * ─────────────────────────────────────────────────────────────────── */
#main-content .md-about-story,
#main-content .md-contact-main { background: var(--mod-bg) !important; }
#main-content .md-about-work { background: var(--mod-surface) !important; }
#main-content .md-stat { border-top-color: var(--mod-accent) !important; }
#main-content .md-stat-num {
	font-family: var(--mod-font-display);
	font-weight: 600 !important;
	color: var(--mod-primary-strong) !important;
	letter-spacing: 0;
}
#main-content .md-info-card { border-left-color: var(--mod-primary) !important; }
#main-content .md-contact-h2::after { background: linear-gradient(90deg, var(--mod-primary), var(--mod-primary-strong)) !important; }
#main-content .md-feature { background: var(--mod-bg) !important; border-color: var(--mod-line) !important; }
#main-content .md-feature:hover {
	background: var(--mod-surface) !important;
	border-color: var(--mod-primary-soft) !important;
	box-shadow: var(--mod-shadow-card-hover) !important;
}

/* Contact band: the stored code module whitens only `.md-contact-hero h1`, but the
 * title was demoted to h2 in the heading-order fix — it rendered near-black on the
 * dark green band (flagged by 4 of 5 design critics). */
#main-content .md-contact-hero h2 {
	color: #fff !important;
	font-size: clamp(30px, 3.2vw, 42px) !important;
	margin: 0 0 8px !important;
	text-shadow: 0 2px 8px rgba(0, 0, 0, .25);
}
#main-content .md-contact-grid { align-items: stretch; }
#main-content .md-contact-form-card {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

/* Off-palette OS emoji icons (About/Contact card tiles) → bronze monotone so
 * the last uncontrolled hues sit inside the palette. Home's .mod-service-icon is
 * deliberately excluded (its tile is already token-green). */
#main-content .md-feature-icon,
#main-content .md-info-icon {
	filter: grayscale(1) sepia(.9) hue-rotate(-8deg) saturate(1.2) brightness(1);
}

/* (Comment-area link rules deleted 2026-06 — mod-comments.php force-closes comments
   site-wide, so the elements never render.) */

/* Privacy (Gutenberg) page is all light — darken its content + external links. */
.page-id-3 #main-content a:not(.et_pb_button) { color: var(--mod-primary) !important; }
/* Gutenberg search-block button (search form / 404) — make it the primary pill. */
.wp-block-search__button {
	background: var(--mod-primary) !important;
	color: #fff !important;
	border-color: var(--mod-primary) !important;
}

/* My modernize ghost CTA was being overridden to the light Divi green. */
.mod-approach-cta { color: var(--mod-primary) !important; }
.mod-approach-cta:hover { color: #fff !important; }

/* Events menu actions sit inside a legacy code module whose later in-body link
 * color would otherwise override the externalized component stylesheet. */
.mod-menus .mod-menu-link--html,
.mod-menus .mod-menu-link--html:visited { color: #fff !important; }
.mod-menus .mod-menu-link--pdf,
.mod-menus .mod-menu-link--pdf:visited { color: var(--mod-primary-strong) !important; }
.mod-menus .mod-menu-link:hover { color: #fff !important; }

/* ───────────────────────────────────────────────────────────────────
 * 3. Pre-footer "Request a quote" gold button: white-on-gold was 3.22.
 *    White fill + dark-green label reads at ~11:1 and looks premium on green.
 * ─────────────────────────────────────────────────────────────────── */
.mod-prefooter .btn-primary {
	background: #fff !important;
	color: var(--mod-primary-strong) !important;
	border-color: #fff !important;
}
.mod-prefooter .btn-primary:hover {
	background: var(--mod-accent-soft) !important;
	color: var(--mod-primary-strong) !important;
	border-color: var(--mod-accent-soft) !important;
}

/* ───────────────────────────────────────────────────────────────────
 * 4. About hero: white text on a medium-green gradient was 2.49.
 *    Re-base it on the brand's dark greens (white text → ~6.3:1).
 * ─────────────────────────────────────────────────────────────────── */
#main-content .md-about-hero,
#main-content .md-contact-hero {
	background-color: var(--mod-primary-strong) !important;
	background-image: linear-gradient(135deg, #2d6a4f 0%, #1a3a2c 100%) !important;
}
/* Contact-page body links + tel/mailto + map links were light Divi green on white. */
#main-content .et_pb_blurb a:not(.et_pb_button),
#main-content .et_pb_contact a,
#main-content .mod-map a,
#main-content .mod-map-meta a,
#main-content a[href^="tel:"],
#main-content a[href^="mailto:"],
a.mod-tel { color: var(--mod-primary) !important; }
/* About section eyebrow tags + work categories + CTA were medium/light green. */
#main-content .md-section-tag,
#main-content .md-work-cat { color: var(--mod-primary) !important; }
/* "Let's create something memorable" CTA was a light-green gradient button with
   low-contrast text either way — make it a solid dark-green pill with white text. */
#main-content .md-cta-btn,
#main-content .md-cta-btn:visited {
	background-image: none !important;
	background-color: var(--mod-primary) !important;
	color: #fff !important;
	border-color: var(--mod-primary) !important;
}
#main-content .md-cta-btn:hover {
	background-color: var(--mod-primary-strong) !important;
	color: #fff !important;
}
/* About stat-card labels (were ink-soft ~3.75). (.mod-approach-stats dt removed —
   fixed at origin in mod-content; .md-stat-label stays: its origin is in-DB page CSS.) */
#main-content .md-stat-label { color: var(--mod-ink-muted) !important; }

/* ───────────────────────────────────────────────────────────────────
 * 6. Small muted labels just under AA. (.mod-menu-meta and .mod-quote cite were
 *    removed — fixed at origin in mod-content; the Divi-core more-link remains.)
 * ─────────────────────────────────────────────────────────────────── */
.et_pb_portfolio_item .et_portfolio_more_link { color: var(--mod-ink-muted) !important; }