/**
 * Typography: body copy, section headings, subheadings and highlights.
 * Ultimate Addons headings carry inline styles, hence !important where needed.
 */

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

::selection {
	background: rgba(16, 222, 236, .28);
	color: var(--b3d-ink);
}

/* ---------- Body copy ---------- */

#main .uvc-sub-heading,
#main .wpb_text_column {
	color: var(--b3d-body) !important;
	font-size: 16px;
	line-height: 1.8;
}

#main .uvc-sub-heading p,
#main .wpb_text_column p {
	margin-bottom: 1.1em;
}

/* :where() keeps specificity low so components can restyle their own links */
#main :is(.uvc-sub-heading, .wpb_text_column) a:where(:not(.vc_btn3, .b3d-faq-btn, .b3d-btn)) {
	color: var(--b3d-cyan-600);
	text-decoration: none;
	/* logo-cyan → pink underline that slides in from the left on hover
	 * (same as the "AFIVE Agency" credit in the footer) */
	background: var(--b3d-gradient-text) 0 100% / 0 2px no-repeat;
	transition: background-size var(--b3d-dur) var(--b3d-ease), color var(--b3d-dur-fast);
}

#main :is(.uvc-sub-heading, .wpb_text_column) a:where(:not(.vc_btn3, .b3d-faq-btn, .b3d-btn)):hover {
	color: var(--b3d-cyan-700);
	background-size: 100% 2px;
}

/* Lists: small cyan logo blade instead of the default bullet.
 * Plugin widgets built from lists are excluded (ImageLinks markers are a <ul> whose
 * <li> must not become position: relative, or every pin loses its place).
 * :where() keeps the specificity unchanged. */
#main .uvc-sub-heading ul:where(:not(.imgl-markers)),
#main .wpb_text_column ul:where(:not(.imgl-markers)) {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style: none !important;
}

#main .uvc-sub-heading ul:where(:not(.imgl-markers)) > li,
#main .wpb_text_column ul:where(:not(.imgl-markers)) > li,
#main ul.b3d-course-intro__list li {
	position: relative;
	margin-bottom: .45em;
	padding-left: 22px;
	list-style: none !important;
}

#main .uvc-sub-heading ul:where(:not(.imgl-markers)) > li::before,
#main .wpb_text_column ul:where(:not(.imgl-markers)) > li::before,
#main ul.b3d-course-intro__list li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: .5em;
	width: 7px;
	height: 12px;
	background: var(--b3d-logo-cyan);
	clip-path: polygon(0 0, 100% 30%, 100% 100%, 0 70%);
}

/* ---------- Section titles in text blocks: <h2|h3 class="b3d-title"> ----------
 * (blades under the title: brand.css) */

#main .wpb_text_column :is(h2, h3).b3d-title {
	color: var(--b3d-ink);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -.015em;
}

#main .wpb_text_column h2.b3d-title {
	margin: 16px 0 24px;
	font-size: clamp(28px, 2.6vw, 38px);
}

#main .wpb_text_column h3.b3d-title {
	margin: 0 0 22px;
	font-size: clamp(24px, 2.2vw, 32px);
}

/* ---------- Ultimate Heading elements (if an editor adds one) ---------- */

#main .uvc-heading .uvc-main-heading :is(h2, h3) {
	position: relative;
	color: var(--b3d-ink) !important;
	font-weight: 700 !important;
	letter-spacing: -.015em;
	line-height: 1.2 !important;
	margin-bottom: 22px !important;
	padding-bottom: 16px;
}

#main .uvc-heading .uvc-main-heading h2 {
	font-size: clamp(28px, 2.6vw, 38px) !important;
}

#main .uvc-heading .uvc-main-heading h3 {
	font-size: clamp(24px, 2.2vw, 32px) !important;
}

/* Accent bar under headings: logo blades, defined in brand.css */

/* ---------- Taglines (The7 highlight) ---------- */

#main .dt-highlight {
	display: inline;
	background: none !important;
	color: var(--b3d-cyan-700) !important;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.6;
	padding: 0;
}

#main strong:has(> .dt-highlight) {
	display: block;
	position: relative;
	margin: 0 0 18px;
	padding-left: 16px;
}

#main strong:has(> .dt-highlight)::before {
	content: "";
	position: absolute;
	left: 0;
	top: 3px;
	bottom: 3px;
	width: 3px;
	border-radius: 3px;
	background: var(--b3d-pink);
}

/* ---------- Dual color heading ("Orthotics & Prosthetics") ---------- */

#main .ult-dual-color h2 {
	font-size: clamp(30px, 3vw, 44px) !important;
	font-weight: 700 !important;
	letter-spacing: -.02em;
}

/* ---------- The7 fancy titles ---------- */

#main .dt-fancy-title {
	font-weight: 700 !important;
	letter-spacing: -.01em;
}

/* Phone numbers never break in the middle */
a[href^="tel:"],
a[href^="viber:"] {
	white-space: nowrap;
}