.block-eyebrow,
.hero-eyebrow,
.section-intro-eyebrow,
.cta-panel-eyebrow,
.doctor-preview-card .block-eyebrow,
.two-column-content .block-eyebrow,
.process-step-number {
	margin: 0 0 1rem;
	color: var(--color-brand);
	font-size: 0.875rem;
	line-height: 1.25rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

.faq-section .block-eyebrow {
	color: white;
}

.block-eyebrow-b,
.hero-eyebrow-b,
.section-intro-eyebrow-b {
	margin-bottom: 1.5rem;
	display: inline-flex;
	align-items: center;
	border-radius: 9999px;
	border: 1px solid var(--color-brand-op);
	background-color: #fff;
	padding: 0.5rem 1rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	font-weight: 500;
	color: var(--color-ink);
	box-shadow:
		var(--ring-off-set-shadow, 0 0 #0000), var(--ring-shadow, 0 0 #0000),
		var(--shadow-soft);
}

.hero {
	padding: 3rem 1rem;
	background:
		linear-gradient(
			to bottom,
			var(--color-soft),
			#a2d5e73a 10%,
			#fff 30%,
			transparent
		),
		linear-gradient(to top, #a2d5e752, #fff 3%, transparent);
}

.hero--split .hero-layout {
	display: grid;
	gap: 3rem;
	align-items: center;
}

.hero-heading {
	max-width: 48rem;
	margin: 0;
	font-size: clamp(2rem, 4vw, 2.8rem);
	line-height: clamp(2.25rem, 4vw, 3.2rem);
	letter-spacing: -0.025em;
	font-weight: 900;
}

.hero-text {
	max-width: 42rem;
	margin: 1.5rem 0 0;
	color: var(--color-muted);
	font-size: 1.125rem;
	line-height: 1.8;
}

.hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-top: 2rem;
}

.hero-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--radius-pill);
	padding: 0.9rem 1.2rem;
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
}

.hero-button:hover,
.cta-panel-button:hover,
.service-highlight-button:hover {
	opacity: 80%;
}

.hero-button--primary {
	background: var(--color-navy);
	color: white;
}

.hero-button--secondary {
	border: 1px solid var(--color-brand);
	background: var(--color-brand-subtle);
	color: var(--color-brand);
}
.hero-button.hero-button--secondary:hover {
	border-color: var(--color-navy);
}

.hero-highlights {
	display: grid;
	gap: 0.7rem;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
	color: var(--color-muted);
	font-size: 0.92rem;
}

.hero-highlights li {
	display: flex;
	gap: 0.75rem;
	align-items: center;
}

.hero-highlights span {
	width: 0.55rem;
	height: 0.55rem;
	border-radius: 999px;
	background: var(--color-brand);
}

.hero-image-wrap {
	padding: 1rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-card);
	background: white;
	box-shadow: var(--shadow-soft);
}

.hero-image {
	display: block;
	width: 100%;
	border-radius: 1.25rem;
	opacity: 70%;
}

.section-intro {
	padding: 4rem 1rem;
	background: linear-gradient(
		to bottom,
		var(--color-soft),
		#a2d5e73a 10%,
		#fff 30%,
		transparent
	);
}

