/* =========================================================================
   Top Service - foglio di stile del tema
   -------------------------------------------------------------------------
   1.  Font e variabili
   2.  Reset e basi
   3.  Utilita e accessibilita
   4.  Bottoni
   5.  Barra contatti superiore, header, menu
   6.  Hero
   7.  Sezioni, griglie, schede
   8.  Numeri, referenze, team
   9.  Pagine interne, prose (contenuto editor)
   10. Contatti, mappa, moduli (Contact Form 7)
   11. CTA, footer, barra mobile, torna su
   12. Elenchi articoli, ricerca, 404, paginazione
   13. Animazioni e preferenze di movimento
   14. Versione scura (biglietti da visita)
   ========================================================================= */

/* ---------- 1. Font e variabili ----------------------------------------- */

@font-face {
	font-family: 'InterVar';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url('../fonts/inter-latin-wght-normal.woff2') format('woff2-variations');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
		U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'InterVar';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url('../fonts/inter-latin-ext-wght-normal.woff2') format('woff2-variations');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
		U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0,
		U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
	/* Colori */
	--ts-brand:        #0B5CA8;
	--ts-brand-600:    #0A5296;
	--ts-brand-700:    #08447C;
	--ts-brand-900:    #062C50;
	--ts-accent:       #17A9E0;
	--ts-accent-soft:  #E7F4FC;

	--ts-ink:          #0C1B2A;
	--ts-body:         #3A4B5C;
	--ts-muted:        #64788C;
	--ts-line:         #E2EAF2;
	--ts-line-strong:  #CBD8E6;
	--ts-surface:      #F4F8FC;
	--ts-surface-2:    #EAF1F8;
	--ts-white:        #FFFFFF;

	/* Superfici: cambiano nella versione scura del tema */
	--ts-page-bg:      #FFFFFF;
	--ts-card-bg:      #FFFFFF;
	--ts-side-bg:      #FFFFFF;
	--ts-field-bg:     #FFFFFF;
	--ts-bar-bg:       rgb(255 255 255 / 94%);
	--ts-logo-tile:    #FFFFFF;   /* i loghi dei clienti restano su bianco */
	--ts-line-hover:   #BFDCF2;
	--ts-accent-line:  #C7E5F7;
	--ts-footer-bg:    #0C1B2A;
	--ts-footer-text:  rgb(255 255 255 / 72%);

	--ts-ok:           #15803D;
	--ts-err:          #B42318;

	/* Gradienti */
	--ts-grad:        linear-gradient(135deg, #17A9E0 0%, #0B5CA8 100%);
	--ts-grad-dark:   linear-gradient(140deg, #0B5CA8 0%, #062C50 100%);

	/* Tipografia */
	--ts-font: 'InterVar', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto,
		'Helvetica Neue', Arial, 'Noto Sans', sans-serif;

	--ts-fs-xs:   0.8125rem;
	--ts-fs-sm:   0.9375rem;
	--ts-fs-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
	--ts-fs-lg:   clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
	--ts-fs-h4:   clamp(1.0625rem, 1rem + 0.4vw, 1.25rem);
	--ts-fs-h3:   clamp(1.1875rem, 1.08rem + 0.55vw, 1.5rem);
	--ts-fs-h2:   clamp(1.5rem, 1.24rem + 1.25vw, 2.375rem);
	--ts-fs-h1:   clamp(1.875rem, 1.45rem + 2.1vw, 3.25rem);
	--ts-fs-hero: clamp(2rem, 1.4rem + 2.9vw, 3.75rem);

	/* Spazi */
	--ts-gap:      clamp(1.25rem, 0.9rem + 1.4vw, 2rem);
	--ts-section:  clamp(3.5rem, 2.4rem + 4.4vw, 7rem);
	--ts-container: 1200px;
	--ts-pad:      clamp(1.15rem, 0.6rem + 2.4vw, 2.5rem);

	/* Forme */
	--ts-r-sm: 8px;
	--ts-r:    14px;
	--ts-r-lg: 20px;
	--ts-r-xl: 28px;

	--ts-shadow-sm: 0 1px 2px rgb(12 27 42 / 6%), 0 1px 3px rgb(12 27 42 / 4%);
	--ts-shadow:    0 4px 16px rgb(12 27 42 / 7%), 0 1px 3px rgb(12 27 42 / 5%);
	--ts-shadow-lg: 0 18px 42px rgb(12 27 42 / 12%), 0 4px 12px rgb(12 27 42 / 6%);

	--ts-header-h: 68px;
	--ts-side-w: 268px;

	--ts-ease: cubic-bezier(0.22, 0.68, 0.35, 1);
}

/* ---------- 2. Reset e basi --------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

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

body {
	margin: 0;
	font-family: var(--ts-font);
	font-size: var(--ts-fs-base);
	line-height: 1.65;
	color: var(--ts-body);
	background: var(--ts-page-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-wrap: break-word;
	/* Rete di sicurezza: se un elemento sborda a destra viene tagliato invece
	   di far scorrere la pagina in orizzontale. "clip" e non "hidden" perche'
	   hidden creerebbe un contenitore di scorrimento e romperebbe gli elementi
	   appiccicati in alto (position: sticky). */
	overflow-x: clip;
}

body.ts-nav-open { overflow: hidden; }

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

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 0.5em;
	color: var(--ts-ink);
	font-weight: 700;
	line-height: 1.18;
	letter-spacing: -0.018em;
	text-wrap: balance;
}
h1 { font-size: var(--ts-fs-h1); }
h2 { font-size: var(--ts-fs-h2); }
h3 { font-size: var(--ts-fs-h3); }
h4 { font-size: var(--ts-fs-h4); }

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

a {
	color: var(--ts-brand);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	transition: color 0.18s var(--ts-ease);
}
a:hover { color: var(--ts-accent); }

ul, ol { padding-inline-start: 1.3em; }

strong, b { font-weight: 650; color: var(--ts-ink); }

hr {
	border: 0;
	border-top: 1px solid var(--ts-line);
	margin: 2.5rem 0;
}

:focus-visible {
	outline: 3px solid var(--ts-accent);
	outline-offset: 2px;
	border-radius: 4px;
}

