/* KD Home base. Everything is scoped under main.kd-home. Owner: foundation (A).
   Specificity note: Elementor kit (.elementor-kit-6 h1 = 0,1,1) and Hello reset
   (h1, a, button = 0,0,1) leak in, so element resets use main.kd-home (0,1,2)
   and utilities use .kd-home .kd-x (0,2,0). */

/* ---------- Reset of Hello / Elementor leakage ---------- */
main.kd-home {
	display: block;
	margin: 0;
	padding: 0;
	max-width: none;
	width: 100%;
	overflow-x: clip;
	background: var(--kdh-white);
	color: var(--kdh-ink);
	font-family: var(--kdh-font-body);
	font-size: var(--kdh-fs-body);
	line-height: var(--kdh-lh-body);
	-webkit-font-smoothing: antialiased;
}
main.kd-home *,
main.kd-home *::before,
main.kd-home *::after { box-sizing: border-box; }

main.kd-home :is(h1, h2, h3, h4, h5, h6) {
	margin: 0;
	padding: 0;
	font-family: var(--kdh-font-head);
	font-weight: 600;
	color: var(--kdh-navy);
	text-transform: none;
	letter-spacing: normal;
	text-wrap: balance;
}
main.kd-home p {
	margin: 0;
	font-family: var(--kdh-font-body);
	font-size: var(--kdh-fs-body);
	line-height: var(--kdh-lh-body);
	color: var(--kdh-ink);
}
main.kd-home :is(ul, ol) { margin: 0; padding: 0; }
main.kd-home img,
main.kd-home svg { max-width: 100%; height: auto; border: 0; }
main.kd-home figure { margin: 0; }
main.kd-home a { background: transparent; text-decoration: none; }
main.kd-home .wp-block-group,
main.kd-home .wp-block-columns,
main.kd-home .wp-block-column { margin-block: 0; }
/* WordPress "constrained" layout injects auto margins / max-widths on children: neutralise */
main.kd-home .wp-block-group.is-layout-constrained > *,
main.kd-home .wp-block-group.is-layout-flow > * { margin-block-start: 0; margin-block-end: 0; }
main.kd-home .wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: none; margin-left: 0; margin-right: 0;
}

/* ---------- Layout ---------- */
/* Full-bleed section band: put on the outer group. */
.kd-home .kd-section {
	position: relative;
	width: 100%;
	max-width: none;
	margin: 0;
	padding-block: var(--kdh-s-64);
	padding-inline: 0;
	overflow: clip;
}
@media (min-width: 1024px) {
	.kd-home .kd-section { padding-block: var(--kdh-s-96); }
}
/* Content container: 1320 max, gutters 16 / 32 / 60. */
.kd-home .kd-container {
	width: min(var(--kdh-max), 100% - 2 * var(--kdh-gutter));
	max-width: var(--kdh-max);
	margin-inline: auto;
	padding: 0;
}
.kd-home .kd-bg-cloud { background: var(--kdh-cloud); }
.kd-home .kd-bg-navy { background: var(--kdh-navy); color: var(--kdh-white); }
.kd-home .kd-bg-white { background: var(--kdh-white); }
/* The live footer carries a 60px top margin; on this template the last band meets it flush.
   General sibling (~): hosts inject <script> tags between main and the footer. Only pages
   with main.kd-home are touched. */
main.kd-home ~ .footer { margin-top: 0; }
.kd-home .kd-center { text-align: center; }

/* ---------- Type utilities ---------- */
.kd-home .kd-display,
.kd-home .kd-h1,
.kd-home .kd-h2,
.kd-home .kd-h3,
.kd-home .kd-h4 {
	font-family: var(--kdh-font-head);
	font-weight: 600;
	color: var(--kdh-navy);
	text-transform: none;
}
.kd-home .kd-display { font-size: var(--kdh-fs-display); line-height: var(--kdh-lh-display); letter-spacing: var(--kdh-ls-display); }
.kd-home .kd-h1 { font-size: var(--kdh-fs-h1); line-height: var(--kdh-lh-h1); letter-spacing: var(--kdh-ls-h2); }
.kd-home .kd-h2 { font-size: var(--kdh-fs-h2); line-height: var(--kdh-lh-h2); letter-spacing: var(--kdh-ls-h2); }
.kd-home .kd-h3 { font-size: var(--kdh-fs-h3); line-height: var(--kdh-lh-h3); letter-spacing: -0.005em; }
.kd-home .kd-h4 { font-size: var(--kdh-fs-h4); line-height: var(--kdh-lh-h4); }
.kd-home .kd-eyebrow {
	font-family: var(--kdh-font-head);
	font-size: var(--kdh-fs-eyebrow);
	font-weight: 500;
	line-height: 1.375;
	letter-spacing: var(--kdh-ls-eyebrow);
	text-transform: uppercase;
	color: var(--kdh-blue-ink);
}
.kd-home .kd-lead {
	font-family: var(--kdh-font-body);
	font-size: var(--kdh-fs-lead);
	font-weight: 400;
	line-height: var(--kdh-lh-lead);
	color: var(--kdh-ink);
}
.kd-home .kd-body { font-size: var(--kdh-fs-body); line-height: var(--kdh-lh-body); }
.kd-home .kd-small { font-size: var(--kdh-fs-small); line-height: 1.5; }
.kd-home .kd-label { font-family: var(--kdh-font-head); font-size: var(--kdh-fs-label); font-weight: 500; line-height: 1.4; }
.kd-home .kd-quote { font-family: var(--kdh-font-body); font-size: var(--kdh-fs-quote); line-height: 1.5; }
.kd-home .kd-card-title { font-family: var(--kdh-font-head); font-size: var(--kdh-fs-card-title); font-weight: 600; line-height: 1.3; color: var(--kdh-navy); }
/* Green punctuation pop: <span class="kd-punct">?</span> */
.kd-home .kd-punct { color: var(--kdh-green); }
.kd-home .kd-on-dark,
.kd-home .kd-bg-navy :is(h1, h2, h3, h4, p) { color: var(--kdh-white); }

