/* ==========================================================================
   ES V6.5 POLISH 2026-09-10 — electronicsolution.eu
   Rifinitura ADDITIVA di design e micro-animazioni. Nessun elemento viene
   aggiunto, rimosso o spostato: solo tipografia, transizioni, stati hover/
   focus/attivo, ritmo del reveal. Le regole sono prefissate con `body` per
   prevalere sul "CSS aggiuntivo" del Customizer (stampato dopo) a parita' di
   selettore, senza !important.
   Rollback: eliminare v6-5-polish.css e v6-5-polish.js (blocco enqueue atomico).
   Rispetta prefers-reduced-motion (sezione 12).
   ========================================================================== */

/* 1. Tipografia: titoli bilanciati, paragrafi senza orfani, numeri tabellari */
body .es h1,
body .es h2,
body .es h3 {
	text-wrap: balance;
	hyphens: manual;
}
body .es p,
body .es .lead,
body .es li {
	text-wrap: pretty;
}
body .es .hero-stats .n,
body .es .steps .n,
body .es .step .n {
	font-variant-numeric: tabular-nums;
}

/* 2. Pulsanti: easing piu' morbido, stato premuto, focus visibile, riflesso sull'oro */
body .es .btn {
	transition:
		transform .28s cubic-bezier(.16, 1, .3, 1),
		box-shadow .28s cubic-bezier(.16, 1, .3, 1),
		background-color .2s ease,
		border-color .2s ease,
		color .2s ease;
}
body .es .btn:active {
	transform: translateY(0) scale(.985);
	transition-duration: .08s;
}
body .es .btn:focus-visible {
	outline: 2px solid #C99B4B;
	outline-offset: 3px;
}
body .es .btn-gold {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}
body .es .btn-gold::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .34) 50%, transparent 65%);
	transform: translateX(-130%);
	transition: transform .65s cubic-bezier(.16, 1, .3, 1);
	pointer-events: none;
}
body .es .btn-gold:hover::after {
	transform: translateX(130%);
}
body .es .btn-ghost:hover {
	background: rgba(201, 155, 75, .07);
}

/* 3. Card: curva hover piu' fluida, ombra a strati, icona che sale, link che si apre */
body .es .card,
body .es-card {
	transition:
		transform .32s cubic-bezier(.16, 1, .3, 1),
		box-shadow .32s cubic-bezier(.16, 1, .3, 1),
		border-color .32s ease;
}
body .es .card:hover,
body .es-card:hover {
	box-shadow: 0 2px 6px rgba(7, 26, 47, .06), 0 18px 46px rgba(7, 26, 47, .12);
}
body .es .card:hover .ico,
body .es-card:hover .es-card__icon {
	transform: translateY(-2px);
}
body .es .card:hover .more {
	gap: 12px;
}

/* 4. Immagini in cornice: leggero zoom al passaggio (mai inclinazione), solo con mouse */
@media (hover: hover) and (pointer: fine) {
	body .es-fig img {
		transition: transform .7s cubic-bezier(.16, 1, .3, 1);
	}
	body .es-fig:hover img {
		transform: scale(1.03);
	}
}

/* 5. Ancore: le sezioni con id atterrano sotto l'header sticky, non dietro */
body .es .s[id],
body [id].s,
body .es [id] {
	scroll-margin-top: 96px;
}

/* 6. FAQ: il contenuto entra con una dissolvenza; focus visibile sul titolo */
body .es details > *:not(summary) {
	animation: esV65Fade .28s cubic-bezier(.16, 1, .3, 1) both;
}
@keyframes esV65Fade {
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: none; }
}
body .es summary {
	transition: color .2s ease;
}
body .es summary:focus-visible {
	outline: 2px solid #C99B4B;
	outline-offset: -2px;
	border-radius: 10px;
}

/* 7. Reveal: distanza piu' elegante e stessa curva del resto del sito.
      (lo stagger nelle griglie e' impostato da v6-5-polish.js) */
body .es-rv {
	transform: translateY(18px);
	transition:
		opacity .6s cubic-bezier(.16, 1, .3, 1),
		transform .7s cubic-bezier(.16, 1, .3, 1);
}
body .es .es-rv.es-rv-in,
body .es-rv.es-rv-in {
	transform: none;
}

/* 8. Torna su: anello oro al passaggio */
body .generate-back-to-top:hover {
	box-shadow: 0 0 0 3px rgba(201, 155, 75, .35), 0 10px 26px rgba(7, 26, 47, .25);
}

/* 9. Selezione testo coerente con il brand */
body ::selection {
	background: #A77C39;
	color: #ffffff;
}

/* 10. Header: transizioni morbide dello shrink sticky */
body .site-header,
body .site-header .inside-header,
body .site-header .header-image {
	transition:
		padding .35s cubic-bezier(.16, 1, .3, 1),
		width .35s cubic-bezier(.16, 1, .3, 1),
		background-color .35s ease,
		box-shadow .35s ease;
}
body .main-navigation a {
	transition: color .2s ease;
}

/* 11. Link nei contenuti: sottolineatura che scorre (integra ES-POLISH V6.4) */
body .es .card .more,
body .es .lead a {
	transition: gap .25s cubic-bezier(.16, 1, .3, 1), color .2s ease;
}

/* 12. Movimento ridotto: nessuna animazione aggiunta */
@media (prefers-reduced-motion: reduce) {
	body .es .btn-gold::after,
	body .es details > *:not(summary) {
		animation: none;
		transition: none;
	}
	body .es .btn:active,
	body .es .card:hover .ico,
	body .es-card:hover .es-card__icon,
	body .es-fig:hover img {
		transform: none;
	}
	body .es-rv {
		transform: none;
		transition: opacity .3s ease;
	}
}