::selection { background: var(--ts-accent); color: #fff; }

/* ---------- 3. Utilita e accessibilita ---------------------------------- */

.ts-container {
	width: min(100% - (var(--ts-pad) * 2), var(--ts-container));
	margin-inline: auto;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.ts-skip {
	position: absolute;
	left: 50%;
	transform: translate(-50%, -140%);
	z-index: 200;
	background: var(--ts-brand);
	color: #fff;
	padding: 0.7rem 1.2rem;
	border-radius: 0 0 var(--ts-r) var(--ts-r);
	font-weight: 600;
	text-decoration: none;
	transition: transform 0.2s var(--ts-ease);
}
.ts-skip:focus { transform: translate(-50%, 0); color: #fff; }

.ts-icon { flex: none; }

.ts-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	margin: 0 0 0.75rem;
	font-size: var(--ts-fs-sm);
	font-weight: 650;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--ts-brand);
}
.ts-eyebrow span {
	width: 26px; height: 2px;
	background: currentColor;
	border-radius: 2px;
	display: inline-block;
}
.ts-eyebrow--light { color: #9BD5F2; }

/* ---------- 4. Bottoni --------------------------------------------------- */

.ts-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;
	padding: 0.78rem 1.35rem;
	border: 1px solid transparent;
	border-radius: 999px;
	font: inherit;
	font-weight: 620;
	font-size: var(--ts-fs-sm);
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
	transition: transform 0.16s var(--ts-ease), box-shadow 0.2s var(--ts-ease),
		background-color 0.2s var(--ts-ease), color 0.2s var(--ts-ease), border-color 0.2s var(--ts-ease);
}
.ts-btn:active { transform: translateY(1px); }
.ts-btn .ts-icon { transition: transform 0.2s var(--ts-ease); }
.ts-btn:hover .ts-icon { transform: translateX(3px); }

.ts-btn--primary {
	background: var(--ts-brand);
	color: #fff;
	box-shadow: 0 6px 18px rgb(11 92 168 / 26%);
}
.ts-btn--primary:hover { background: var(--ts-brand-700); color: #fff; box-shadow: 0 10px 26px rgb(11 92 168 / 32%); }

.ts-btn--white { background: #fff; color: var(--ts-brand); box-shadow: 0 6px 20px rgb(6 44 80 / 22%); }
.ts-btn--white:hover { background: #fff; color: var(--ts-brand-700); }

.ts-btn--ghost {
	background: transparent;
	color: var(--ts-brand);
	border-color: var(--ts-line-strong);
}
.ts-btn--ghost:hover { border-color: var(--ts-brand); background: var(--ts-accent-soft); color: var(--ts-brand-700); }

.ts-btn--ghost-light {
	background: rgb(255 255 255 / 10%);
	color: #fff;
	border-color: rgb(255 255 255 / 45%);
	backdrop-filter: blur(4px);
}
.ts-btn--ghost-light:hover { background: rgb(255 255 255 / 20%); color: #fff; border-color: #fff; }

.ts-btn--lg { padding: 0.95rem 1.7rem; font-size: var(--ts-fs-base); }
.ts-btn--sm { padding: 0.6rem 1.05rem; font-size: var(--ts-fs-xs); }
.ts-btn--block { display: flex; width: 100%; }
/* ---------- 5. Banda laterale, barra mobile, menu ------------------------ */

/*
 * Su schermi larghi la navigazione sta in una banda verticale fissa a sinistra,
 * come nella versione precedente del sito. Il contenuto scorre alla sua destra.
 * Sotto i 1100 px la banda diventa un pannello a scomparsa e in alto compare
 * una barra compatta con logo e pulsante.
 */

.ts-side {
	position: fixed;
	inset: 0 auto 0 0;
	z-index: 110;
	width: var(--ts-side-w);
	background: var(--ts-side-bg);
	border-right: 1px solid var(--ts-line);
	overflow-y: auto;
	overscroll-behavior: contain;
	/* La banda resta scorrevole (serve sugli schermi bassi) ma senza la barra
	   grigia a vista, che sporcherebbe il bordo del menu. */
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.ts-side::-webkit-scrollbar { width: 0; height: 0; }
.ts-side__inner {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	min-height: 100%;
	padding: 1.9rem 1.4rem 1.6rem;
}

.ts-side__brand { text-align: center; }
.ts-side__brand .ts-logo img,
.ts-side__brand .custom-logo-link img {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 62px;
	margin-inline: auto;
}
.ts-side__claim {
	margin: 0.7rem 0 0;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ts-muted);
	line-height: 1.45;
}

.ts-side .ts-nav { flex: 1; }

.ts-nav__list {
	display: flex;
	flex-direction: column;
	gap: 0.12rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ts-nav__list li { position: relative; }
.ts-nav__list a {
	display: block;
	padding: 0.62rem 0.9rem;
	border-radius: var(--ts-r-sm);
	color: var(--ts-ink);
	font-weight: 560;
	font-size: var(--ts-fs-sm);
	text-decoration: none;
	transition: color 0.18s var(--ts-ease), background-color 0.18s var(--ts-ease);
}
.ts-nav__list a::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 3px;
	height: 0;
	background: var(--ts-accent);
	border-radius: 3px;
	transform: translateY(-50%);
	transition: height 0.22s var(--ts-ease);
}
.ts-nav__list a:hover { color: var(--ts-brand); background: var(--ts-surface); }

.ts-nav__list .current-menu-item > a,
.ts-nav__list .current_page_item > a,
.ts-nav__list .current-menu-ancestor > a,
.ts-nav__list .current_page_parent > a,
.ts-nav__list .is-current > a {
	color: var(--ts-brand);
	background: var(--ts-accent-soft);
}
.ts-nav__list .current-menu-item > a::before,
.ts-nav__list .current_page_item > a::before,
.ts-nav__list .is-current > a::before { height: 60%; }

/* sottomenu: in colonna, rientrati */
.ts-nav__list .sub-menu {
	margin: 0.15rem 0 0.35rem 0.9rem;
	padding: 0 0 0 0.7rem;
	list-style: none;
	border-left: 2px solid var(--ts-line);
}
.ts-nav__list .sub-menu a { padding: 0.45rem 0.7rem; font-size: var(--ts-fs-xs); }

/* Un po' più compatto: con sette voci di menu la banda deve stare in piedi
   anche su schermi bassi, senza dover scorrere. */
.ts-side__foot { display: grid; gap: 0.9rem; }
.ts-side__contacts {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.65rem;
	font-size: var(--ts-fs-xs);
	color: var(--ts-muted);
}
.ts-side__contacts li { display: flex; gap: 0.55rem; align-items: flex-start; line-height: 1.45; }
.ts-side__contacts .ts-icon { margin-top: 0.15em; color: var(--ts-brand); flex: none; }
.ts-side__contacts a { color: var(--ts-body); text-decoration: none; font-weight: 550; }
.ts-side__contacts a:hover { color: var(--ts-brand); text-decoration: underline; }

/*
 * Selettore con la banda davanti, non il solo `.ts-social--side`: la regola
 * generica del footer (`.ts-social a`, colore bianco) sta piu in basso nel file
 * e a pari specificita vincerebbe, lasciando icone bianche su fondo bianco.
 */
.ts-side .ts-social { justify-content: flex-start; }
.ts-side .ts-social a {
	width: 34px; height: 34px;
	background: var(--ts-surface);
	color: var(--ts-brand);
}
.ts-side .ts-social a:hover { background: var(--ts-brand); color: #fff; }

/* Barra compatta: esiste solo sotto i 1100 px */
.ts-topbar-m { display: none; }

.ts-burger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px; height: 46px;
	padding: 0;
	background: var(--ts-surface);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-sm);
	cursor: pointer;
	color: var(--ts-ink);
}
.ts-burger__box { display: grid; gap: 5px; width: 20px; }
.ts-burger__box span {
	display: block;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
	transition: transform 0.25s var(--ts-ease), opacity 0.2s var(--ts-ease);
}
.ts-burger[aria-expanded='true'] .ts-burger__box span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.ts-burger[aria-expanded='true'] .ts-burger__box span:nth-child(2) { opacity: 0; }
.ts-burger[aria-expanded='true'] .ts-burger__box span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* --- da 1100 px in su: banda fissa, contenuto spostato a destra --- */
@media (min-width: 1100px) {
	.ts-shell { margin-left: var(--ts-side-w); }
	.ts-side { transform: none !important; visibility: visible !important; }
	/* niente barra fissa in alto: le ancore non hanno bisogno di scostamento */
	html { scroll-padding-top: 24px; }
	.ts-contact__aside,
	.ts-servizio__aside { top: 24px; }
}

/* --- sotto i 1100 px: barra in alto + pannello a scomparsa --- */
@media (max-width: 1099px) {
	.ts-topbar-m {
		display: block;
		position: sticky;
		top: 0;
		z-index: 120;
		background: var(--ts-bar-bg);
		backdrop-filter: saturate(160%) blur(10px);
		border-bottom: 1px solid var(--ts-line);
	}
	.ts-topbar-m__inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
		min-height: var(--ts-header-h);
		width: min(100% - (var(--ts-pad) * 2), var(--ts-container));
		margin-inline: auto;
	}
	.ts-topbar-m .ts-logo img,
	.ts-topbar-m .custom-logo-link img { width: auto; height: clamp(32px, 4.4vw, 40px); }

	.ts-side {
		width: min(86vw, 340px);
		border-right: 0;
		border-left: 1px solid var(--ts-line);
		inset: 0 0 0 auto;
		box-shadow: -20px 0 50px rgb(12 27 42 / 14%);
		transform: translateX(100%);
		visibility: hidden;
		transition: transform 0.32s var(--ts-ease), visibility 0.32s;
	}
	.ts-side.is-open { transform: translateX(0); visibility: visible; }
	.ts-side__inner { padding-top: 1.5rem; }
	.ts-side__brand { text-align: left; }
	.ts-side__brand .ts-logo img,
	.ts-side__brand .custom-logo-link img { margin-inline: 0; }
	.ts-nav__list a { padding: 0.8rem 0.9rem; font-size: 1.0625rem; }

	.ts-backdrop {
		position: fixed;
		inset: 0;
		background: rgb(6 44 80 / 45%);
		backdrop-filter: blur(2px);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.3s var(--ts-ease), visibility 0.3s;
		z-index: 105;
	}
	.ts-backdrop.is-open { opacity: 1; visibility: visible; }
}

/* ---------- 6. Hero ------------------------------------------------------ */

.ts-hero {
	position: relative;
	padding-block: clamp(2.75rem, 2rem + 3.5vw, 4.5rem);
	background: var(--ts-grad-dark);
	overflow: hidden;
	isolation: isolate;
}
/* Trama geometrica leggera, disegnata in CSS: nessuna immagine da scaricare. */
.ts-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(70% 100% at 88% 8%, rgb(23 169 224 / 34%) 0%, transparent 62%),
		radial-gradient(60% 90% at 4% 96%, rgb(23 169 224 / 20%) 0%, transparent 58%),
		repeating-linear-gradient(135deg, rgb(255 255 255 / 3.5%) 0 2px, transparent 2px 26px);
}
.ts-hero__inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 620px);
	align-items: center;
	gap: clamp(1.5rem, 1rem + 2vw, 3rem);
}
.ts-hero__content { color: #fff; max-width: 34rem; }

.ts-hero__figure {
	margin: 0;
	align-self: end;
	justify-self: end;
}
.ts-hero__figure img {
	width: 100%;
	max-width: 620px;
	height: auto;
	filter: drop-shadow(0 26px 45px rgb(3 22 42 / 45%));
}

@media (max-width: 980px) {
	.ts-hero__inner { grid-template-columns: 1fr; }
	.ts-hero__content { max-width: none; }
	.ts-hero__figure { justify-self: center; }
	.ts-hero__figure img { max-width: min(100%, 460px); }
}

.ts-hero__title {
	margin: 0 0 1rem;
	font-size: var(--ts-fs-hero);
	line-height: 1.08;
	letter-spacing: -0.028em;
	color: #fff;
}
.ts-hero__sub {
	margin: 0 0 1.9rem;
	font-size: var(--ts-fs-lg);
	line-height: 1.6;
	color: rgb(255 255 255 / 90%);
	max-width: 36rem;
	text-wrap: pretty;
}
.ts-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-bottom: 2.2rem;
}
.ts-hero__points {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem 1.6rem;
	margin: 0; padding: 0;
	list-style: none;
	font-size: var(--ts-fs-sm);
	color: rgb(255 255 255 / 88%);
}
.ts-hero__points li { display: inline-flex; align-items: center; gap: 0.5rem; }
.ts-hero__points .ts-icon { color: #6FD0F5; }

/* ---------- 7. Sezioni, griglie, schede --------------------------------- */

.ts-section { padding-block: var(--ts-section); }
.ts-section--tight { padding-block: clamp(2.5rem, 1.8rem + 3vw, 4.5rem) 0; }
.ts-section--alt { background: var(--ts-surface); }
.ts-section--editor { padding-top: 0; }

.ts-sectionhead {
	max-width: 46rem;
	margin: 0 auto clamp(2rem, 1.4rem + 2.4vw, 3.5rem);
	text-align: center;
}
.ts-sectionhead__title { margin: 0 0 0.6rem; }
.ts-sectionhead__text {
	margin: 0;
	font-size: var(--ts-fs-lg);
	color: var(--ts-muted);
	text-wrap: pretty;
}

/* Sezione della home costruita da una pagina: testo e foto affiancati */
.ts-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.75rem, 1.2rem + 2.6vw, 3.5rem);
	align-items: center;
}
.ts-split--solo { grid-template-columns: minmax(0, 1fr); max-width: 52rem; margin-inline: auto; }
.ts-split--invertito .ts-split__media { order: -1; }

