/**
 * BlueMed Dental — global design system (approved homepage palette).
 * Colors, surfaces, buttons, navigation, footer, shared components only.
 */

:root {
	--primary-50: #EEF3FC;
	--primary-100: #DCE8F8;
	--primary-200: #C2D6F3;
	--primary-300: #9DBCEB;
	--primary-400: #6D98DF;
	--primary-500: #3E6FCD;
	--primary-600: #153D8A;
	--primary-700: #12367A;
	--primary-800: #102F6A;
	--primary-900: #0C2554;

	--bg-primary: #F8F9FD;
	--bg-secondary: #F4F5FA;
	--bg-soft: #F0F3FA;
	--surface-primary: #FFFFFF;
	--surface-secondary: #F8F9FD;
	--border-light: #E2E7F1;
	--border-default: #DCE4EF;
	--glass-1: #EAF0FA;
	--glass-2: #D9E2ED;
	--glass-3: #CDD8E4;
	--text-secondary: #5B6068;
	--text-muted: #8B969B;
	--accent-hover: var(--primary-700);
	--accent-light: var(--primary-500);
	--accent-pressed: var(--primary-800);
	--accent-focus-ring: rgba(21, 61, 138, 0.18);
	--accent-overlay-04: rgba(21, 61, 138, 0.04);
	--accent-overlay-08: rgba(21, 61, 138, 0.08);
	--accent-overlay-12: rgba(21, 61, 138, 0.12);
	--accent-overlay-16: rgba(21, 61, 138, 0.16);

	--text-primary: #33343D;
	--text-heading: #33343D;
	--text-on-dark: #ffffff;
	--text-on-dark-soft: #F8F9FD;
	--accent-primary: var(--primary-600);
	--accent-primary-hover: var(--primary-700);
	--accent-secondary: #EAF0FA;
	--background-primary: #F8F9FD;
	--background-secondary: #F4F5FA;
	--bluemed-white: #FFFFFF;
	--bluemed-sand: #F8F9FD;
	--bluemed-oak: #CDD8E4;
	--bluemed-ash: #8B969B;
	--bluemed-graphite: var(--primary-600);
	--bluemed-spa: #EAF0FA;
	--bluemed-spa-soft: #F0F3FA;
	--bluemed-spa-muted: rgba(234, 240, 250, 0.55);
	--bluemed-terracotta-deep: var(--primary-700);
	--bluemed-terracotta-soft: var(--primary-500);
	--bluemed-line: rgba(226, 231, 241, 0.72);

	--bm-sand-deep: #EAF0FA;
	--bm-sand-subtle: #F0F3FA;
	--bm-oak-deep: #CDD8E4;
	--bm-graphite-soft: var(--primary-500);

	--bluemed-shadow-soft: 0 20px 56px rgba(51, 52, 61, 0.06);
	--bluemed-shadow-card: 0 10px 36px rgba(51, 52, 61, 0.04), 0 1px 0 rgba(255, 255, 255, 0.8) inset;
	--bm-shadow-hero: 0 40px 100px rgba(51, 52, 61, 0.08), 0 8px 32px rgba(21, 61, 138, 0.04);
	--bm-shadow-xl: 0 32px 80px rgba(51, 52, 61, 0.09), 0 6px 20px rgba(21, 61, 138, 0.05);
	--bm-shadow-float: 0 16px 48px rgba(51, 52, 61, 0.08), 0 2px 8px rgba(21, 61, 138, 0.04);

	--wp--preset--color--sand: #F8F9FD;
	--wp--preset--color--surface: #F4F5FA;
	--wp--preset--color--text: #33343D;
	--wp--preset--color--heading: #33343D;
	--wp--preset--color--oak: var(--primary-500);
	--wp--preset--color--ash: #8B969B;
	--wp--preset--color--graphite: var(--primary-600);
	--wp--preset--color--spa: #EAF0FA;
}

body {
	background-color: var(--bg-primary);
	color: var(--text-primary);
}

::selection {
	background-color: var(--accent-overlay-12);
	color: var(--text-primary);
}

a:focus-visible,
.wp-block-button__link:focus-visible,
.wp-element-button:focus-visible,
.bluemed-nav a:focus-visible {
	outline-color: var(--accent-primary);
}

/* —— Header & navigation —— */
.bluemed-header {
	border-bottom-color: var(--border-light);
	background-color: rgba(255, 255, 255, 0.94) !important;
}

.bluemed-header.is-scrolled {
	box-shadow: 0 4px 24px rgba(51, 52, 61, 0.06), 0 1px 0 var(--border-light) !important;
}

