/* dy-components.css — Componenti UI "clinical-chic"
   OWNER: Agent D
   Caricato DOPO dy-core.css: consuma i token del design system
   (--dy-ivory, --dy-sage, --dy-font-head, ...) e non ridefinisce il design system.
   Le primitive mancanti al momento del caricamento sono definite qui come
   fallback coerenti con il contratto dei token. */

/* Token alfa aggiuntivi di questo file: derivati esclusivamente dai token del
   design system (nessun colore inventato). */
:root {
	--dy-sage-a22: rgba(58, 118, 182, 0.22);
	--dy-sage-a0: rgba(58, 118, 182, 0);
	--dy-dust-a10: rgba(147, 174, 191, 0.1);
	--dy-dust-a0: rgba(147, 174, 191, 0);
	--dy-ink-a90: rgba(27, 34, 32, 0.9);
	--dy-ink-a55: rgba(27, 34, 32, 0.55);
	--dy-ink-a16: var(--dy-ink-a16);
	--dy-ink-a0: rgba(27, 34, 32, 0);
	--dy-ivory-a76: rgba(246, 244, 239, 0.76);
	--dy-ivory-a0: rgba(246, 244, 239, 0);
	--dy-surface-a94: rgba(255, 255, 255, 0.94);
	--dy-surface-a82: rgba(255, 255, 255, 0.82);
}

/* =========================================================================
   1. PRIMITIVE (fallback del design system)
   ========================================================================= */

.dy-container {
	width: 100%;
	max-width: var(--dy-container);
	margin-inline: auto;
	padding-inline: var(--dy-space-5);
}

.dy-section {
	padding-block: var(--dy-space-9);
	background: var(--dy-surface);
}

.dy-section--alt {
	background: var(--dy-ivory);
}

.dy-eyebrow {
	margin: 0 0 var(--dy-space-3);
	font-family: var(--dy-font-body);
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--dy-sage-deep);
}

.dy-title {
	margin: 0 0 var(--dy-space-4);
	font-family: var(--dy-font-head);
	font-size: clamp(1.7rem, 1.25rem + 1.5vw, 2.35rem);
	font-weight: 500;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: var(--dy-ink);
}

.dy-lead {
	margin: 0;
	max-width: 62ch;
	font-family: var(--dy-font-body);
	font-size: 1.0625rem;
	font-weight: 300;
	line-height: 1.7;
	color: var(--dy-body);
}

.dy-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 0.9em 1.7em;
	border: 1px solid transparent;
	border-radius: var(--dy-radius-pill);
	font-family: var(--dy-font-body);
	font-size: 0.95rem;
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--dy-motion-hover) ease, color var(--dy-motion-hover) ease,
		border-color var(--dy-motion-hover) ease, box-shadow var(--dy-motion-hover) ease,
		transform var(--dy-motion-hover) var(--dy-motion-ease);
}

.dy-btn--primary {
	background: var(--dy-sage-deep);
	color: var(--dy-surface);
}

.dy-btn--primary:hover,
.dy-btn--primary:focus-visible {
	background: var(--dy-ink);
	color: var(--dy-surface);
	box-shadow: var(--dy-shadow-md);
	transform: translateY(-2px);
}

.dy-btn--ghost {
	background: transparent;
	border-color: var(--dy-line);
	color: var(--dy-ink);
}

.dy-btn--ghost:hover,
.dy-btn--ghost:focus-visible {
	border-color: var(--dy-sage-deep);
	color: var(--dy-sage-deep);
}

.dy-btn--sm {
	padding: 0.65em 1.25em;
	font-size: 0.875rem;
}

.dy-btn--light {
	background: var(--dy-ivory);
	color: var(--dy-ink);
}

.dy-btn--light:hover,
.dy-btn--light:focus-visible {
	background: var(--dy-sage);
	color: var(--dy-surface);
}

.dy-tag {
	align-self: flex-start;
	display: inline-block;
	padding: 0.45em 0.85em;
	border-radius: var(--dy-radius-pill);
	background: var(--dy-sage-tint);
	color: var(--dy-sage-deep);
	font-family: var(--dy-font-body);
	font-size: 0.7rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.dy-tag--dust {
	background: var(--dy-dust-tint);
	color: var(--dy-dust-deep);
}

.dy-more {
	display: inline-flex;
	align-items: center;
	gap: 0.45em;
	margin-top: auto;
	padding-top: var(--dy-space-3);
	font-family: var(--dy-font-body);
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--dy-sage-deep);
}

.dy-more__arrow {
	display: inline-block;
	transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1);
}

.dy-empty {
	margin: 0;
	padding: var(--dy-space-6);
	border: 1px dashed var(--dy-line);
	border-radius: var(--dy-radius-md);
	background: var(--dy-surface);
	color: var(--dy-muted);
	font-family: var(--dy-font-body);
	font-size: 0.95rem;
	line-height: 1.6;
	text-align: center;
}