.ts-split__media {
	margin: 0;
	border-radius: var(--ts-r-lg);
	overflow: hidden;
	box-shadow: var(--ts-shadow-lg);
}
.ts-split__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.ts-split__title { margin: 0 0 0.9rem; font-size: var(--ts-fs-h2); }
.ts-split__body .ts-prose { max-width: none; font-size: var(--ts-fs-base); }
.ts-split__body .ts-prose > *:first-child { margin-top: 0; }
/* dentro una sezione il titolo della pagina è gia un h2: i titoli del testo
   scendono di un gradino visivo per non fare concorrenza */
.ts-split__body .ts-prose h2 { font-size: var(--ts-fs-h3); margin-top: 1.9em; }
.ts-split__body .ts-prose h3 { font-size: var(--ts-fs-h4); }
.ts-split__more { margin-top: 1.6rem; }

@media (max-width: 860px) {
	.ts-split { grid-template-columns: 1fr; }
	.ts-split--invertito .ts-split__media { order: 0; }
}

.ts-grid { display: grid; gap: var(--ts-gap); }
.ts-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.ts-grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); }
.ts-grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }

.ts-card {
	display: flex;
	flex-direction: column;
	padding: clamp(1.4rem, 1.1rem + 1vw, 2rem);
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-lg);
	box-shadow: var(--ts-shadow-sm);
	transition: transform 0.28s var(--ts-ease), box-shadow 0.28s var(--ts-ease), border-color 0.28s var(--ts-ease);
}
.ts-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--ts-shadow-lg);
	border-color: var(--ts-line-hover);
}
.ts-card__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px; height: 56px;
	margin-bottom: 1.1rem;
	background: var(--ts-accent-soft);
	color: var(--ts-brand);
	border-radius: var(--ts-r);
}
.ts-card__title { margin: 0 0 0.55rem; font-size: var(--ts-fs-h3); }
.ts-card__title a { color: inherit; text-decoration: none; }
.ts-card__title a:hover { color: var(--ts-brand); }
.ts-card__text { margin: 0 0 1rem; color: var(--ts-muted); text-wrap: pretty; }

.ts-card__list {
	margin: 0 0 1.3rem;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.5rem;
	font-size: var(--ts-fs-sm);
}
.ts-card__list li { display: flex; gap: 0.55rem; align-items: flex-start; }
.ts-card__list .ts-icon { margin-top: 0.28em; color: var(--ts-accent); }

.ts-card__more {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-weight: 620;
	font-size: var(--ts-fs-sm);
	text-decoration: none;
	color: var(--ts-brand);
}
.ts-card__more .ts-icon { transition: transform 0.2s var(--ts-ease); }
.ts-card__more:hover .ts-icon { transform: translateX(4px); }

.ts-checklist {
	margin: 0; padding: 0;
	list-style: none;
	display: grid;
	gap: 0.7rem;
}
.ts-checklist li { display: flex; gap: 0.6rem; align-items: flex-start; }
.ts-checklist .ts-icon { margin-top: 0.3em; color: var(--ts-accent); }

/* ---------- 8. Numeri, referenze, team ---------------------------------- */

