/**
 * single-trattamento — layout MVP 5 sezioni (Plan 6 §4).
 *
 * Caricato condizionalmente da inc/enqueue.php solo su is_singular('trattamento').
 *
 * @package lavventura
 */

@layer single {

.lv-single-trattamento {
	color: var(--color-text);
	background: var(--color-bg);
}

/* ============ Container helpers ============ */
.lv-single-trattamento__container-narrow {
	max-inline-size: var(--container-narrow);
	margin-inline: auto;
	padding-inline: var(--container-padding-inline);
}

/* ============ Eyebrow comune sezioni ============ */
.lv-single-trattamento__section-eyebrow {
	margin: 0 0 var(--space-m);
	font-family: var(--font-body);
	font-size: var(--font-size-caption);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-caps);
	text-transform: uppercase;
	color: var(--color-vino);
}

/* ============ S1: hero ============ */
.lv-single-trattamento__hero {
	background: var(--color-inchiostro-terra);
	color: var(--color-carta-calda);
	padding-block: var(--space-xl);
}

.lv-single-trattamento__hero > .lv-single-trattamento__container-narrow {
	display: flex;
	flex-direction: column;
	gap: var(--space-s);
	text-align: center;
}

.lv-single-trattamento__eyebrow {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--font-size-caption);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-caps);
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-carta-calda) 75%, transparent);
}

.lv-single-trattamento__title {
	margin: 0;
	font-family: var(--font-display);
	font-size: var(--font-size-display);
	font-weight: 500;
	line-height: var(--line-height-display);
	letter-spacing: var(--letter-spacing-display);
	text-wrap: balance;
	color: var(--color-carta-calda);
}

.lv-single-trattamento__lead {
	margin: 0 auto;
	font-family: var(--font-body);
	font-size: var(--font-size-lead);
	line-height: var(--line-height-body);
	color: color-mix(in srgb, var(--color-carta-calda) 88%, transparent);
	max-inline-size: 55ch;
	text-wrap: pretty;
}

/* ============ S2: dati ============ */
.lv-single-trattamento__dati {
	padding-block: var(--space-xl);
	background: var(--color-bg);
}

.lv-single-trattamento__dati-list {
	margin: 0;
	display: grid;
	grid-template-columns: 1fr;
	border-block-start: 1px solid var(--color-border);
}

.lv-single-trattamento__dati-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
	gap: var(--space-s);
	padding-block: var(--space-xs);
	border-block-end: 1px solid var(--color-border);
}

@media (max-width: 540px) {
	.lv-single-trattamento__dati-row {
		grid-template-columns: 1fr;
		gap: var(--space-3xs);
		padding-block: var(--space-s);
	}
}

.lv-single-trattamento__dati-label {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--font-size-small);
	font-weight: 600;
	color: var(--color-inchiostro-morbido);
}

.lv-single-trattamento__dati-value {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--font-size-body);
	color: var(--color-text);
}

/* ============ S3: immagine ============ */
.lv-single-trattamento__immagine {
	padding-block: var(--space-xl);
	background: color-mix(in srgb, var(--color-pietra) 35%, var(--color-bg));
}

.lv-single-trattamento__cover {
	display: block;
	inline-size: 100%;
	block-size: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: var(--radius-md);
}

/* ============ S4: content editor (the_content) ============ */
.lv-single-trattamento__content {
	padding-block: var(--space-xl);
	background: var(--color-bg);
}

.lv-single-trattamento__content-body {
	font-family: var(--font-body);
	font-size: var(--font-size-lead);
	line-height: var(--line-height-body);
	color: var(--color-text);
}

.lv-single-trattamento__content-body > * + * {
	margin-block-start: var(--space-s);
}

.lv-single-trattamento__content-body h2,
.lv-single-trattamento__content-body h3 {
	font-family: var(--font-display);
	font-weight: 500;
	line-height: var(--line-height-headings);
	letter-spacing: var(--letter-spacing-headings);
	color: var(--color-text);
	margin-block-start: var(--space-m);
}

.lv-single-trattamento__content-body h2 {
	font-size: var(--font-size-h2);
}

.lv-single-trattamento__content-body h3 {
	font-size: var(--font-size-h3);
}

.lv-single-trattamento__content-body a {
	color: var(--color-link);
	text-decoration: underline;
	text-underline-offset: 0.2em;
	transition: color var(--transition-base);
}

@media (prefers-reduced-motion: no-preference) {
	.lv-single-trattamento__content-body a:hover,
	.lv-single-trattamento__content-body a:focus-visible {
		color: var(--color-link-hover);
	}
}

/* ============ S5: cta prenotazione ============ */
.lv-single-trattamento__cta {
	padding-block: var(--space-xl);
	background: var(--color-vino);
	color: var(--color-carta-calda);
}

.lv-single-trattamento__cta-inner {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-s);
}

.lv-single-trattamento__cta-eyebrow {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--font-size-caption);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-caps);
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-carta-calda) 75%, transparent);
}

.lv-single-trattamento__cta-button {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2xs);
	background: var(--color-carta-calda);
	color: var(--color-vino);
	font-family: var(--font-body);
	font-size: var(--font-size-lead);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-ui);
	text-decoration: none;
	padding: var(--space-s) var(--space-l);
	border-radius: var(--radius-sm);
	transition: background var(--transition-base), color var(--transition-base), transform var(--transition-base);
}

@media (prefers-reduced-motion: no-preference) {
	.lv-single-trattamento__cta-button:hover,
	.lv-single-trattamento__cta-button:focus-visible {
		background: var(--color-terracotta);
		color: var(--color-carta-calda);
		transform: translateY(-1px);
	}
}

.lv-single-trattamento__cta-caption {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--font-size-small);
	color: color-mix(in srgb, var(--color-carta-calda) 75%, transparent);
}

} /* @layer single */