.dy-empty__action {
	display: flex;
	justify-content: center;
	margin-top: var(--dy-space-3);
}

.dy-note {
	margin: 0;
	padding: var(--dy-space-4) var(--dy-space-5);
	border-radius: var(--dy-radius-md);
	font-family: var(--dy-font-body);
	font-size: 0.9rem;
	line-height: 1.6;
}

.dy-note--admin {
	background: var(--dy-dust-tint);
	border: 1px solid var(--dy-dust);
	color: var(--dy-ink);
}

/* =========================================================================
   2. TESTATE SEZIONE / PAGINA
   ========================================================================= */

.dy-section__head {
	margin-bottom: var(--dy-space-6);
}

.dy-section__head--split {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--dy-space-5);
}

.dy-section__head-text {
	max-width: 68ch;
}

.dy-section__head-link {
	margin: 0;
}

.dy-section__more {
	margin: var(--dy-space-6) 0 0;
	text-align: center;
}

.dy-page-header {
	padding-block: var(--dy-space-8);
	background: var(--dy-ivory);
	border-bottom: 1px solid var(--dy-line);
}

.dy-page-header__title {
	margin-bottom: var(--dy-space-3);
	font-size: clamp(1.9rem, 1.4rem + 2.2vw, 2.8rem);
}

.dy-page-header__lead {
	max-width: 64ch;
}

/* =========================================================================
   3. HERO (home)
   ========================================================================= */

.dy-hero {
	position: relative;
	overflow: hidden;
	padding-block: clamp(var(--dy-space-7), 6vw, var(--dy-space-9));
	background: var(--dy-ivory);
}

.dy-hero::before {
	content: "";
	position: absolute;
	inset: -20% -10% auto auto;
	width: min(58vw, 720px);
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(
		circle at 40% 40%,
		var(--dy-sage-a22),
		var(--dy-dust-a10) 55%,
		var(--dy-ivory-a0) 72%
	);
	pointer-events: none;
}

.dy-hero__grid {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dy-space-7);
	align-items: center;
}

.dy-hero__title {
	max-width: 14ch;
	margin-bottom: var(--dy-space-5);
	font-size: clamp(2.1rem, 1.4rem + 3.1vw, 3.5rem);
	line-height: 1.06;
}

.dy-hero__accent {
	display: block;
	font-style: italic;
	font-weight: 400;
	color: var(--dy-sage-deep);
}

.dy-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--dy-space-3);
	margin-top: var(--dy-space-6);
}

.dy-hero__visual {
	position: relative;
	padding-block: var(--dy-space-5);
}

.dy-hero__frame {
	position: relative;
	z-index: 1;
	margin: 0;
	aspect-ratio: 4 / 5;
	max-height: 74vh;
	border-radius: var(--dy-radius-lg);
	overflow: hidden;
	background: var(--dy-sage-tint);
	border: 1px solid var(--dy-line);
	box-shadow: var(--dy-shadow-md);
}

.dy-hero__frame img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.dy-hero__blob {
	position: absolute;
	z-index: 0;
	right: -6%;
	top: 0;
	width: 78%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: var(--dy-sage-tint);
	border: 1px solid var(--dy-line);
}

.dy-hero__badge {
	position: absolute;
	z-index: 2;
	left: 0;
	bottom: var(--dy-space-6);
	max-width: min(330px, 82%);
	padding: var(--dy-space-4) var(--dy-space-5);
	margin:  var(--dy-space-4) var(--dy-space-5);
	background: var(--dy-surface);
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-md);
	box-shadow: var(--dy-shadow-md);
}

.dy-hero__badge-label {
	display: block;
	font-family: var(--dy-font-body);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dy-sage-deep);
}

.dy-hero__badge-name {
	display: block;
	margin-top: var(--dy-space-2);
	font-family: var(--dy-font-head);
	font-size: 1.2rem;
	font-weight: 500;
	color: var(--dy-ink);
}

.dy-hero__badge-note {
	display: block;
	margin-top: var(--dy-space-1);
	font-family: var(--dy-font-body);
	font-size: 0.8rem;
	line-height: 1.5;
	color: var(--dy-muted);
}

/* =========================================================================
   4. TRUST STRIP
   ========================================================================= */

.dy-trust {
	padding-block: var(--dy-space-5);
	background: var(--dy-surface);
	border-block: 1px solid var(--dy-line);
}

.dy-trust__list {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dy-space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.dy-trust__item {
	padding: var(--dy-space-2) var(--dy-space-4);
	font-family: var(--dy-font-body);
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	text-align: center;
	color: var(--dy-muted);
}

/* =========================================================================
   5. CARD (trattamenti / casi singoli)
   ========================================================================= */

.dy-card-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dy-space-6);
}