.ts-stats {
	padding-block: clamp(2.4rem, 1.8rem + 2.6vw, 4rem);
	background: var(--ts-grad-dark);
	color: #fff;
}
.ts-stats__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
	gap: var(--ts-gap);
	margin: 0;
	text-align: center;
}
.ts-stats__item { padding: 0.5rem; }
.ts-stats__num {
	font-size: clamp(1.9rem, 1.4rem + 2.2vw, 3rem);
	font-weight: 750;
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: #fff;
	background: linear-gradient(180deg, #fff 30%, #A7DBF5 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.ts-stats__label {
	margin: 0.35rem 0 0;
	font-size: var(--ts-fs-sm);
	color: rgb(255 255 255 / 78%);
}

.ts-logos {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 232px), 1fr));
	gap: 1rem;
}
.ts-logos__item {
	display: flex;
	align-items: center;
	justify-content: center;
	/* i file hanno già un margine interno: qui basta un filo d'aria */
	padding: 0.35rem;
	background: var(--ts-logo-tile);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r);
	transition: transform 0.25s var(--ts-ease), box-shadow 0.25s var(--ts-ease), border-color 0.25s var(--ts-ease);
}
.ts-logos__item:hover { transform: translateY(-3px); box-shadow: var(--ts-shadow); border-color: var(--ts-line-hover); }
.ts-logos__item img { width: 100%; height: auto; border-radius: var(--ts-r-sm); }

.ts-marquee {
	position: relative;
	overflow: hidden;
	padding-block: 0.5rem;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
.ts-marquee__track {
	display: flex;
	width: max-content;
	gap: 1rem;
	animation: ts-marquee 55s linear infinite;
}
.ts-marquee:hover .ts-marquee__track,
.ts-marquee:focus-within .ts-marquee__track { animation-play-state: paused; }
.ts-marquee__item {
	flex: 0 0 auto;
	width: 205px;
	padding: 0.35rem;
	background: var(--ts-logo-tile);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r);
}
.ts-marquee__item img { width: 100%; height: auto; border-radius: var(--ts-r-sm); }
@keyframes ts-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

.ts-person {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: clamp(1.4rem, 1.1rem + 1vw, 2rem);
	text-align: center;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-lg);
	box-shadow: var(--ts-shadow-sm);
	transition: transform 0.28s var(--ts-ease), box-shadow 0.28s var(--ts-ease);
}
.ts-person:hover { transform: translateY(-4px); box-shadow: var(--ts-shadow-lg); }
.ts-person__photo {
	width: 132px; height: 132px;
	margin-bottom: 1.1rem;
	border-radius: 50%;
	overflow: hidden;
	background: var(--ts-grad);
	display: grid;
	place-items: center;
	box-shadow: 0 0 0 5px var(--ts-white), 0 0 0 7px var(--ts-accent-soft);
}
.ts-person__photo img { width: 100%; height: 100%; object-fit: cover; }
.ts-person__initials { font-size: 2.4rem; font-weight: 700; color: #fff; }
.ts-person__name { margin: 0 0 0.15rem; font-size: var(--ts-fs-h4); }
.ts-person__role {
	margin: 0 0 0.7rem;
	font-size: var(--ts-fs-sm);
	font-weight: 620;
	color: var(--ts-brand);
	letter-spacing: 0.02em;
}
.ts-person__bio { margin: 0; color: var(--ts-muted); font-size: var(--ts-fs-sm); }
.ts-person__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px; height: 38px;
	margin-top: 0.9rem;
	border-radius: 50%;
	background: var(--ts-surface);
	color: var(--ts-brand);
}
.ts-person__link:hover { background: var(--ts-brand); color: #fff; }

/* ---------- 9. Pagine interne e contenuto editor ------------------------ */

.ts-pagehead {
	position: relative;
	padding-block: clamp(2.2rem, 1.6rem + 2.6vw, 3.8rem) clamp(1.8rem, 1.4rem + 2vw, 3rem);
	background: var(--ts-surface);
	border-bottom: 1px solid var(--ts-line);
}
.ts-pagehead::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(70% 120% at 88% 0%, rgb(23 169 224 / 10%) 0%, transparent 62%);
	pointer-events: none;
}
.ts-pagehead > * { position: relative; }
.ts-pagehead__title { margin: 0; max-width: 22ch; }
.ts-pagehead__sub {
	margin: 0.7rem 0 0;
	max-width: 46rem;
	font-size: var(--ts-fs-lg);
	color: var(--ts-muted);
	text-wrap: pretty;
}
.ts-pagehead__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px; height: 60px;
	margin-bottom: 0.9rem;
	background: var(--ts-card-bg);
	color: var(--ts-brand);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r);
}

.ts-breadcrumb { margin-bottom: 0.9rem; font-size: var(--ts-fs-xs); }
.ts-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
	margin: 0; padding: 0;
	list-style: none;
	color: var(--ts-muted);
}
.ts-breadcrumb li + li::before {
	content: '/';
	margin-right: 0.4rem;
	color: var(--ts-line-strong);
}
.ts-breadcrumb a { color: var(--ts-muted); text-decoration: none; }
.ts-breadcrumb a:hover { color: var(--ts-brand); text-decoration: underline; }

.ts-featured {
	margin: 0 0 2rem;
	border-radius: var(--ts-r-lg);
	overflow: hidden;
	box-shadow: var(--ts-shadow);
}
.ts-featured img { width: 100%; }
.ts-featured--wide { margin-top: 2.5rem; }

/* Frase di apertura di una pagina */
.ts-lead {
	font-size: var(--ts-fs-h4);
	line-height: 1.5;
	color: var(--ts-brand);
}

/* Con due sole persone il blocco team resta centrato e non si allarga troppo */
.ts-team { max-width: 940px; margin-inline: auto; }

.ts-meta { color: var(--ts-muted); font-size: var(--ts-fs-sm); margin-bottom: 1.5rem; }

/* contenuto scritto nell'editor */
.ts-prose {
	max-width: 46rem;
	font-size: var(--ts-fs-lg);
	line-height: 1.75;
}
/* Il blocco largo (home, sezioni libere) resta centrato nel contenitore. */
.ts-prose--wide { max-width: 62rem; margin-inline: auto; }
.ts-prose > *:first-child { margin-top: 0; }
.ts-prose > *:last-child { margin-bottom: 0; }
.ts-prose h2 { margin-top: 2.2em; font-size: var(--ts-fs-h2); }
.ts-prose h3 { margin-top: 1.9em; font-size: var(--ts-fs-h3); }
.ts-prose h4 { margin-top: 1.7em; }
.ts-prose ul, .ts-prose ol { margin: 0 0 1.3em; padding-inline-start: 1.35em; }
.ts-prose li { margin-bottom: 0.5em; }
.ts-prose li::marker { color: var(--ts-accent); font-weight: 700; }
.ts-prose img, .ts-prose figure img { border-radius: var(--ts-r); }
.ts-prose figure { margin: 2rem 0; }
.ts-prose figcaption { margin-top: 0.6rem; font-size: var(--ts-fs-sm); color: var(--ts-muted); text-align: center; }
.ts-prose blockquote {
	margin: 2rem 0;
	padding: 1.2rem 1.5rem;
	border-left: 4px solid var(--ts-accent);
	background: var(--ts-surface);
	border-radius: 0 var(--ts-r) var(--ts-r) 0;
	font-size: var(--ts-fs-lg);
	color: var(--ts-ink);
}
.ts-prose blockquote p:last-child { margin-bottom: 0; }
.ts-prose table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--ts-fs-sm);
	margin: 1.8rem 0;
}
.ts-prose th, .ts-prose td { padding: 0.7rem 0.9rem; border: 1px solid var(--ts-line); text-align: left; }
.ts-prose thead th { background: var(--ts-surface); color: var(--ts-ink); }
.ts-prose .wp-block-table { overflow-x: auto; }
.ts-prose code {
	padding: 0.15em 0.4em;
	background: var(--ts-surface-2);
	border-radius: 5px;
	font-size: 0.9em;
}
.ts-prose .alignwide { width: min(100%, 62rem); margin-inline: auto; }
.ts-prose .alignfull { width: 100vw; margin-inline: calc(50% - 50vw); max-width: none; }

