/*
 * Zahra Dental — design system + section styles
 * -------------------------------------------------------------
 * Tokens below are mirrored into Elementor Global Colors / Fonts on activation,
 * so editing them in Elementor > Site Settings updates the whole site.
 * Everything is written with logical properties so RTL works without mirroring.
 */

/* ------------------------------------------------------------------
   1. Tokens
------------------------------------------------------------------ */
:root {
	/* Brand */
	--zd-primary: #25b997;
	--zd-primary-dark: #087b6d;
	--zd-primary-soft: #eaf8f4;
	--zd-mint: #72dbc1;
	--zd-mint-soft: #e9f8f3;
	--zd-beige: #eef2f1;
	--zd-sand: #dfeae8;
	--zd-warm-white: #f6f8f7;
	--zd-surface: #ffffff;
	--zd-ink: #102d3a;
	--zd-muted: #607985;
	--zd-line: #dce8e8;
	--zd-ice: #bceaf1;
	--zd-accent: #efc85c;

	/* Typography */
	--zd-font-display: "Yekan Bakh FaNum", "Vazirmatn", Tahoma, ui-sans-serif, system-ui, sans-serif;
	--zd-font-body: "ModamFaNum", "Vazirmatn", Tahoma, ui-sans-serif, system-ui, sans-serif;
	--zd-text-xs: .8125rem;
	--zd-text-sm: .9375rem;
	--zd-text-base: 1.0625rem;
	--zd-text-lead: 1.25rem;
	--zd-h2: 3rem;
	--zd-h3: 1.6rem;
	--zd-hero: 3.5rem;

	/* Space & shape */
	--zd-radius-sm: 6px;
	--zd-radius: 8px;
	--zd-radius-lg: 8px;
	--zd-radius-pill: 999px;
	--zd-section-y: clamp(4rem, 2.5rem + 6vw, 7.5rem);
	--zd-gap: clamp(1.25rem, 1rem + 1vw, 2rem);
	--zd-container: 1200px;
	--zd-container-pad: clamp(1.15rem, .6rem + 2.2vw, 2.5rem);

	/* Elevation — layered, low-opacity, tinted with the brand hue */
	--zd-shadow-xs: 0 2px 5px rgba(16, 45, 58, .035), 0 8px 18px -12px rgba(16, 45, 58, .12);
	--zd-shadow: 0 8px 22px -14px rgba(16, 45, 58, .2), 0 18px 46px -28px rgba(8, 123, 109, .18);
	--zd-shadow-lg: 0 18px 50px -24px rgba(16, 45, 58, .28), 0 8px 20px -14px rgba(8, 123, 109, .18);
	--zd-ring: 0 0 0 3px rgba(37, 185, 151, .25);

	--zd-ease: cubic-bezier(.22, 1, .36, 1);
	--zd-header-h: 84px;
}

/* ------------------------------------------------------------------
   2. Base
------------------------------------------------------------------ */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--zd-header-h) + 16px);
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	background: var(--zd-warm-white);
	color: var(--zd-ink);
	font-family: var(--zd-font-body);
	font-size: var(--zd-text-base);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}

img,
svg,
video,
iframe {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--zd-primary-dark);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color .2s var(--zd-ease);
}

a:hover {
	color: var(--zd-primary);
}

h1, h2, h3, h4 {
	font-family: var(--zd-font-display);
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: 0;
	color: var(--zd-ink);
	margin: 0 0 .6em;
	text-wrap: balance;
}

p {
	margin: 0 0 1.1em;
	text-wrap: pretty;
}

p:last-child {
	margin-bottom: 0;
}

.zd-reading-time {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	margin-block: .65rem;
	color: var(--zd-primary-dark);
	font-size: var(--zd-text-sm);
	font-weight: 700;
}

.zd-reading-time::before {
	content: "";
	inline-size: .55rem;
	block-size: .55rem;
	border: 2px solid currentColor;
	border-radius: 50%;
}

ul, ol {
	padding-inline-start: 1.25rem;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--zd-primary-dark);
	outline-offset: 2px;
	border-radius: 6px;
}

::selection {
	background: var(--zd-mint-soft);
	color: var(--zd-ink);
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
}

/* Runtime visibility must win over the base grid declaration. */
.zd-otp__step[hidden],
.zd-booking-step[hidden] {
	display: none !important;
}

/* Password fallback when OTP/SMS is unavailable on the guest account page. */
.woocommerce-account:not(.logged-in) .woocommerce > #customer_login {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
	inline-size: min(100%, 58rem);
	margin-inline: auto;
}

.woocommerce-account:not(.logged-in) .woocommerce > #customer_login > .u-column1,
.woocommerce-account:not(.logged-in) .woocommerce > #customer_login > .u-column2 {
	float: none;
	inline-size: auto;
	padding: clamp(1.1rem, 3vw, 1.6rem);
	border: 1px solid var(--zd-line);
	border-radius: 10px;
	background: var(--zd-surface);
	box-shadow: 0 22px 56px -44px rgba(10, 54, 62, .48);
}

.woocommerce-account:not(.logged-in) .woocommerce > #customer_login h2 {
	margin-block: 0 1rem;
	font: 800 1.25rem/1.5 var(--zd-font-display);
}

.woocommerce-account:not(.logged-in) .woocommerce > #customer_login .form-row {
	margin-block: 0 1rem;
}

.woocommerce-account:not(.logged-in) .woocommerce > #customer_login label {
	display: block;
	margin-block-end: .4rem;
	color: var(--zd-ink);
	font-size: .8rem;
	font-weight: 750;
}

.woocommerce-account:not(.logged-in) .woocommerce > #customer_login a {
	color: var(--zd-primary-dark);
	font-weight: 750;
}

@media (max-width: 720px) {
	.woocommerce-account:not(.logged-in) .woocommerce > #customer_login {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------------------------
 * Digital reception: focused auth and appointment flows
 * ----------------------------------------------------------------------- */
.woocommerce-account .zd-prose {
	max-inline-size: 76rem !important;
}

.zd-account-auth {
	inline-size: min(100%, 42rem);
	margin-inline: auto;
	padding-block: clamp(.5rem, 2vw, 1.5rem);
}

.zd-account-auth .zd-otp {
	inline-size: min(100%, 34rem);
}

.zd-otp {
	padding: clamp(1.5rem, 4vw, 2.25rem);
	border-radius: 12px;
	border-color: color-mix(in srgb, var(--zd-primary-dark) 16%, var(--zd-line));
	box-shadow: 0 24px 64px -42px rgba(10, 54, 62, .55);
}

.zd-otp__intro {
	margin-block-end: 1.75rem;
}

.zd-otp__intro .zd-otp__eyebrow {
	margin-block: .8rem .15rem;
	color: var(--zd-primary-dark);
	font-size: .76rem;
	font-weight: 800;
}

.zd-otp__intro h2 {
	margin-block: .15rem .55rem;
	font-size: clamp(1.55rem, 4vw, 1.9rem);
}

.zd-otp__intro p:not(.zd-otp__eyebrow) {
	max-inline-size: 29rem;
	margin-inline: auto;
	font-size: .92rem;
}

.zd-otp__step {
	gap: .65rem;
}

.zd-otp__step > small {
	margin-block-start: -.2rem;
	color: var(--zd-muted);
	font-size: .76rem;
}

.zd-otp__input-wrap {
	display: flex;
	align-items: center;
	min-block-size: 54px;
	border: 1px solid var(--zd-line);
	border-radius: 8px;
	background: #f8faf9;
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.zd-otp__input-wrap:focus-within {
	border-color: var(--zd-primary);
	background: var(--zd-surface);
	box-shadow: var(--zd-ring);
}

.zd-otp__input-wrap > span {
	padding-inline: .9rem;
	border-inline-end: 1px solid var(--zd-line);
	color: var(--zd-muted);
	font-size: .84rem;
	font-weight: 700;
}

.zd-otp__input-wrap input {
	min-block-size: 52px;
	padding-inline: .9rem;
	border: 0;
	background: transparent;
	box-shadow: none !important;
}

.zd-otp__destination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	margin-block-end: .3rem;
	padding: .75rem .85rem;
	border: 1px solid #d9ece7;
	border-radius: 8px;
	background: var(--zd-primary-soft);
	color: var(--zd-muted);
	font-size: .78rem;
}

.zd-otp__destination strong {
	color: var(--zd-primary-dark);
	font-size: .88rem;
}

.zd-otp__step .zd-otp__code {
	direction: ltr;
	text-align: center;
	font-size: 1.45rem;
	font-weight: 800;
	letter-spacing: .55em;
	text-indent: .55em;
}

.zd-otp__secondary {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .65rem;
	min-block-size: 26px;
	color: var(--zd-muted);
	font-size: .78rem;
}

.zd-otp__resend,
.zd-otp__back {
	padding: .35rem;
	border: 0;
	background: transparent;
	color: var(--zd-primary-dark);
	font: inherit;
	font-weight: 750;
	cursor: pointer;
}

.zd-otp__resend:disabled {
	color: var(--zd-muted);
	cursor: not-allowed;
}

.zd-otp__back {
	text-decoration: none;
}

.zd-otp__back:hover,
.zd-otp__resend:not(:disabled):hover {
	text-decoration: underline;
}

.zd-otp__message.is-error {
	color: #a43f34;
}

.zd-otp__trust {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	margin-block-start: 1rem;
	padding-block-start: 1rem;
	border-block-start: 1px solid var(--zd-line);
	color: var(--zd-muted);
	font-size: .76rem;
}

.zd-otp__trust svg {
	color: var(--zd-primary-dark);
}

.zd-otp__trust a {
	margin-inline-start: .25rem;
	color: var(--zd-primary-dark);
	font-weight: 750;
}

.zd-password-login {
	margin-block-start: 1rem;
	border-block-start: 1px solid var(--zd-line);
}

.zd-password-login > summary {
	inline-size: fit-content;
	margin-inline: auto;
	padding: 1rem .25rem;
	color: var(--zd-muted);
	font-size: .84rem;
	font-weight: 750;
	cursor: pointer;
}

.zd-password-login[open] > summary {
	color: var(--zd-primary-dark);
}

.zd-password-login__body {
	padding: 1.25rem;
	border: 1px solid var(--zd-line);
	border-radius: 10px;
	background: var(--zd-surface);
}

.zd-password-login__body .u-columns {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
}

.zd-password-login__body .u-column1,
.zd-password-login__body .u-column2 {
	float: none !important;
	inline-size: auto !important;
	margin: 0;
}

.zd-password-login__body h2 {
	font: 800 1.15rem/1.5 var(--zd-font-display);
}

.woocommerce-account:not(.logged-in) .woocommerce form.login,
.woocommerce-account:not(.logged-in) .woocommerce form.register {
	margin: 0;
	padding: 0;
	border: 0;
}

.woocommerce-account:not(.logged-in) .woocommerce form.login input.input-text,
.woocommerce-account:not(.logged-in) .woocommerce form.register input.input-text {
	inline-size: 100%;
	min-block-size: 48px;
	padding: .75rem .9rem;
	border: 1px solid var(--zd-line);
	border-radius: 7px;
	background: #f8faf9;
	font: inherit;
}

.woocommerce-account:not(.logged-in) .woocommerce form .button {
	min-block-size: 46px;
	padding: .7rem 1rem;
	border: 0;
	border-radius: 7px;
	background: var(--zd-primary-dark);
	color: #fff;
	font: 750 .9rem/1 var(--zd-font-body);
}

.zd-booking-flow {
	inline-size: min(100%, 68rem);
	margin-inline: auto;
	padding: clamp(1.1rem, 3vw, 2rem);
	border-radius: 12px;
	box-shadow: 0 30px 74px -48px rgba(10, 54, 62, .58);
}

.zd-booking-flow__head {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 1.5rem;
	padding-block-end: 1.2rem;
}

.zd-booking-flow__head span {
	color: var(--zd-primary-dark);
	font-size: .76rem;
	font-weight: 800;
}

.zd-booking-flow__head h3 {
	margin: .15rem 0 0;
	color: var(--zd-ink);
	font: 800 clamp(1.35rem, 3vw, 1.75rem)/1.4 var(--zd-font-display);
}

.zd-booking-flow__head p {
	max-inline-size: 29rem;
	margin: 0;
	color: var(--zd-muted);
	font-size: .84rem;
}

.zd-booking-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0 0 1.6rem;
	padding: 0;
	border-block: 1px solid var(--zd-line);
	list-style: none;
}

.zd-booking-steps li {
	position: relative;
}

.zd-booking-steps li:not(:last-child)::after {
	content: "";
	position: absolute;
	inset-block: .8rem;
	inset-inline-end: 0;
	inline-size: 1px;
	background: var(--zd-line);
}

.zd-booking-steps button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	inline-size: 100%;
	min-block-size: 66px;
	padding: .65rem;
	border: 0;
	background: transparent;
	color: var(--zd-muted);
	font: 750 .82rem/1.5 var(--zd-font-body);
	cursor: pointer;
}

.zd-booking-steps button:disabled {
	cursor: default;
}

.zd-booking-steps b {
	display: grid;
	place-items: center;
	inline-size: 28px;
	block-size: 28px;
	flex: none;
	border: 1px solid var(--zd-line);
	border-radius: 50%;
	background: var(--zd-surface);
	font-size: .78rem;
}

.zd-booking-steps .is-active button,
.zd-booking-steps .is-complete button {
	color: var(--zd-primary-dark);
}

.zd-booking-steps .is-active b {
	border-color: var(--zd-primary-dark);
	background: var(--zd-primary-dark);
	color: #fff;
}

.zd-booking-steps .is-complete b {
	border-color: #b9ded5;
	background: var(--zd-primary-soft);
}

.zd-booking-step {
	min-block-size: 22rem;
}

.zd-booking-step[hidden] {
	display: none !important;
}

.zd-booking-step.is-active {
	animation: zd-booking-step-in .24s ease both;
}

@keyframes zd-booking-step-in {
	from { opacity: 0; transform: translateY(5px); }
	to { opacity: 1; transform: none; }
}

.zd-booking-step__heading {
	display: flex;
	align-items: flex-start;
	gap: .8rem;
	margin-block-end: 1.25rem;
}

.zd-booking-step__heading > span {
	display: grid;
	place-items: center;
	inline-size: 34px;
	block-size: 34px;
	flex: none;
	border-radius: 8px;
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
	font-weight: 850;
}

.zd-booking-step__heading h4 {
	margin: 0;
	font: 800 1.12rem/1.5 var(--zd-font-display);
}

.zd-booking-step__heading p {
	margin: .15rem 0 0;
	color: var(--zd-muted);
	font-size: .8rem;
}

.zd-booking-step__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.zd-booking-step__grid .zd-field--full {
	grid-column: 1 / -1;
}

