/* TM Animations */

/* Smooth scroll */
html.tm-has-smooth body { overscroll-behavior: none; }
#tm-smooth-wrapper { overflow: hidden; }

/* Evita il "lampo" del testo prima che parta l'animazione */
/* (si cerca '"text":{' e non solo '"text"': anche il cursore ha una chiave "text") */
html.tm-js .tm-anim[data-tm*='"text":{']:not(.tm-text-ready) .elementor-heading-title,
html.tm-js .tm-anim[data-tm*='"text":{']:not(.tm-text-ready) .elementor-widget-container {
	visibility: hidden;
}

/* Righe mascherate (Text Reveal) */
.tm-anim .tm-line-mask { overflow: clip; }
.tm-anim .tm-char,
.tm-anim .tm-word { will-change: transform, opacity; }

/* Elementi fissati */
.pin-spacer > .e-con { will-change: transform; }

/* scroll-behavior: smooth del tema interferisce con ScrollTrigger/ScrollSmoother */
html.tm-js, html.tm-has-smooth { scroll-behavior: auto !important; }

/* Elementor anima "transform" dei container con una transition di 0.4s:
   sugli elementi mossi da GSAP (pin, ecc.) va tolta, altrimenti il movimento
   arriva in ritardo e "scivola" invece di restare fermo. */
.tm-anim[data-tm*='"pin":{'],
.tm-no-transition {
	--e-con-transform-transition-duration: 0s;
	transition: none !important;
}

/* Fade: nascosto finché GSAP non prende il controllo (niente "lampo") */
html.tm-js .tm-anim[data-tm*='"fade":{']:not(.tm-fade-ready) { opacity: 0; }

/* Scroll orizzontale: niente barra orizzontale mentre il contenuto è più largo dello schermo */
html.tm-has-hscroll, html.tm-has-hscroll body { overflow-x: clip; }

/* Text Invert: ogni riga parte al 30% e si riempie del colore del testo */
.tm-text-invert .tm-invert-line {
	color: transparent !important;
	background-image: linear-gradient(to right, rgba(var(--tm-rgb, 0, 0, 0), 1) 50%, rgba(var(--tm-rgb, 0, 0, 0), 0.3) 50%);
	background-size: 200% 100%;
	background-position-x: 100%;
	-webkit-background-clip: text;
	background-clip: text;
}

/* 3D Spin: la copia sta esattamente sopra l'originale */
.tm-spin-copy {
	position: absolute !important;
	top: 0;
	left: 0;
	width: 100%;
	margin: 0 !important;
	pointer-events: none;
}

/* Immagini: nascoste finché GSAP non prende il controllo (solo reveal) */
html.tm-js .tm-anim[data-tm*='"type":"reveal"']:not(.tm-img-ready) img { visibility: hidden; }
.tm-img-mask { display: inline-block; max-width: 100%; overflow: hidden; vertical-align: top; line-height: 0; }