.section-intro--split-grad {
	background: linear-gradient(to top, #a2d5e752, #fff 3%, transparent);
}

.section-intro--nofx {
	padding: 4rem 1rem;
	background: none;
}

.section-intro--split .section-intro-layout,
.section-intro--split-grad .section-intro-layout {
	display: grid;
	gap: 3rem;
	align-items: center;
}

.section-intro-text {
	max-width: 42rem;
	margin: 1.5rem 0 0;
	color: var(--color-muted);
	font-size: 1.125rem;
	line-height: 1.8;
}

.section-intro-image {
	display: block;
	width: 100%;
	border-radius: 1.25rem;
	opacity: 70%;
	max-height: 360px;
}

.stats-strip {
	padding: 1.5rem 0;
}

.stats-strip--grad {
	background: linear-gradient(to bottom, #a2d5e752, #fff 90%, #fff);
}

.stats-grid {
	display: grid;
	gap: 1rem;
}

.stat-card,
.feature-card,
.doctor-preview-feature {
	padding: 1.25rem;
	border: 1px solid var(--color-border);
	border-radius: 1rem;
	background: white;
}

.stat-value {
	margin: 0.25rem 0 0;
	font-weight: 900;
}

.stat-label {
	margin: 0;
	color: var(--color-muted);
	font-size: 0.85rem;
}

.feature-grid-section,
.doctor-preview {
	padding: 5rem 0;
}

.feature-grid-heading,
.service-highlight-heading,
.doctor-preview-heading,
.cta-panel-heading,
.contact-methods-heading,
.process-steps-heading,
.two-column-content-heading,
.section-intro-heading,
.gallery-grid-heading,
.faq-heading {
	max-width: 48rem;
	margin: 0;
	font-size: clamp(2rem, 4vw, 2.8rem);
	line-height: clamp(2.25rem, 4vw, 3.2rem);
	letter-spacing: -0.025em;
	font-weight: 900;
}

.doctor-preview-heading,
.faq-heading,
.two-column-content-heading,
.gallery-grid-heading {
	font-size: clamp(2rem, 4vw, 2rem);
	line-height: clamp(2.25rem, 4vw, 2.5rem);
}

.feature-grid-intro {
	max-width: 42rem;
	margin: 1rem 0 0;
	color: var(--color-muted);
}

.feature-grid {
	display: grid;
	gap: 1.25rem;
	margin-top: 2.5rem;
}

.feature-card-title,
.process-step-title,
.two-column-content-heading {
	margin: 0 0 0.75rem;
}

.feature-card-text,
.process-step-text,
.two-column-content-copy p {
	margin: 0;
	color: var(--color-muted);
	line-height: 1.75rem;
	font-size: 0.875rem;
}

.service-highlight-grid {
	padding: 5rem 0;
	margin-top: 4rem;
	background: var(--color-navy);
	color: white;
}

.service-highlight-layout {
	display: grid;
	gap: 3rem;
}

.service-highlight-text,
.cta-panel-text {
	max-width: 34rem;
	color: #cbd5e1;
}

.service-highlight-button,
.cta-panel-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--radius-pill);
	padding: 1rem 2rem;
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	margin-top: 2rem;
	border: 1px solid var(--color-brand);
	background: var(--color-brand-subtle);
	color: var(--color-brand);
}

.service-highlight-cards {
	display: grid;
	gap: 1rem;
}

.service-highlight-card {
	padding: 1.5rem;
	border: 1px solid var(--color-brand-subtle);
	border-radius: 1rem;
	background: var(--color-brand-subtle);
}

.service-highlight-card h3 {
	font-size: 1.25rem;
	line-height: 1.75rem;
	margin: 0;
}

.service-highlight-card p {
	color: #cbd5e1;
	line-height: 1.75rem;
	font-size: 0.875rem;
	margin-bottom: 0;
}

.service-feature-sidebar {
	position: sticky;
	top: 6rem;
	background: var(--color-navy);
	color: white;
	padding: 2rem;
	border-radius: 0;
	box-shadow: none;
}

.doctor-preview-layout {
	display: grid;
	gap: 2rem;
}

.doctor-preview-card {
	padding: 2rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-card);
	background: white;
	box-shadow: var(--shadow-soft);
}

.doctor-preview-card p {
	color: var(--color-muted);
}

.doctor-preview-feature h3 {
	font-size: 1.125rem;
	line-height: 1.75rem;
	margin: 0;
}

.doctor-preview-feature p {
	line-height: 1.75rem;
	font-size: 0.875rem;
	margin-bottom: 0;
}

.service-highlight-card p {
	color: #cbd5e1;
}

.doctor-preview-card blockquote,
.two-column-content-quote {
	margin: 1.5rem 0;
	padding-left: 1rem;
	border-left: 4px solid var(--color-brand);
	color: var(--color-muted);
}