.dy-card {
	background: var(--dy-surface);
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-md);
	overflow: hidden;
	box-shadow: var(--dy-shadow-sm);
	transition: box-shadow var(--dy-motion-hover) var(--dy-motion-ease), transform var(--dy-motion-hover) var(--dy-motion-ease);
}

.dy-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
}

.dy-card__media {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--dy-sage-tint);
}

.dy-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1);
}

.dy-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--dy-space-2);
	padding: var(--dy-space-5);
}

.dy-card__title {
	font-family: var(--dy-font-head);
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1.3;
	color: var(--dy-ink);
}

.dy-card__excerpt {
	margin: 0;
	font-family: var(--dy-font-body);
	font-size: 0.93rem;
	line-height: 1.65;
	color: var(--dy-body);
}

@media (prefers-reduced-motion: no-preference) {
	.dy-card-grid > .dy-reveal:hover,
	.dy-card-grid > .dy-reveal:focus-within {
		transition-delay: 0ms;
	}

	.dy-card:hover,
	.dy-card:focus-within {
		box-shadow: var(--dy-shadow-md);
		transform: translateY(-4px);
	}

	.dy-card:hover .dy-card__img,
	.dy-card:focus-within .dy-card__img {
		transform: scale(1.04);
	}

	.dy-card:hover .dy-more__arrow,
	.dy-card:focus-within .dy-more__arrow {
		transform: translateX(5px);
	}
}

/* =========================================================================
   6. GRIGLIA DOTTORI + CARD CON HOVER REVEAL
   ========================================================================= */

.dy-doctor-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dy-space-6);
}

.dy-doctor-card {
	background: var(--dy-surface);
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-md);
	overflow: hidden;
}

.dy-doctor-card__link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.dy-doctor-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--dy-sage-tint);
}

.dy-doctor-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.dy-doctor-card__img--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(
		140deg,
		var(--dy-sage-tint),
		var(--dy-dust-tint)
	);
	font-family: var(--dy-font-head);
	font-size: 3rem;
	color: var(--dy-sage-deep);
}

.dy-doctor-card__overlay {
	position: absolute;
	inset: auto 0 0 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: var(--dy-space-5);
	background: linear-gradient(
		to top,
		var(--dy-ink-a90),
		var(--dy-ink-a55) 55%,
		var(--dy-ink-a0) 100%
	);
	color: var(--dy-surface);
	transform: translateY(101%);
}

.dy-doctor-card__studio {
	font-family: var(--dy-font-body);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--dy-surface-a82);
}

.dy-doctor-card__more {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-family: var(--dy-font-body);
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--dy-surface);
}

.dy-doctor-card__arrow {
	display: inline-block;
	transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1);
}

.dy-doctor-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--dy-space-1);
	padding: var(--dy-space-5);
}

.dy-doctor-card__name {
	font-family: var(--dy-font-head);
	font-size: 1.3rem;
	font-weight: 500;
	line-height: 1.25;
	color: var(--dy-ink);
}

.dy-doctor-card__ruolo {
	font-family: var(--dy-font-body);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--dy-sage-deep);
}

.dy-doctor-card__spec {
	margin: 0;
	font-family: var(--dy-font-body);
	font-size: 0.9rem;
	line-height: 1.55;
	color: var(--dy-muted);
}

/* Rivela l'overlay anche da tastiera (stesso effetto dell'hover). */
.dy-doctor-card:focus-within .dy-doctor-card__overlay {
	transform: translateY(0);
}

/* Touch / schermi piccoli: card come blocco link, overlay sempre visibile. */
@media (hover: none), (max-width: 639px) {
	.dy-doctor-card__overlay {
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: no-preference) {
	.dy-doctor-card {
		transition: box-shadow 0.5s cubic-bezier(0.2, 0.7, 0.3, 1),
			border-color 0.5s cubic-bezier(0.2, 0.7, 0.3, 1),
			transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1);
	}

	.dy-doctor-card__img {
		transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1);
	}

	.dy-doctor-card__overlay {
		transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1);
	}

	.dy-doctor-card:hover,
	.dy-doctor-card:focus-within {
		border-color: var(--dy-sage);
		box-shadow: var(--dy-shadow-md);
		transform: translateY(-4px);
	}

	.dy-doctor-card:hover .dy-doctor-card__img {
		transform: scale(1.04);
	}

	.dy-doctor-card:hover .dy-doctor-card__overlay {
		transform: translateY(0);
	}

	.dy-doctor-card:hover .dy-doctor-card__arrow {
		transform: translateX(6px);
	}
}

