/* Crystal Dental: shared appointment treatment and editorial refinements. */
:root {
	--crystal-cta-gradient: linear-gradient(115deg, #e0f7ff 0%, #a5dced 55%, #76bedb 100%);
	--crystal-deep-blue: #123440;
}

/* One recognizable primary action, across desktop, hero, and mobile menu. */
.crystal-header-booking .wp-block-button__link,
.crystal-hero-booking .wp-block-button__link,
.crystal-site-header .wp-block-navigation__responsive-container.is-menu-open .crystal-mobile-nav-book .wp-block-navigation-item__content {
	position: relative;
	display: inline-flex;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	padding: 0.85rem 1.6rem;
	border: 1px solid #79b9d0;
	border-radius: 999px;
	background-image: linear-gradient(110deg, transparent 25%, rgba(255, 255, 255, 0.42) 48%, transparent 70%), var(--crystal-cta-gradient);
	background-size: 250% 100%, 100% 100%;
	background-position: 100% 0, 0 0;
	color: #12313b;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), 0 8px 24px rgba(16, 39, 45, 0.16);
	font-weight: 650;
	letter-spacing: -0.015em;
	line-height: 1.25;
	text-decoration: none;
	text-shadow: none;
	transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease, background-position 600ms ease;
}

.crystal-header-booking .wp-block-button__link::after,
.crystal-hero-booking .wp-block-button__link::after,
.crystal-site-header .crystal-mobile-nav-book .wp-block-navigation-item__content::after {
	content: none;
}

.crystal-header-booking .wp-block-button__link {
	min-height: 3.2rem;
	gap: 0.7rem;
	padding: 0.7rem 1.25rem;
	font-size: 0.93rem;
}

.crystal-hero-booking .wp-block-button__link {
	min-height: 4rem;
	justify-content: center;
	font-size: 1.12rem;
	padding-left: 1.6rem;
}

.crystal-header-booking .wp-block-button__link:focus-visible,
.crystal-hero-booking .wp-block-button__link:focus-visible,
.crystal-site-header .crystal-mobile-nav-book .wp-block-navigation-item__content:focus-visible {
	outline: 3px solid #ffffff;
	outline-offset: 4px;
	box-shadow: 0 0 0 7px #123440;
}

.crystal-hero .wp-block-cover__background {
	background: linear-gradient(90deg, rgba(6, 27, 36, 0.94), rgba(9, 35, 46, 0.79) 38%, rgba(13, 42, 53, 0.24) 74%, rgba(13, 42, 53, 0.14)) !important;
}

.crystal-hero-title {
	font-size: clamp(3.6rem, 5.5vw, 5.25rem) !important;
	max-width: 15ch;
	letter-spacing: -0.045em;
	line-height: 1.04;
}

.crystal-title-accent {
	color: #c3ebee;
	font-weight: 500;
}

.crystal-hero-copy > p:not(.crystal-eyebrow) {
	margin-top: 1.5rem;
	max-width: 35rem;
	font-size: clamp(1rem, 1.3vw, 1.16rem);
	line-height: 1.7;
}

.crystal-hero-actions {
	margin-top: 1.8rem;
}

.crystal-hero-call .wp-block-button__link {
	border-width: 1px;
	font-size: 0.88rem;
	background: rgba(16, 43, 54, 0.24);
}

.crystal-hero .crystal-hero-call .wp-block-button__link {
	border-color: rgba(215, 240, 247, 0.48);
}

.crystal-trust-row {
	gap: 1.1rem;
	padding-top: 1.2rem;
	border-top: 1px solid rgba(219, 239, 244, 0.25);
	width: fit-content;
}

.crystal-trust-row p {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	font-size: 0.75rem;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.crystal-trust-row p + p {
	padding-left: 1.1rem;
	border-left: 1px solid rgba(219, 239, 244, 0.3);
}

.crystal-eyebrow::before {
	background: #2b748a;
	border-radius: 1px;
	transform: rotate(45deg);
	width: 0.42rem;
	height: 0.42rem;
	flex-shrink: 0;
}

.crystal-hero .crystal-eyebrow::before,
.crystal-reviews-section .crystal-eyebrow::before,
.crystal-emergency .crystal-eyebrow::before {
	background: #b8e9fa;
}

.crystal-section-heading {
	font-size: clamp(2rem, 3.2vw, 3rem) !important;
	letter-spacing: -0.035em;
	line-height: 1.13;
}

#services {
	background: linear-gradient(155deg, #f7fbfc, #edf5f7);
}

.crystal-card-grid .crystal-card {
	box-sizing: border-box;
	padding: 0 0 1.65rem;
	overflow: hidden;
	border-color: #dce9ec;
	background: #ffffff;
	box-shadow: 0 6px 22px rgba(16, 52, 64, 0.04);
}

.crystal-card-grid .crystal-service-image {
	border-radius: 0;
	aspect-ratio: 16 / 9;
	border-bottom: 1px solid #e2edef;
}

.crystal-card-grid .crystal-card > :not(.crystal-service-image) {
	box-sizing: border-box;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

.crystal-card-grid .crystal-card h3 {
	margin-top: 1.5rem;
	font-weight: 550;
}

.crystal-doctor-card {
	border-color: #dce7e9;
	box-shadow: 0 8px 26px rgba(16, 52, 64, 0.05);
}

.crystal-doctor-copy {
	margin-top: 0;
	padding-top: 1.65rem;
	border-top: 3px solid #cae3e8;
}

/* Shared portrait windows, with framing tuned to each original photograph. */
.crystal-doctor-photo {
	aspect-ratio: 4 / 5;
	overflow: hidden;
}

.crystal-doctor-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform-origin: center top;
}

.crystal-doctor-photo img[src*="/dr-bogdan."] {
	object-position: center 60%;
	transform: scale(1.22);
}

.crystal-doctor-photo img[src*="/dr-goran."] {
	transform: translateY(-3%) scale(1.15);
}

.crystal-doctor-photo img[src*="/dr-nicole."] {
	transform: scale(1.02);
}

.crystal-doctor-photo img[src*="/dr-nicole-portrait-v2."] {
	object-position: center top;
	transform-origin: 35% top;
	transform: translate(8%, -5%) scale(1.35);
}

.crystal-doctor-photo img[src*="/dr-dragana-portrait."] {
	object-position: center top;
}

.crystal-reviews-section {
	background: radial-gradient(ellipse at 90% 0%, #254e60, transparent 65%), #0d2935;
}

.crystal-review-summary {
	box-sizing: border-box;
	border-color: rgba(165, 220, 237, 0.35);
	background: linear-gradient(145deg, rgba(216, 237, 242, 0.14), rgba(216, 237, 242, 0.035));
}

.crystal-review-summary .crystal-stars {
	color: #f2cc87;
}

.crystal-review-slide {
	box-sizing: border-box;
	background: #f6fafb;
	border-radius: 1.25rem;
}

.crystal-review-author {
	padding-top: 1.2rem;
	border-top: 1px solid #d8e5e8;
}

/* Equal grid tracks grow together to fit the longest review, without clipping. */
.crystal-review-track {
	display: grid !important;
	grid-auto-flow: column;
	grid-auto-columns: min(82vw, 22rem);
	align-items: stretch;
	gap: 1rem;
}

.crystal-review-track > .crystal-review-slide {
	margin: 0 !important;
	width: auto;
	max-width: none;
	min-width: 0;
	min-height: 23rem;
	height: auto;
	align-self: stretch;
	justify-content: flex-start;
	gap: 1.5rem;
}

.crystal-review-slide > .crystal-stars,
.crystal-review-slide > .crystal-quote {
	margin: 0;
}

.crystal-review-slide > .crystal-review-author {
	margin: auto 0 0;
	width: 100%;
}

/* Official artwork remains unaltered; the logo strip is intentionally quiet. */
.crystal-association-label {
	margin: 0 auto 1.25rem;
	color: #476773;
	font-size: 0.76rem;
	font-weight: 550;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.crystal-emergency .crystal-emergency-heading {
	max-width: 22ch;
	font-size: clamp(2rem, 3.8vw, 3.1rem) !important;
	font-weight: 600;
	letter-spacing: -0.035em;
	line-height: 1.15;
}

.crystal-cdcp-callout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: clamp(1.5rem, 4vw, 3rem);
	padding: clamp(1.5rem, 4vw, 3rem);
	margin-bottom: 1.5rem;
	border: 1px solid #326477;
	border-radius: 1.5rem;
	background: linear-gradient(125deg, #173f50, #205d72);
	color: #ffffff;
}

.crystal-cdcp-callout > * { margin: 0; }
.crystal-cdcp-copy { max-width: 44rem; }
.crystal-cdcp-copy > .crystal-eyebrow { color: #c7e9f3; }
.crystal-cdcp-copy > .crystal-eyebrow::before { background: #b8e9fa; }
.crystal-cdcp-copy > .crystal-cdcp-heading {
	margin-top: 0.8rem;
	color: #ffffff;
	font-size: clamp(2rem, 3.6vw, 3rem);
	font-weight: 600;
	letter-spacing: -0.035em;
	line-height: 1.15;
}
.crystal-cdcp-note { color: #c7e0e9; font-size: 0.85rem; }
.crystal-cdcp-actions { max-width: 17rem; }
.crystal-cdcp-actions .wp-block-button__link {
	background: #d2eef8;
	color: #123440;
	font-weight: 650;
	border-radius: 0.8rem;
	padding: 0.9rem 1.4rem;
}
.crystal-cdcp-actions > p { font-size: 0.84rem; }
.crystal-cdcp-actions > p a { color: #e1f5fc; text-underline-offset: 0.2em; }
@media (max-width: 782px) {
	.crystal-cdcp-callout { grid-template-columns: 1fr; }
	.crystal-cdcp-actions { max-width: none; }
}

.crystal-association-strip {
	padding-block: clamp(2rem, 4vw, 3.5rem);
	background: #ffffff;
	border-top: 1px solid #e0eaed;
}

.crystal-association-logos {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: center;
	gap: clamp(1rem, 5vw, 5rem);
	max-width: 900px !important;
}

.crystal-association-logos > .crystal-association-logo {
	margin: 0 !important;
	min-width: 0;
}

.crystal-association-logo a {
	display: flex;
	min-height: 6rem;
	align-items: center;
	justify-content: center;
	border-radius: 0.75rem;
	transition: background-color 180ms ease;
}

.crystal-association-logo img {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 5.5rem;
	object-fit: contain;
}

.crystal-association-cda img { width: 158px; }
.crystal-association-bcda img { width: 200px; }
.crystal-association-iti img { width: 172px; }

.crystal-association-logo a:focus-visible {
	outline: 3px solid #194d60;
	outline-offset: 4px;
}

@media (hover: hover) {
	.crystal-association-logo a:hover { background: #f1f7f9; }
}

@media (max-width: 480px) {
	.crystal-association-logos { gap: 1.15rem; }
	.crystal-association-logo a { min-height: 4.5rem; }
}

/* Keep navigation on one line beside the action on smaller desktops. */
@media (min-width: 1051px) and (max-width: 1200px) {
	.crystal-header-brand { width: 16rem; }
	.crystal-header-actions { gap: 1rem; }
	.crystal-site-header .wp-block-navigation__container {
		gap: 0.5rem !important;
	}
	.crystal-site-header .wp-block-navigation__container > .wp-block-navigation-item + .wp-block-navigation-item::before {
		margin-right: 0.5rem;
	}
}

/* Compact, text-only appointment action with a quiet blue finish. */
.crystal-site-header .crystal-header-booking .wp-block-button__link {
	min-height: 2.75rem;
	gap: 0;
	padding: 0.65rem 1.05rem;
	border: 1px solid #28556c;
	border-radius: 0.7rem;
	background: linear-gradient(135deg, #23536b 0%, #163c52 100%);
	color: #ffffff;
	box-shadow: inset 0 1px 0 rgba(223, 248, 255, 0.16), 0 3px 9px rgba(18, 52, 64, 0.12);
	font-size: 0.93rem;
	font-weight: 650;
	letter-spacing: -0.01em;
	white-space: nowrap;
	transition: box-shadow 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.crystal-site-header .crystal-header-booking .wp-block-button__link::before {
	content: none;
}

.crystal-site-header .crystal-header-booking .wp-block-button__link:focus-visible {
	outline: 3px solid #194d60;
	outline-offset: 4px;
	box-shadow: 0 0 0 3px #ffffff;
}

@media (hover: hover) {
	.crystal-site-header .crystal-header-booking .wp-block-button__link:hover {
		background: linear-gradient(135deg, #306e86 0%, #163e53 75%);
		border-color: #77b3c9;
		box-shadow: inset 0 1px 0 rgba(223, 248, 255, 0.4), 0 8px 20px rgba(18, 52, 64, 0.25);
		transform: translateY(-1px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.crystal-site-header .crystal-header-booking .wp-block-button__link,
	.crystal-association-logo a { transition: none; }
}

.crystal-faq-section {
	background: #edf5f7;
}

.crystal-faq-list {
	max-width: 100%;
	box-shadow: none;
	overflow: hidden;
}

.crystal-faq-item[open] {
	background: #f4f9fb;
}

.crystal-faq-item summary::after {
	display: grid;
	width: 2rem;
	height: 2rem;
	place-items: center;
	border: 1px solid #cfdee3;
	border-radius: 50%;
	font-size: 1.2rem;
	line-height: 1;
}

.crystal-footer .crystal-site-title {
	font-size: clamp(2rem, 3vw, 2.8rem);
	letter-spacing: -0.045em;
	line-height: 1.2;
}

@media (min-width: 1000px) {
	#services > .alignwide:first-child:not(.crystal-structure-inner),
	#dentists > .alignwide:first-child,
	#locations > .alignwide:first-child {
		display: grid;
		grid-template-columns: 1.1fr 1fr;
		column-gap: clamp(3rem, 7vw, 7rem);
		padding-bottom: 2.5rem;
		border-bottom: 1px solid #cfdee3;
	}

	#services > .alignwide:first-child > .crystal-eyebrow,
	#dentists > .alignwide:first-child > .crystal-eyebrow,
	#locations > .alignwide:first-child > .crystal-eyebrow {
		grid-column: 1 / -1;
	}

	#services > .alignwide:first-child > .crystal-section-lead,
	#dentists > .alignwide:first-child > .crystal-section-lead,
	#locations > .alignwide:first-child > .crystal-section-lead {
		align-self: end;
		margin-top: 0;
		font-size: 1.06rem;
	}

	#services .crystal-section-heading,
	#dentists .crystal-section-heading,
	#locations .crystal-section-heading {
		max-width: 24ch;
		margin-bottom: 0;
	}
}

@media (hover: hover) {
	.crystal-header-booking .wp-block-button__link:hover,
	.crystal-hero-booking .wp-block-button__link:hover,
	.crystal-site-header .wp-block-navigation__responsive-container.is-menu-open .crystal-mobile-nav-book .wp-block-navigation-item__content:hover {
		background-position: 0 0, 0 0;
		box-shadow: inset 0 1px 0 #effbff, 0 12px 32px rgba(16, 39, 45, 0.23);
		transform: translateY(-2px);
		text-decoration: none;
	}

	.crystal-hero .crystal-hero-call .wp-block-button__link:hover {
		background: rgba(216, 239, 246, 0.16);
		border-color: #d7f0f7;
	}

	.crystal-carousel-button:hover {
		background: #a5dced;
		color: #123440;
	}
}

@media (max-width: 782px) {
	.crystal-header-brand {
		width: min(18.4rem, calc(100% - 3.5rem));
	}

	/* Keep one appointment action visible while the dropdown is open. */
	body:has(.crystal-site-header .is-menu-open) .crystal-hero-booking {
		visibility: hidden;
	}

	/* Short screens scroll the links without moving the header's close control. */
	.crystal-site-header .wp-block-navigation__responsive-container-content {
		max-height: calc(100dvh - var(--crystal-header-height) - var(--crystal-mobile-admin-offset, 0px) - 6rem);
		min-height: 0;
		flex: 0 1 auto;
		justify-content: flex-start;
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
	}

	.crystal-hero .wp-block-cover__background {
		background: linear-gradient(180deg, rgba(6, 28, 39, 0.65), rgba(6, 28, 39, 0.65) 50%, rgba(6, 28, 39, 0.86)) !important;
	}

	/* Keep the dental chair recognizable in the homepage's narrow portrait crop. */
	.home .crystal-hero .wp-block-cover__image-background {
		object-position: 84% center;
	}

	.crystal-hero-copy {
		margin-inline: auto !important;
	}

	.crystal-hero-title {
		font-size: clamp(2.5rem, 10.5vw, 3.25rem) !important;
		max-width: 14ch;
		line-height: 1.1;
	}

	.crystal-hero-copy > p:not(.crystal-eyebrow) {
		margin-top: 1.15rem;
		font-size: 1rem;
	}

	.crystal-hero-booking .wp-block-button__link {
		font-size: 1.05rem;
	}

	.crystal-site-header .wp-block-navigation__responsive-container.is-menu-open .crystal-mobile-nav-book .wp-block-navigation-item__content {
		min-height: 3.65rem;
		font-size: 1.05rem;
		font-weight: 700;
		border-radius: .85rem;
		border: 1px solid #3b6e87;
		background: linear-gradient(135deg,#204f68,#12384e);
		color: #fff;
		box-shadow: inset 0 1px 0 #ffffff26, 0 7px 18px #102e4233;
	}

	.crystal-trust-row {
		margin-inline: auto;
	}
}

@media (prefers-reduced-motion: reduce) {
	.crystal-header-booking .wp-block-button__link,
	.crystal-hero-booking .wp-block-button__link,
	.crystal-site-header .wp-block-navigation__responsive-container.is-menu-open .crystal-mobile-nav-book .wp-block-navigation-item__content,
	.crystal-header-booking .wp-block-button__link::after,
	.crystal-hero-booking .wp-block-button__link::after,
	.crystal-site-header .crystal-mobile-nav-book .wp-block-navigation-item__content::after {
		transition: none;
	}
}