/*
 * DAY ONE design system, layer 1 (WEB-037a, 2026-10-21).
 * Source: redesign/03-Foundations/design-system-plan.md (approved D70-D79, D82).
 *
 * Loads AFTER style-min.css (see inc/scripts.php). Two jobs only:
 *   1. Define the design tokens as CSS custom properties (no visual effect on their own).
 *   2. Fix the contrast failures measured on 21 Oct (seo/contrast-probe.py):
 *      white on Emerald (2.49:1) and Emerald on white (2.49:1), both banned by BR-3.
 * Rollback: remove the 'dayone-system' wp_enqueue_style line in inc/scripts.php.
 * Typography (Archivo, sentence case) is a separate change (WEB-037b), not this file.
 */

:root {
	--c-obsidian: #070707;
	--c-oxford: #132436;
	--c-teal: #014745;
	--c-teal-hover: #026560;
	--c-emerald: #00BC72;
	--c-ink: #1E293B;
	--c-ink-2: #475569;
	--c-ink-3: #64748B;
	--c-rule: #94A3B8;
	--c-border: #E2E8F0;
	--c-surface: #F0F2F5;
	--c-surface-teal: #E6F2F1;
	--c-on-dark: #FFFFFF;
	--c-on-dark-2: #94A3B8;
	--c-error: #B91C1C;
	--c-error-dark: #FCA5A5;
	--r-card: 4px;
	--r-pill: 999px;
	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

/* 1. Primary buttons: Emerald fill with Obsidian ink (8.09:1). Same selector list as the theme so this wins on order. */
body .gform_wrapper form .gform_footer button,
.btn,
.gform_wrapper.gform-theme.gform-theme--framework.gform_wrapper button.btn.gform_button,
input[type='submit'],
.wp-block-button a,
.wp-block-button a .btn-text,
.btn .btn-text,
body .btn.has-primary,
body .gform_wrapper.gform-theme.gform-theme--framework.gform_wrapper button.btn.gform_button.has-primary {
	color: var(--c-obsidian) !important;
}

body .gform_wrapper form .gform_footer button:hover,
.btn:hover,
.gform_wrapper.gform-theme.gform-theme--framework.gform_wrapper button.btn.gform_button:hover,
input[type='submit']:hover,
.wp-block-button a:hover {
	/* was: white background with Emerald text (2.49:1) */
	background: var(--c-emerald);
	color: var(--c-obsidian) !important;
	box-shadow: 0 0 0 4px rgb(0 188 114 / 0.3);
}

body .btn.has-primary:hover,
body .gform_wrapper.gform-theme.gform-theme--framework.gform_wrapper button.btn.gform_button.has-primary:hover {
	background: var(--c-emerald);
	color: var(--c-obsidian) !important;
}

/* Teal buttons keep white ink (10.56:1); hover goes to Teal hover, not white. */
.btn.has-dark,
.wp-block-button.is-style-has-dark a,
div.is-style-has-dark a {
	color: var(--c-on-dark) !important;
}

.btn.has-dark:hover,
.wp-block-button.is-style-has-dark a:hover,
div.is-style-has-dark a:hover {
	background: var(--c-teal-hover);
	color: var(--c-on-dark) !important;
	box-shadow: none;
}

/* White buttons: Teal ink instead of Emerald (10.56:1). */
.btn.has-light {
	color: var(--c-teal) !important;
}

.btn.has-light:hover {
	background: var(--c-teal);
	color: var(--c-on-dark) !important;
	box-shadow: none;
}

/* 2. Text on Emerald bands: Obsidian, not white. */
section.guarantee .guarantee--content h2.title,
section.guarantee .guarantee--content h2.title span,
section.guarantee .guarantee--content p,
section.testimonials .testimonials--heading h2.title,
section.testimonials .testimonials--heading h2.title span,
section.vision ul li,
section.vision ol li,
section.vision .vision--wrapper-cont-text ul li,
section.vision .vision--wrapper-cont-text ol li,
body section.vision div.vision--wrapper-cont-text ol li,
body section.vision div.vision--wrapper-cont-text ul li {
	color: var(--c-obsidian) !important;
}

/* 3. Emerald on white or light grounds becomes Deep Forest Teal (10.56:1). */
section.white-bg h1 span,
section.white-bg h2 span,
section.white-bg h3 span,
section.light-bg h1 span,
section.light-bg h2 span,
section.light-bg h3 span,
section.integrations.white-bg h2.title,
section.media-text-tools h2.has-primary-color,
section.founders.white-bg span,
section.statistics .about--count,
section.statistics .suffix,
footer.footer .gform_wrapper ~ * span,
footer.footer [class*='form'] h2 span,
footer.footer [class*='form'] h3 span,
footer.footer .footer--top-text h2 span {
	color: var(--c-teal) !important;
}

/* 4. White text on green gradient cards: a solid Teal ground behind the text (10.56:1).
   BR-4 retires these gradients; the cards themselves are replaced in the template rebuild (WEB-039). */
section.showcase .showcase--slider-item,
section.quick-start .quick-start--colums-item-boxes-item {
	background: var(--c-teal) !important;
	background-image: none !important;
}

section.showcase .showcase--slider-item-text {
	background: transparent !important;
	background-image: none !important;
}

/* Keyboard focus stays visible on every ground. */
.btn:focus-visible,
.wp-block-button a:focus-visible,
input[type='submit']:focus-visible {
	outline: 2px solid var(--c-emerald);
	outline-offset: 2px;
}