.bluemed-header__cta .wp-block-button__link {
	background-color: var(--accent-primary) !important;
	box-shadow: 0 8px 24px rgba(21, 61, 138, 0.14) !important;
}

.bluemed-header__cta .wp-block-button__link:hover {
	background-color: var(--accent-hover) !important;
	box-shadow: 0 14px 36px rgba(21, 61, 138, 0.18) !important;
}

.bluemed-nav .wp-block-navigation__responsive-container-open {
	border-color: var(--border-default);
}

.bluemed-nav .wp-block-navigation__responsive-container-open:hover {
	border-color: var(--glass-3);
}

.bluemed-mega-card__link:hover,
.bluemed-mega-card__link:focus-visible {
	color: #ffffff !important;
}

.bluemed-mega-card__link:hover .bluemed-mega-card__title,
.bluemed-mega-card__link:focus-visible .bluemed-mega-card__title {
	color: #ffffff !important;
}

.bluemed-mega-card__link:hover .bluemed-mega-card__media--icon .bluemed-lucide,
.bluemed-mega-card__link:focus-visible .bluemed-mega-card__media--icon .bluemed-lucide {
	color: #ffffff !important;
	stroke: #ffffff !important;
}

/* —— Section accents (shared) —— */
.bluemed-section-kicker {
	color: var(--accent-light);
}

.bluemed-section-kicker::before {
	background: var(--accent-light);
}

.bluemed-section-ornament::before,
.bluemed-section-ornament::after {
	background: linear-gradient(90deg, transparent, rgba(205, 216, 228, 0.75), transparent);
}

/* —— Shared CTA band —— */
.bluemed-home-cta--art,
.bluemed-home-cta--photo,
.bluemed-cta-band.bluemed-home-cta.bluemed-home-cta--art,
.bluemed-home-cta.bluemed-home-cta--art.alignfull {
	background-color: var(--accent-primary) !important;
	background-image:
		linear-gradient(rgba(21, 61, 138, 0.82), rgba(21, 61, 138, 0.82)),
		var(--bluemed-cta-bg-image, url("/wp-content/uploads/2026/05/920.webp")) !important;
	background-size: cover !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
}

.bluemed-home-cta__glow {
	background: radial-gradient(ellipse at center, rgba(234, 240, 250, 0.14) 0%, transparent 65%);
}

.bluemed-home-cta--art .bluemed-home-cta__glow {
	background: radial-gradient(ellipse at center, rgba(234, 240, 250, 0.16) 0%, transparent 62%);
}

.bluemed-home-cta--art h2 {
	text-shadow: 0 2px 40px rgba(18, 54, 122, 0.28);
}

.bluemed-home-cta__pill-mark {
	color: var(--glass-2);
}

.bluemed-home-cta--art .bluemed-home-cta__btn-main .wp-block-button__link,
.bluemed-home-cta__btn-main .wp-block-button__link {
	background: var(--surface-primary) !important;
	color: var(--accent-primary) !important;
	box-shadow: 0 20px 52px rgba(21, 61, 138, 0.22) !important;
}

.bluemed-home-cta--art .bluemed-home-cta__btn-main .wp-block-button__link:hover,
.bluemed-home-cta__btn-main .wp-block-button__link:hover {
	background: var(--bg-primary) !important;
	color: var(--accent-hover) !important;
	box-shadow: 0 28px 68px rgba(21, 61, 138, 0.24) !important;
	filter: none !important;
}

.bluemed-home-cta--art .bluemed-home-cta__btn-sec .wp-block-button__link,
.bluemed-home-cta__btn-sec .wp-block-button__link {
	color: #ffffff !important;
	border-color: #ffffff !important;
	background: transparent !important;
}

.bluemed-home-cta--art .bluemed-home-cta__btn-sec .wp-block-button__link:hover,
.bluemed-home-cta__btn-sec .wp-block-button__link:hover {
	color: #ffffff !important;
	border-color: #ffffff !important;
	background: rgba(255, 255, 255, 0.12) !important;
}

/* —— Cards & buttons —— */
.is-style-bluemed-card {
	border: 1px solid var(--border-light);
}

.is-style-bluemed-card:hover {
	background-color: var(--bg-soft);
}

a:where(:not(.wp-block-button__link):not(.bluemed-mega-card__link):not(.bluemed-mega-footer__cta)) {
	color: var(--accent-primary);
}

a:where(:not(.wp-block-button__link):not(.bluemed-mega-card__link):not(.bluemed-mega-footer__cta)):hover {
	color: var(--accent-hover);
}