.zd-field__optional {
	margin-inline-start: .35rem;
	color: var(--zd-muted);
	font-size: .68rem;
	font-weight: 500;
}

.zd-booking-step .zd-field > small {
	color: var(--zd-muted);
	font-size: .72rem;
}

.zd-time-options {
	display: none;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: .5rem;
}

.zd-runtime-ready .zd-time-options {
	display: grid;
}

.zd-runtime-ready .zd-time-select {
	position: absolute !important;
	inline-size: 1px !important;
	block-size: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	clip-path: inset(50%);
	overflow: hidden;
}

.zd-time-options button {
	min-block-size: 44px;
	padding: .5rem;
	border: 1px solid var(--zd-line);
	border-radius: 7px;
	background: #f8faf9;
	color: var(--zd-ink);
	font: 750 .82rem/1 var(--zd-font-body);
	cursor: pointer;
	transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}

.zd-time-options button:hover {
	border-color: var(--zd-primary);
	background: var(--zd-primary-soft);
}

.zd-time-options button.is-selected {
	border-color: var(--zd-primary-dark);
	background: var(--zd-primary-dark);
	color: #fff;
}

.zd-booking-step__actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	margin-block-start: 1.5rem;
	padding-block-start: 1.1rem;
	border-block-start: 1px solid var(--zd-line);
}

.zd-booking-step__actions .zd-btn {
	min-block-size: 48px;
}

.zd-btn.zd-btn--quiet {
	border: 1px solid var(--zd-line);
	background: var(--zd-surface);
	color: var(--zd-muted);
	box-shadow: none;
}

.zd-btn.zd-btn--quiet:hover {
	border-color: var(--zd-primary-dark);
	color: var(--zd-primary-dark);
}

.zd-booking-confirm {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(15rem, .75fr);
	gap: 1.25rem;
	align-items: start;
}

.zd-booking-summary {
	padding: 1rem;
	border: 1px solid #d5e9e4;
	border-radius: 9px;
	background: var(--zd-primary-soft);
}

.zd-booking-summary > span {
	color: var(--zd-primary-dark);
	font-size: .7rem;
	font-weight: 850;
}

.zd-booking-summary h5 {
	margin: .15rem 0 .8rem;
	font: 800 1rem/1.5 var(--zd-font-display);
}

.zd-booking-summary dl,
.zd-booking-summary dl div {
	margin: 0;
}

.zd-booking-summary dl {
	display: grid;
	gap: .5rem;
}

.zd-booking-summary dl div {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: .75rem;
	padding-block-start: .5rem;
	border-block-start: 1px solid rgba(8, 123, 109, .13);
}

.zd-booking-summary dt {
	color: var(--zd-muted);
	font-size: .72rem;
}

.zd-booking-summary dd {
	color: var(--zd-ink);
	font-size: .78rem;
	font-weight: 750;
	text-align: end;
}

.zd-booking-login {
	margin: 1rem 0 0;
	color: var(--zd-muted);
	font-size: .8rem;
}

.zd-booking-login a {
	color: var(--zd-primary-dark);
	font-weight: 800;
}

.zd-booking-step > .zd-form__note {
	max-inline-size: none;
	margin-block-start: .75rem;
}

@media (max-width: 720px) {
	.zd-password-login__body .u-columns,
	.zd-booking-confirm,
	.zd-booking-step__grid {
		grid-template-columns: 1fr;
	}

	.zd-booking-step__grid .zd-field--full {
		grid-column: auto;
	}

	.zd-booking-flow__head {
		align-items: flex-start;
		flex-direction: column;
		gap: .45rem;
	}

	.zd-booking-flow__head p {
		max-inline-size: none;
	}

	.zd-time-options {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 520px) {
	.zd-otp,
	.zd-booking-flow {
		padding: 1rem;
	}

	.zd-otp__trust {
		flex-wrap: wrap;
	}

	.zd-booking-steps {
		margin-inline: -.25rem;
	}

	.zd-booking-steps button {
		align-items: center;
		flex-direction: column;
		gap: .25rem;
		min-block-size: 76px;
		padding-inline: .2rem;
		font-size: .68rem;
		text-align: center;
	}

	.zd-booking-steps li:not(:last-child)::after {
		inset-block: 1rem;
	}

	.zd-booking-step {
		min-block-size: 0;
	}

	.zd-booking-step__actions {
		align-items: stretch;
		flex-direction: column-reverse;
	}

	.zd-booking-step__actions > span {
		display: none;
	}

	.zd-booking-step__actions .zd-btn {
		inline-size: 100%;
	}

	.zd-time-options {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Patient time-management dashboard. */
.zd-account-appointments { max-width: 72rem; color: var(--zd-ink); }
.zd-account-appointments__head { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; padding-block-end: 1.25rem; border-block-end: 1px solid var(--zd-line); }
.zd-account-appointments__head > div > span { color: var(--zd-primary-dark); font-size: .8rem; font-weight: 800; }
.zd-account-appointments__head h2 { margin: .2rem 0; font: 800 clamp(1.6rem, 3vw, 2.2rem)/1.25 var(--zd-font-display); }
.zd-account-appointments__head p { margin: 0; color: var(--zd-muted); }
.zd-account-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin-block: 1.25rem 2rem; border-block: 1px solid var(--zd-line); }
.zd-account-stats > div { display: flex; align-items: center; gap: .65rem; min-height: 76px; padding: .75rem 1rem; border-inline-end: 1px solid var(--zd-line); }
.zd-account-stats > div:first-child { border-inline-end: 0; }
.zd-account-stats strong { font: 800 1.7rem/1 var(--zd-font-display); color: var(--zd-primary-dark); }
.zd-account-stats span { color: var(--zd-muted); }
.zd-next-appointment { display: grid; grid-template-columns: 1fr auto; gap: 1.5rem; align-items: center; padding: 1.4rem 1.6rem; border-inline-start: 5px solid var(--zd-primary); border-radius: 8px; background: linear-gradient(110deg, var(--zd-primary-soft), var(--zd-surface)); }
.zd-next-appointment__label { color: var(--zd-primary-dark); font-size: .8rem; font-weight: 800; }
.zd-next-appointment h3 { margin: .25rem 0; font: 800 1.35rem/1.4 var(--zd-font-display); }
.zd-next-appointment p { margin: 0; color: var(--zd-muted); }
.zd-next-appointment__time { display: grid; gap: .35rem; min-width: 15rem; padding-inline-start: 1.25rem; border-inline-start: 1px solid var(--zd-line); }
.zd-account-appointments__group { margin-block-start: 2rem; }
.zd-account-appointments__group > h3 { margin-block-end: .75rem; font: 800 1.15rem/1.5 var(--zd-font-display); }
.zd-appointment-card { grid-template-columns: minmax(12rem, 1.5fr) minmax(10rem, 1fr) minmax(5rem, .5fr) auto auto; box-shadow: none; }
.zd-appointment-card > div:not(.zd-appointment-card__main) { display: grid; gap: .2rem; }
.zd-appointment-card small { padding: 0; background: transparent; color: var(--zd-muted); font-size: .72rem; }
.zd-appointment-card__main { display: grid; gap: .25rem; }
.zd-appointment-status { justify-self: start; padding: .35rem .55rem; border-radius: 6px; font-size: .78rem; font-weight: 800; }
.zd-appointment-status--pending { background: #fff6d8; color: #755700; }
.zd-appointment-status--confirmed { background: var(--zd-primary-soft); color: var(--zd-primary-dark); }
.zd-appointment-status--done { background: #eef2f1; color: #42565d; }
.zd-appointment-status--cancelled { background: #fff0ee; color: #8b3029; }
.zd-appointment-cancel { min-height: 44px; display: inline-flex; align-items: center; }
.zd-account-empty { padding-block: 3rem; text-align: center; }
@media (max-width: 820px) {
	.zd-account-appointments__head { align-items: stretch; flex-direction: column; }
	.zd-account-appointments__head .zd-btn { align-self: start; }
	.zd-next-appointment { grid-template-columns: 1fr; }
	.zd-next-appointment__time { min-width: 0; padding: 1rem 0 0; border-inline-start: 0; border-block-start: 1px solid var(--zd-line); }
	.zd-appointment-card { grid-template-columns: repeat(2, 1fr); }
	.zd-appointment-card__main { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
	.zd-account-stats { grid-template-columns: 1fr; }
	.zd-account-stats > div { border-inline-end: 0; border-block-end: 1px solid var(--zd-line); }
	.zd-account-stats > div:last-child { border-block-end: 0; }
	.zd-appointment-card { grid-template-columns: 1fr; }
	.zd-appointment-card__main { grid-column: auto; }
}

/* ------------------------------------------------------------------
   3. Layout primitives
------------------------------------------------------------------ */
.zd-container {
	width: 100%;
	max-width: var(--zd-container);
	margin-inline: auto;
	padding-inline: var(--zd-container-pad);
}

.zd-container--header {
	max-width: var(--zd-header-container, var(--zd-container));
}

.zd-section {
	position: relative;
	padding-block: var(--zd-section-y);
}

.zd-section--tint {
	background: linear-gradient(180deg, var(--zd-primary-soft) 0%, var(--zd-warm-white) 100%);
}

.zd-section--sand {
	background: var(--zd-beige);
}

.zd-section--mint {
	background: var(--zd-mint-soft);
}

.zd-section-head {
	max-width: 46rem;
	margin-inline: auto;
	margin-block-end: clamp(2.25rem, 1.5rem + 2vw, 3.5rem);
	text-align: center;
}

.zd-section-head--start {
	margin-inline: 0;
	text-align: start;
}

.zd-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-size: var(--zd-text-xs);
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--zd-primary-dark);
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-pill);
	padding: .4rem .9rem;
	margin-block-end: 1rem;
	box-shadow: var(--zd-shadow-xs);
}

.zd-eyebrow::before {
	content: "";
	inline-size: 6px;
	block-size: 6px;
	border-radius: 50%;
	background: var(--zd-mint);
}

.zd-section-title {
	font-size: var(--zd-h2);
	margin-block-end: .5rem;
}

.zd-section-title em {
	font-style: italic;
	color: var(--zd-primary);
}

.zd-section-sub {
	color: var(--zd-muted);
	font-size: var(--zd-text-lead);
	margin: 0;
}

.zd-grid {
	display: grid;
	gap: var(--zd-gap);
}

@media (min-width: 640px) {
	.zd-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.zd-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 960px) {
	.zd-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.zd-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ------------------------------------------------------------------
   4. Buttons
------------------------------------------------------------------ */
.zd-btn {
	--_bg: var(--zd-primary-dark);
	--_hover-bg: #06685d;
	--_fg: #fff;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	font-family: var(--zd-font-body);
	font-size: var(--zd-text-sm);
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	padding: 1.05rem 1.75rem;
	border: 1px solid transparent;
	border-radius: var(--zd-radius-pill);
	background: var(--_bg);
	color: var(--_fg);
	cursor: pointer;
	transition: transform .25s var(--zd-ease), box-shadow .25s var(--zd-ease), background-color .2s ease, color .2s ease;
	box-shadow: 0 10px 22px -12px rgba(18, 101, 123, .8);
}

.zd-btn:hover {
	color: var(--_fg);
	background: var(--_hover-bg);
	transform: translateY(-2px);
	box-shadow: 0 18px 32px -14px rgba(18, 101, 123, .85);
}

/* Buttons keep their contrast when rendered inside rich-text page content. */
.zd-prose .zd-btn,
.zd-prose .zd-btn:hover {
	color: var(--_fg);
	text-decoration: none;
}

.zd-btn:active {
	transform: translateY(0);
}

.zd-btn:focus-visible {
	outline: 3px solid rgba(8, 123, 109, .3);
	outline-offset: 3px;
}

.zd-btn:disabled,
.zd-btn[aria-disabled="true"] {
	cursor: not-allowed;
	opacity: .68;
	transform: none;
}

.zd-btn--ghost {
	--_bg: transparent;
	--_hover-bg: var(--zd-surface);
	--_fg: var(--zd-ink);
	border-color: var(--zd-line);
	background: var(--zd-surface);
	box-shadow: var(--zd-shadow-xs);
}

.zd-btn--ghost:hover {
	--_fg: var(--zd-primary-dark);
	border-color: var(--zd-primary);
	box-shadow: var(--zd-shadow);
}

/* Keep the secondary hero action readable even when a global Elementor link
   colour has higher priority than the theme palette. */
.zd-hero__cta .zd-btn--ghost {
	color: var(--zd-ink);
}

.zd-hero__cta .zd-btn--ghost:hover {
	color: var(--zd-primary-dark);
}

.zd-btn--mint {
	--_bg: var(--zd-mint);
	--_hover-bg: #8be5cf;
	--_fg: #06382c;
	box-shadow: 0 10px 22px -12px rgba(82, 195, 165, .9);
}

.zd-btn--block {
	inline-size: 100%;
}

.zd-btn .zd-i {
	inline-size: 1.15em;
	block-size: 1.15em;
	flex: none;
}

/* Directional icon flips in RTL */
.zd-btn .zd-i--arrow {
	transition: transform .25s var(--zd-ease);
}

.zd-btn:hover .zd-i--arrow {
	transform: translateX(3px);
}

/* Text link with sweeping underline */
.zd-link {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-weight: 700;
	font-size: var(--zd-text-sm);
	text-decoration: none;
	color: var(--zd-primary-dark);
	background-image: linear-gradient(var(--zd-primary), var(--zd-primary));
	background-size: 0% 1.5px;
	background-position: 0 100%;
	background-repeat: no-repeat;
	transition: background-size .35s var(--zd-ease);
	padding-block-end: 2px;
}

.zd-link:hover {
	background-size: 100% 1.5px;
}

/* ------------------------------------------------------------------
   5. Cards
------------------------------------------------------------------ */
.zd-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-lg);
	padding: clamp(1.5rem, 1.2rem + 1vw, 2rem);
	box-shadow: var(--zd-shadow-xs);
	transition: transform .35s var(--zd-ease), box-shadow .35s var(--zd-ease), border-color .35s ease;
	overflow: hidden;
	block-size: 100%;
}

.zd-card::after {
	/* soft brand wash that fades in on hover */
	content: "";
	position: absolute;
	inset-block-start: -40%;
	inset-inline-end: -30%;
	inline-size: 60%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle, var(--zd-primary-soft) 0%, transparent 70%);
	opacity: 0;
	transition: opacity .45s var(--zd-ease);
	pointer-events: none;
}

.zd-card:hover,
.zd-card:focus-within {
	transform: translateY(-6px);
	box-shadow: var(--zd-shadow-lg);
	border-color: transparent;
}

.zd-card:hover::after,
.zd-card:focus-within::after {
	opacity: 1;
}

.zd-card > * {
	position: relative;
	z-index: 1;
}

.zd-card__icon {
	display: grid;
	place-items: center;
	inline-size: 58px;
	block-size: 58px;
	border-radius: 18px;
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
	margin-block-end: 1.25rem;
	transition: background-color .35s ease, color .35s ease, transform .35s var(--zd-ease);
}

.zd-card__icon svg,
.zd-card__icon i {
	inline-size: 26px;
	block-size: 26px;
	font-size: 26px;
}

.zd-card:hover .zd-card__icon {
	background: var(--zd-primary);
	color: #fff;
	transform: rotate(-4deg) scale(1.04);
}

.zd-card__title {
	font-size: var(--zd-h3);
	margin-block-end: .5rem;
}

.zd-card__text {
	color: var(--zd-muted);
	font-size: var(--zd-text-sm);
	margin-block-end: 1.25rem;
}

.zd-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-block-start: auto;
	padding-block-start: 1.15rem;
	border-block-start: 1px dashed var(--zd-line);
}