/* =========================================================================
   7. SLIDER PRIMA / DOPO (.dy-ba)
   ========================================================================= */

.dy-ba-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dy-space-6);
}

.dy-mixed-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dy-space-6);
}

.dy-ba {
	margin: 0;
}

.dy-ba__stage {
	position: relative;
	aspect-ratio: 4 / 3;
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-lg);
	overflow: hidden;
	background: var(--dy-dust-tint);
	cursor: ew-resize;
	touch-action: pan-y;
	user-select: none;
	-webkit-user-select: none;
	-webkit-tap-highlight-color: transparent;
}

.dy-ba--full .dy-ba__stage {
	aspect-ratio: 3 / 2;
}

.dy-ba__img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none;
}

.dy-ba__img.is-dopo {
	clip-path: inset(0 0 0 var(--dy-ba-pos, 50%));
}

.dy-ba__label {
	position: absolute;
	top: var(--dy-space-3);
	z-index: 3;
	padding: 0.45em 0.85em;
	border-radius: var(--dy-radius-pill);
	background: var(--dy-surface-a94);
	font-family: var(--dy-font-body);
	font-size: 0.68rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dy-ink);
	pointer-events: none;
}

.dy-ba__label.is-prima {
	left: var(--dy-space-3);
}

.dy-ba__label.is-dopo {
	right: var(--dy-space-3);
}

.dy-ba__handle {
	position: absolute;
	top: 0;
	bottom: 0;
	left: var(--dy-ba-pos, 50%);
	z-index: 4;
	width: 2px;
	background: var(--dy-surface);
	box-shadow: 0 0 0 1px var(--dy-ink-a16);
	transform: translateX(-1px);
	pointer-events: none;
}

.dy-ba__handle::after {
	content: "\2039\00a0\203A";
	position: absolute;
	top: 50%;
	left: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--dy-surface);
	box-shadow: var(--dy-shadow-md);
	font-family: var(--dy-font-body);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 1px;
	color: var(--dy-ink);
	transform: translate(-50%, -50%);
}

/* Percorso accessibile/da tastiera: nascosto visivamente, ma focusabile. */
.dy-ba__range {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 5;
	width: 100%;
	height: 28px;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	opacity: 0;
	pointer-events: none;
	appearance: none;
	-webkit-appearance: none;
}

.dy-ba__stage:focus-within {
	outline: 3px solid var(--dy-dust-deep);
	outline-offset: 3px;
}

.dy-ba__caption {
	margin: var(--dy-space-3) 0 0;
	font-family: var(--dy-font-body);
	font-size: 0.88rem;
	line-height: 1.6;
	color: var(--dy-muted);
}

.dy-ba__caption-link {
	font-weight: 600;
	color: var(--dy-ink);
	text-decoration: none;
	transition: color 0.25s ease;
}

.dy-ba__caption-link:hover,
.dy-ba__caption-link:focus-visible {
	color: var(--dy-sage);
}

.dy-ba__caption .dy-more {
	margin-left: var(--dy-space-2);
}

.dy-ba__caption .dy-more:hover {
	color: var(--dy-sage);
}

@media (prefers-reduced-motion: no-preference) {
	.dy-ba__img.is-dopo {
		transition: clip-path 0.12s linear;
	}

	.dy-ba__handle {
		transition: left 0.12s linear;
	}

	.dy-ba.is-dragging .dy-ba__img.is-dopo,
	.dy-ba.is-dragging .dy-ba__handle {
		transition: none;
	}
}

/* =========================================================================
   8. CHIPS (filtri per tassonomia)
   ========================================================================= */

.dy-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--dy-space-2);
	margin: 0 0 var(--dy-space-6);
}

.dy-chip {
	display: inline-flex;
	align-items: center;
	padding: 0.45em 1em;
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-pill);
	background: var(--dy-surface);
	color: var(--dy-body);
	font-family: var(--dy-font-body);
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	transition: background-color 0.3s ease, border-color 0.3s ease,
		color 0.3s ease, transform var(--dy-motion-hover) var(--dy-motion-ease);
}

.dy-chip:hover,
.dy-chip:focus-visible {
	border-color: var(--dy-sage-deep);
	color: var(--dy-sage-deep);
	transform: translateY(-1px);
}

.dy-chip.is-active {
	background: var(--dy-ink);
	border-color: var(--dy-ink);
	color: var(--dy-surface);
}

/* =========================================================================
   9. SEDI
   ========================================================================= */

.dy-offices {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dy-space-6);
}

.dy-office {
	padding-top: var(--dy-space-4);
	border-top: 2px solid var(--dy-sage);
}

.dy-office__city {
	margin: 0 0 var(--dy-space-2);
	font-family: var(--dy-font-head);
	font-size: 1.15rem;
	font-weight: 500;
	color: var(--dy-ink);
}