.wp-block-button.is-style-outline:not(.bluemed-home-cta__btn-sec) .wp-block-button__link {
	color: var(--accent-primary) !important;
	border-color: rgba(21, 61, 138, 0.32) !important;
}

.wp-block-button.is-style-outline:not(.bluemed-home-cta__btn-sec) .wp-block-button__link:hover,
.bluemed-hero-lux__cta-secondary .wp-block-button__link:hover {
	background-color: var(--primary-50) !important;
	border-color: var(--accent-primary) !important;
	color: var(--accent-hover) !important;
}

.bluemed-btn-primary .wp-block-button__link,
.has-graphite-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background-color: var(--accent-primary) !important;
	color: var(--text-on-dark) !important;
}

.bluemed-btn-primary .wp-block-button__link:hover,
.has-graphite-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
	background-color: var(--accent-hover) !important;
}

.bluemed-btn-primary .wp-block-button__link:active,
.has-graphite-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link:active {
	background-color: var(--accent-pressed) !important;
}

.has-graphite-background-color .has-white-background-color a:where(:not(.wp-block-button__link)),
.has-graphite-background-color .bluemed-testimonials-slider__quote a {
	color: var(--accent-primary) !important;
}

.has-graphite-background-color .has-white-background-color a:where(:not(.wp-block-button__link)):hover,
.has-graphite-background-color .bluemed-testimonials-slider__quote a:hover {
	color: var(--accent-hover) !important;
}

.has-sand-background-color:not(.wp-block-navigation__responsive-container),
.has-surface-background-color:not(.wp-block-navigation__responsive-container) {
	background-image: linear-gradient(180deg, rgba(234, 240, 250, 0.35) 0%, transparent 45%);
}

.has-graphite-background-color .bluemed-testimonials-slider,
.has-graphite-background-color .bluemed-testimonials-slider__viewport,
.has-graphite-background-color .bluemed-testimonials-slider__slide,
.has-graphite-background-color .has-white-background-color,
.has-graphite-background-color .has-white-background-color :where(p, li, span, .wp-block-paragraph, blockquote),
.has-graphite-background-color .is-style-bluemed-card,
.has-graphite-background-color .is-style-bluemed-card :where(p, li, span, .wp-block-paragraph, blockquote, cite),
.has-graphite-background-color .bluemed-testimonials-slider__quote,
.has-graphite-background-color .bluemed-testimonials-slider__quote :where(p, li, span, cite, footer, .bluemed-testimonials-slider__meta) {
	color: var(--text-primary) !important;
	-webkit-text-fill-color: var(--text-primary);
}

.has-graphite-background-color .bluemed-testimonials-slider__quote .has-graphite-color {
	color: var(--text-primary) !important;
}

.has-graphite-background-color .has-ash-color,
.bluemed-home-testimonials__head .has-ash-color {
	color: rgba(248, 249, 253, 0.88) !important;
}

.has-graphite-background-color .has-white-background-color .has-ash-color,
.has-graphite-background-color .bluemed-testimonials-slider__quote .has-ash-color,
.has-graphite-background-color .bluemed-testimonials-slider__meta {
	color: var(--text-muted) !important;
}

/* —— Forms —— */
.bluemed-reg-shell input[type="checkbox"],
.bluemed-reg-shell input[type="radio"],
.bluemed-contact-form input[type="checkbox"],
.bluemed-contact-form input[type="radio"],
.bluemed-field input[type="checkbox"],
.bluemed-field input[type="radio"] {
	accent-color: var(--accent-primary);
}

.bluemed-reg-shell input,
.bluemed-reg-shell textarea,
.bluemed-reg-shell select,
.bluemed-contact-form input,
.bluemed-contact-form textarea,
.bluemed-contact-form select {
	border-color: var(--border-default) !important;
	background-color: var(--surface-primary) !important;
}

.bluemed-reg-shell input:focus,
.bluemed-reg-shell textarea:focus,
.bluemed-reg-shell select:focus,
.bluemed-contact-form input:focus,
.bluemed-contact-form textarea:focus,
.bluemed-contact-form select:focus {
	border-color: var(--accent-primary) !important;
	outline-color: var(--accent-primary);
	box-shadow: 0 0 0 3px var(--accent-focus-ring) !important;
}

/* —— Footer —— */
.bluemed-footer {
	background: var(--accent-primary) !important;
	background-color: var(--accent-primary) !important;
}

.bluemed-footer__legal a {
	border-bottom-color: rgba(255, 255, 255, 0.28) !important;
}

.bluemed-footer__legal a:hover {
	color: var(--glass-1) !important;
	border-bottom-color: var(--glass-1) !important;
}