.zd-price {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.zd-price__label {
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
}

.zd-price__value {
	font-family: var(--zd-font-display);
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--zd-primary-dark);
}

/* ------------------------------------------------------------------
   6. Header
------------------------------------------------------------------ */
.zd-topbar {
	background: var(--zd-ink);
	color: rgba(255, 255, 255, .82);
	font-size: var(--zd-text-xs);
}

.zd-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-block-size: 40px;
	flex-wrap: wrap;
}

.zd-topbar a {
	color: #fff;
	text-decoration: none;
}

.zd-topbar a:hover {
	color: var(--zd-mint);
}

.zd-topbar__list {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
	flex-wrap: wrap;
}

.zd-topbar__list li {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
}

.zd-header {
	position: sticky;
	inset-block-start: 0;
	z-index: 999;
	background: rgba(253, 251, 248, .82);
	backdrop-filter: saturate(160%) blur(14px);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	border-block-end: 1px solid transparent;
	transition: box-shadow .3s ease, border-color .3s ease, background-color .3s ease;
}

.zd-header.is-stuck {
	border-block-end-color: var(--zd-line);
	box-shadow: 0 10px 30px -22px rgba(20, 49, 60, .45);
}

.admin-bar .zd-header {
	inset-block-start: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .zd-header {
		inset-block-start: 46px;
	}
}

.zd-header__inner {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	min-block-size: var(--zd-header-h);
}

.zd-brand {
	display: inline-flex;
	align-items: center;
	gap: .7rem;
	text-decoration: none;
	color: var(--zd-ink);
	flex: 0 1 auto;
	min-inline-size: 0;
}

.zd-brand img {
	max-block-size: 52px;
	inline-size: auto;
}

.zd-brand__mark {
	display: grid;
	place-items: center;
	inline-size: 44px;
	block-size: 44px;
	border-radius: 14px;
	background: linear-gradient(140deg, var(--zd-primary) 0%, var(--zd-mint) 100%);
	color: #fff;
	flex: none;
}

.zd-brand__mark svg {
	inline-size: 24px;
	block-size: 24px;
}

.zd-brand__name {
	display: block;
	min-inline-size: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--zd-font-display);
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: 0;
}

.zd-brand__tag {
	display: block;
	font-family: var(--zd-font-body);
	font-size: .7rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--zd-muted);
}

.zd-nav {
	margin-inline-start: auto;
}

.zd-nav ul {
	display: flex;
	align-items: center;
	gap: clamp(.75rem, .2rem + 1.1vw, 1.75rem);
	list-style: none;
	margin: 0;
	padding: 0;
}

.zd-nav a {
	position: relative;
	display: block;
	padding: .5rem 0;
	font-size: var(--zd-text-sm);
	font-weight: 600;
	color: var(--zd-ink);
	text-decoration: none;
	white-space: nowrap;
}

.zd-header--brand-center .zd-brand {
	order: 2;
	margin-inline: auto;
}

.zd-header--brand-center .zd-nav { order: 1; margin-inline-start: 0; }
.zd-header--brand-center .zd-header__actions { order: 3; margin-inline-start: 0; }

.zd-nav a::after {
	content: "";
	position: absolute;
	inset-block-end: 0;
	inset-inline-start: 0;
	inline-size: 0;
	block-size: 2px;
	border-radius: 2px;
	background: var(--zd-mint);
	transition: inline-size .3s var(--zd-ease);
}

.zd-nav a:hover::after,
.zd-nav .current-menu-item > a::after,
.zd-nav a.is-active::after {
	inline-size: 100%;
}

.zd-nav .sub-menu {
	position: absolute;
	inset-block-start: 100%;
	inset-inline-start: 0;
	min-inline-size: 220px;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	padding: .5rem;
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius);
	box-shadow: var(--zd-shadow-lg);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .25s ease, transform .25s var(--zd-ease), visibility .25s;
}

.zd-nav li {
	position: relative;
}

.zd-nav li:hover > .sub-menu,
.zd-nav li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.zd-nav .sub-menu a {
	padding: .55rem .75rem;
	border-radius: 10px;
}

.zd-nav .sub-menu a::after {
	display: none;
}

.zd-nav .sub-menu a:hover {
	background: var(--zd-primary-soft);
}

.zd-header__actions {
	display: flex;
	align-items: center;
	gap: .75rem;
	flex: none;
	margin-inline-start: auto;
}

.zd-header__phone {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-weight: 700;
	font-size: var(--zd-text-sm);
	text-decoration: none;
	color: var(--zd-ink);
}

.zd-header__phone svg {
	inline-size: 34px;
	block-size: 34px;
	padding: 8px;
	border-radius: 50%;
	background: var(--zd-mint-soft);
	color: var(--zd-primary-dark);
}

.zd-burger {
	display: none;
	align-items: center;
	justify-content: center;
	inline-size: 46px;
	block-size: 46px;
	padding: 0;
	border: 1px solid var(--zd-line);
	border-radius: 8px;
	background: var(--zd-surface);
	color: var(--zd-ink);
	cursor: pointer;
}

.zd-burger span {
	position: relative;
	display: block;
	inline-size: 18px;
	block-size: 2px;
	border-radius: 2px;
	background: currentColor;
	transition: transform .3s var(--zd-ease), background-color .2s;
}

.zd-burger span::before,
.zd-burger span::after {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inline-size: 18px;
	block-size: 2px;
	border-radius: 2px;
	background: currentColor;
	transition: transform .3s var(--zd-ease), top .2s ease, bottom .2s ease;
}

.zd-burger span::before { inset-block-start: -6px; }
.zd-burger span::after { inset-block-end: -6px; }

.zd-burger[aria-expanded="true"] span {
	background: transparent;
}

.zd-burger[aria-expanded="true"] span::before {
	inset-block-start: 0;
	transform: rotate(45deg);
}

.zd-burger[aria-expanded="true"] span::after {
	inset-block-end: 0;
	transform: rotate(-45deg);
}

/* The top bar carries five pieces of contact info — useful on a laptop, a
   four-row wall on a phone. The same details are in the footer and the dock. */
@media (max-width: 767px) {
	.zd-topbar {
		display: none;
	}
}

/* Below ~640px the brand, the CTA and the burger stop fitting on one line.
   The CTA collapses to its icon rather than wrapping or clipping. */
@media (max-width: 640px) {
	:root {
		--zd-header-h: 72px;
	}

	.zd-header__inner {
		gap: .5rem;
	}

	.zd-brand {
		flex: 1 1 auto;
		gap: .45rem;
		max-inline-size: 100%;
	}

	.zd-brand__mark {
		inline-size: 38px;
		block-size: 38px;
	}

	.zd-brand__tag {
		display: none;
	}

	.zd-brand__name {
		font-size: .92rem;
		font-weight: 750;
	}

	.zd-brand img {
		max-block-size: 40px;
	}

	.zd-header__actions .zd-btn {
		inline-size: 42px;
		block-size: 42px;
		padding: 0;
	}

	.zd-header__actions .zd-btn span {
		display: none;
	}

	.zd-burger {
		inline-size: 42px;
		block-size: 42px;
	}
}

@media (max-width: 420px) {
	.zd-header__actions > .zd-btn {
		display: none;
	}
}

@media (max-width: 1180px) {
	/* backdrop-filter creates a containing block that traps fixed children in
	   the 72px header. Use an opaque header so the mobile menu owns the viewport. */
	.zd-header {
		background: rgba(253, 251, 248, .98);
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
	}

	.zd-burger { display: inline-flex; }
	.zd-header__phone { display: none; }

	.zd-nav {
		position: fixed;
		inset-block-start: var(--zd-header-h);
		inset-inline: 0;
		inset-block-end: 0;
		background: var(--zd-warm-white);
		padding: 1.5rem var(--zd-container-pad) 2rem;
		overflow-y: auto;
		transform: translateY(-8px);
		opacity: 0;
		visibility: hidden;
		transition: opacity .3s ease, transform .3s var(--zd-ease), visibility .3s;
	}

	.zd-nav.is-open {
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.zd-nav ul {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.zd-nav > ul > li {
		border-block-end: 1px solid var(--zd-line);
	}

	.zd-nav a {
		padding: 1rem 0;
		font-size: 1.05rem;
	}

	.zd-nav a::after { display: none; }

	.zd-nav .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: 0;
		padding-inline-start: .75rem;
	}

	.zd-header--brand-center .zd-brand,
	.zd-header--brand-center .zd-nav,
	.zd-header--brand-center .zd-header__actions {
		order: initial;
	}
	.zd-header--brand-center .zd-brand { margin-inline: 0; }
	.zd-header--brand-center .zd-header__actions { margin-inline-start: auto; }
}

@media (min-width: 783px) and (max-width: 1180px) {
	.admin-bar .zd-nav { inset-block-start: calc(var(--zd-header-h) + 32px); }
}

@media (max-width: 782px) {
	.admin-bar .zd-nav { inset-block-start: calc(var(--zd-header-h) + 46px); }
}

/* ------------------------------------------------------------------
   7. Hero
------------------------------------------------------------------ */
.zd-hero {
	position: relative;
	padding-block: clamp(3rem, 1.5rem + 6vw, 6rem) clamp(4rem, 2rem + 6vw, 7rem);
	background:
		radial-gradient(90% 70% at 100% 0%, var(--zd-mint-soft) 0%, transparent 60%),
		radial-gradient(70% 60% at 0% 10%, var(--zd-primary-soft) 0%, transparent 65%),
		var(--zd-warm-white);
	overflow: hidden;
}

.zd-hero__grid {
	display: grid;
	gap: clamp(2.5rem, 1rem + 5vw, 4.5rem);
	align-items: center;
}

@media (min-width: 960px) {
	.zd-hero__grid {
		grid-template-columns: 1.05fr .95fr;
	}
}

.zd-hero__title {
	font-size: var(--zd-hero);
	max-inline-size: 17ch;
	margin-block-end: 1.1rem;
}

.zd-hero__identity {
	display: block;
	margin-block-end: .7rem;
	color: var(--zd-primary-dark);
	font-size: 1.05rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .08em;
}

.zd-hero__title em {
	font-style: italic;
	color: var(--zd-primary);
	position: relative;
}

.zd-hero__lead {
	font-size: var(--zd-text-lead);
	color: var(--zd-muted);
	max-inline-size: 34rem;
	margin-block-end: 2rem;
}

.zd-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
	margin-block-end: 2.25rem;
}

.zd-hero__trust {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	flex-wrap: wrap;
}

.zd-avatars {
	display: flex;
}

.zd-avatars img,
.zd-avatars span {
	inline-size: 42px;
	block-size: 42px;
	border-radius: 50%;
	border: 3px solid var(--zd-warm-white);
	object-fit: cover;
	margin-inline-start: -12px;
	background: var(--zd-primary-soft);
	display: grid;
	place-items: center;
	font-size: .75rem;
	font-weight: 700;
	color: var(--zd-primary-dark);
}

.zd-avatars > :first-child {
	margin-inline-start: 0;
}

.zd-trust__text {
	font-size: var(--zd-text-sm);
	color: var(--zd-muted);
	line-height: 1.4;
}

.zd-trust__text strong {
	display: block;
	color: var(--zd-ink);
}

.zd-stars {
	display: inline-flex;
	gap: 2px;
	color: #f2b544;
}

.zd-stars svg {
	inline-size: 16px;
	block-size: 16px;
}

/* Hero media: organic blob frame + floating chips */
.zd-hero__media {
	position: relative;
	isolation: isolate;
}

.zd-hero__figure {
	position: relative;
	margin: 0;
	border-radius: 8px 8px 48px 8px;
	overflow: hidden;
	background: linear-gradient(160deg, var(--zd-primary-soft), var(--zd-mint-soft));
	box-shadow: var(--zd-shadow-lg);
	aspect-ratio: 4 / 5;
}

.zd-hero__figure img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
}

.zd-hero__figure--placeholder {
	display: grid;
	place-items: center;
	color: var(--zd-primary-dark);
	text-align: center;
	padding: 2rem;
}

.zd-hero__blob {
	position: absolute;
	inset-block-start: -6%;
	inset-inline-end: -8%;
	inline-size: 55%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 30%, var(--zd-sand), transparent 70%);
	filter: blur(2px);
	z-index: -1;
	animation: zd-float 9s ease-in-out infinite;
}

.zd-chip {
	position: absolute;
	display: flex;
	align-items: center;
	gap: .65rem;
	padding: .8rem 1.1rem;
	background: rgba(255, 255, 255, .92);
	backdrop-filter: blur(8px);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius);
	box-shadow: var(--zd-shadow);
	font-size: var(--zd-text-xs);
	font-weight: 600;
	line-height: 1.3;
	animation: zd-float 7s ease-in-out infinite;
}

.zd-chip strong {
	display: block;
	font-family: var(--zd-font-display);
	font-size: 1.15rem;
	color: var(--zd-primary-dark);
}

.zd-chip__icon {
	display: grid;
	place-items: center;
	inline-size: 36px;
	block-size: 36px;
	border-radius: 8px;
	background: var(--zd-mint-soft);
	color: var(--zd-primary-dark);
	flex: none;
}

.zd-chip--a {
	inset-block-start: 12%;
	inset-inline-start: -6%;
}

.zd-chip--b {
	inset-block-end: 10%;
	inset-inline-end: -4%;
	animation-delay: -3.5s;
}

@media (max-width: 640px) {
	.zd-chip--a { inset-inline-start: -2%; }
	.zd-chip--b { inset-inline-end: 0; }
}

@keyframes zd-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-10px); }
}

/* ------------------------------------------------------------------
   8. About / clinic intro
------------------------------------------------------------------ */
.zd-about__grid {
	display: grid;
	gap: clamp(2rem, 1rem + 4vw, 4rem);
	align-items: center;
}

