/* Vacanze dei mestieri e «I nostri servizi» (kit vacanze-mestieri-8-10, CEO 8/10).
 * Si appoggia a tbp-carrello.css (stessi gettoni, schede, tabella, campi). Qui solo: foto d'apertura, racconto,
 * «Cosa facciamo» (3 voci) con le icone Lava, pillole degli interessi, sezioni della pagina dei servizi.
 * Niente bordi colorati di lato o in alto, niente gradienti, niente ombre grandi. */

/* ---------- Foto a tutta larghezza ---------- */
/* A tutta larghezza del contenitore della pagina (main#main, che taglia quello che esce: niente trucchi per uscirne). */
html body .tbp-vac-pagina figure.tbp-vac-foto { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
.tbp-vac-foto img {
	display: block;
	width: 100%;
	height: clamp(240px, 46vw, 560px);
	object-fit: cover;
	object-position: 50% 55%;
	background: #e4f1e8;
}
html body .tbp-vac-pagina .tbp-vac-foto__credito {
	box-sizing: border-box;
	max-width: 1208px;
	margin: 0 auto;
	padding: 8px 16px 0;
	font-size: 12px;
	line-height: 1.4;
	color: #4f6a5c;
	text-align: right;
}
@media (min-width: 850px) {
	html body .tbp-vac-pagina .tbp-vac-foto__credito { padding: 8px 24px 0; }
}
.tbp-vac-foto__credito a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* ---------- Testata ---------- */
html body #tbp-car p.tbp-vac__lingue { margin: 0 0 8px; font-size: 14px; line-height: 1.5; color: var(--car-tenue); }
.tbp-vac__lingue a { color: var(--car-verde); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Racconto ---------- */
.tbp-vac__racconto { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 0 0 56px; padding: 32px 0 0; border-top: 1px solid var(--car-linea); }
@media (min-width: 1024px) {
	.tbp-vac__racconto { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; }
}
html body #tbp-car .tbp-vac__racconto-testo p { margin: 0 0 12px; font-size: 17px; line-height: 1.6; max-width: 38em; }
html body #tbp-car .tbp-vac__racconto-testo p:last-child { margin-bottom: 0; }

/* ---------- Cosa facciamo ---------- */
.tbp-vac__fare { margin: 0 0 64px; }
html body #tbp-car ul.tbp-vac__fare-lista {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 640px) {
	html body #tbp-car ul.tbp-vac__fare-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
}
@media (min-width: 1100px) {
	html body #tbp-car ul.tbp-vac__fare-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
}
.tbp-vac__fare-lista li { margin: 0; }
html body #tbp-car img.tbp-vac__icona { display: block; width: 56px !important; height: 56px !important; max-width: none !important; margin: 0 0 8px; object-fit: contain; }
html body #tbp-car .tbp-vac__fare-lista h3 { margin: 0 0 4px; font-family: var(--tbp-font, inherit); font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--car-verde); }
html body #tbp-car .tbp-vac__fare-lista p { margin: 0; font-size: 15px; line-height: 1.5; }

/* ---------- Modulo ---------- */
html body #tbp-car .tbp-vac__cella { font-size: 13px; color: var(--car-testo); }
.tbp-vac__interessi,
.tbp-vac__scelta { grid-column: 1 / -1; }
html body #tbp-car .tbp-vac__aiuto-sopra { margin: -2px 0 8px; }
.tbp-vac__pillole input[type="checkbox"] { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.tbp-vac__pillole input[type="checkbox"]:checked + label { background: var(--car-marchio); border-color: var(--car-marchio); color: var(--car-su-marchio); }
.tbp-vac__pillole input[type="checkbox"]:focus-visible + label { outline: 3px solid var(--car-verde); outline-offset: 2px; }
.tbp-vac__scelta.is-errore .tbp-car__pillole label,
.tbp-vac__interessi.is-errore .tbp-car__pillole label { border-color: var(--car-errore); }
html body #tbp-car p.tbp-vac__spunta { display: flex; align-items: center; gap: 10px; align-self: end; min-height: 48px; }
html body #tbp-car form#tbp-car-modulo p.tbp-vac__spunta input[type="checkbox"] { display: inline-block; flex: 0 0 auto; width: 22px !important; min-height: 0; height: 22px; margin: 0; padding: 0; border-radius: 4px !important; background: none !important; box-shadow: none !important; accent-color: var(--car-marchio); appearance: auto !important; -webkit-appearance: checkbox !important; opacity: 1 !important; position: static !important; visibility: visible !important; clip: auto !important; }
html body #tbp-car p.tbp-vac__spunta label { margin: 0; font-weight: 600; }
html body #tbp-car p.tbp-vac__firma { margin: 16px 0 0; font-weight: 700; color: var(--car-verde); }
html body #tbp-car ul.tbp-vac__righe li { grid-template-columns: minmax(0, 1fr) auto; }

/* Pillola scelta: testo bianco anche dove il foglio generale colora le etichette. */
html body #tbp-car .tbp-car__pillole input:checked + label { background: var(--car-marchio); border-color: var(--car-marchio); color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; }
html body #tbp-car .tbp-vac__testa .tbp-car__oro { width: auto; }
@media (max-width: 639px) {
	html body #tbp-car .tbp-vac__testa .tbp-car__oro { width: 100%; }
}

/* Come funziona: quattro tappe. */
@media (min-width: 900px) {
	html body #tbp-car ol.tbp-vac__tappe { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---------- I nostri servizi ---------- */
.tbp-hub__testa { margin-bottom: 48px; }
.tbp-hub__sezione {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	margin: 0;
	padding: 40px 0;
	border-top: 1px solid var(--car-linea);
}
@media (min-width: 900px) {
	.tbp-hub__sezione { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: center; padding: 56px 0; }
	.tbp-hub__sezione--mastri .tbp-hub__visivo { order: 2; }
}
html body #tbp-car .tbp-hub__visivo { margin: 0; }
.tbp-hub__visivo--icona {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 220px;
	border-radius: 22px;
	background: var(--car-avorio);
}
.tbp-hub__sezione--mastri .tbp-hub__visivo--icona { background: var(--car-tinta); }
html body #tbp-car .tbp-hub__visivo--icona img { width: 160px !important; height: 160px !important; max-width: none !important; object-fit: contain; }
@media (min-width: 900px) {
	.tbp-hub__visivo--icona { min-height: 320px; }
	html body #tbp-car .tbp-hub__visivo--icona img { width: 200px !important; height: 200px !important; }
}
/* Foto in cornice tonda con l'icona Lava in un tondo crema nell'angolo (servizi-hub-foto-8-10), uguale per le tre sezioni. */
.tbp-hub__cornice { position: relative; border-radius: 22px; }
html body #tbp-car img.tbp-hub__foto { display: block; width: 100% !important; max-width: none !important; height: 260px !important; object-fit: cover; object-position: 50% 50%; border-radius: 22px; }
html body #tbp-car .tbp-hub__visivo--comuni img.tbp-hub__foto { object-position: 50% 30%; }
html body #tbp-car .tbp-hub__visivo--artigiani img.tbp-hub__foto { object-position: 40% 50%; }
html body #tbp-car .tbp-hub__distintivo {
	position: absolute;
	top: 14px;
	left: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 68px;
	height: 68px;
	border-radius: 50%;
	background: #fffaf0;
	box-shadow: 0 6px 18px rgba(16, 32, 24, 0.24), 0 1px 3px rgba(16, 32, 24, 0.14);
	pointer-events: none;
}
html body #tbp-car .tbp-hub__distintivo img { display: block; width: 74% !important; height: 74% !important; max-width: none !important; margin: 0 !important; object-fit: contain; border-radius: 0; }
@media (min-width: 900px) {
	html body #tbp-car img.tbp-hub__foto { height: 320px !important; }
	.tbp-hub__sezione--mastri { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }  /* foto a destra, stessa larghezza delle altre due */
	html body #tbp-car .tbp-hub__distintivo { top: 18px; left: 18px; width: 96px; height: 96px; }
}
@media (min-width: 1200px) {
	html body #tbp-car img.tbp-hub__foto { height: 360px !important; }
	html body #tbp-car .tbp-hub__distintivo { width: 104px; height: 104px; }
}
html body #tbp-car .tbp-hub__visivo--foto .tbp-vac-foto__credito { max-width: none; padding: 6px 0 0; font-size: 12px; color: var(--car-tenue); text-align: left; }
.tbp-hub__testo { min-width: 0; }
html body #tbp-car .tbp-hub__testo h2 a { color: inherit; text-decoration: none; }
html body #tbp-car .tbp-hub__testo h2 a:hover { text-decoration: underline; text-underline-offset: 4px; }
html body #tbp-car p.tbp-hub__racconto { margin: 8px 0 16px; font-size: 17px; line-height: 1.55; max-width: 38em; }
html body #tbp-car ul.tbp-hub__voci { max-width: 34em; margin: 0 0 8px; }
html body #tbp-car ul.tbp-hub__voci li { grid-template-columns: minmax(0, 1fr) auto; }
html body #tbp-car .tbp-hub__voci .tbp-car__riga-prezzo { font-family: var(--tbp-font-titoli, inherit); font-weight: 700; color: var(--car-verde); }
html body #tbp-car .tbp-hub__testo .tbp-car__azioni { margin-top: 16px; }
html body #tbp-car p.tbp-hub__contatti { margin: 8px 0 0; padding: 32px 0 0; border-top: 1px solid var(--car-linea); font-size: 16px; color: var(--car-tenue); }