.dy-office__address {
	margin: 0 0 var(--dy-space-3);
	font-family: var(--dy-font-body);
	font-size: 0.92rem;
	line-height: 1.6;
	color: var(--dy-body);
}

.dy-office__tel {
	display: inline-block;
	margin-bottom: var(--dy-space-2);
	font-family: var(--dy-font-body);
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--dy-ink);
	text-decoration: none;
}

.dy-office__tel:hover {
	color: var(--dy-sage-deep);
}

.dy-office__more {
	margin-top: 0;
	padding-top: 0;
	font-size: 0.85rem;
	text-decoration: none;
}

.dy-office__more:hover .dy-more__arrow {
	transform: translateX(5px);
}

/* =========================================================================
   9b. PAGINE STUDIO (card indirizzo + mappa)
   ========================================================================= */

.dy-studio {
	display: grid;
	grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
	gap: var(--dy-space-5);
	align-items: start;
	margin-block: var(--dy-space-6);
}

.dy-studio__card {
	overflow: hidden;
	padding: var(--dy-space-5);
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-md);
	background: var(--dy-surface);
	box-shadow: var(--dy-shadow-sm);
}

.dy-studio__city {
	margin: 0 0 var(--dy-space-3);
	font-family: var(--dy-font-head);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--dy-ink);
}

.dy-studio__address {
	margin: 0 0 var(--dy-space-4);
	font-family: var(--dy-font-body);
	font-size: 0.92rem;
	line-height: 1.6;
	color: var(--dy-body);
}

.dy-studio__tel,
.dy-studio__email {
	display: block;
	font-family: var(--dy-font-body);
	font-size: 0.9rem;
	font-weight: 500;
	line-height: 1.5;
	color: var(--dy-ink);
	text-decoration: none;
}

.dy-studio__tel {
	margin-bottom: var(--dy-space-2);
}

.dy-studio__tel:hover,
.dy-studio__tel:focus-visible,
.dy-studio__email:hover,
.dy-studio__email:focus-visible {
	color: var(--dy-sage-deep);
}

.dy-studio__email {
	word-break: break-all;
}

.dy-studio__map > div {
	width: 100%;
}

.dy-studio__map iframe {
	display: block;
	width: 100%;
	height: clamp(300px, 42vw, 420px);
	border: 0;
	border-radius: var(--dy-radius-md);
}

/* Foto legacy da host morto (byethost24): icona rotta, nascosta. */
.dy-studio__map img[src*='byethost24'] {
	display: none;
}

@media (max-width: 899px) {
	.dy-studio {
		grid-template-columns: 1fr;
	}
}

/* =========================================================================
   10. BANDA CTA
   ========================================================================= */

.dy-cta-band {
	padding-block: var(--dy-space-8);
	background: var(--dy-ink);
	color: var(--dy-ivory);
}

.dy-cta-band__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--dy-space-6);
}

.dy-cta-band__text {
	max-width: 62ch;
}

.dy-cta-band__title {
	margin-bottom: var(--dy-space-3);
	color: var(--dy-ivory);
}

.dy-cta-band__note {
	margin: 0;
	font-family: var(--dy-font-body);
	font-size: 1rem;
	line-height: 1.7;
	color: var(--dy-ivory-a76);
}

/* =========================================================================
   11. TEMPLATE SINGOLI
   ========================================================================= */

.dy-single {
	padding-block: var(--dy-space-8);
}

.dy-single__head {
	margin-bottom: var(--dy-space-6);
}

.dy-back {
	display: inline-flex;
	align-items: center;
	gap: 0.45em;
	margin-bottom: var(--dy-space-4);
	font-family: var(--dy-font-body);
	font-size: 0.88rem;
	font-weight: 500;
	color: var(--dy-muted);
	text-decoration: none;
}

.dy-back:hover {
	color: var(--dy-sage-deep);
}

.dy-back span {
	display: inline-block;
	transition: transform var(--dy-motion-hover) var(--dy-motion-ease);
}

.dy-back:hover span,
.dy-back:focus-visible span {
	transform: translateX(-4px);
}

.dy-single__title {
	margin-bottom: var(--dy-space-3);
	font-size: clamp(2rem, 1.4rem + 2vw, 3rem);
}

.dy-meta-table {
	width: 100%;
	margin: var(--dy-space-6) 0;
	border-collapse: collapse;
	border-top: 1px solid var(--dy-line);
}

.dy-meta-table th,
.dy-meta-table td {
	padding: var(--dy-space-4) 0;
	border-bottom: 1px solid var(--dy-line);
	text-align: left;
	vertical-align: top;
	font-family: var(--dy-font-body);
	font-size: 0.95rem;
	line-height: 1.6;
}