@media (min-width: 960px) {
	.zd-about__grid {
		grid-template-columns: .95fr 1.05fr;
	}
}

.zd-about__media {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.zd-about__media img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	border-radius: var(--zd-radius-lg);
	box-shadow: var(--zd-shadow);
}

/* Scoped to img: the floating badge is also a child of this grid, and an
   aspect-ratio would square it off. */
.zd-about__media > img:first-of-type {
	grid-row: span 2;
	aspect-ratio: 3 / 5;
}

.zd-about__media > img:not(:first-of-type) {
	aspect-ratio: 1;
}

.zd-badge-float {
	position: absolute;
	inset-block-end: -1.25rem;
	inset-inline-start: -1.25rem;
	max-inline-size: 260px;
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: 1rem 1.25rem;
	border-radius: var(--zd-radius);
	background: var(--zd-ink);
	color: #fff;
	box-shadow: var(--zd-shadow-lg);
	font-size: var(--zd-text-xs);
	line-height: 1.3;
}

.zd-badge-float strong {
	font-family: var(--zd-font-display);
	font-size: 1.7rem;
	color: var(--zd-mint);
	display: block;
}

.zd-feature-list {
	list-style: none;
	margin: 1.75rem 0 2rem;
	padding: 0;
	display: grid;
	gap: 1rem;
}

@media (min-width: 640px) {
	.zd-feature-list {
		grid-template-columns: 1fr 1fr;
	}
}

.zd-feature-list li {
	display: flex;
	align-items: flex-start;
	gap: .75rem;
	font-size: var(--zd-text-sm);
	font-weight: 600;
}

.zd-feature-list svg {
	inline-size: 22px;
	block-size: 22px;
	flex: none;
	color: var(--zd-mint);
	margin-block-start: 2px;
}

.zd-feature-list span small {
	display: block;
	font-weight: 400;
	color: var(--zd-muted);
	font-size: var(--zd-text-xs);
}

/* ------------------------------------------------------------------
   9. Booking
------------------------------------------------------------------ */
.zd-booking {
	position: relative;
	background:
		radial-gradient(80% 80% at 10% 0%, rgba(82, 195, 165, .16) 0%, transparent 60%),
		var(--zd-ink);
	color: #fff;
	overflow: hidden;
}

.zd-booking .zd-section-title,
.zd-booking h3 {
	color: #fff;
}

.zd-booking .zd-section-sub {
	color: rgba(255, 255, 255, .72);
}

.zd-booking .zd-eyebrow {
	background: rgba(255, 255, 255, .08);
	border-color: rgba(255, 255, 255, .18);
	color: #fff;
	box-shadow: none;
}

.zd-booking__grid {
	display: grid;
	gap: clamp(2rem, 1rem + 4vw, 3.5rem);
	align-items: start;
}

@media (min-width: 960px) {
	.zd-booking__grid {
		grid-template-columns: 1fr;
	}
}

.zd-booking__aside p {
	color: rgba(255, 255, 255, .72);
}

.zd-booking__points {
	list-style: none;
	margin: 2rem 0 0;
	padding: 0;
	display: grid;
	gap: 1.25rem;
}

.zd-booking__points li {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
}

.zd-booking__points .zd-card__icon {
	inline-size: 44px;
	block-size: 44px;
	border-radius: 14px;
	background: rgba(255, 255, 255, .08);
	color: var(--zd-mint);
	margin: 0;
	flex: none;
}

.zd-booking__points .zd-card__icon svg {
	inline-size: 20px;
	block-size: 20px;
}

.zd-booking__points strong {
	display: block;
	font-size: var(--zd-text-sm);
}

.zd-booking__points span {
	font-size: var(--zd-text-xs);
	color: rgba(255, 255, 255, .6);
}

/* Form */
.zd-form {
	background: var(--zd-surface);
	color: var(--zd-ink);
	border-radius: var(--zd-radius-lg);
	padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
	box-shadow: var(--zd-shadow-lg);
}

.zd-form__grid {
	display: grid;
	gap: 1.1rem;
}

.zd-booking-flow__quick,
.zd-booking-flow__details-grid {
	display: grid;
	gap: 1rem;
}

.zd-booking-flow__quick {
	align-items: end;
}

.zd-booking-flow__continue {
	display: none;
	min-block-size: 48px;
	white-space: nowrap;
}

.zd-booking-flow.is-compact .zd-booking-flow__continue {
	display: inline-flex;
}

.zd-booking-flow__details {
	padding-block-start: 1.25rem;
	margin-block-start: 1.25rem;
	border-block-start: 1px solid var(--zd-line);
}

.zd-booking-flow__details[hidden] {
	display: none;
}

@media (min-width: 640px) {
	.zd-booking-flow__quick {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.zd-booking-flow__details-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.zd-booking-flow__details-grid .zd-field--full {
		grid-column: 1 / -1;
	}
}

@media (min-width: 960px) {
	.zd-booking-flow__quick {
		grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
	}
}

@media (min-width: 640px) {
	.zd-form__grid {
		grid-template-columns: 1fr 1fr;
	}

	.zd-field--full {
		grid-column: 1 / -1;
	}
}

.zd-field {
	display: flex;
	flex-direction: column;
	gap: .45rem;
	min-inline-size: 0;
	margin: 0;
}

.zd-field label {
	font-size: var(--zd-text-xs);
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--zd-ink);
}

.zd-field label .zd-req {
	color: var(--zd-accent);
	margin-inline-start: 2px;
}

.zd-field input,
.zd-field select,
.zd-field textarea {
	inline-size: 100%;
	font-family: inherit;
	font-size: var(--zd-text-sm);
	color: var(--zd-ink);
	background: var(--zd-warm-white);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-sm);
	padding: .85rem 1rem;
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
	-webkit-appearance: none;
	appearance: none;
}

.zd-field select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c7a85' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 18px;
	padding-inline-end: 2.5rem;
}

[dir="rtl"] .zd-field select {
	background-position: left 1rem center;
}

.zd-field textarea {
	min-block-size: 120px;
	resize: vertical;
}

.zd-field input:focus,
.zd-field select:focus,
.zd-field textarea:focus {
	outline: none;
	background: var(--zd-surface);
	border-color: var(--zd-primary);
	box-shadow: var(--zd-ring);
}

.zd-field input:user-invalid,
.zd-field.has-error input,
.zd-field.has-error select,
.zd-field.has-error textarea {
	border-color: #d4694a;
}

.zd-field__error {
	font-size: var(--zd-text-xs);
	color: #b34f33;
	min-block-size: 1em;
}

.zd-form__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	margin-block-start: 1.5rem;
}

.zd-form__note {
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
	display: flex;
	align-items: center;
	gap: .4rem;
	max-inline-size: 22rem;
}

.zd-form__note svg {
	inline-size: 16px;
	block-size: 16px;
	flex: none;
	color: var(--zd-mint);
}

/* Honeypot — hidden from humans, visible to bots */
.zd-hp {
	position: absolute !important;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.zd-alert {
	display: flex;
	gap: .75rem;
	align-items: flex-start;
	padding: 1rem 1.15rem;
	border-radius: var(--zd-radius-sm);
	font-size: var(--zd-text-sm);
	margin-block-end: 1.25rem;
	border: 1px solid transparent;
}

.zd-alert[hidden] {
	display: none;
}

.zd-alert svg {
	inline-size: 20px;
	block-size: 20px;
	flex: none;
}

.zd-alert--success {
	background: var(--zd-mint-soft);
	border-color: rgba(82, 195, 165, .5);
	color: #10513f;
}

.zd-alert--error {
	background: #fdece5;
	border-color: rgba(212, 105, 74, .4);
	color: #8a3a20;
}

.zd-btn.is-loading {
	pointer-events: none;
	opacity: .75;
}

.zd-btn.is-loading::before {
	content: "";
	inline-size: 1em;
	block-size: 1em;
	border: 2px solid rgba(255, 255, 255, .4);
	border-block-start-color: #fff;
	border-radius: 50%;
	animation: zd-spin .7s linear infinite;
}

@keyframes zd-spin {
	to { transform: rotate(360deg); }
}

/* ------------------------------------------------------------------
   10. Team
------------------------------------------------------------------ */
.zd-team-card {
	padding: 0;
	overflow: hidden;
}

.zd-team-card__photo {
	position: relative;
	aspect-ratio: 4 / 4.4;
	background: linear-gradient(160deg, var(--zd-primary-soft), var(--zd-mint-soft));
	overflow: hidden;
}

.zd-team-card__photo img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	transition: transform .6s var(--zd-ease);
}

.zd-team-card:hover .zd-team-card__photo img {
	transform: scale(1.05);
}

.zd-team-card__social {
	position: absolute;
	inset-block-end: 1rem;
	inset-inline-start: 50%;
	transform: translate(-50%, 12px);
	display: flex;
	gap: .4rem;
	padding: .4rem;
	background: rgba(255, 255, 255, .9);
	backdrop-filter: blur(6px);
	border-radius: var(--zd-radius-pill);
	box-shadow: var(--zd-shadow);
	opacity: 0;
	transition: opacity .3s ease, transform .3s var(--zd-ease);
}

[dir="rtl"] .zd-team-card__social {
	transform: translate(50%, 12px);
}

.zd-team-card:hover .zd-team-card__social,
.zd-team-card:focus-within .zd-team-card__social {
	opacity: 1;
	transform: translate(-50%, 0);
}

[dir="rtl"] .zd-team-card:hover .zd-team-card__social,
[dir="rtl"] .zd-team-card:focus-within .zd-team-card__social {
	transform: translate(50%, 0);
}

.zd-team-card__social a {
	display: grid;
	place-items: center;
	inline-size: 34px;
	block-size: 34px;
	border-radius: 50%;
	color: var(--zd-primary-dark);
	background: var(--zd-primary-soft);
	transition: background-color .2s ease, color .2s ease;
}

.zd-team-card__social a:hover {
	background: var(--zd-primary);
	color: #fff;
}

.zd-team-card__social svg {
	inline-size: 16px;
	block-size: 16px;
}

.zd-team-card__body {
	padding: 1.5rem;
	text-align: center;
}

.zd-team-card__name {
	font-size: 1.3rem;
	margin-block-end: .15rem;
}

.zd-team-card__role {
	display: inline-block;
	font-size: var(--zd-text-xs);
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--zd-primary);
	margin-block-end: .75rem;
}

.zd-team-card__bio {
	font-size: var(--zd-text-sm);
	color: var(--zd-muted);
}

.zd-team-card__meta {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	margin-block-start: 1rem;
	padding: .35rem .8rem;
	border-radius: var(--zd-radius-pill);
	background: var(--zd-beige);
	font-size: var(--zd-text-xs);
	font-weight: 700;
	color: #7a5c3c;
}

/* ------------------------------------------------------------------
   11. Gallery (before/after)
------------------------------------------------------------------ */
.zd-filters {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .5rem;
	margin-block-end: 2.5rem;
}

.zd-filter {
	padding: .6rem 1.15rem;
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-pill);
	background: var(--zd-surface);
	color: var(--zd-muted);
	font-family: inherit;
	font-size: var(--zd-text-sm);
	font-weight: 600;
	cursor: pointer;
	transition: all .25s var(--zd-ease);
}

.zd-filter:hover {
	color: var(--zd-primary-dark);
	border-color: var(--zd-primary);
}

.zd-filter.is-active {
	background: var(--zd-ink);
	border-color: var(--zd-ink);
	color: #fff;
}

.zd-gallery-item {
	position: relative;
	border-radius: var(--zd-radius-lg);
	overflow: hidden;
	background: var(--zd-surface);
	box-shadow: var(--zd-shadow-xs);
	transition: box-shadow .35s var(--zd-ease), transform .35s var(--zd-ease), opacity .3s ease;
}

.zd-gallery-item:hover {
	transform: translateY(-4px);
	box-shadow: var(--zd-shadow-lg);
}

.zd-gallery-item[hidden] {
	display: none;
}

.zd-ba {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2px;
	background: var(--zd-line);
}

.zd-ba figure {
	position: relative;
	margin: 0;
	aspect-ratio: 1;
	overflow: hidden;
}

.zd-ba img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	transition: transform .6s var(--zd-ease);
}

.zd-gallery-item:hover .zd-ba img {
	transform: scale(1.04);
}

.zd-ba figcaption {
	position: absolute;
	inset-block-start: .75rem;
	inset-inline-start: .75rem;
	padding: .25rem .65rem;
	border-radius: var(--zd-radius-pill);
	background: rgba(20, 49, 60, .75);
	backdrop-filter: blur(4px);
	color: #fff;
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.zd-ba figure:last-child figcaption {
	background: var(--zd-mint);
	color: #06382c;
}

.zd-gallery-item__body {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.15rem 1.35rem;
}

.zd-gallery-item__title {
	font-size: 1.05rem;
	margin: 0;
}

.zd-gallery-item__cat {
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
}

.zd-gallery-item__zoom {
	display: grid;
	place-items: center;
	inline-size: 38px;
	block-size: 38px;
	flex: none;
	border-radius: 50%;
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
	transition: background-color .2s, color .2s;
}

.zd-gallery-item__zoom:hover {
	background: var(--zd-primary);
	color: #fff;
}

/* ------------------------------------------------------------------
   12. Testimonials slider
------------------------------------------------------------------ */
.zd-slider {
	position: relative;
}

.zd-slider__track {
	display: flex;
	gap: var(--zd-gap);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	padding-block-end: 1rem;
	margin-inline: calc(var(--zd-container-pad) * -1);
	padding-inline: var(--zd-container-pad);
	scrollbar-width: none;
}

.zd-slider__track::-webkit-scrollbar {
	display: none;
}

.zd-slider__slide {
	flex: 0 0 min(100%, 380px);
	scroll-snap-align: center;
}

@media (min-width: 768px) {
	.zd-slider__slide {
		flex-basis: calc((100% - var(--zd-gap)) / 2);
	}
}

@media (min-width: 1100px) {
	.zd-slider__slide {
		flex-basis: calc((100% - var(--zd-gap) * 2) / 3);
	}
}

.zd-quote-card {
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-lg);
	padding: 2rem;
	block-size: 100%;
	display: flex;
	flex-direction: column;
	box-shadow: var(--zd-shadow-xs);
	transition: box-shadow .35s var(--zd-ease), transform .35s var(--zd-ease);
}

.zd-quote-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--zd-shadow);
}

.zd-quote-card__mark {
	font-family: var(--zd-font-display);
	font-size: 4rem;
	line-height: .8;
	color: var(--zd-primary-soft);
	margin-block-end: .5rem;
}

.zd-quote-card__text {
	font-size: var(--zd-text-base);
	color: var(--zd-ink);
	margin-block-end: 1.75rem;
	flex: 1;
}