/* pattern del tema */
.ts-features { gap: var(--ts-gap) !important; margin-block: 2.2rem; }
.ts-features .wp-block-column {
	padding: 1.5rem;
	background: var(--ts-surface);
	border-radius: var(--ts-r-lg);
	border: 1px solid var(--ts-line);
}
.ts-features h3 { margin-top: 0; font-size: var(--ts-fs-h4); }
.ts-features p { margin-bottom: 0; font-size: var(--ts-fs-base); color: var(--ts-muted); }

.ts-steps { margin-block: 2.5rem; }
.ts-steps__list { counter-reset: step; list-style: none; padding: 0; display: grid; gap: 1rem; }
.ts-steps__list li {
	counter-increment: step;
	position: relative;
	padding: 1.15rem 1.3rem 1.15rem 3.8rem;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r);
	font-size: var(--ts-fs-base);
}
.ts-steps__list li::before {
	content: counter(step);
	position: absolute;
	left: 1.1rem; top: 1.05rem;
	display: grid;
	place-items: center;
	width: 34px; height: 34px;
	background: var(--ts-grad);
	color: #fff;
	font-weight: 700;
	font-size: 0.95rem;
	border-radius: 50%;
}

.ts-callout {
	margin-block: 2.2rem;
	padding: 1.4rem 1.6rem;
	background: var(--ts-accent-soft);
	border: 1px solid var(--ts-accent-line);
	border-left: 4px solid var(--ts-accent);
	border-radius: var(--ts-r);
	font-size: var(--ts-fs-base);
}

.ts-faq { margin-block: 2.5rem; }
.ts-faq .wp-block-details {
	padding: 1rem 1.2rem;
	margin-bottom: 0.7rem;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r);
}
.ts-faq summary {
	cursor: pointer;
	font-weight: 640;
	color: var(--ts-ink);
	font-size: var(--ts-fs-base);
	list-style-position: outside;
}
.ts-faq summary::marker { color: var(--ts-accent); }
.ts-faq .wp-block-details[open] { border-color: var(--ts-line-hover); box-shadow: var(--ts-shadow-sm); }
.ts-faq .wp-block-details p { margin-top: 0.8rem; font-size: var(--ts-fs-base); color: var(--ts-muted); }

/* ---------- 10. Contatti, mappa, moduli --------------------------------- */

.ts-contact {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 1rem + 2.5vw, 3.5rem);
	align-items: start;
}
@media (max-width: 900px) {
	.ts-contact { grid-template-columns: 1fr; }
}
.ts-contact__title { margin: 0 0 0.4rem; font-size: var(--ts-fs-h2); }
.ts-contact__lead { margin: 0 0 1.8rem; color: var(--ts-muted); font-size: var(--ts-fs-lg); }
.ts-contact__aside { display: grid; gap: var(--ts-gap); position: sticky; top: calc(var(--ts-header-h) + 20px); }
@media (max-width: 900px) { .ts-contact__aside { position: static; } }

.ts-infobox {
	padding: clamp(1.3rem, 1rem + 1vw, 1.9rem);
	background: var(--ts-surface);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-lg);
}
.ts-infobox--accent { background: var(--ts-accent-soft); border-color: var(--ts-accent-line); }
.ts-infobox--dark { background: var(--ts-grad-dark); border-color: transparent; color: rgb(255 255 255 / 85%); }
.ts-infobox--dark .ts-infobox__title { color: #fff; }
.ts-infobox--dark p { color: rgb(255 255 255 / 82%); font-size: var(--ts-fs-sm); }
.ts-infobox__title { margin: 0 0 1rem; font-size: var(--ts-fs-h4); }
.ts-infobox__fiscal {
	margin: 1.2rem 0 0;
	padding-top: 1rem;
	border-top: 1px solid var(--ts-line-strong);
	font-size: var(--ts-fs-xs);
	color: var(--ts-muted);
}
.ts-infobox__note { margin: 1.1rem 0 0; font-size: var(--ts-fs-sm); color: var(--ts-muted); }

/* Distintivi di associazioni e partner sotto i recapiti (BNI, S4 Energia) */
.ts-badges {
	margin-top: 1.2rem;
	padding-top: 1.1rem;
	border-top: 1px solid var(--ts-line-strong);
}
.ts-badges__label {
	margin: 0 0 0.75rem;
	font-size: var(--ts-fs-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ts-muted);
}
.ts-badges__list {
	/* affiancati finche ci stanno, poi uno sotto l'altro senza rimpicciolirsi */
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 0.7rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ts-badges__item {
	display: flex;
	align-items: center;
	/* i marchi hanno colori propri: il riquadro bianco li tiene leggibili
	   anche nella versione scura, come per i loghi delle referenze */
	padding: 0.65rem 0.8rem;
	background: var(--ts-logo-tile);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-sm);
	transition: transform 0.2s var(--ts-ease), border-color 0.2s var(--ts-ease);
}
.ts-badges__item:hover { transform: translateY(-2px); border-color: var(--ts-line-hover); }
.ts-badges__item a { display: block; width: 100%; }
.ts-badges__item img { display: block; width: 100%; height: auto; }
.ts-infobox__tel {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 0.9rem;
	color: #fff;
	font-weight: 620;
	text-decoration: none;
	font-size: var(--ts-fs-sm);
}
.ts-infobox__tel:hover { color: #A7DBF5; }

.ts-infolist { margin: 0; padding: 0; list-style: none; display: grid; gap: 1rem; }
.ts-infolist li { display: flex; gap: 0.85rem; align-items: flex-start; font-size: var(--ts-fs-sm); }
.ts-infolist__ico {
	flex: none;
	display: grid;
	place-items: center;
	width: 38px; height: 38px;
	background: var(--ts-card-bg);
	color: var(--ts-brand);
	border: 1px solid var(--ts-line);
	border-radius: 10px;
}
.ts-infolist a { text-decoration: none; font-weight: 560; }
.ts-infolist a:hover { text-decoration: underline; }

.ts-map {
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--ts-surface-2);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-lg);
	overflow: hidden;
}
/*
 * L'iframe deve riempire il riquadro in tutte e due le situazioni: mappa
 * bloccata e mappa attiva. Complianz avvolge l'iframe in un contenitore suo
 * (`.cmplz-blocked-content-container`, un flex centrato con altezza ereditata)
 * e gli mette un `max-height` con !important: senza queste righe la mappa
 * finisce piu stretta del contenitore e sembra tagliata.
 */
.ts-map iframe {
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	border: 0;
	display: block;
}
.ts-map .cmplz-blocked-content-container {
	width: 100%;
	height: 100%;
	box-shadow: none;
	border-radius: inherit;
}
/* Il contenitore resta nel documento anche dopo il consenso, senza classi. */
.ts-map > div:not(.ts-map__consent) { width: 100%; height: 100%; }
.ts-map__consent {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1.5rem;
	text-align: center;
	color: var(--ts-muted);
	background:
		repeating-linear-gradient(45deg, rgb(203 216 230 / 22%) 0 12px, transparent 12px 24px),
		var(--ts-surface);
}
.ts-map__consent .ts-icon { color: var(--ts-brand); }
.ts-map__title { margin: 0; font-weight: 700; color: var(--ts-ink); }
.ts-map__text { margin: 0 0 0.6rem; font-size: var(--ts-fs-xs); max-width: 30ch; }
.ts-map__link { font-size: var(--ts-fs-xs); }