.dy-meta-table th {
	width: 34%;
	padding-right: var(--dy-space-4);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	font-size: 0.72rem;
	color: var(--dy-sage-deep);
}

.dy-meta-table td {
	color: var(--dy-body);
}

.dy-doctor-affiliations {
	margin-top: var(--dy-space-5);
	padding-top: var(--dy-space-5);
	border-top: 1px solid var(--dy-line);
}

.dy-doctor-affiliations__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.dy-doctor-affiliations__list li {
	position: relative;
	padding: var(--dy-space-3) 0 var(--dy-space-3) var(--dy-space-5);
	border-bottom: 1px solid var(--dy-line);
	font-family: var(--dy-font-body);
	font-size: 0.95rem;
	line-height: 1.65;
	color: var(--dy-body);
}

.dy-doctor-affiliations__list li::before {
	position: absolute;
	left: 0;
	top: 1.1em;
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	background: var(--dy-primary);
	content: '';
}

.dy-prose {
	font-family: var(--dy-font-body);
	font-size: 1.02rem;
	line-height: 1.8;
	color: var(--dy-body);
}

.dy-prose p {
	margin: 0 0 var(--dy-space-4);
}

.dy-prose h2,
.dy-prose h3 {
	font-family: var(--dy-font-head);
	font-weight: 500;
	color: var(--dy-ink);
}

.dy-two-col {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dy-space-7);
}

.dy-doctor-side {
	display: flex;
	flex-direction: column;
	gap: var(--dy-space-4);
}

.dy-doctor-side__media {
	margin: 0;
	aspect-ratio: 4 / 5;
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-md);
	overflow: hidden;
	background: var(--dy-sage-tint);
	box-shadow: var(--dy-shadow-sm);
}

.dy-doctor-side__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.dy-doctor-side__facts {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--dy-line);
}

.dy-doctor-side__facts li {
	padding: var(--dy-space-3) 0;
	border-bottom: 1px solid var(--dy-line);
	font-family: var(--dy-font-body);
	font-size: 0.92rem;
	line-height: 1.6;
	color: var(--dy-body);
}

.dy-doctor-side__facts strong {
	display: block;
	margin-bottom: 2px;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--dy-sage-deep);
}

.dy-doctor-side__facts a {
	color: var(--dy-ink);
	text-decoration: none;
}

.dy-doctor-side__facts a:hover {
	color: var(--dy-sage-deep);
}

.dy-nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--dy-space-4);
	margin-top: var(--dy-space-7);
	padding-top: var(--dy-space-5);
	border-top: 1px solid var(--dy-line);
}

.dy-nav-links__item {
	display: flex;
	flex-direction: column;
	gap: 4px;
	max-width: 46%;
	font-family: var(--dy-font-body);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--dy-muted);
	text-decoration: none;
}

.dy-nav-links__item span {
	font-family: var(--dy-font-head);
	font-size: 1.05rem;
	font-weight: 500;
	letter-spacing: normal;
	text-transform: none;
	color: var(--dy-ink);
}

.dy-nav-links__item:hover span {
	color: var(--dy-sage-deep);
}

.dy-nav-links__item--next {
	margin-left: auto;
	text-align: right;
}

.dy-disclaimer {
	margin: var(--dy-space-5) 0 0;
	padding-left: var(--dy-space-4);
	border-left: 2px solid var(--dy-line);
	font-family: var(--dy-font-body);
	font-size: 0.85rem;
	line-height: 1.6;
	color: var(--dy-muted);
}

.dy-single-cta {
	margin-top: var(--dy-space-7);
}

.dy-article__featured-image {
	max-width: 900px;
	margin: 0 0 var(--dy-space-6);
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-lg);
	overflow: hidden;
}

.dy-article__featured-image img {
	display: block;
	width: 100%;
	height: auto;
}

.dy-article__tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--dy-space-2);
	margin: var(--dy-space-6) 0 0;
	padding: 0;
	list-style: none;
}

.dy-section-cta {
	margin-top: var(--dy-space-6);
}

.dy-cv {
	margin-top: var(--dy-space-6);
	padding-top: var(--dy-space-5);
	border-top: 1px solid var(--dy-line);
}

.dy-cv__title {
	margin: 0 0 var(--dy-space-3);
	font-family: var(--dy-font-head);
	font-size: 1.3rem;
	font-weight: 500;
	color: var(--dy-ink);
}

.dy-subtitle {
	margin: 0 0 var(--dy-space-3);
	font-family: var(--dy-font-head);
	font-size: 1.3rem;
	font-weight: 500;
	line-height: 1.3;
	color: var(--dy-ink);
}

.dy-two-col__side {
	display: flex;
	flex-direction: column;
	gap: var(--dy-space-5);
	min-width: 0;
}

