/* ========================================================================== 
   KHA DENTAL — GOLD FINISH
   One restrained metallic-gold language for headings and conversion actions.
   ========================================================================== */

:root {
	--kha-gold-gradient: linear-gradient(108deg, #74501f 0%, #a97834 36%, #d8ad58 68%, #8a5d24 100%);
	--kha-gold-gradient-hover: linear-gradient(108deg, #654218 0%, #926127 38%, #c59140 70%, #76501e 100%);
	--kha-gold-gradient-light: linear-gradient(108deg, #fff8dd 0%, #f1d58c 50%, #fffdf4 100%);
	--kha-gold-solid: #9b6d31;
	--kha-gold-deep: #684318;
	--kha-gold-focus: rgba(167, 122, 58, .34);
}

/* Primary page and section headings. Card headings are included so archive,
   search and homepage sections share the same visual language. */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
	body:not(.wp-admin) :where(.site-content, main) :is(h1, h2, h3):not(.kha-on-gold),
	body:not(.wp-admin) :where(.site-content, main) :is(h1, h2, h3):not(.kha-on-gold) > a,
	body:not(.wp-admin) :where(.site-content, main) .elementor-heading-title:not(.kha-on-gold),
	body:not(.wp-admin) .site-content .elementor .e-con.e-parent .elementor-widget.elementor-element :is(h1, h2, h3):not(.kha-on-gold),
	body.home:not(.wp-admin) .site-content .elementor.elementor-2 :is(.elementor-element-73e4dc7, .elementor-element-cd54876) h5 {
		color: var(--kha-gold-solid) !important;
		background-image: var(--kha-gold-gradient) !important;
		background-repeat: no-repeat;
		background-size: 100% 100%;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	/* Light treatment protects contrast for headings already authored in white.
	   Elementor's text editor widget often wraps the actual heading text in a
	   child <span>/<strong>/<a> with the color set there instead of on the
	   h1/h2/h3 itself (e.g. <h2><span style="color:#fff">...</span></h2>) —
	   the [style*=...] match alone misses that case, so :has() also checks
	   any styled descendant carrying the same white color. */
	body:not(.wp-admin) :where(.site-content, main) :is(h1, h2, h3):not(.kha-on-gold)[style*="color: #fff" i],
	body:not(.wp-admin) :where(.site-content, main) :is(h1, h2, h3):not(.kha-on-gold):has(*[style*="color: #fff" i]),
	body:not(.wp-admin) .site-content .elementor .e-con.e-parent .elementor-widget.elementor-element :is(h1, h2, h3):not(.kha-on-gold)[style*="color: #fff" i],
	body:not(.wp-admin) .site-content .elementor .e-con.e-parent .elementor-widget.elementor-element :is(h1, h2, h3):not(.kha-on-gold):has(*[style*="color: #fff" i]),
	body.home:not(.wp-admin) .site-content .elementor.elementor-2 .e-con.e-parent .elementor-element.elementor-element-e77f591 h2,
	body.home:not(.wp-admin) .site-content .elementor.elementor-2 .e-con.e-parent .elementor-element.elementor-element-66835ed h2,
	body.home:not(.wp-admin) .site-content .elementor.elementor-2 .e-con.e-parent .elementor-element.elementor-element-98c929a :is(h3, h5) {
		background-image: var(--kha-gold-gradient-light) !important;
	}
}

/* Shared filled actions. Utility controls and carousel arrows stay neutral. */
body:not(.wp-admin) :is(
	.site-header .header-button .button,
	.site-header button.search-submit,
	.site-content .elementor-button,
	.site-content .wp-block-button__link,
	.site-content a.button:not(.search-submit),
	.site-content button.button:not(.search-submit),
	.site-content .wp-block-search__button,
	.site-content input[type="submit"]:not(.search-submit),
	.site-content button[type="submit"]:not(.search-submit):not(.wp-block-search__button),
	.site-footer input[type="submit"]:not(.search-submit),
	.adp-popup-wrap input[type="submit"],
	.kha-search-control button,
	.kha-search-help__action a,
	.kha-aside-button
) {
	border-color: transparent !important;
	background-color: var(--kha-gold-solid) !important;
	background-image: var(--kha-gold-gradient) !important;
	background-size: 160% 100% !important;
	background-position: 0 50% !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff;
	box-shadow: 0 10px 22px -18px rgba(83, 50, 12, .72) !important;
	transition: background-position .3s ease, transform .22s ease, box-shadow .22s ease !important;
}

body:not(.wp-admin) :is(
	.site-header .header-button .button,
	.site-header button.search-submit,
	.site-content .elementor-button,
	.site-content .wp-block-button__link,
	.site-content a.button:not(.search-submit),
	.site-content button.button:not(.search-submit),
	.site-content .wp-block-search__button,
	.site-content input[type="submit"]:not(.search-submit),
	.site-content button[type="submit"]:not(.search-submit):not(.wp-block-search__button),
	.site-footer input[type="submit"]:not(.search-submit),
	.adp-popup-wrap input[type="submit"],
	.kha-search-control button,
	.kha-search-help__action a,
	.kha-aside-button
):hover {
	background-image: var(--kha-gold-gradient-hover) !important;
	background-position: 100% 50% !important;
	color: #fff !important;
	transform: translateY(-2px);
	box-shadow: 0 14px 28px -19px rgba(74, 43, 8, .8) !important;
}

body:not(.wp-admin) :is(
	.site-header .header-button .button,
	.site-header button.search-submit,
	.site-content .elementor-button,
	.site-content .wp-block-button__link,
	.site-content a.button:not(.search-submit),
	.site-content button.button:not(.search-submit),
	.site-content .wp-block-search__button,
	.site-content input[type="submit"]:not(.search-submit),
	.site-content button[type="submit"]:not(.search-submit),
	.site-footer input[type="submit"]:not(.search-submit),
	.adp-popup-wrap input[type="submit"],
	.kha-search-control button,
	.kha-search-help__action a,
	.kha-aside-button
):focus-visible {
	outline: 3px solid var(--kha-gold-focus) !important;
	outline-offset: 3px;
}

body:not(.wp-admin) :is(
	.site-header .header-button .button,
	.site-content .elementor-button,
	.site-content .wp-block-button__link,
	.site-content a.button:not(.search-submit),
	.site-content button.button:not(.search-submit),
	.site-content input[type="submit"]:not(.search-submit),
	.site-content button[type="submit"]:not(.search-submit),
	.site-footer input[type="submit"]:not(.search-submit),
	.adp-popup-wrap input[type="submit"],
	.kha-search-control button,
	.kha-search-help__action a,
	.kha-aside-button
):active {
	transform: translateY(1px) scale(.985);
	box-shadow: none !important;
}

/* Keep every glyph readable, including the search icon reported on hover. */
body:not(.wp-admin) :is(
	.site-header button.search-submit,
	.kha-search-control button,
	.site-content .elementor-button
) :is(svg, svg path, i, .nevo-icon, .elementor-button-icon, .elementor-button-text) {
	color: #fff !important;
	fill: currentColor !important;
	-webkit-text-fill-color: currentColor;
	opacity: 1 !important;
}

/* Footer CTA participates in the same system despite living outside content. */
body:not(.wp-admin) .site-footer .boxrightft-cusbtndangky a {
	border-color: transparent !important;
	background: var(--kha-gold-gradient) !important;
	color: #fff !important;
	box-shadow: 0 10px 22px -18px rgba(83, 50, 12, .72) !important;
}

body:not(.wp-admin) .site-footer .boxrightft-cusbtndangky a:hover {
	background: var(--kha-gold-gradient-hover) !important;
	color: #fff !important;
}

@media (prefers-reduced-motion: reduce) {
	body:not(.wp-admin) :is(a, button, input[type="submit"]) {
		transition-duration: .01ms !important;
	}
}