/* Contact Form 7 */
.wpcf7 { margin: 0; }
.wpcf7-form p { margin: 0 0 1.1rem; }
.ts-form__row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
	gap: 1.1rem;
}
.ts-form__label {
	display: block;
	margin-bottom: 0.4rem;
	font-size: var(--ts-fs-sm);
	font-weight: 620;
	color: var(--ts-ink);
}
.ts-form__label .ts-req { color: var(--ts-err); }

.wpcf7 input[type='text'],
.wpcf7 input[type='email'],
.wpcf7 input[type='tel'],
.wpcf7 input[type='url'],
.wpcf7 input[type='number'],
.wpcf7 input[type='date'],
.wpcf7 select,
.wpcf7 textarea,
.ts-search__field {
	width: 100%;
	padding: 0.8rem 1rem;
	font: inherit;
	font-size: var(--ts-fs-base);
	color: var(--ts-ink);
	background: var(--ts-field-bg);
	border: 1px solid var(--ts-line-strong);
	border-radius: var(--ts-r-sm);
	transition: border-color 0.18s var(--ts-ease), box-shadow 0.18s var(--ts-ease);
}
.wpcf7 textarea { min-height: 150px; resize: vertical; }
.wpcf7 input:focus, .wpcf7 select:focus, .wpcf7 textarea:focus, .ts-search__field:focus {
	outline: none;
	border-color: var(--ts-brand);
	box-shadow: 0 0 0 3px rgb(23 169 224 / 22%);
}
.wpcf7 input::placeholder, .wpcf7 textarea::placeholder { color: #93A5B6; }

.wpcf7 input[type='file'] {
	width: 100%;
	padding: 0.6rem;
	font-size: var(--ts-fs-sm);
	background: var(--ts-surface);
	border: 1px dashed var(--ts-line-strong);
	border-radius: var(--ts-r-sm);
}

.ts-form__consent {
	display: flex;
	gap: 0.6rem;
	align-items: flex-start;
	font-size: var(--ts-fs-sm);
	color: var(--ts-muted);
	background: var(--ts-surface);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-sm);
	padding: 0.9rem 1rem;
}
.ts-form__consent .wpcf7-list-item { margin: 0; }
.ts-form__consent input[type='checkbox'] { width: 18px; height: 18px; accent-color: var(--ts-brand); }

.wpcf7 .wpcf7-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.95rem 1.9rem;
	font: inherit;
	font-weight: 640;
	color: #fff;
	background: var(--ts-brand);
	border: 0;
	border-radius: 999px;
	cursor: pointer;
	box-shadow: 0 6px 18px rgb(11 92 168 / 26%);
	transition: background-color 0.2s var(--ts-ease), box-shadow 0.2s var(--ts-ease), transform 0.16s var(--ts-ease);
}
.wpcf7 .wpcf7-submit:hover { background: var(--ts-brand-700); box-shadow: 0 10px 26px rgb(11 92 168 / 32%); }
.wpcf7 .wpcf7-submit:active { transform: translateY(1px); }
/* Contact Form 7 tiene il pulsante disattivato finché non si accetta
   l'informativa: lo si vede a colpo d'occhio ma non sembra rotto. */
.wpcf7 .wpcf7-submit:disabled {
	opacity: 0.55;
	cursor: not-allowed;
	box-shadow: none;
}

.wpcf7-not-valid { border-color: var(--ts-err) !important; }
.wpcf7-not-valid-tip {
	display: block;
	margin-top: 0.35rem;
	font-size: var(--ts-fs-xs);
	color: var(--ts-err);
}
.wpcf7 form .wpcf7-response-output {
	margin: 1.4rem 0 0;
	padding: 0.9rem 1.1rem;
	border-width: 1px;
	border-radius: var(--ts-r-sm);
	font-size: var(--ts-fs-sm);
}
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--ts-ok); background: #F0FDF4; color: #14532D; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { border-color: var(--ts-err); background: #FEF3F2; color: #7A271A; }
.wpcf7-spinner { margin-left: 0.7rem; }

.ts-form__privacy { font-size: var(--ts-fs-xs); color: var(--ts-muted); }

/* Allegati: i campi veri di Contact Form 7 restano nel documento ma spariscono
   quando il JavaScript prende in carico la selezione dei file. */
.ts-allegati { margin: 0 0 1.1rem; }
.ts-allegati__aiuto {
	margin: 0.2rem 0 0.7rem;
	font-size: var(--ts-fs-xs);
	color: var(--ts-muted);
}
.ts-allegati__campi { display: grid; gap: 0.5rem; }
.ts-allegati.is-enhanced .ts-allegati__campi { display: none; }
/* Il selettore va ripetuto per esteso: la regola ".wpcf7 input[type=file]"
   qui sopra e' piu' specifica di una classe sola, e senza questa ripetizione
   l'input resta largo quanto la pagina. Essendo fuori flusso non si vede, ma
   sporge a destra e fa comparire la barra di scorrimento orizzontale. */
.ts-allegati__nascosto,
.wpcf7 input[type='file'].ts-allegati__nascosto {
	position: absolute;
	left: 0; top: 0;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
	white-space: nowrap; border: 0;
}
.ts-allegati__azioni { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.ts-allegati__elenco {
	margin: 0.8rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.4rem;
}
.ts-allegati__elenco li {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.5rem 0.7rem;
	background: var(--ts-surface);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-sm);
	font-size: var(--ts-fs-sm);
}
.ts-allegati__nome {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ts-allegati__peso { color: var(--ts-muted); font-size: var(--ts-fs-xs); flex: none; }
.ts-allegati__togli {
	flex: none;
	width: 26px; height: 26px;
	display: grid; place-items: center;
	background: none;
	border: 1px solid var(--ts-line-strong);
	border-radius: 50%;
	color: var(--ts-muted);
	font-size: 1.1rem;
	line-height: 1;
	cursor: pointer;
}
.ts-allegati__togli:hover { border-color: var(--ts-err); color: var(--ts-err); }
.ts-allegati__totale {
	background: none !important;
	border: 0 !important;
	padding: 0.2rem 0 0 !important;
	font-size: var(--ts-fs-xs) !important;
	color: var(--ts-muted);
}
.ts-allegati__avviso {
	margin: 0.6rem 0 0;
	font-size: var(--ts-fs-xs);
	color: var(--ts-err);
}

/* ---------- 11. CTA, footer, barra mobile ------------------------------- */

.ts-ctaband {
	padding-block: clamp(2.6rem, 2rem + 3vw, 4.5rem);
	background: var(--ts-grad-dark);
	color: #fff;
	position: relative;
	overflow: hidden;
}
.ts-ctaband::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(70% 130% at 92% 20%, rgb(23 169 224 / 32%) 0%, transparent 60%);
}
.ts-ctaband__inner {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--ts-gap);
}
.ts-ctaband__text { max-width: 40rem; }
.ts-ctaband__title { margin: 0 0 0.4rem; color: #fff; font-size: var(--ts-fs-h2); }
.ts-ctaband__sub { margin: 0; color: rgb(255 255 255 / 82%); font-size: var(--ts-fs-lg); text-wrap: pretty; }
.ts-ctaband__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }

.ts-footer {
	padding-block: clamp(2.8rem, 2.2rem + 2.6vw, 4.5rem) 1.5rem;
	background: var(--ts-footer-bg);
	color: var(--ts-footer-text);
	font-size: var(--ts-fs-sm);
}
.ts-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
	gap: clamp(1.6rem, 1.1rem + 2vw, 3rem);
}
@media (max-width: 1240px) {
	.ts-footer__grid { grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
	.ts-footer__grid { grid-template-columns: 1fr 1fr; }
	.ts-footer__col--brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
	.ts-footer__grid { grid-template-columns: 1fr; }
}

/* Senza "width: auto" resta la larghezza dell'attributo e il marchio si schiaccia. */
.ts-logo--white img { width: auto; height: 42px; }
.ts-footer__claim { margin: 1.1rem 0 1.3rem; max-width: 34rem; line-height: 1.7; }
.ts-footer__title {
	margin: 0 0 1rem;
	font-size: var(--ts-fs-sm);
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: #fff;
}
.ts-footer__list, .ts-footer__contacts, .ts-footer__legallist {
	margin: 0; padding: 0; list-style: none;
	display: grid; gap: 0.7rem;
}
.ts-footer__list a, .ts-footer__contacts a, .ts-footer__legallist a {
	color: rgb(255 255 255 / 76%);
	text-decoration: none;
}
.ts-footer__list a:hover, .ts-footer__contacts a:hover, .ts-footer__legallist a:hover {
	color: #fff; text-decoration: underline;
}
.ts-footer__contacts li { display: flex; gap: 0.7rem; align-items: flex-start; }
.ts-footer__contacts .ts-icon { margin-top: 0.25em; color: var(--ts-accent); }

.ts-social { display: flex; gap: 0.6rem; margin: 0; padding: 0; list-style: none; }
.ts-social a {
	display: grid;
	place-items: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	background: rgb(255 255 255 / 8%);
	color: #fff;
	transition: background-color 0.2s var(--ts-ease), transform 0.2s var(--ts-ease);
}
.ts-social a:hover { background: var(--ts-brand); transform: translateY(-2px); }

.ts-footer__legal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.8rem 1.5rem;
	margin-top: clamp(2rem, 1.5rem + 2vw, 3rem);
	padding-top: 1.4rem;
	border-top: 1px solid rgb(255 255 255 / 12%);
	font-size: var(--ts-fs-xs);
	color: rgb(255 255 255 / 58%);
}
.ts-footer__legal p { margin: 0; }
.ts-footer__legallist { display: flex; flex-wrap: wrap; gap: 0.4rem 1.2rem; }

/* Riquadro "gestisci il consenso" in fondo alla Cookie Policy: lo disegna
   Complianz, qui gli si dà solo l'aria e i colori del sito. */
.cmplz-manage-consent-container {
	margin-top: 1.5rem;
	padding: 1.1rem 1.2rem;
	background: var(--ts-surface);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r);
}
.cmplz-manage-consent-container:empty { display: none; }
#cmplz-manage-consent-container-nojavascript { font-size: var(--ts-fs-sm); color: var(--ts-muted); }

/* Le righe delle categorie hanno un fondo grigio chiaro fisso, che sulla veste
   scura lascia scritte grigie su grigio. Il selettore ricalca quello del
   plugin (che usa un id) con un "body" davanti, altrimenti non vince. */
body #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header {
	background-color: var(--ts-surface);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-sm);
	color: var(--ts-body);
	padding: 0.6rem 0.9rem;
}
body #cmplz-manage-consent-container .cmplz-category { margin-bottom: 0.5rem; }
body #cmplz-manage-consent-container .cmplz-description { padding: 0.2rem 0.9rem 0.6rem; color: var(--ts-muted); font-size: var(--ts-fs-sm); }

.ts-footer__widgets { margin-top: 1.4rem; }
.ts-footer__widgets .widget-title { font-size: var(--ts-fs-sm); color: #fff; }

.ts-mobilebar {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 90;
	display: none;
	background: var(--ts-bar-bg);
	backdrop-filter: blur(10px);
	border-top: 1px solid var(--ts-line);
	padding-bottom: env(safe-area-inset-bottom);
	box-shadow: 0 -4px 20px rgb(12 27 42 / 8%);
}
.ts-mobilebar__item {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	padding: 0.6rem 0.3rem;
	font-size: 0.72rem;
	font-weight: 620;
	color: var(--ts-ink);
	text-decoration: none;
}
.ts-mobilebar__item .ts-icon { color: var(--ts-brand); }
.ts-mobilebar__item:active { background: var(--ts-surface); }
@media (max-width: 780px) {
	.ts-mobilebar { display: flex; }
	body { padding-bottom: 62px; }
	.ts-totop { bottom: 76px !important; }
	/* Il banner dei cookie sta in basso a destra: da telefono coprirebbe la
	   barra con telefono ed email. Lo alziamo e lo allarghiamo. */
	#cmplz-cookiebanner-container .cmplz-cookiebanner {
		bottom: 70px !important;
		left: 10px !important;
		right: 10px !important;
		width: auto !important;
		max-width: none !important;
	}
}

.ts-totop {
	position: fixed;
	right: 18px; bottom: 18px;
	z-index: 80;
	display: grid;
	place-items: center;
	width: 46px; height: 46px;
	background: var(--ts-brand);
	color: #fff;
	border: 0;
	border-radius: 50%;
	box-shadow: var(--ts-shadow-lg);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity 0.25s var(--ts-ease), transform 0.25s var(--ts-ease), visibility 0.25s, background-color 0.2s;
}
.ts-totop.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.ts-totop:hover { background: var(--ts-brand-700); }

/* ---------- 12. Elenchi, ricerca, 404, paginazione ---------------------- */

.ts-postcard {
	display: flex;
	flex-direction: column;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-lg);
	overflow: hidden;
	box-shadow: var(--ts-shadow-sm);
	transition: transform 0.28s var(--ts-ease), box-shadow 0.28s var(--ts-ease);
}
.ts-postcard:hover { transform: translateY(-4px); box-shadow: var(--ts-shadow-lg); }
.ts-postcard__media img { width: 100%; aspect-ratio: 10 / 7; object-fit: cover; }
.ts-postcard__body { display: flex; flex-direction: column; padding: 1.4rem; flex: 1; }
.ts-postcard__date { margin: 0 0 0.4rem; font-size: var(--ts-fs-xs); color: var(--ts-muted); }
.ts-postcard__title { margin: 0 0 0.6rem; font-size: var(--ts-fs-h4); }
.ts-postcard__title a { color: inherit; text-decoration: none; }
.ts-postcard__title a:hover { color: var(--ts-brand); }
.ts-postcard__text { margin: 0 0 1rem; color: var(--ts-muted); font-size: var(--ts-fs-sm); }

.ts-search { display: flex; gap: 0.6rem; max-width: 34rem; }
.ts-search__btn {
	padding: 0.8rem 1.3rem;
	font: inherit;
	font-weight: 620;
	color: #fff;
	background: var(--ts-brand);
	border: 0;
	border-radius: var(--ts-r-sm);
	cursor: pointer;
}
.ts-search__btn:hover { background: var(--ts-brand-700); }
.ts-searchtop { margin-bottom: 2.5rem; }

.ts-results { margin: 0; padding: 0; list-style: none; display: grid; gap: 1rem; }
.ts-results__item {
	padding: 1.3rem 1.5rem;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r);
}
.ts-results__title { font-size: var(--ts-fs-h4); font-weight: 680; text-decoration: none; }
.ts-results__text { margin: 0.4rem 0 0.3rem; color: var(--ts-muted); font-size: var(--ts-fs-sm); }
.ts-results__url { margin: 0; font-size: var(--ts-fs-xs); color: var(--ts-accent); }

.ts-empty {
	padding: 2.5rem;
	text-align: center;
	color: var(--ts-muted);
	background: var(--ts-surface);
	border-radius: var(--ts-r-lg);
}