.dy-two-col__main {
	min-width: 0;
}

.dy-doctor-profile__frame {
	margin: 0;
	aspect-ratio: 4 / 5;
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-md);
	overflow: hidden;
	background: var(--dy-sage-tint);
	box-shadow: var(--dy-shadow-sm);
}

.dy-doctor-profile__portrait {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.dy-case-single {
	margin: 0 0 var(--dy-space-5);
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-lg);
	overflow: hidden;
	background: var(--dy-surface);
	box-shadow: var(--dy-shadow-sm);
}

.dy-case-single img {
	display: block;
	width: 100%;
	height: auto;
}

.dy-case-refs {
	margin: var(--dy-space-5) 0 0;
	font-family: var(--dy-font-body);
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--dy-body);
}

.dy-case-refs__label {
	font-weight: 600;
	color: var(--dy-ink);
}

.dy-case-refs a {
	color: var(--dy-sage-deep);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.dy-case-refs a:hover {
	color: var(--dy-sage);
}

/* =========================================================================
   12. LAYOUT GRIGLIE RESPONSIVE
   ========================================================================= */

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

	.dy-card-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.dy-doctor-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.dy-ba-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.dy-mixed-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.dy-offices {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 768px) {
	.dy-hero__grid {
		grid-template-columns: 1.05fr 0.95fr;
		gap: var(--dy-space-8);
	}

	.dy-two-col {
		grid-template-columns: 340px 1fr;
		align-items: start;
	}
}

@media (min-width: 1024px) {
	.dy-trust__list {
		grid-template-columns: repeat(4, 1fr);
		gap: 0;
	}

	.dy-trust__item {
		border-left: 1px solid var(--dy-line);
	}

	.dy-trust__item:first-child {
		border-left: 0;
	}

	.dy-card-grid--3 {
		grid-template-columns: repeat(3, 1fr);
	}

	.dy-card-grid--3 > *:last-child:nth-child(3n + 1),
	.dy-doctor-grid > *:last-child:nth-child(3n + 1),
	.dy-ba-grid > *:last-child:nth-child(3n + 1) {
		grid-column: 2;
	}

	.dy-doctor-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.dy-ba-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.dy-mixed-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.dy-offices {
		grid-template-columns: repeat(4, 1fr);
		gap: var(--dy-space-5);
	}

	.dy-two-col {
		grid-template-columns: 380px 1fr;
		gap: var(--dy-space-8);
	}
}

/* =========================================================================
   13. MOTION: nessuna animazione se l'utente la riduce
   ========================================================================= */

@media (prefers-reduced-motion: reduce) {
	.dy-btn,
	.dy-chip,
	.dy-more__arrow,
	.dy-card,
	.dy-doctor-card,
	.dy-doctor-card__arrow {
		transition: none;
	}

	.dy-card:hover,
	.dy-card:focus-within,
	.dy-doctor-card:hover,
	.dy-doctor-card:focus-within {
		transform: none;
	}

	.dy-btn--primary:hover,
	.dy-btn--primary:focus-visible,
	.dy-chip:hover,
	.dy-chip:focus-visible {
		transform: none;
	}
}

/* --- Video page & modal --- */
.dy-video-card__trigger {
	all: unset;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	cursor: pointer;
	color: inherit;
}

.dy-video-card__trigger:focus-visible {
	outline: 2px solid var(--dy-sage);
	outline-offset: -2px;
}

.dy-video-card__trigger--disabled {
	cursor: default;
}

.dy-video-card .dy-card__media {
	position: relative;
}

.dy-video-card__media--placeholder {
	position: relative;
	background: var(--dy-sage-tint);
}

.dy-video-card__play {
	position: absolute;
	top: 50%;
	left: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	aspect-ratio: 1;
	border-radius: var(--dy-radius-pill);
	background: var(--dy-sage);
	color: var(--dy-surface);
	transform: translate(-50%, -50%);
	transition: transform var(--dy-motion-hover) var(--dy-motion-ease);
}

@media (prefers-reduced-motion: no-preference) {
	.dy-video-card__trigger:hover .dy-video-card__play,
	.dy-video-card__trigger:focus-visible .dy-video-card__play {
		transform: translate(-50%, -50%) scale(1.08);
	}
}

.dy-video-card__fallback {
	margin: 0;
	padding: 0 var(--dy-space-5) var(--dy-space-4);
}

.dy-video-modal[hidden] {
	display: none;
}

.dy-video-modal {
	position: fixed;
	inset: 0;
	z-index: 10001;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--dy-space-5);
}

.dy-video-modal__backdrop {
	position: absolute;
	inset: 0;
	background: var(--dy-ink-a90);
}