.doctor-preview-link-wrap {
	margin-top: 2rem;
}

.doctor-preview-link {
	color: var(--color-brand);
	font-weight: 700;
	letter-spacing: 0.22em;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 0.875rem;
}

.doctor-preview-grid {
	display: grid;
	gap: 1rem;
}

.faq-section {
	padding: 5rem 0;
	margin-top: 4rem;
	background: var(--color-soft);
}

.faq-list {
	display: grid;
	gap: 1rem;
	margin-top: 2rem;
}

.faq-item {
	border: 1px solid var(--color-border);
	border-radius: 1rem;
	background: white;
}

.faq-summary {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.25rem 1.5rem;
	cursor: pointer;
	list-style: none;
	font-weight: bold;
}

.faq-summary::-webkit-details-marker {
	display: none;
}

.faq-answer {
	padding: 0 1.5rem 1.5rem;
	color: var(--color-muted);
}

.faq-icon {
	position: relative;
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	background-color: var(--color-brand);
	border-radius: var(--radius-pill);
}

.faq-icon::before,
.faq-icon::after {
	content: "";
	background: white;
	position: absolute;
	left: 50%;
	top: 50%;
	width: 0.75rem;
	height: 2px;
	transform: translate(-50%, -50%);
	transition:
		transform 0.2s ease,
		opacity 0.2s ease;
	opacity: 1;
}
.faq-icon::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

details[open] .faq-icon::after {
	opacity: 0;
	transform: translate(-50%, -50%) rotate(90deg) scaleX(0);
}

.faq-footer {
	margin-top: 2rem;
}

.faq-footer a {
	color: white;
	font-weight: 800;
	letter-spacing: 0.18em;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 0.875rem;
}

.cta-panel {
	padding: 2rem 0;
	background: var(--color-navy);
}

.cta-panel-card {
	color: white;
	padding: 2rem 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
}

.cta-panel-card-cta {
	justify-self: center;
}
.cta-panel-card-main {
	justify-self: end;
}

.cta-panel-text {
	color: #cbd5e1;
}

.service-feature {
	padding: 3rem 0;
}

.service-feature .container {
	padding: 0 0;
}

.service-feature-layout {
	display: grid;
	gap: 0;
	align-items: start;
}

.service-feature--noside .service-feature-layout {
	display: block;
}

.service-feature-main {
	background: white;
	box-shadow: var(--shadow-soft);
	padding: 2rem;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-top-right-radius: var(--radius-card);
	border-top-left-radius: var(--radius-card);
}

.service-feature--noside .service-feature-main {
	display: grid;
	gap: 2rem;
	align-items: start;
	background: linear-gradient(196deg, #a2d5e7, #a2d5e79d 10%, transparent 50%);
}

.service-feature-heading,
.service-list-heading {
	margin: 0;
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1;
	letter-spacing: -0.035em;
}

.service-feature-text,
.service-list-text,
.process-steps-intro,
.contact-methods-intro,
.gallery-grid-text {
	max-width: 42rem;
	margin: 1.25rem 0 0;
	color: var(--color-muted);
	line-height: 1.8;
	font-size: 1.15rem;
}

.service-feature + .service-feature,
.service-feature + .service-list-section,
.service-list-section + .service-feature {
	margin-bottom: 3rem;
}

.service-feature-callouts {
	display: grid;
	gap: 1rem;
	margin-top: 2rem;
	grid-column: span 2;
}

.service-feature--noside .service-feature-callouts {
	display: grid;
	gap: 1rem;
	margin-top: 0;
}

.service-feature--noside .service-feature-heading-group {
	grid-column: span 2;
}

.service-feature-callout {
	display: grid;
	gap: 0.15rem;
	padding: 1rem;
	color: var(--color-muted);
	align-content: start;
}

.service-feature-callout span {
	display: block;
	line-height: 1.75rem;
	font-size: 0.875rem;
}

.service-feature-callout strong {
	color: var(--color-ink);
	line-height: 1.25rem;
	font-size: 1rem;
}

.service-feature-image-wrap {
	margin-top: 2rem;
	justify-self: center;
}

.service-feature--noside .service-feature-image-wrap {
	margin-top: 0;
	grid-column: span 2;
	max-height: 280px;
}

.service-feature-image {
	display: block;
	width: 100%;
	max-height: 22rem;
	object-fit: cover;
	object-position: left center;
	border-radius: 1rem;
	opacity: 0.72;
}

.service-feature--noside .service-feature-image-wrap img {
	max-height: 280px;
}

.service-feature-sidebar p {
	color: #cbd5e1;
	line-height: 1.8;
}

.service-feature-sidebar a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin-top: 1.5rem;
	border-radius: var(--radius-pill);
	background: white;
	color: var(--color-navy);
	padding: 0.9rem 1.25rem;
	font-weight: 800;
	text-decoration: none;
}