.ts-404 { text-align: center; }
.ts-404__code {
	margin: 0;
	font-size: clamp(4.5rem, 3rem + 9vw, 9rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.05em;
	background: var(--ts-grad);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.ts-404__title { margin: 0.5rem 0 0.7rem; }
.ts-404__text { max-width: 40rem; margin: 0 auto 2rem; color: var(--ts-muted); font-size: var(--ts-fs-lg); }
.ts-404__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; justify-content: center; margin-bottom: 2.5rem; }
.ts-404__search { display: flex; justify-content: center; margin-bottom: 3rem; }
.ts-404__grid { text-align: left; }

.ts-pagination, .navigation.pagination { margin-top: 3rem; }
.ts-pagination .nav-links, .navigation.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.4rem;
}
.navigation.pagination .page-numbers {
	display: grid;
	place-items: center;
	min-width: 42px; height: 42px;
	padding: 0 0.7rem;
	border: 1px solid var(--ts-line);
	border-radius: var(--ts-r-sm);
	color: var(--ts-ink);
	text-decoration: none;
	font-weight: 600;
	font-size: var(--ts-fs-sm);
}
.navigation.pagination .page-numbers:hover { border-color: var(--ts-brand); color: var(--ts-brand); }
.navigation.pagination .page-numbers.current { background: var(--ts-brand); border-color: var(--ts-brand); color: #fff; }

.ts-postnav {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 3rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--ts-line);
	font-size: var(--ts-fs-sm);
}
.ts-postnav a { text-decoration: none; font-weight: 600; }

.ts-servizio {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 1rem + 2.5vw, 3.5rem);
	align-items: start;
}
@media (max-width: 900px) { .ts-servizio { grid-template-columns: 1fr; } }
.ts-servizio__aside { display: grid; gap: var(--ts-gap); position: sticky; top: calc(var(--ts-header-h) + 20px); }
@media (max-width: 900px) { .ts-servizio__aside { position: static; } }

/* ---------- 13. Animazioni ---------------------------------------------- */

.ts-js [data-reveal] {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.6s var(--ts-ease), transform 0.6s var(--ts-ease);
	will-change: opacity, transform;
}
.ts-js [data-reveal].is-visible {
	opacity: 1;
	transform: none;
	will-change: auto;
}
/* le schede dentro una griglia entrano a cascata */
.ts-js .ts-grid > [data-reveal]:nth-child(2) { transition-delay: 90ms; }
.ts-js .ts-grid > [data-reveal]:nth-child(3) { transition-delay: 180ms; }
.ts-js .ts-grid > [data-reveal]:nth-child(4) { transition-delay: 270ms; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.ts-js [data-reveal] { opacity: 1; transform: none; }
	/* Senza animazione i loghi restano su una riga che si scorre a mano:
	   la copia usata per il ciclo continuo va nascosta. */
	.ts-marquee { overflow-x: auto; scroll-snap-type: x proximity; }
	.ts-marquee__track { animation: none; }
	.ts-marquee__item[aria-hidden='true'] { display: none; }
	.ts-marquee__item { scroll-snap-align: start; }
}

/* ---------- 14. Versione scura ------------------------------------------
   Si attiva da Aspetto > Personalizza > Top Service > Aspetto del sito.
   Riprende i biglietti da visita: fondo nero e marchio azzurro.
   Cambia solo il valore delle variabili: la struttura resta la stessa.
   ---------------------------------------------------------------------- */

body.ts-dark {
	--ts-brand:        #2BA8E8;
	--ts-brand-600:    #1E97D6;
	--ts-brand-700:    #57BFF2;
	--ts-brand-900:    #050C13;
	--ts-accent:       #56C7F5;
	--ts-accent-soft:  #10222E;
	--ts-accent-line:  #1D3E53;

	--ts-ink:          #F3F7FB;
	--ts-body:         #C0CCD9;
	--ts-muted:        #93A2B2;
	--ts-line:         #212B36;
	--ts-line-strong:  #33404F;
	--ts-line-hover:   #2F5C7C;
	--ts-surface:      #11161C;
	--ts-surface-2:    #19212A;

	--ts-page-bg:      #0A0D11;
	--ts-card-bg:      #11161C;
	--ts-side-bg:      #0C1015;
	--ts-field-bg:     #161D26;
	--ts-bar-bg:       rgb(10 13 17 / 94%);
	--ts-logo-tile:    #FFFFFF;
	--ts-footer-bg:    #06090C;
	--ts-footer-text:  rgb(255 255 255 / 68%);

	--ts-grad:         linear-gradient(135deg, #2BA8E8 0%, #12649F 100%);
	--ts-grad-dark:    linear-gradient(140deg, #0D141C 0%, #071119 52%, #0A2C48 100%);

	--ts-shadow-sm: 0 1px 2px rgb(0 0 0 / 50%);
	--ts-shadow:    0 6px 18px rgb(0 0 0 / 50%);
	--ts-shadow-lg: 0 18px 42px rgb(0 0 0 / 62%);

	color-scheme: dark;
}

/* Apertura: la trama e i bagliori vanno alzati, su fondo nero sparirebbero */
.ts-dark .ts-hero::before {
	background:
		radial-gradient(72% 100% at 88% 6%, rgb(43 168 232 / 30%) 0%, transparent 60%),
		radial-gradient(60% 90% at 2% 98%, rgb(43 168 232 / 16%) 0%, transparent 58%),
		repeating-linear-gradient(135deg, rgb(255 255 255 / 2.5%) 0 2px, transparent 2px 26px);
}

/* Bottone chiaro sopra le fasce scure: resta bianco ma con testo blu scuro */
.ts-dark .ts-btn--white { color: #0B3F63; }
.ts-dark .ts-btn--white:hover { color: #072A44; }

/* La fascia dei numeri e quella della chiamata all'azione hanno bisogno di
   un bordo che le stacchi dal fondo, altrimenti si fondono con la pagina */
.ts-dark .ts-stats,
.ts-dark .ts-ctaband {
	border-block: 1px solid var(--ts-line);
}

/* I riquadri dei loghi restano bianchi: incorniciarli evita l'effetto ritaglio */
.ts-dark .ts-logos__item,
.ts-dark .ts-marquee__item {
	border-color: #2A333F;
	box-shadow: 0 1px 0 rgb(255 255 255 / 6%);
}

/* Campi dei moduli: il bordo chiaro standard sarebbe troppo acceso */
.ts-dark .wpcf7 input[type='text'],
.ts-dark .wpcf7 input[type='email'],
.ts-dark .wpcf7 input[type='tel'],
.ts-dark .wpcf7 input[type='url'],
.ts-dark .wpcf7 select,
.ts-dark .wpcf7 textarea,
.ts-dark .ts-search__field {
	border-color: #2C3643;
	color: var(--ts-ink);
}
.ts-dark .wpcf7 input::placeholder,
.ts-dark .wpcf7 textarea::placeholder { color: #6C7C8C; }
.ts-dark .wpcf7 input[type='file'] { background: var(--ts-surface); border-color: #2C3643; color: var(--ts-body); }

/* Messaggi di esito, ricalibrati sul fondo scuro */
.ts-dark .wpcf7 form.sent .wpcf7-response-output { background: #0E2418; border-color: #2E7D53; color: #A7E6C3; }
.ts-dark .wpcf7 form.invalid .wpcf7-response-output,
.ts-dark .wpcf7 form.unaccepted .wpcf7-response-output,
.ts-dark .wpcf7 form.failed .wpcf7-response-output { background: #2A1315; border-color: #8C3B36; color: #F3B7B2; }

/* Mappa e riquadro consenso */
.ts-dark .ts-map { background: var(--ts-surface-2); }
.ts-dark .ts-map__consent {
	background:
		repeating-linear-gradient(45deg, rgb(255 255 255 / 4%) 0 12px, transparent 12px 24px),
		var(--ts-surface);
}

/* Distintivi: il riquadro bianco c'e gia, qui basta ammorbidirne il bordo */
.ts-dark .ts-badges__item {
	border-color: #2A333F;
	box-shadow: 0 1px 0 rgb(255 255 255 / 6%);
}

/* Selezione del testo */
.ts-dark ::selection { background: var(--ts-brand); color: #04121C; }

@media print {
	.ts-topbar, .ts-header, .ts-footer, .ts-ctaband, .ts-mobilebar, .ts-totop, .ts-map { display: none !important; }
	body { color: #000; }
}