.zd-quote-card__person {
	display: flex;
	align-items: center;
	gap: .85rem;
	padding-block-start: 1.25rem;
	border-block-start: 1px solid var(--zd-line);
}

.zd-quote-card__person img,
.zd-quote-card__person .zd-avatar-fallback {
	inline-size: 48px;
	block-size: 48px;
	border-radius: 8px;
	object-fit: cover;
	flex: none;
	display: grid;
	place-items: center;
	background: var(--zd-ink);
	color: #fff;
	font-weight: 700;
}

.zd-quote-card__name {
	display: block;
	font-weight: 700;
	font-size: var(--zd-text-sm);
	line-height: 1.3;
}

.zd-quote-card__meta {
	display: block;
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
}

.zd-slider__nav {
	display: flex;
	justify-content: center;
	gap: .5rem;
	margin-block-start: 2rem;
}

.zd-slider__btn {
	display: grid;
	place-items: center;
	inline-size: 46px;
	block-size: 46px;
	border-radius: 50%;
	border: 1px solid var(--zd-line);
	background: var(--zd-surface);
	color: var(--zd-ink);
	cursor: pointer;
	transition: all .25s var(--zd-ease);
}

.zd-slider__btn:hover:not(:disabled) {
	background: var(--zd-ink);
	border-color: var(--zd-ink);
	color: #fff;
}

.zd-slider__btn:disabled {
	opacity: .4;
	cursor: default;
}

.zd-slider__btn svg {
	inline-size: 18px;
	block-size: 18px;
}

[dir="rtl"] .zd-slider__btn svg {
	transform: scaleX(-1);
}

/* ------------------------------------------------------------------
   13. Stats
------------------------------------------------------------------ */
.zd-stats {
	background: var(--zd-ink);
	color: #fff;
	border-radius: var(--zd-radius-lg);
	padding: clamp(2rem, 1.2rem + 3vw, 3.5rem);
	position: relative;
	overflow: hidden;
}

.zd-stats::before {
	content: "";
	position: absolute;
	inset-block-start: -50%;
	inset-inline-start: -10%;
	inline-size: 45%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(82, 195, 165, .22), transparent 65%);
}

.zd-stats__grid {
	position: relative;
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, 1fr);
	text-align: center;
}

@media (min-width: 900px) {
	.zd-stats__grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

.zd-stat__value {
	font-family: var(--zd-font-display);
	font-size: 3.25rem;
	font-weight: 600;
	line-height: 1;
	color: #fff;
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 2px;
}

.zd-stat__value .zd-stat__suffix {
	font-size: .55em;
	color: var(--zd-mint);
}

.zd-stat__label {
	margin-block-start: .6rem;
	font-size: var(--zd-text-sm);
	color: rgba(255, 255, 255, .68);
}

.zd-stats__grid > :not(:last-child) {
	border-inline-end: 1px solid rgba(255, 255, 255, .1);
}

@media (max-width: 899px) {
	.zd-stats__grid > :nth-child(2n) {
		border-inline-end: 0;
	}
}

/* ------------------------------------------------------------------
   14. Contact / hours / map
------------------------------------------------------------------ */
.zd-contact__grid {
	display: grid;
	gap: var(--zd-gap);
}

@media (min-width: 960px) {
	.zd-contact__grid {
		grid-template-columns: 1fr 1fr;
		align-items: stretch;
	}
}

.zd-info-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1rem;
}

.zd-info-item {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1.15rem 1.35rem;
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius);
	text-decoration: none;
	color: var(--zd-ink);
	transition: transform .25s var(--zd-ease), box-shadow .25s var(--zd-ease), border-color .25s;
}

.zd-info-item:hover {
	transform: translateX(4px);
	border-color: var(--zd-primary);
	box-shadow: var(--zd-shadow);
	color: var(--zd-ink);
}

[dir="rtl"] .zd-info-item:hover {
	transform: translateX(-4px);
}

.zd-info-item__icon {
	display: grid;
	place-items: center;
	inline-size: 46px;
	block-size: 46px;
	flex: none;
	border-radius: 14px;
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
}

.zd-info-item__icon svg {
	inline-size: 20px;
	block-size: 20px;
}

.zd-info-item--urgent .zd-info-item__icon {
	background: #fdece5;
	color: #b34f33;
}

.zd-info-item__label {
	display: block;
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
	margin-block-end: 2px;
}

.zd-info-item__value {
	display: block;
	font-weight: 700;
	font-size: var(--zd-text-sm);
	overflow-wrap: anywhere;
}

.zd-hours {
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-lg);
	padding: clamp(1.5rem, 1rem + 1.5vw, 2rem);
	box-shadow: var(--zd-shadow-xs);
	block-size: 100%;
}

.zd-hours__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-block-end: 1.25rem;
	padding-block-end: 1.25rem;
	border-block-end: 1px solid var(--zd-line);
}

.zd-hours__title {
	margin: 0;
	font-size: var(--zd-h3);
}

.zd-status {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .35rem .75rem;
	border-radius: var(--zd-radius-pill);
	font-size: var(--zd-text-xs);
	font-weight: 700;
}

.zd-status::before {
	content: "";
	inline-size: 8px;
	block-size: 8px;
	border-radius: 50%;
	background: currentColor;
	box-shadow: 0 0 0 0 currentColor;
	animation: zd-pulse 2s infinite;
}

.zd-status--open {
	background: var(--zd-mint-soft);
	color: #10513f;
}

.zd-status--closed {
	background: #f6eae5;
	color: #8a3a20;
}

@keyframes zd-pulse {
	0% { box-shadow: 0 0 0 0 rgba(82, 195, 165, .6); }
	70% { box-shadow: 0 0 0 8px rgba(82, 195, 165, 0); }
	100% { box-shadow: 0 0 0 0 rgba(82, 195, 165, 0); }
}

.zd-hours__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .15rem;
}

.zd-hours__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	padding: .7rem .75rem;
	border-radius: 10px;
	font-size: var(--zd-text-sm);
}

.zd-hours__row.is-today {
	background: var(--zd-primary-soft);
	font-weight: 700;
}

.zd-hours__day {
	color: var(--zd-muted);
}

.zd-hours__row.is-today .zd-hours__day {
	color: var(--zd-primary-dark);
}

.zd-hours__time {
	font-variant-numeric: proportional-nums;
	font-weight: 600;
}

.zd-hours__time.is-closed {
	color: #b34f33;
	font-weight: 500;
}

.zd-hours__foot {
	margin-block-start: 1.5rem;
	padding: 1rem 1.15rem;
	border-radius: var(--zd-radius-sm);
	background: var(--zd-beige);
	font-size: var(--zd-text-xs);
	color: #7a5c3c;
	display: flex;
	gap: .6rem;
	align-items: center;
}

/* Map */
.zd-map {
	position: relative;
	border-radius: var(--zd-radius-lg);
	overflow: hidden;
	box-shadow: var(--zd-shadow);
	background: var(--zd-primary-soft);
	min-block-size: 380px;
	isolation: isolate;
}

.zd-map iframe {
	position: absolute;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
	border: 0;
	filter: saturate(.85) contrast(1.02);
}

.zd-map__card {
	position: absolute;
	inset-block-end: 1.25rem;
	inset-inline-start: 1.25rem;
	max-inline-size: min(340px, calc(100% - 2.5rem));
	padding: 1.25rem 1.4rem;
	border-radius: var(--zd-radius);
	background: rgba(255, 255, 255, .95);
	backdrop-filter: blur(10px);
	box-shadow: var(--zd-shadow-lg);
	z-index: 2;
}

.zd-map__title {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-family: var(--zd-font-display);
	font-size: 1.1rem;
	font-weight: 600;
	margin-block-end: .35rem;
}

.zd-map__title svg {
	inline-size: 18px;
	block-size: 18px;
	color: var(--zd-accent);
	flex: none;
}

.zd-map__desc {
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
	margin-block-end: .85rem;
}

.zd-map__placeholder {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	text-align: center;
	padding: 2rem;
	color: var(--zd-primary-dark);
	background-image:
		linear-gradient(rgba(27, 140, 168, .07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(27, 140, 168, .07) 1px, transparent 1px);
	background-size: 32px 32px;
}

/* ------------------------------------------------------------------
   15. FAQ
------------------------------------------------------------------ */
.zd-faq {
	max-inline-size: 52rem;
	margin-inline: auto;
	display: grid;
	gap: .85rem;
}

.zd-acc {
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius);
	overflow: hidden;
	transition: box-shadow .3s var(--zd-ease), border-color .3s;
}

.zd-acc[open] {
	border-color: var(--zd-primary);
	box-shadow: var(--zd-shadow);
}

.zd-acc__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.2rem 1.4rem;
	font-family: var(--zd-font-display);
	font-size: 1.0625rem;
	font-weight: 600;
	cursor: pointer;
	list-style: none;
	color: var(--zd-ink);
}

.zd-acc__q::-webkit-details-marker {
	display: none;
}

.zd-acc__q:hover {
	color: var(--zd-primary-dark);
}

.zd-acc__icon {
	position: relative;
	display: grid;
	place-items: center;
	inline-size: 30px;
	block-size: 30px;
	flex: none;
	border-radius: 50%;
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
	transition: transform .3s var(--zd-ease), background-color .3s, color .3s;
}

.zd-acc[open] .zd-acc__icon {
	background: var(--zd-primary);
	color: #fff;
	transform: rotate(45deg);
}

.zd-acc__icon svg {
	inline-size: 15px;
	block-size: 15px;
}

.zd-acc__a {
	padding: 0 1.4rem 1.4rem;
	color: var(--zd-muted);
	font-size: var(--zd-text-sm);
}

.zd-acc[open] .zd-acc__a {
	animation: zd-reveal .35s var(--zd-ease);
}

@keyframes zd-reveal {
	from { opacity: 0; transform: translateY(-6px); }
	to { opacity: 1; transform: none; }
}

/* ------------------------------------------------------------------
   16. Blog
------------------------------------------------------------------ */
.zd-post-card {
	display: flex;
	flex-direction: column;
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-lg);
	overflow: hidden;
	box-shadow: var(--zd-shadow-xs);
	transition: transform .35s var(--zd-ease), box-shadow .35s var(--zd-ease);
	block-size: 100%;
}

.zd-post-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--zd-shadow-lg);
}

.zd-post-card__media {
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--zd-primary-soft);
}

.zd-post-card__media img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	transition: transform .6s var(--zd-ease);
}

.zd-post-card:hover .zd-post-card__media img {
	transform: scale(1.05);
}

.zd-post-card__cat {
	position: absolute;
	inset-block-start: 1rem;
	inset-inline-start: 1rem;
	padding: .35rem .8rem;
	border-radius: var(--zd-radius-pill);
	background: rgba(255, 255, 255, .94);
	backdrop-filter: blur(6px);
	font-size: var(--zd-text-xs);
	font-weight: 700;
	color: var(--zd-primary-dark);
	text-decoration: none;
	z-index: 1;
}

.zd-post-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 1.5rem;
}

.zd-post-card__title {
	font-size: 1.25rem;
	margin-block-end: .6rem;
}

.zd-post-card__title a {
	color: inherit;
	text-decoration: none;
}

.zd-post-card__title a:hover {
	color: var(--zd-primary-dark);
}

.zd-post-card__excerpt {
	font-size: var(--zd-text-sm);
	color: var(--zd-muted);
	margin-block-end: 1.25rem;
}

.zd-post-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-block-start: auto;
	padding-block-start: 1.15rem;
	border-block-start: 1px solid var(--zd-line);
}

.zd-post-meta {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
}

.zd-post-meta img {
	inline-size: 28px;
	block-size: 28px;
	border-radius: 50%;
}

.zd-post-meta__sep::before {
	content: "•";
	margin-inline: .35rem;
}

/* ------------------------------------------------------------------
   17. CTA band
------------------------------------------------------------------ */
.zd-cta {
	position: relative;
	border-radius: var(--zd-radius-lg);
	padding: clamp(2.25rem, 1.5rem + 4vw, 4.5rem);
	background:
		radial-gradient(70% 120% at 100% 0%, rgba(82, 195, 165, .35) 0%, transparent 55%),
		linear-gradient(120deg, var(--zd-primary-dark), var(--zd-primary));
	color: #fff;
	overflow: hidden;
	text-align: center;
	box-shadow: var(--zd-shadow-lg);
}

.zd-cta::before,
.zd-cta::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .16);
}

.zd-cta::before {
	inline-size: 320px;
	block-size: 320px;
	inset-block-start: -140px;
	inset-inline-start: -80px;
}

.zd-cta::after {
	inline-size: 220px;
	block-size: 220px;
	inset-block-end: -110px;
	inset-inline-end: -40px;
}

.zd-cta > * {
	position: relative;
	z-index: 1;
}

.zd-cta__title {
	color: #fff;
	font-size: var(--zd-h2);
	max-inline-size: 22ch;
	margin-inline: auto;
}

.zd-cta__text {
	color: rgba(255, 255, 255, .8);
	font-size: var(--zd-text-lead);
	max-inline-size: 46ch;
	margin-inline: auto;
	margin-block-end: 2rem;
}

.zd-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
	justify-content: center;
}

.zd-cta .zd-btn {
	--_bg: #fff;
	--_hover-bg: #eef8f5;
	--_fg: var(--zd-primary-dark);
	box-shadow: 0 12px 26px -14px rgba(0, 0, 0, .6);
}

.zd-cta .zd-btn--ghost {
	--_bg: transparent;
	--_hover-bg: #fff;
	--_fg: #fff;
	border-color: rgba(255, 255, 255, .45);
	box-shadow: none;
	color: #fff;
}

.zd-cta .zd-btn--ghost:hover {
	--_fg: var(--zd-primary-dark);
	background: #fff;
	border-color: #fff;
	color: var(--zd-primary-dark);
}

/* ------------------------------------------------------------------
   18. Footer
------------------------------------------------------------------ */
.zd-footer {
	background: var(--zd-ink);
	color: rgba(255, 255, 255, .66);
	padding-block-start: clamp(3rem, 2rem + 4vw, 5rem);
	font-size: var(--zd-text-sm);
}

.zd-footer a {
	color: rgba(255, 255, 255, .66);
	text-decoration: none;
	transition: color .2s ease;
}

.zd-footer a:hover {
	color: #fff;
}

.zd-footer__grid {
	display: grid;
	gap: 2.5rem;
	padding-block-end: 3rem;
}

@media (min-width: 640px) {
	.zd-footer__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.zd-footer__grid {
		grid-template-columns: 1.6fr 1fr 1fr 1.4fr;
	}
}

.zd-footer .zd-brand,
.zd-footer .zd-brand__name {
	color: #fff;
}

.zd-footer__about {
	margin-block: 1.25rem 1.5rem;
	max-inline-size: 32ch;
}