.service-list-section,
.rich-text {
	padding: 4rem 0;
	background-color: #f8fafc;
}

.service-list-section .container {
	display: grid;
	gap: 2rem;
	align-content: start;
}

.service-list-grid {
	display: grid;
	gap: 0.5rem 4rem;
}

.service-list-item {
	font-size: 0.95rem;
	font-weight: 600;
	text-wrap: nowrap;
}

.service-list-item::before {
	color: transparent;
	text-shadow: 0 0 0 var(--color-brand);
	content: "\23C3";
	font-size: 1.5rem;
	line-height: 1;
	padding-right: 0.5rem;
}

.treatment-philosophy {
	padding: 2rem 0;
}

.treatment-philosophy h2 {
	max-width: 44rem;
	margin: 0;
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1;
	letter-spacing: -0.035em;
}

.treatment-philosophy p:not(.block-eyebrow) {
	max-width: 44rem;
	color: var(--color-muted);
	line-height: 1.8;
}

.consultation-form-link {
	padding: 5rem 0;
}

.consultation-form-link--grad {
	background: linear-gradient(
		to bottom,
		var(--color-soft),
		#a2d5e73a 10%,
		#fff 30%,
		transparent
	);
}

.consultation-form-layout {
	display: grid;
	gap: 2rem;
	align-items: start;
}

.consultation-form-heading {
	max-width: 42rem;
	margin: 0;
	font-size: clamp(2.25rem, 5vw, 4rem);
	line-height: 0.95;
	letter-spacing: -0.04em;
}

.consultation-form-text {
	max-width: 42rem;
	margin: 1.25rem 0 0;
	color: var(--color-muted);
	font-size: 1.05rem;
	line-height: 1.8;
}

.consultation-form-note {
	max-width: 42rem;
	margin: 1rem 0 0;
	color: var(--color-muted);
	font-size: 0.9rem;
	line-height: 1.7;
}

.consultation-form-card {
	display: grid;
	margin-top: 0.75rem;
	justify-items: center;
	gap: 1.25rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-card);
	background: white;
	padding: 2.5rem;
	text-align: center;
	text-decoration: none;
	box-shadow: var(--shadow-soft);
	transition:
		transform 0.18s ease,
		box-shadow 0.18s ease;
}

.consultation-form-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
}

.consultation-form-logo-wrap {
	display: grid;
	place-items: center;
}

.consultation-form-logo {
	display: block;
	width: min(100%, 16rem);
	height: auto;
	object-fit: contain;
}

.consultation-form-card-label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--radius-pill);
	background: var(--color-navy);
	color: white;
	padding: 0.85rem 1.25rem;
	font-weight: 800;
}

.contact-methods {
	margin-top: 2rem;
}

.contact-methods-grid {
	display: grid;
	gap: 1rem;
	margin-top: 1.5rem;
	margin-bottom: 3.5rem;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
}

.contact-method-card {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-card);
	padding: 1.25rem 1.5rem;
	background: white;
}

.contact-method-card h3 {
	margin: 0;
}

.contact-method-card p {
	font-size: 0.875rem;
	color: var(--color-muted);
	margin: 0.8rem 0;
}