.dy-video-modal__panel {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 960px;
	border-radius: var(--dy-radius-lg);
	background: var(--dy-ink);
	box-shadow: var(--dy-shadow-md);
	overflow: hidden;
}

.dy-video-modal__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--dy-space-4);
	padding: var(--dy-space-3) var(--dy-space-4);
	color: var(--dy-surface);
}

.dy-video-modal__title {
	margin: 0;
	font-family: var(--dy-font-head);
	font-size: 1rem;
	font-weight: 500;
	color: var(--dy-surface);
}

.dy-video-modal__close {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border: 1px solid var(--dy-line);
	border-radius: var(--dy-radius-pill);
	background: transparent;
	color: var(--dy-surface);
	font: inherit;
	cursor: pointer;
	transition: background-color var(--dy-motion-hover) var(--dy-motion-ease), color var(--dy-motion-hover) var(--dy-motion-ease);
}

.dy-video-modal__close:hover,
.dy-video-modal__close:focus-visible {
	background: var(--dy-sage);
	color: var(--dy-surface);
}

.dy-video-modal__player {
	aspect-ratio: 16 / 9;
	background: var(--dy-ink);
}

.dy-video-modal__player iframe,
.dy-video-modal__player video {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

.dy-video-modal__status[hidden] {
	display: none;
}

.dy-video-modal__status > [hidden] {
	display: none;
}

.dy-video-modal__status:not([hidden]) {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--dy-space-3);
	min-width: 0;
	padding: var(--dy-space-4) var(--dy-space-5);
	background: var(--dy-ink);
	color: var(--dy-ivory);
}

.dy-video-modal__status p {
	flex: 1 1 18rem;
	min-width: 0;
	margin: 0;
	font-family: var(--dy-font-body);
	font-size: 0.95rem;
	line-height: 1.5;
	overflow-wrap: anywhere;
}

.dy-video-modal__status .dy-btn {
	flex: 0 0 auto;
}

@media (prefers-reduced-motion: reduce) {
	.dy-video-card__play,
	.dy-video-modal__close {
		transition: none;
	}
}

/* ===== COVER (dy-cover) ===== */
body.dy-cover-on #wrapper {
	position: relative;
}

.dy-cover {
	position: absolute;
	inset: 0 0 auto 0;
	height: 100vh;
	display: none;
	background-image: linear-gradient(
		rgba(var(--dy-cover-overlay-rgb), var(--dy-cover-overlay-o)),
		rgba(var(--dy-cover-overlay-rgb), var(--dy-cover-overlay-o))
	), var(--dy-cover-img);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
	/* Altezza = viewport con attachment scroll: maschera e immagine nello stesso spazio (l'elemento). fixed sfalsa maschera/immagine allo scroll → bordi netti e residui. */
	pointer-events: none;
}

body.dy-cover-on:not(.dy-cover-full)
	:is(.dy-article-hero, .dy-single__head, .dy-page-header, .entry-hero, .entry-header) {
	background-color: transparent;
	background-image: linear-gradient(
		rgba(var(--dy-cover-overlay-rgb), var(--dy-cover-overlay-o)),
		rgba(var(--dy-cover-overlay-rgb), var(--dy-cover-overlay-o))
	), var(--dy-cover-img);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
}

/* .dy-single__head non ha padding proprio: banda verticale minima per la cover. */
body.dy-cover-on:not(.dy-cover-full) .dy-single__head {
	padding-block: var(--dy-space-5);
}

/* .entry-header dentro .entry-hero coperto: un solo ritaglio del bg (quello della sezione). */
body.dy-cover-on .entry-hero .entry-header {
	background: transparent !important;
}

/* Kadence parent: .entry-hero-container-inner ha bg opaco (--global-palette7) e copre la cover sotto entrambe le modalità. */
body.dy-cover-on .entry-hero-container-inner {
	background: transparent !important;
}

/* Full-page: le superfici strutturali diventano trasparenti, il layer .dy-cover fa da sfondo. */
body.dy-cover-full
	:is(
		.dy-article-hero,
		.dy-single__head,
		.dy-page-header,
		.entry-hero,
		.entry-header,
		.dy-section,
		.dy-section--alt,
		.content-bg
	) {
	background: transparent !important;
}

body.dy-cover-full .dy-cover {
	z-index: 0;
	display: block;
	-webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
	mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}

body.dy-cover-full #inner-wrap {
	position: relative;
	z-index: 1;
}

/* Footer sopra il layer: la maschera raggiunge opacità 0 in fondo, ma resta al di sopra del bg pagina. */
body.dy-cover-full #colophon {
	position: relative;
	z-index: 1;
}

/* single.php:46 renderizza la stessa featured image nel fig content; con cover attiva diventerebbe duplicato. */
body.dy-cover-on .dy-article__featured-image {
	display: none;
}