.zd-footer__title {
	color: #fff;
	font-family: var(--zd-font-body);
	font-size: var(--zd-text-xs);
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-block-end: 1.25rem;
}

.zd-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .7rem;
}

.zd-footer__list a {
	display: inline-block;
	transition: transform .2s var(--zd-ease), color .2s;
}

.zd-footer__list a:hover {
	transform: translateX(3px);
}

[dir="rtl"] .zd-footer__list a:hover {
	transform: translateX(-3px);
}

.zd-footer__hours {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding-block: .35rem;
	border-block-end: 1px dashed rgba(255, 255, 255, .1);
	font-size: var(--zd-text-xs);
}

.zd-social {
	display: flex;
	gap: .5rem;
	list-style: none;
	margin: 1.5rem 0 0;
	padding: 0;
}

.zd-social a {
	display: grid;
	place-items: center;
	inline-size: 40px;
	block-size: 40px;
	border-radius: 12px;
	background: rgba(255, 255, 255, .07);
	color: #fff;
	transition: background-color .25s ease, transform .25s var(--zd-ease);
}

.zd-social a:hover {
	background: var(--zd-primary);
	transform: translateY(-3px);
}

.zd-social svg {
	inline-size: 18px;
	block-size: 18px;
}

.zd-footer__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	padding-block: 1.5rem;
	border-block-start: 1px solid rgba(255, 255, 255, .09);
	font-size: var(--zd-text-xs);
}

.zd-footer__legal {
	display: flex;
	gap: 1.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
	flex-wrap: wrap;
}

/* ------------------------------------------------------------------
   19. Floating mobile actions
------------------------------------------------------------------ */
.zd-dock {
	position: fixed;
	inset-block-end: 0;
	inset-inline: 0;
	z-index: 900;
	display: none;
	gap: .5rem;
	padding: .6rem .75rem calc(.6rem + env(safe-area-inset-bottom));
	background: rgba(253, 251, 248, .92);
	backdrop-filter: blur(12px);
	border-block-start: 1px solid var(--zd-line);
	box-shadow: 0 -8px 30px -20px rgba(20, 49, 60, .5);
}

.zd-dock .zd-btn {
	flex: 1;
	padding: .9rem 1rem;
	font-size: var(--zd-text-xs);
}

.zd-dock__icon {
	display: grid;
	place-items: center;
	inline-size: 48px;
	block-size: 48px;
	flex: none;
	border-radius: 16px;
	color: #fff;
	transition: transform .25s var(--zd-ease);
}

.zd-dock__icon:hover {
	transform: translateY(-2px);
	color: #fff;
}

.zd-dock__icon svg {
	inline-size: 22px;
	block-size: 22px;
}

.zd-dock__icon--wa { background: #25d366; }
.zd-dock__icon--sos { background: var(--zd-accent); }

@media (max-width: 767px) {
	.zd-dock.is-enabled {
		display: flex;
		align-items: center;
	}

	body.has-dock {
		padding-block-end: 76px;
	}
}

/* Desktop floating WhatsApp bubble */
.zd-float-wa {
	position: fixed;
	inset-block-end: 1.75rem;
	inset-inline-end: 1.75rem;
	z-index: 890;
	display: grid;
	place-items: center;
	inline-size: 56px;
	block-size: 56px;
	border-radius: 50%;
	background: #25d366;
	color: #fff;
	box-shadow: 0 14px 30px -12px rgba(37, 211, 102, .9);
	transition: transform .3s var(--zd-ease);
}

.zd-float-wa:hover {
	transform: scale(1.06);
	color: #fff;
}

.zd-float-wa svg {
	inline-size: 26px;
	block-size: 26px;
}

@media (max-width: 767px) {
	.zd-float-wa {
		display: none;
	}
}

/* ------------------------------------------------------------------
   20. Single post / article
------------------------------------------------------------------ */
.zd-page-hero {
	padding-block: clamp(2.5rem, 1.5rem + 4vw, 4.5rem) clamp(2rem, 1rem + 3vw, 3rem);
	background:
		radial-gradient(80% 80% at 100% 0%, var(--zd-mint-soft) 0%, transparent 60%),
		var(--zd-primary-soft);
}

.zd-breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .4rem;
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
	margin-block-end: 1rem;
	padding: 0;
	list-style: none;
}

.zd-breadcrumbs a {
	color: var(--zd-primary-dark);
	text-decoration: none;
}

.zd-breadcrumbs li + li::before {
	content: "/";
	margin-inline-end: .4rem;
	color: var(--zd-line);
}

.zd-article-layout {
	display: grid;
	gap: clamp(2rem, 1rem + 3vw, 3.5rem);
	align-items: start;
}

@media (min-width: 1024px) {
	.zd-article-layout {
		grid-template-columns: minmax(0, 1fr) 300px;
	}
}

.zd-article__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-block-end: 2rem;
	padding-block-end: 1.5rem;
	border-block-end: 1px solid var(--zd-line);
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
}

.zd-article__meta img {
	inline-size: 40px;
	block-size: 40px;
	border-radius: 50%;
}

.zd-article__author {
	display: flex;
	align-items: center;
	gap: .6rem;
	font-weight: 700;
	color: var(--zd-ink);
	font-size: var(--zd-text-sm);
}

.zd-pill {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .3rem .7rem;
	border-radius: var(--zd-radius-pill);
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
	font-weight: 700;
	font-size: var(--zd-text-xs);
	text-decoration: none;
}

.zd-featured {
	border-radius: var(--zd-radius-lg);
	overflow: hidden;
	margin-block-end: 2.5rem;
	box-shadow: var(--zd-shadow);
}

.zd-featured img {
	inline-size: 100%;
}

.zd-prose {
	font-size: var(--zd-text-lead);
	line-height: 1.8;
	color: #2c4b57;
}

.zd-prose > * + * {
	margin-block-start: 1.4em;
}

.zd-prose h2 {
	font-size: 2rem;
	margin-block-start: 2em;
	scroll-margin-top: calc(var(--zd-header-h) + 24px);
}

.zd-prose h3 {
	font-size: 1.5rem;
	margin-block-start: 1.6em;
	scroll-margin-top: calc(var(--zd-header-h) + 24px);
}

.zd-prose img,
.zd-prose figure {
	border-radius: var(--zd-radius);
	overflow: hidden;
}

.zd-prose blockquote {
	margin: 2em 0;
	padding: 1.5rem 1.75rem;
	border-inline-start: 4px solid var(--zd-mint);
	background: var(--zd-mint-soft);
	border-radius: var(--zd-radius-sm);
	font-family: var(--zd-font-display);
	font-size: 1.2rem;
	font-style: italic;
	color: var(--zd-ink);
}

.zd-prose blockquote p:last-child {
	margin: 0;
}

.zd-prose ul,
.zd-prose ol {
	padding-inline-start: 1.5rem;
}

.zd-prose li + li {
	margin-block-start: .5em;
}

.zd-prose li::marker {
	color: var(--zd-primary);
}

.zd-prose a {
	color: var(--zd-primary-dark);
	text-decoration: underline;
	text-decoration-color: rgba(27, 140, 168, .35);
}

.zd-prose code {
	background: var(--zd-primary-soft);
	padding: .15em .4em;
	border-radius: 6px;
	font-size: .9em;
}

.zd-prose pre {
	background: var(--zd-ink);
	color: #e6f1f4;
	padding: 1.25rem;
	border-radius: var(--zd-radius);
	overflow-x: auto;
}

.zd-prose table {
	inline-size: 100%;
	border-collapse: collapse;
	font-size: var(--zd-text-sm);
}

.zd-prose th,
.zd-prose td {
	padding: .75rem 1rem;
	border: 1px solid var(--zd-line);
	text-align: start;
}

.zd-prose th {
	background: var(--zd-primary-soft);
}

/* Sidebar / TOC */
.zd-sidebar {
	display: grid;
	gap: 1.5rem;
	position: sticky;
	inset-block-start: calc(var(--zd-header-h) + 24px);
}

@media (max-width: 1023px) {
	.zd-sidebar {
		position: static;
	}
}

.zd-widget {
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius);
	padding: 1.5rem;
	box-shadow: var(--zd-shadow-xs);
}

.zd-widget__title {
	font-size: 1rem;
	margin-block-end: 1rem;
	padding-block-end: .75rem;
	border-block-end: 1px solid var(--zd-line);
}

.zd-toc ol {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: toc;
	display: grid;
	gap: .35rem;
	font-size: var(--zd-text-sm);
}

.zd-toc li[data-level="3"] {
	padding-inline-start: 1rem;
}

.zd-toc a {
	display: block;
	padding: .4rem .6rem;
	border-radius: 8px;
	color: var(--zd-muted);
	text-decoration: none;
	border-inline-start: 2px solid transparent;
	transition: all .2s ease;
}

.zd-toc a:hover {
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
}

.zd-toc a.is-active {
	color: var(--zd-primary-dark);
	font-weight: 700;
	border-inline-start-color: var(--zd-primary);
	background: var(--zd-primary-soft);
}

.zd-share {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;
}

.zd-share__btn {
	display: grid;
	place-items: center;
	inline-size: 40px;
	block-size: 40px;
	border: 1px solid var(--zd-line);
	border-radius: 12px;
	background: var(--zd-surface);
	color: var(--zd-muted);
	cursor: pointer;
	transition: all .25s var(--zd-ease);
}

.zd-share__btn:hover {
	background: var(--zd-ink);
	border-color: var(--zd-ink);
	color: #fff;
	transform: translateY(-2px);
}

.zd-share__btn svg {
	inline-size: 17px;
	block-size: 17px;
}

.zd-sticky-cta {
	background: linear-gradient(150deg, var(--zd-primary-dark), var(--zd-primary));
	color: #fff;
	text-align: center;
	border: 0;
}

.zd-sticky-cta .zd-widget__title {
	color: #fff;
	border-color: rgba(255, 255, 255, .2);
}

.zd-sticky-cta p {
	font-size: var(--zd-text-sm);
	color: rgba(255, 255, 255, .8);
	margin-block-end: 1.25rem;
}

.zd-sticky-cta .zd-btn {
	--_bg: #fff;
	--_hover-bg: #eef8f5;
	--_fg: var(--zd-primary-dark);
}

/* Author box */
.zd-author-box {
	display: flex;
	gap: 1.25rem;
	align-items: flex-start;
	padding: 1.75rem;
	margin-block-start: 3rem;
	border-radius: var(--zd-radius-lg);
	background: var(--zd-beige);
}

.zd-author-box img {
	inline-size: 72px;
	block-size: 72px;
	border-radius: 50%;
	flex: none;
}

.zd-author-box h3 {
	margin-block-end: .25rem;
	font-size: 1.15rem;
}

.zd-author-box p {
	font-size: var(--zd-text-sm);
	color: #6b5843;
}

/* Post navigation */
.zd-post-nav {
	display: grid;
	gap: 1rem;
	margin-block-start: 2.5rem;
}

@media (min-width: 640px) {
	.zd-post-nav {
		grid-template-columns: 1fr 1fr;
	}
}

.zd-post-nav a {
	display: block;
	padding: 1.25rem 1.5rem;
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius);
	text-decoration: none;
	transition: all .3s var(--zd-ease);
}

.zd-post-nav a:hover {
	border-color: var(--zd-primary);
	box-shadow: var(--zd-shadow);
	transform: translateY(-3px);
}

.zd-post-nav__label {
	display: block;
	font-size: var(--zd-text-xs);
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--zd-muted);
	margin-block-end: .35rem;
}

.zd-post-nav__title {
	font-family: var(--zd-font-display);
	font-weight: 600;
	color: var(--zd-ink);
	line-height: 1.3;
}

.zd-post-nav__next {
	text-align: end;
}

/* Comments */
.zd-comments {
	margin-block-start: 3.5rem;
}

.zd-comments .comment-list {
	list-style: none;
	margin: 0 0 2.5rem;
	padding: 0;
	display: grid;
	gap: 1.25rem;
}

.zd-comments .comment-list .children {
	list-style: none;
	margin-block-start: 1.25rem;
	padding-inline-start: clamp(1rem, .5rem + 2vw, 3rem);
	display: grid;
	gap: 1.25rem;
}

.zd-comments .comment-body {
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius);
	padding: 1.5rem;
}

.zd-comments .comment-meta {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-block-end: .75rem;
	font-size: var(--zd-text-xs);
	color: var(--zd-muted);
}

.zd-comments .comment-author img {
	inline-size: 42px;
	block-size: 42px;
	border-radius: 50%;
}

.zd-comments .comment-author .fn {
	font-style: normal;
	font-weight: 700;
	color: var(--zd-ink);
	font-size: var(--zd-text-sm);
	display: block;
}

.zd-comments .reply a {
	font-size: var(--zd-text-xs);
	font-weight: 700;
	color: var(--zd-primary-dark);
	text-decoration: none;
}

.zd-comments .comment-form {
	display: grid;
	gap: 1rem;
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-lg);
	padding: clamp(1.5rem, 1rem + 1.5vw, 2rem);
}

.zd-comments .comment-form p {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: .45rem;
}

.zd-comments .comment-form label {
	font-size: var(--zd-text-xs);
	font-weight: 700;
}

.zd-comments .comment-form input[type="text"],
.zd-comments .comment-form input[type="email"],
.zd-comments .comment-form input[type="url"],
.zd-comments .comment-form textarea {
	inline-size: 100%;
	font-family: inherit;
	font-size: var(--zd-text-sm);
	background: var(--zd-warm-white);
	border: 1px solid var(--zd-line);
	border-radius: var(--zd-radius-sm);
	padding: .85rem 1rem;
	color: var(--zd-ink);
}

.zd-comments .comment-form input:focus,
.zd-comments .comment-form textarea:focus {
	outline: none;
	border-color: var(--zd-primary);
	box-shadow: var(--zd-ring);
}

.zd-comments .comment-form .form-submit input {
	all: unset;
}

.zd-comments .form-submit input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 1.05rem 1.75rem;
	border-radius: var(--zd-radius-pill);
	background: var(--zd-primary-dark);
	color: #fff;
	font-weight: 700;
	font-size: var(--zd-text-sm);
	cursor: pointer;
	transition: background-color .2s ease;
}

.zd-comments .form-submit input[type="submit"]:hover {
	background: var(--zd-primary-dark);
}

/* ------------------------------------------------------------------
   21. Archive / pagination / misc
------------------------------------------------------------------ */
.zd-pagination {
	display: flex;
	justify-content: center;
	gap: .4rem;
	margin-block-start: 3rem;
	flex-wrap: wrap;
}