.contact-method-card span {
	font-size: 0.975rem;
	font-weight: 700;
	color: var(--color-muted);
}

.contact-method-card a {
	font-size: 0.825rem;
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
}

.consultation-form-card small {
	color: var(--color-muted);
	font-size: 0.85rem;
}

.two-column-content {
	padding: 3rem 1rem;
}

.two-column-content-layout {
	display: grid;
	gap: 2rem;
	align-items: center;
}

.two-column-content-image-wrap {
	border-radius: var(--radius-card);
	overflow: hidden;
	box-shadow: var(--shadow-soft);
	align-self: end;
}

.two-column-content-image {
	display: block;
	width: 100%;
	object-fit: cover;
	max-height: 300px;
}

.process-steps-grid {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	margin-top: 2rem;
	margin-bottom: 3.5rem;
}

.process-steps {
	margin: 4rem 0 4rem;
}

.process-step {
	padding: 1.25rem 1rem;
}

.gallery-grid-section {
	padding: 2rem 0 5rem;
}

.gallery-grid {
	display: grid;
	gap: 1rem;
	margin-top: 2.5rem;
	grid-template-columns: repeat(auto-fit, minmax(min(350px, 100%), 1fr));
}

.gallery-card {
	margin: 0;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-card);
	background: white;
	overflow: hidden;
	box-shadow: var(--shadow-soft);
}

.gallery-image {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.gallery-card figcaption {
	padding: 1rem;
	color: var(--color-muted);
	font-size: 0.95rem;
	line-height: 1.6;
}

@media (min-width: 760px) {
	.stats-grid {
		grid-template-columns: repeat(4, 1fr);
	}

	.feature-grid {
		grid-template-columns: repeat(4, 1fr);
	}

	.service-highlight-layout,
	.doctor-preview-layout {
		grid-template-columns: 0.95fr 1.05fr;
	}

	.hero--split .hero-layout {
		grid-template-columns: 1.05fr 0.95fr;
	}

	.section-intro--split .section-intro-layout,
	.section-intro--split-grad .section-intro-layout {
		grid-template-columns: 1.05fr 0.95fr;
	}

	.service-highlight-cards,
	.doctor-preview-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.service-feature .container {
		padding: 0 2rem;
	}

	.service-feature-main {
		border: 1px solid var(--color-border);
	}

	.service-feature-callouts {
		grid-template-columns: repeat(2, 1fr);
		grid-column: span 1;
	}

	.service-feature--noside .service-feature-main {
		border-radius: var(--radius-card);
	}

	.service-feature--noside .service-feature-callouts {
		grid-template-columns: 1fr;
	}

	.service-feature .service-feature-image-wrap {
		grid-column: span 1;
		align-self: center;
	}

	.service-list-section .container {
		grid-template-columns: 0.8fr max-content;
	}

	.service-list-grid {
		grid-template-columns: repeat(2, max-content);
		grid-template-rows: repeat(3, min-content);
		padding-left: 2rem;
		align-content: center;
	}

	.consultation-form-layout {
		grid-template-columns: 1.25fr 0.75fr;
	}

	.two-column-content-layout {
		grid-template-columns: 1.25fr 0.75fr;
	}
}

@media (min-width: 760px) {
}

@media (min-width: 1024px) {
	.hero {
		padding: 6rem 2rem;
	}

	.cta-panel-card {
		grid-template-columns: 1.1fr 0.9fr;
	}

	.service-feature-layout {
		grid-template-columns: minmax(0, 2fr) minmax(18rem, 0.9fr);
		gap: 2rem;
	}

	.service-feature-sidebar {
		border-radius: var(--radius-card);
		box-shadow: var(--shadow-soft);
	}

	.service-feature-main {
		border-radius: var(--radius-card);
	}

	.service-feature--noside .service-feature-main {
		grid-template-columns: 0.8fr 1.2fr;
	}

	.service-feature--noside .service-feature-callouts {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 959px) {
	.service-feature-sidebar {
		position: static;
		border-radius: 0;
		box-shadow: none;
	}
}