/* Decorative shapes: <div class="kd-shape" aria-hidden="true"><img alt="" ...></div> */
.kd-home .kd-shape { position: absolute; display: block; margin: 0; pointer-events: none; line-height: 0; }
.kd-home .kd-shape img { display: block; width: 100%; height: 100%; max-width: none; }

/* Visually hidden helper */
.kd-home .kd-sr-only {
	position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- Buttons (Figma Button 12:111) ----------
   Markup: <div class="wp-block-buttons"><div class="wp-block-button kd-btn kd-btn--primary">
           <a class="wp-block-button__link wp-element-button" href="">LET'S TALK</a></div></div>
   Variants: kd-btn--primary | --navy | --blue | --on-dark | --text. Add .is-disabled / aria-disabled for disabled. */
.kd-home .wp-block-buttons { display: flex; flex-wrap: wrap; gap: var(--kdh-s-16); align-items: center; margin: 0; padding: 0; }
.kd-home .wp-block-buttons > .wp-block-button { margin: 0; width: auto; }
.kd-home .kd-btn .wp-block-button__link,
.kd-home a.kd-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--kdh-s-8);
	min-height: 48px;
	padding: var(--kdh-s-16) var(--kdh-s-32);
	border: 2px solid transparent;
	border-radius: var(--kdh-r-pill);
	font-family: var(--kdh-font-head);
	font-size: var(--kdh-fs-button);
	font-weight: 600;
	line-height: 1;
	letter-spacing: var(--kdh-ls-button);
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: none;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
/* The arrow: 20px, 2px stroke, currentColor (Icon/arrow-right) */
.kd-home .kd-btn .wp-block-button__link::after,
.kd-home a.kd-btn::after {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask: var(--kdh-arrow) center / contain no-repeat;
	mask: var(--kdh-arrow) center / contain no-repeat;
}
.kd-home .kd-btn--noarrow .wp-block-button__link::after { display: none; }
.kd-home {
	--kdh-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10h12M11 5l5 5-5 5'/%3E%3C/svg%3E");
}

/* Primary: green, NAVY label (white on green fails contrast) */
.kd-home .kd-btn--primary .wp-block-button__link { background: var(--kdh-green); color: var(--kdh-navy); }
.kd-home .kd-btn--primary .wp-block-button__link:hover { background: var(--kdh-green-hover); color: var(--kdh-navy); }
/* Secondary / navy */
.kd-home .kd-btn--navy .wp-block-button__link { background: var(--kdh-navy); color: var(--kdh-white); }
.kd-home .kd-btn--navy .wp-block-button__link:hover { background: var(--kdh-navy-hover); color: var(--kdh-white); }
/* Blue */
.kd-home .kd-btn--blue .wp-block-button__link { background: var(--kdh-blue-ink); color: var(--kdh-white); }
.kd-home .kd-btn--blue .wp-block-button__link:hover { background: var(--kdh-blue-ink-hover); color: var(--kdh-white); }
/* On dark: white outline, hover fills white */
.kd-home .kd-btn--on-dark .wp-block-button__link { background: transparent; color: var(--kdh-white); border-color: var(--kdh-white); }
.kd-home .kd-btn--on-dark .wp-block-button__link:hover { background: var(--kdh-white); color: var(--kdh-navy); border-color: var(--kdh-white); }
/* Text link */
.kd-home .kd-btn--text .wp-block-button__link {
	background: transparent; color: var(--kdh-blue-ink); border: 0; border-radius: var(--kdh-r-pill);
	padding: var(--kdh-s-12) 0;
}
.kd-home .kd-btn--text .wp-block-button__link:hover { background: transparent; color: var(--kdh-blue-ink-hover); }
.kd-home .kd-btn--text .wp-block-button__link:hover::after { transform: translateX(3px); }
.kd-home .kd-btn--text .wp-block-button__link::after { transition: transform .15s ease; }

/* Focus */
.kd-home .kd-btn .wp-block-button__link:focus { outline: none; }
.kd-home .kd-btn .wp-block-button__link:focus-visible { outline: none; box-shadow: var(--kdh-focus-light); }
.kd-home .kd-btn--on-dark .wp-block-button__link:focus-visible { box-shadow: none; outline: 2px solid var(--kdh-white); outline-offset: 4px; }
.kd-home .kd-btn--text .wp-block-button__link:focus-visible { box-shadow: none; outline: 2px solid var(--kdh-navy); outline-offset: 4px; border-radius: var(--kdh-r-sm); }
/* Disabled */
.kd-home .kd-btn .wp-block-button__link[aria-disabled="true"],
.kd-home .kd-btn.is-disabled .wp-block-button__link { opacity: .4; pointer-events: none; }

/* Generic in-copy link inside .kd-home */
.kd-home :is(p, li) a:not(.wp-block-button__link) { color: var(--kdh-blue-ink); text-decoration: underline; text-underline-offset: 3px; }
.kd-home a:focus-visible { outline: 2px solid var(--kdh-navy); outline-offset: 3px; border-radius: 2px; }

/* Phone: stack button rows */
@media (max-width: 767.98px) {
	.kd-home .kd-buttons-stack.wp-block-buttons { flex-direction: column; align-items: center; }
}

@media (prefers-reduced-motion: reduce) {
	.kd-home *, .kd-home *::before, .kd-home *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