.zd-pagination .page-numbers {
	display: grid;
	place-items: center;
	min-inline-size: 44px;
	block-size: 44px;
	padding-inline: .5rem;
	border: 1px solid var(--zd-line);
	border-radius: 12px;
	background: var(--zd-surface);
	color: var(--zd-ink);
	text-decoration: none;
	font-weight: 600;
	font-size: var(--zd-text-sm);
	transition: all .25s var(--zd-ease);
}

.zd-pagination .page-numbers:hover,
.zd-pagination .page-numbers.current {
	background: var(--zd-ink);
	border-color: var(--zd-ink);
	color: #fff;
}

.zd-404 {
	display: grid;
	place-items: center;
	text-align: center;
	min-block-size: 70vh;
	padding-block: 4rem;
}

.zd-404__code {
	font-family: var(--zd-font-display);
	font-size: 12rem;
	line-height: .9;
	background: linear-gradient(140deg, var(--zd-primary), var(--zd-mint));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	margin-block-end: 1rem;
}

.zd-empty {
	text-align: center;
	padding: 4rem 1rem;
	color: var(--zd-muted);
	border: 1px dashed var(--zd-line);
	border-radius: var(--zd-radius-lg);
	background: var(--zd-surface);
}

@media (max-width: 767px) {
	:root {
		--zd-text-base: 1rem;
		--zd-text-lead: 1.0625rem;
		--zd-h2: 1.9rem;
		--zd-h3: 1.25rem;
		--zd-hero: 2.15rem;
	}

	.zd-stat__value { font-size: 2.25rem; }
	.zd-prose h2 { font-size: 1.5rem; }
	.zd-prose h3 { font-size: 1.2rem; }
	.zd-404__code { font-size: 6rem; }
}

/* Scroll reveal (progressive enhancement — no JS = fully visible) */
.zd-reveal {
	opacity: 1;
	transform: none;
	transition: opacity var(--zd-reveal-duration, .62s) var(--zd-ease), transform var(--zd-reveal-duration, .62s) var(--zd-ease);
	transition-delay: var(--zd-reveal-delay, 0ms);
	will-change: opacity, transform;
}

.js .zd-reveal {
	opacity: 0;
	transform: translateY(var(--zd-reveal-distance, 18px));
}

.js:not(.zd-runtime-ready) .zd-reveal {
	animation: zd-reveal-failsafe .01s 2.5s forwards;
}

@keyframes zd-reveal-failsafe {
	to { opacity: 1; transform: none; }
}

.js .zd-reveal.is-visible,
.no-js .zd-reveal,
.elementor-editor-active .zd-reveal {
	opacity: 1;
	transform: none;
}

.zd-reveal:nth-child(2) { --zd-reveal-delay: 60ms; }
.zd-reveal:nth-child(3) { --zd-reveal-delay: 120ms; }
.zd-reveal:nth-child(4) { --zd-reveal-delay: 180ms; }

/* Elementor editor safety: never hide content in the editor canvas */
.elementor-editor-active .zd-reveal,
.elementor-editor-preview .zd-reveal {
	opacity: 1 !important;
	transform: none !important;
}

/* Atomic/V4 canvas: do not clip selection outlines or drag handles at the
   viewport edge. The live site keeps the horizontal overflow protection. */
body.elementor-editor-active,
body.elementor-editor-preview {
	overflow-x: visible;
}

/* ------------------------------------------------------------------
   22. Persian digital-clinic presentation layer
------------------------------------------------------------------ */
body {
	background: var(--zd-warm-white);
	font-feature-settings: "ss01" 1, "pnum" 1;
	font-variant-numeric: proportional-nums;
}

/*
 * Persian FaNum fonts look unnaturally loose when tabular numerals are forced.
 * Keep phone numbers and compact numeric UI proportional, with only a subtle
 * optical tightening. OTP digits retain their intentional wide tracking.
 */
.zd-number,
.zd-hours__time,
.zd-stat__value,
.zd-pagination .page-numbers,
.zd-404__code,
input[type="tel"],
input[inputmode="numeric"] {
	font-feature-settings: "ss01" 1, "pnum" 1;
	font-variant-numeric: proportional-nums;
	font-kerning: normal;
	letter-spacing: -.02em;
}

.zd-price__value,
.zd-next-appointment__time,
.zd-appointment-card {
	font-feature-settings: "ss01" 1, "pnum" 1;
	font-variant-numeric: proportional-nums;
}

.zd-section--tint,
.zd-section--sand,
.zd-section--mint {
	background: var(--zd-warm-white);
}