/* Widget TM Marquee */
.tm-marquee { position: relative; width: 100%; overflow: hidden; }
.tm-marquee__track { display: flex; width: max-content; will-change: transform; }
.tm-marquee__group { display: flex; flex-shrink: 0; align-items: center; }
.tm-marquee__item { display: inline-block; white-space: nowrap; padding-right: var(--tm-mq-gap, 0.35em); }
.tm-marquee__item--outline { color: transparent !important; -webkit-text-stroke-width: 1px; -webkit-text-stroke-style: solid; -webkit-text-stroke-color: var(--tm-mq-stroke, var(--tm-mq-color, #000)); }
.tm-marquee__sep { font-size: 0.4em; vertical-align: middle; line-height: 1; }
.tm-marquee__sep--icon { display: inline-flex; align-items: center; }
.tm-marquee__sep--icon svg { width: 1em; height: 1em; fill: currentColor; }
.tm-marquee__sep--icon i { line-height: 1; }

/* Immagine al passaggio del mouse (container e widget TM Hover List) */
.tm-hover-img {
	position: absolute;
	left: 0;
	top: -50%;
	width: 300px;
	height: 400px;
	z-index: 1;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	will-change: transform, opacity;
	transition: opacity 0.3s, transform var(--tm-hi-smooth, 0.7s) cubic-bezier(0.23, 1, 0.32, 1);
}
.tm-hover-behind { isolation: isolate; }
.tm-hover-behind > .tm-hover-img { z-index: -1; }

/* Widget TM Hover List */
.tm-hl { display: flex; flex-direction: column; }
.tm-hl__row { position: relative; display: flex; align-items: center; gap: 20px; padding: 25px 0; border-bottom: 1px solid var(--tm-hl-line, #d7d7d7); color: inherit; text-decoration: none; }
.tm-hl__row:first-child { border-top: 1px solid var(--tm-hl-line, #d7d7d7); }
.tm-hl__num { flex: 0 0 60px; }
.tm-hl__title { flex: 1 1 auto; min-width: 0; transition: color 0.3s; }
.tm-hl__meta { flex: 0 0 25%; }
.tm-hl__arrow { flex: 0 0 auto; display: inline-flex; line-height: 1; transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1); }
.tm-hl__arrow svg { width: 1em; height: 1em; fill: currentColor; }
@media (max-width: 767px) {
	.tm-hl__row { flex-wrap: wrap; gap: 8px 16px; }
	.tm-hl__meta { flex: 1 1 100%; order: 3; }
}

/* Cursore personalizzato */
.tm-cursor {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: #000;
	color: #fff;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.6;
	opacity: 0;
	pointer-events: none;
	will-change: transform, opacity;
}

/* ------------------------------------------------------------------ */
/* 0.10 – Hover CTA (riempimento)                                      */
/* ------------------------------------------------------------------ */
.tm-btnfill .elementor-button { position: relative; overflow: hidden; isolation: isolate; }
/* lo sfondo resta quello normale: il colore di hover lo porta il livello GSAP */
.tm-btnfill .elementor-button:hover,
.tm-btnfill .elementor-button:focus,
.tm-btnfill .elementor-button.is-tm-filled { background-color: var(--tm-btn-bg) !important; }
.tm-btnfill__layer { position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
	background: var(--tm-fill-color, rgba(0, 0, 0, 0.2)); transform: scaleX(0); will-change: transform; }
.gsap-fill-vertical .tm-btnfill__layer { transform: scaleY(0); }
.tm-btnfill .elementor-button-content-wrapper { position: relative; z-index: 1; }

/* ------------------------------------------------------------------ */
/* 0.10 – Slideshow di sfondo                                          */
/* ------------------------------------------------------------------ */
.tm-slideshow { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.tm-slideshow__slide { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat;
	opacity: 0; visibility: hidden; will-change: opacity, transform; }

/* ------------------------------------------------------------------ */
/* 0.10 – Oggetto animato                                              */
/* ------------------------------------------------------------------ */
/* niente "lampo" prima dell'ingresso */
html.tm-js .tm-anim[data-tm*='"object":{"entrance":true']:not(.tm-object) img { opacity: 0; }
.tm-object__tilt { display: block; width: 100%; height: 100%; transform-style: preserve-3d; will-change: transform; }
.tm-object__tilt > a { display: block; width: 100%; height: 100%; }
/* Oggetto animato 3D: il canvas sta sopra l'immagine, che sparisce quando il modello è pronto */
.tm-model { position: relative; }
.tm-model__canvas { position: absolute; left: -20%; top: -20%; width: 140% !important; height: 140% !important; max-width: none; display: block; opacity: 0; transition: opacity .6s ease; pointer-events: none; }
.tm-model.is-model-ready .tm-model__canvas { opacity: 1; }
/* con un modello 3D la foto non si vede mai, salvo che il 3D non sia disponibile (.tm-model-off) */
html.tm-js .tm-anim[data-tm*='"model":"']:not(.tm-model-off) img { opacity: 0 !important; }
.tm-model-off .tm-model__canvas { display: none; }

/* ------------------------------------------------------------------ */
/* 0.10 – Marquee con loghi                                            */
/* ------------------------------------------------------------------ */
.tm-marquee__logo { display: inline-flex; align-items: center; height: var(--tm-mq-logo-h, 1.6em); vertical-align: middle; flex-shrink: 0; }
.tm-marquee__logo img { display: block; height: 100%; width: auto; max-width: none; }
.tm-marquee__logo--mono::before { content: ""; display: block; height: 100%; aspect-ratio: var(--tm-logo-ratio, 3);
	background-color: var(--tm-mq-logo-color, currentColor);
	-webkit-mask: var(--tm-logo) center / contain no-repeat; mask: var(--tm-logo) center / contain no-repeat; }
.tm-marquee--on-dark .tm-marquee__logo--mono::before { background-color: var(--tm-mq-logo-light, #fff); }
.tm-marquee__group { align-items: center; }

@media (prefers-reduced-motion: reduce) {
	.tm-btnfill__layer { transition: none; }
}

/* ---------- Carousel ---------- */
.tm-carousel { overflow: hidden !important; touch-action: pan-y; }
.tm-carousel.is-ready { cursor: grab; }
.tm-carousel.is-dragging { cursor: grabbing; }
.tm-carousel.is-dragging * { user-select: none; pointer-events: none; }
.tm-carousel.is-static { cursor: auto; }
.tm-carousel__track { display: flex; flex-wrap: nowrap; align-items: stretch; width: 100%; will-change: transform; }
.tm-carousel__slide { min-width: 0; max-width: none !important; }
.tm-carousel__nav { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-top: 24px; padding: 0 var(--tm-carousel-nav-pad, 20px); }
.tm-carousel__nav.has-dots { justify-content: space-between; }
.tm-carousel__arrows { display: flex; gap: 12px; margin-left: auto; }
.tm-carousel__dots { display: flex; align-items: center; gap: 10px; }
.tm-carousel__nav .tm-carousel__dot { width: 10px; height: 10px; min-height: 0; padding: 0; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--tm-carousel-dot, rgba(15, 23, 43, 0.18)); transition: width .35s cubic-bezier(.22,1,.36,1), background-color .25s; }
.tm-carousel__nav .tm-carousel__dot:hover, .tm-carousel__nav .tm-carousel__dot:focus { background: var(--tm-carousel-dot, rgba(15, 23, 43, 0.35)); }
.tm-carousel__nav .tm-carousel__dot.is-active { width: 28px; background: var(--tm-carousel-accent, #295FDC); }
.tm-carousel__nav .tm-carousel__dot:focus-visible { outline: 2px solid var(--tm-carousel-accent, #295FDC); outline-offset: 3px; }
.tm-carousel__arrow { width: 48px; height: 48px; display: inline-grid; place-items: center; padding: 0; border-radius: 8px; cursor: pointer;
  border: 1px solid var(--tm-carousel-accent, #295FDC); background: transparent; color: var(--tm-carousel-accent, #295FDC); transition: background-color .2s, color .2s, opacity .2s; }
.tm-carousel__nav .tm-carousel__arrow, .tm-carousel__nav .tm-carousel__arrow:focus, .tm-carousel__nav .tm-carousel__arrow:active { background: transparent; color: var(--tm-carousel-accent, #295FDC); border-color: var(--tm-carousel-accent, #295FDC); }
@media (hover: hover) { .tm-carousel__nav .tm-carousel__arrow:hover:not(:disabled) { background: var(--tm-carousel-accent, #295FDC); color: #fff; } }
.tm-carousel__nav .tm-carousel__arrow:focus-visible { background: var(--tm-carousel-accent, #295FDC); color: #fff; }
.tm-carousel__arrow:focus-visible { outline: 2px solid var(--tm-carousel-accent, #295FDC); outline-offset: 3px; }
.tm-carousel__arrow:disabled { opacity: .35; cursor: default; }
