/*
 * Stonebriar brand color layer.
 * Loaded after page-specific styles so the updated logo's vivid azure is
 * represented consistently without changing the established gold CTAs.
 */

:root {
	--brand-azure: #089bd8;
	--brand-azure-text: #006b94;
	--brand-azure-light: #6acdf3;
}

/* Script accents on light surfaces use the accessible, deeper azure. */
.heading em {
	color: var(--brand-azure-text);
}

/* Keep the premium gold script treatment on navy-deep surfaces. */
.hero .heading em,
.result .heading em,
section[class*="-hero"] .heading em,
section[class$="-cta"] .heading em,
section[class*="-cta "] .heading em {
	color: var(--gold-light);
}

/* Navy—not navy-deep—sections may continue the approved azure treatment. */
.journey .heading em {
	color: var(--brand-azure);
}

/* Eyebrows retain the premium gold treatment on navy-deep surfaces. */
.hero .eyebrow,
.result .eyebrow,
section[class*="-hero"] .eyebrow,
section[class*="-hero"] [class$="-eyebrow"],
section[class$="-cta"] .eyebrow,
section[class$="-cta"] [class$="-eyebrow"],
section[class*="-cta "] .eyebrow,
section[class*="-cta "] [class$="-eyebrow"] {
	color: var(--gold-light);
}

/* Lighter azure remains accessible for small accents on the navy surface. */
.journey .eyebrow,
.journey__steps > li > span {
	color: var(--brand-azure);
}

/* Match every page-specific eyebrow to the homepage typography scale. */
.eyebrow,
.preventive-eyebrow,
.cosmetic-eyebrow,
.restorative-eyebrow,
.wellness-eyebrow,
.ortho-eyebrow,
.implant-eyebrow,
.contact-eyebrow,
.shop-eyebrow {
	font-size: 0.72rem;
}

/* Accessible brand color for small labels on light card surfaces. */
[class$="__kicker"],
[class*="__kicker "] {
	color: var(--brand-azure-text);
}

/* Carry the logo color into existing editorial and card details. */
figure figcaption {
	border-left-color: var(--brand-azure);
}

article[class*="-card"] {
	border-top-color: rgba(8, 155, 216, 0.58);
}

article[class*="-card"]:hover,
article[class*="-card"]:focus-within {
	border-top-color: var(--brand-azure);
}

/* Keep introductory copy consistent across every service-page hero. */
.services-overview-hero__lead,
.preventive-hero__lead,
.cosmetic-hero__lead,
.restorative-hero__lead,
.wellness-hero__lead,
.bale-hero__lead,
.heart-health-hero__lead,
.stem-hero__lead,
.ortho-hero__lead,
.invisalign-hero__lead,
.implant-hero__lead,
.all4-hero__lead {
	font-size: 18px;
}

[class*="__icon-frame"],
[class*="__icon-wrap"] {
	border-color: rgba(8, 155, 216, 0.5);
}

.faq-item__icon,
[class*="faq-item__icon"] {
	border-color: var(--brand-azure);
	color: var(--brand-azure-text);
}

@media (prefers-reduced-motion: reduce) {
	article[class*="-card"] {
		transition-duration: 0.01ms;
	}
}