.zd-section--tint { background: #f0f7f6; }
.zd-section--sand { background: #f2f5f4; }
.zd-section--mint { background: #edf8f5; }

.zd-card::after,
.zd-stats::before,
.zd-hero__blob {
	display: none;
}

.zd-header {
	background: rgba(255, 255, 255, .97);
	border-block-end: 1px solid rgba(220, 232, 232, .9);
}

.zd-header.is-stuck {
	box-shadow: 0 14px 34px -25px rgba(16, 45, 58, .45);
}

.zd-topbar {
	background: var(--zd-ink);
}

.zd-brand__mark,
.zd-card__icon,
.zd-info-item__icon,
.zd-booking__points .zd-card__icon,
.zd-social a,
.zd-pagination .page-numbers {
	border-radius: 8px;
}

.zd-brand__mark {
	background: var(--zd-primary-dark);
}

.zd-card:hover .zd-card__icon,
.zd-team-card__social a:hover,
.zd-gallery-item__zoom:hover,
.zd-acc[open] .zd-acc__icon,
.zd-social a:hover {
	background: var(--zd-primary-dark);
}

.zd-dock__icon--sos {
	color: var(--zd-ink);
}

.zd-nav .sub-menu a,
.zd-burger,
.zd-dock__icon {
	border-radius: 8px;
}

.zd-brand__name,
.zd-hero__identity,
.zd-section-title,
.zd-card__title,
.zd-team-card__name,
.zd-gallery-item__title,
.zd-post-card__title,
.zd-acc__q,
.zd-hours__title {
	font-family: var(--zd-font-display);
	letter-spacing: 0;
}

.zd-btn,
.zd-comments .form-submit input[type="submit"] {
	border-radius: 8px;
	box-shadow: 0 12px 24px -16px rgba(8, 123, 109, .65);
}

.zd-btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 16px 30px -17px rgba(8, 123, 109, .72);
}

.zd-card,
.zd-form,
.zd-hours,
.zd-map,
.zd-map__card,
.zd-acc,
.zd-post-card,
.zd-quote-card,
.zd-gallery-item,
.zd-widget,
.zd-cta {
	border-radius: 8px;
}

.zd-card,
.zd-hours,
.zd-post-card,
.zd-quote-card,
.zd-gallery-item,
.zd-widget {
	border-color: rgba(220, 232, 232, .9);
	box-shadow: var(--zd-shadow);
}

.zd-card:hover,
.zd-card:focus-within,
.zd-post-card:hover,
.zd-quote-card:hover {
	transform: translateY(-3px);
	border-color: rgba(37, 185, 151, .35);
	box-shadow: var(--zd-shadow-lg);
}

.zd-eyebrow {
	border: 0;
	border-radius: 6px;
	background: var(--zd-primary-soft);
	box-shadow: none;
	color: var(--zd-primary-dark);
	letter-spacing: 0;
	padding: .45rem .75rem;
}

.zd-section-head {
	margin-block-end: clamp(2rem, 1.5rem + 2vw, 3.25rem);
}

.zd-section-title {
	font-weight: 800;
	line-height: 1.42;
}

.zd-section-title em,
.zd-hero__title em {
	font-style: normal;
	color: var(--zd-primary-dark);
}

/* Hero: real clinic portrait with compact proof tools and no decorative orbs. */
.zd-hero {
	background: #f1f6f5;
	padding-block: clamp(2.5rem, 1.8rem + 3vw, 5rem) clamp(3rem, 2rem + 3vw, 5.5rem);
}

.zd-hero__grid {
	gap: clamp(2rem, 1.5rem + 3vw, 4rem);
}

.zd-hero__identity {
	color: var(--zd-primary-dark);
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: 0;
	text-transform: none;
}

.zd-hero__title {
	max-inline-size: 18ch;
	font-weight: 850;
	line-height: 1.42;
}

.zd-hero__lead {
	line-height: 1.9;
}

.zd-hero__figure {
	border: 8px solid #fff;
	border-radius: 8px 8px 48px 8px;
	box-shadow: 0 30px 65px -32px rgba(16, 45, 58, .45);
}

.zd-hero__figure img {
	object-position: center 18%;
}

@media (min-width: 960px) {
	.zd-hero {
		padding-block: 2.75rem 3.25rem;
	}

	.zd-hero__media {
		inline-size: min(100%, 500px);
		justify-self: center;
	}

	.zd-hero__figure {
		aspect-ratio: 4 / 4.45;
	}
}

.zd-chip {
	border-radius: 8px;
	background: rgba(255, 255, 255, .97);
	backdrop-filter: none;
	animation-duration: 8s;
	box-shadow: 0 16px 36px -22px rgba(16, 45, 58, .42);
}

.zd-chip--a .zd-chip__icon {
	inline-size: 44px;
	block-size: 44px;
	border-radius: 50%;
	background: radial-gradient(circle, #fff 54%, transparent 56%), conic-gradient(var(--zd-primary) 0 82%, var(--zd-ice) 82% 100%);
}

.zd-chip--b .zd-chip__icon {
	background: #e9f5f7;
}

/* Booking is a light, focused tool immediately after the hero. */
.zd-booking {
	background: #eaf5f3;
	color: var(--zd-ink);
	padding-block: 2rem;
}

.zd-booking__grid {
	gap: 1.25rem;
}

.zd-booking .zd-section-title,
.zd-booking h3 {
	color: var(--zd-ink);
}

.zd-booking .zd-section-sub,
.zd-booking__aside p,
.zd-booking__points span {
	color: #47636d;
}

.zd-booking__aside .zd-section-head {
	margin-block-end: .65rem;
}

.zd-booking__aside .zd-section-title {
	font-size: 2rem;
}

.zd-booking__aside > p {
	max-inline-size: 70ch;
	margin: 0;
}

.zd-booking__points {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: .75rem;
	margin-block-start: 1rem;
}

@media (min-width: 960px) {
	.zd-booking__aside {
		display: grid;
		grid-template-columns: minmax(0, .8fr) minmax(31rem, 1.2fr);
		grid-template-rows: auto auto;
		align-items: end;
		gap: .35rem 1.5rem;
	}

	.zd-booking__aside .zd-section-head,
	.zd-booking__aside > p {
		grid-column: 1;
	}

	.zd-booking__points {
		grid-column: 2;
		grid-row: 1 / 3;
		align-self: end;
		margin: 0;
	}
}

.zd-booking .zd-eyebrow {
	background: #fff;
	border: 1px solid var(--zd-line);
	color: var(--zd-primary-dark);
}

.zd-booking__points li {
	padding: .65rem;
	border: 1px solid rgba(220, 232, 232, .9);
	border-radius: 8px;
	background: rgba(255, 255, 255, .66);
}

.zd-booking__points .zd-card__icon {
	inline-size: 36px;
	block-size: 36px;
	background: #fff;
	color: var(--zd-primary-dark);
}

.zd-form {
	border: 1px solid rgba(220, 232, 232, .9);
	box-shadow: 0 28px 60px -34px rgba(16, 45, 58, .42);
}

.zd-booking-flow {
	padding: clamp(1rem, .8rem + 1vw, 1.5rem);
}

.zd-booking-flow__quick .zd-field__error {
	min-block-size: 0;
}

.zd-booking-flow.is-expanded .zd-booking-flow__details {
	animation: zd-reveal .35s var(--zd-ease);
}

.zd-field input,
.zd-field select,
.zd-field textarea {
	background: #f8faf9;
	border-radius: 6px;
}

.zd-field label {
	letter-spacing: 0;
}

/* Dense but calm cards for repeat scanning. */
.zd-services-grid {
	align-items: stretch;
}

.zd-services-grid .zd-card:nth-child(3n + 1) .zd-card__icon { background: #e8f8f3; color: #087b6d; }
.zd-services-grid .zd-card:nth-child(3n + 2) .zd-card__icon { background: #e9f5f7; color: #176f7f; }
.zd-services-grid .zd-card:nth-child(3n) .zd-card__icon { background: #f5f1df; color: #806919; }

.zd-about__media img,
.zd-team-card__photo,
.zd-ba figure,
.zd-post-card__media {
	border-radius: 8px;
}

.zd-badge-float {
	border-radius: 8px;
	background: #fff;
	color: var(--zd-ink);
	border: 1px solid var(--zd-line);
}

.zd-badge-float strong {
	color: var(--zd-primary-dark);
}

/* Circular, dashboard-like proof without turning the site into SaaS. */
.zd-stats {
	background: #fff;
	color: var(--zd-ink);
	border: 1px solid var(--zd-line);
	box-shadow: var(--zd-shadow-lg);
}

.zd-stats__grid {
	gap: 1.5rem;
}

.zd-stat {
	display: grid;
	justify-items: center;
	gap: .75rem;
}

.zd-stat__value {
	--zd-progress: 84%;
	inline-size: 112px;
	block-size: 112px;
	align-items: center;
	border-radius: 50%;
	background: radial-gradient(circle, #fff 59%, transparent 61%), conic-gradient(var(--zd-primary) 0 var(--zd-progress), #dff0ee var(--zd-progress) 100%);
	color: var(--zd-ink);
	font-size: 2rem;
	box-shadow: inset 0 0 0 1px rgba(220, 232, 232, .65);
}

.zd-stat:nth-child(2) .zd-stat__value { --zd-progress: 92%; }
.zd-stat:nth-child(3) .zd-stat__value { --zd-progress: 88%; }
.zd-stat:nth-child(4) .zd-stat__value { --zd-progress: 76%; }

.zd-stat__value .zd-stat__suffix {
	color: var(--zd-primary-dark);
}

.zd-stat__label {
	margin: 0;
	color: var(--zd-muted);
}

.zd-stats__grid > :not(:last-child) {
	border-inline-end: 0;
}

.zd-info-item__icon {
	background: #eaf8f4;
	border-radius: 8px;
}

.zd-hours__row {
	border-radius: 6px;
}

.zd-map__card {
	background: rgba(255, 255, 255, .97);
	backdrop-filter: none;
}

.zd-acc__icon,
.zd-slider__btn {
	border-radius: 50%;
}

.zd-post-card__cat {
	border-radius: 6px;
	backdrop-filter: none;
}

.zd-cta {
	background: var(--zd-ink);
	box-shadow: 0 30px 60px -35px rgba(16, 45, 58, .52);
}

.zd-footer {
	background: #0d2732;
}

/* Reusable ring primitives for checkout, OTP and async booking states. */
.zd-progress-ring {
	--zd-progress: 75%;
	--zd-ring-size: 96px;
	display: grid;
	place-items: center;
	inline-size: var(--zd-ring-size);
	block-size: var(--zd-ring-size);
	border-radius: 50%;
	background: radial-gradient(circle, var(--zd-surface) 58%, transparent 60%), conic-gradient(var(--zd-primary) 0 var(--zd-progress), var(--zd-line) var(--zd-progress) 100%);
	color: var(--zd-ink);
	font-weight: 800;
}

.zd-loader-ring {
	inline-size: 32px;
	block-size: 32px;
	border: 3px solid var(--zd-line);
	border-block-start-color: var(--zd-primary);
	border-radius: 50%;
	animation: zd-spin .7s linear infinite;
}

.zd-page-loader {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 100000;
	place-content: center;
	justify-items: center;
	gap: 1rem;
	background: var(--zd-warm-white);
	color: var(--zd-ink);
	transition: opacity .35s var(--zd-ease), visibility .35s var(--zd-ease);
}

.js .zd-page-loader {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-content: center;
	justify-items: center;
	gap: 1rem;
	background: var(--zd-warm-white);
	color: var(--zd-ink);
	transition: opacity .35s var(--zd-ease), visibility .35s var(--zd-ease);
}

.js:not(.zd-runtime-ready) .zd-page-loader {
	animation: zd-loader-timeout .35s 3.5s forwards;
}

@keyframes zd-loader-timeout {
	to { opacity: 0; visibility: hidden; pointer-events: none; }
}

.zd-page-loader.is-finished {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.zd-page-loader__ring {
	position: relative;
	display: grid;
	place-items: center;
	inline-size: 88px;
	block-size: 88px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--zd-warm-white) 57%, transparent 59%), conic-gradient(var(--zd-primary) 0 78%, var(--zd-line) 78% 100%);
	box-shadow: var(--zd-shadow-md);
	animation: zd-loader-pulse 1.1s ease-in-out infinite alternate;
}

.zd-page-loader__ring::after {
	content: "";
	position: absolute;
	inset: 7px;
	border: 2px solid transparent;
	border-block-start-color: var(--zd-sky, var(--zd-primary));
	border-radius: 50%;
	animation: zd-spin .8s linear infinite;
}

.zd-page-loader__ring span { color: var(--zd-primary-dark); }
.zd-page-loader__ring svg { inline-size: 26px; block-size: 26px; }
.zd-page-loader p { margin: 0; font-size: .9rem; font-weight: 650; }

@keyframes zd-loader-pulse {
	to { transform: scale(1.035); }
}

/* Patient login and WooCommerce account tools. */
.zd-otp {
	inline-size: min(100%, 480px);
	margin-inline: auto;
	padding: clamp(1.25rem, 4vw, 2rem);
	background: var(--zd-surface);
	border: 1px solid var(--zd-line);
	border-radius: 8px;
	box-shadow: var(--zd-shadow-lg);
}

.zd-otp__intro {
	text-align: center;
	margin-block-end: 1.5rem;
}

.zd-otp__intro h2 {
	margin: .8rem 0 .35rem;
	font-family: var(--zd-font-display);
	font-size: 1.55rem;
}

.zd-otp__intro p {
	margin: 0;
	color: var(--zd-muted);
	line-height: 1.8;
}

.zd-otp__icon {
	display: inline-grid;
	place-items: center;
	justify-self: center;
	inline-size: 52px;
	block-size: 52px;
	border-radius: 50%;
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
}

.zd-otp__step {
	display: grid;
	gap: .75rem;
}

.zd-otp__step label {
	font-weight: 750;
}

.zd-otp__step input {
	inline-size: 100%;
	min-block-size: 52px;
	padding-inline: 1rem;
	border: 1px solid var(--zd-line);
	border-radius: 6px;
	background: #f8faf9;
	font: inherit;
}

.zd-otp__step input:focus {
	outline: 3px solid var(--zd-ring);
	border-color: var(--zd-primary);
}

.zd-otp__back {
	justify-self: center;
	padding: .35rem;
	border: 0;
	background: transparent;
	color: var(--zd-primary-dark);
	text-decoration: underline;
	cursor: pointer;
}

.zd-otp__message {
	min-block-size: 1.5em;
	margin: .85rem 0 0;
	text-align: center;
	color: var(--zd-muted);
}

.zd-account-appointments {
	direction: rtl;
}

/* Keep the WooCommerce account navigation usable on narrow Persian layouts. */
@media (max-width: 767px) {
	.woocommerce-account .woocommerce-MyAccount-navigation {
		position: relative;
		inline-size: 100%;
		margin-block-end: 1.5rem;
		overflow: hidden;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation::after {
		content: "← ادامه گزینه‌ها";
		display: block;
		padding-block-start: .2rem;
		color: var(--zd-muted);
		font-size: .72rem;
		font-weight: 700;
		text-align: end;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation ul {
		display: flex;
		gap: .5rem;
		margin: 0;
		padding: .2rem .1rem .65rem;
		overflow-x: auto;
		list-style: none;
		scroll-snap-type: inline mandatory;
		scrollbar-color: var(--zd-primary) var(--zd-primary-soft);
		scrollbar-width: thin;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation li {
		flex: 0 0 auto;
		scroll-snap-align: start;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation a {
		display: inline-flex;
		align-items: center;
		min-block-size: 44px;
		padding: .55rem .9rem;
		border: 1px solid var(--zd-line);
		border-radius: var(--zd-radius-pill);
		background: var(--zd-surface);
		color: var(--zd-muted);
		font-size: .88rem;
		font-weight: 750;
		text-decoration: none;
		white-space: nowrap;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation .is-active a {
		border-color: var(--zd-primary-dark);
		background: var(--zd-primary-dark);
		color: #fff;
	}

	.woocommerce-account .woocommerce-MyAccount-content {
		inline-size: 100%;
	}
}

/* Persian appointment calendar — portalled to body by JS to avoid clipping. */
.zd-jalali-picker {
	position: relative;
	display: block;
}

.zd-jalali-picker__input {
	padding-inline-end: 3rem !important;
	background-image: linear-gradient(transparent, transparent);
	cursor: pointer;
}

.zd-jalali-picker::after {
	content: "";
	position: absolute;
	inset-block-start: 50%;
	inset-inline-end: 1rem;
	inline-size: 16px;
	block-size: 16px;
	border: 2px solid var(--zd-primary-dark);
	border-block-start-width: 5px;
	border-radius: 3px;
	transform: translateY(-50%);
	pointer-events: none;
}

.zd-jalali-picker__panel {
	position: fixed;
	z-index: 2147483000;
	inline-size: min(22rem, calc(100vw - 1.5rem));
	padding: .75rem;
	box-sizing: border-box;
	direction: rtl;
	border: 1px solid color-mix(in srgb, var(--zd-primary-dark) 24%, var(--zd-line));
	border-radius: 10px;
	background: var(--zd-surface);
	box-shadow: 0 18px 48px -18px rgba(16, 45, 58, .34), 0 4px 14px rgba(16, 45, 58, .08);
	overflow-x: hidden;
	isolation: isolate;
	animation: zd-calendar-in .16s ease-out;
}

.zd-jalali-picker__panel[hidden] {
	display: none !important;
}

@keyframes zd-calendar-in {
	from { opacity: 0; transform: translateY(4px); }
	to { opacity: 1; transform: translateY(0); }
}

.zd-jalali-picker__head {
	display: grid;
	grid-template-columns: 38px 1fr 38px;
	align-items: center;
	gap: .4rem;
	padding-block-end: .65rem;
	margin-block-end: .45rem;
	border-block-end: 1px solid var(--zd-line);
}

.zd-jalali-picker__head strong {
	text-align: center;
	color: var(--zd-ink);
	font-family: var(--zd-font-display);
	font-size: .98rem;
	font-weight: 800;
}
/* Two calendar classes deliberately outrank `.elementor-kit-* button`. */
.zd-jalali-picker__panel .zd-jalali-picker__head button,
.zd-jalali-picker__panel .zd-jalali-picker__grid button {
	box-sizing: border-box;
	display: inline-grid;
	place-items: center;
	min-inline-size: 38px;
	min-block-size: 38px;
	max-inline-size: 38px;
	max-block-size: 38px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 7px;
	background: transparent;
	color: var(--zd-ink);
	font: inherit;
	font-size: .86rem;
	line-height: 1;
	cursor: pointer;
	transition: background-color .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease;
}

.zd-jalali-picker__panel .zd-jalali-picker__head button {
	font-family: sans-serif;
	font-size: 1.35rem;
	line-height: 1;
}

.zd-jalali-picker__panel .zd-jalali-picker__head button:hover,
.zd-jalali-picker__panel .zd-jalali-picker__grid button:hover:not(:disabled) {
	border-color: color-mix(in srgb, var(--zd-primary-dark) 18%, transparent);
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
}
.zd-jalali-picker__panel .zd-jalali-picker__head button:focus-visible,
.zd-jalali-picker__panel .zd-jalali-picker__grid button:focus-visible,
.zd-jalali-picker__panel button.zd-jalali-picker__today:focus-visible { outline: 2px solid var(--zd-primary-dark); outline-offset: 2px; }

.zd-jalali-picker__grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(36px, 1fr));
	align-items: center;
	gap: .2rem;
	text-align: center;
}

.zd-jalali-picker__weekday {
	padding-block: .3rem .4rem;
	color: var(--zd-muted);
	font-size: .72rem;
	font-weight: 750;
}
.zd-jalali-picker__panel .zd-jalali-picker__grid button:disabled { color: color-mix(in srgb, var(--zd-muted) 55%, #fff); cursor: not-allowed; opacity: .55; }
.zd-jalali-picker__panel .zd-jalali-picker__grid .is-today { border-color: var(--zd-primary-dark); color: var(--zd-primary-dark); font-weight: 800; }
.zd-jalali-picker__panel .zd-jalali-picker__grid .is-selected,
.zd-jalali-picker__panel .zd-jalali-picker__grid .is-selected:hover {
	border-color: var(--zd-primary-dark);
	background: var(--zd-primary-dark);
	color: #fff;
	box-shadow: 0 4px 10px rgba(16, 92, 88, .18);
	font-weight: 800;
}
.zd-jalali-picker__panel button.zd-jalali-picker__today {
	display: block;
	inline-size: calc(100% + 1.5rem);
	min-block-size: 38px;
	block-size: 38px;
	margin: .6rem -.75rem -.75rem;
	padding: 0;
	box-sizing: border-box;
	border: 0;
	border-block-start: 1px solid var(--zd-line);
	border-radius: 0 0 10px 10px;
	background: transparent;
	color: var(--zd-primary-dark);
	font: inherit;
	font-size: .82rem;
	font-weight: 800;
	line-height: 1;
	cursor: pointer;
	transition: background-color .14s ease;
}
.zd-jalali-picker__panel button.zd-jalali-picker__today:hover { background: var(--zd-primary-soft); }

@media (max-width: 600px) {
	.zd-jalali-picker__panel {
		max-block-size: calc(100dvh - 24px - env(safe-area-inset-bottom));
		overflow-y: auto;
	}
	.zd-jalali-picker__grid { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
	.zd-jalali-picker__panel { animation: none; }
}

.zd-account-appointments > h2 {
	font-family: var(--zd-font-display);
	font-size: 1.65rem;
}

.zd-account-appointments__list {
	display: grid;
	gap: .85rem;
}

.zd-appointment-card {
	display: grid;
	grid-template-columns: minmax(10rem, 1.5fr) repeat(3, minmax(8rem, 1fr)) auto;
	align-items: center;
	gap: .75rem 1rem;
	padding: 1rem 1.15rem;
	border: 1px solid var(--zd-line);
	border-radius: 8px;
	background: var(--zd-surface);
	box-shadow: var(--zd-shadow);
}

.zd-appointment-card strong {
	font-family: var(--zd-font-display);
	color: var(--zd-ink);
}

.zd-appointment-card span {
	color: var(--zd-muted);
}

.zd-appointment-card small {
	justify-self: start;
	padding: .35rem .55rem;
	border-radius: 6px;
	background: var(--zd-primary-soft);
	color: var(--zd-primary-dark);
	font-weight: 750;
}

.zd-appointment-card a {
	color: #a33b3b;
	font-weight: 750;
}

/* Keep the richer account dashboard above the legacy compact card defaults. */
.zd-account-appointments .zd-appointment-card {
	grid-template-columns: minmax(12rem, 1.5fr) minmax(10rem, 1fr) minmax(5rem, .5fr) auto auto;
	box-shadow: none;
}

.zd-account-appointments .zd-appointment-card > div:not(.zd-appointment-card__main) {
	display: grid;
	gap: .2rem;
}

.zd-account-appointments .zd-appointment-card small {
	padding: 0;
	background: transparent;
	color: var(--zd-muted);
	font-size: .72rem;
}

.zd-account-appointments .zd-appointment-status--pending { color: #755700; }
.zd-account-appointments .zd-appointment-status--confirmed { color: var(--zd-primary-dark); }
.zd-account-appointments .zd-appointment-status--done { color: #42565d; }
.zd-account-appointments .zd-appointment-status--cancelled { color: #8b3029; }

@media (max-width: 820px) {
	.zd-account-appointments .zd-appointment-card { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.zd-account-appointments .zd-appointment-card__main { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
	.zd-account-appointments .zd-appointment-card { grid-template-columns: 1fr; }
	.zd-account-appointments .zd-appointment-card__main { grid-column: auto; }
}

@media (max-width: 767px) {
	.zd-hero__grid { gap: 2rem; }
	.zd-hero__content { order: 1; }
	.zd-hero__media { order: 0; }
	.zd-hero__figure { aspect-ratio: 4 / 3.7; }
	.zd-hero__cta .zd-btn { flex: 1 1 100%; }
	.zd-chip { max-inline-size: 180px; padding: .65rem .75rem; }
	.zd-chip--a { inset-block-start: .75rem; inset-inline-start: -.35rem; }
	.zd-chip--b { inset-block-end: .75rem; inset-inline-end: -.35rem; }
	.zd-booking__points { grid-template-columns: 1fr; }
	.zd-booking { padding-block: 2.5rem; }
	.zd-booking__aside .zd-section-title { font-size: 1.7rem; }
	.zd-form__foot .zd-btn { inline-size: 100%; }
	.zd-stat__value { inline-size: 92px; block-size: 92px; font-size: 1.7rem; }
	.zd-map__card { position: relative; inset: auto; max-inline-size: none; margin: 1rem; }
	.zd-appointment-card { grid-template-columns: 1fr; align-items: start; }
}

@media (prefers-reduced-motion: reduce) {
	.zd-chip,
	.zd-loader-ring,
	.zd-page-loader__ring,
	.zd-page-loader__ring::after,
	.zd-status::before {
		animation: none !important;
	}
}