/*
Theme Name: Hello Child
Description: A lightweight child theme that extends the Parent Theme.
Author: Author
Author URI:   https://example.com
Template: hello-elementor
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, custom-colors, custom-menu, responsive-layout
Text Domain: hello-elementor
*/


.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}


.elementor-g-recaptcha {
	display:none;
}

/* --- effetto deriva --- */
/* deriva: titolo enorme che scivola di lato (dimensione modificabile qui) */
.hk-deriva {
	--hk-deriva-dimensione: clamp(64px, 13vw, 220px);
	overflow: hidden;
}

.elementor-widget-heading.hk-deriva,
.hk-deriva .elementor-widget-heading {
	width: 100% !important;
	max-width: none !important;
}

.hk-deriva .elementor-heading-title {
	display: inline-block;
	white-space: nowrap;
	font-family: var(--e-global-typography-primary-font-family), sans-serif;
	font-size: var(--hk-deriva-dimensione) !important;
	font-weight: 800;
	line-height: 1 !important;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	will-change: transform;
}

/* solo il contorno: il colore del titolo (impostato in Elementor) diventa il colore del bordo */
.hk-deriva-contorno .elementor-heading-title {
	color: transparent !important;
	-webkit-text-stroke: 2px var(--hk-deriva-colore, currentColor);
}

.hk-deriva-contorno .elementor-heading-title { -webkit-text-stroke-color: var(--hk-deriva-colore, var(--e-global-color-secondary)); }

/* la transizione di Elementor sulle trasformazioni farebbe "inseguire" lo scroll */
.hk-deriva .elementor-widget-heading,
.elementor-widget-heading.hk-deriva { transition: none !important; }

/* --- effetto nastro --- */
/* nastro: fascia che scorre all'infinito (velocita' e spazio modificabili qui) */
.hk-nastro {
	--hk-nastro-durata: 32s;
	--hk-nastro-spazio: 56px;
	overflow: hidden;
}

.hk-nastro-lento { --hk-nastro-durata: 60s; }

.hk-nastro.hk-nastro-on > .e-con-inner,
.hk-nastro.hk-nastro-on {
	flex-wrap: nowrap !important;
}

.hk-nastro-traccia {
	display: flex;
	flex: 0 0 auto;
	width: max-content;
	animation: hk-nastro var(--hk-nastro-durata) linear infinite;
}

.hk-nastro-inverso .hk-nastro-traccia { animation-direction: reverse; }

.hk-nastro:hover .hk-nastro-traccia { animation-play-state: paused; }

.hk-nastro-gruppo {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: var(--hk-nastro-spazio);
	padding-right: var(--hk-nastro-spazio);
}

.hk-nastro-gruppo > .elementor-element {
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}

.hk-nastro-gruppo .elementor-heading-title { white-space: nowrap; }

.hk-nastro-gruppo img { width: auto; max-height: 64px; }

@keyframes hk-nastro {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.hk-nastro-traccia { animation: none; }
}

/* --- effetto rivela --- */
/* rivela: parole del titolo che salgono da sotto una riga invisibile */
.hk-parola {
	display: inline-block;
	overflow: hidden;
	vertical-align: bottom;
	/* spazio per le lettere che scendono (g, p, q) */
	padding-bottom: .08em;
	margin-bottom: -.08em;
}

.hk-parola > span { display: inline-block; }

/* Elementor da' ai contenitori una transizione sulle trasformazioni: con GSAP gli
   elementi arriverebbero in ritardo. Solo sugli elementi animati, solo con il JS attivo. */
html.hk-rivela-on .hk-rivela > .elementor-element,
html.hk-rivela-on .hk-rivela > .e-con-inner > .elementor-element { transition: none !important; }

/* ===== HOKUTO EFFETTI: fine ===== */

/* ===== HOKUTO SITO: inizio ===== */
/* Generato da crea-kit.py (04/10/2026) dal prototipo approvato. Non modificare qui dentro: si rigenera.
   Dettagli del design che Elementor non ha, agganciati a classi (Avanzate > Classi CSS). */

/* Archivo con l'asse della larghezza (62-125%): i titoli stretti del prototipo (classi hk-stretto-..).
   Elementor carica Archivo a larghezza normale; queste facce aggiungono le larghezze strette. */
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; src: url(https://fonts.gstatic.com/s/archivo/v25/k3kQo8UDI-1M0wlSfdfoLnnA.woff2) format('woff2'); 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; }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; src: url(https://fonts.gstatic.com/s/archivo/v25/k3kQo8UDI-1M0wlSfdnoLg.woff2) format('woff2'); 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; }

/* occhiello con la lineetta davanti (Titolo con classe hk-occhiello) */
.hk-occhiello .elementor-heading-title { display: flex; align-items: center; gap: 14px; }
.hk-occhiello .elementor-heading-title::before { content: ""; flex: 0 0 48px; height: 1px; background: currentColor; }
.hk-occhiello.elementor-widget-heading[class*="align-center"] .elementor-heading-title,
.hk-occhiello-centro .elementor-heading-title { justify-content: center; }

/* timbro del logo che gira piano (Immagine con classe hk-gira; hk-gira-inverso al contrario) */
@keyframes hk-gira { to { transform: rotate(360deg); } }
.hk-gira img { animation: hk-gira 50s linear infinite; }
.hk-gira-inverso img { animation: hk-gira 40s linear infinite reverse; }

/* foto nelle card: si avvicina piano al passaggio del mouse (contenitore con sfondo e classe hk-zoom) */
.hk-zoom { background-size: 104% auto !important; transition: background-size .9s cubic-bezier(.2, .8, .2, 1); }
.hk-zoom:hover { background-size: 110% auto !important; }

/* foto con ombra profonda (Immagine con classe hk-ombra) */
.hk-ombra img { box-shadow: 0 30px 70px rgba(0, 0, 0, .55); }

/* titoli su una riga sola (nastro, scritte giganti di sfondo): classe hk-una-riga */
.hk-nastro .elementor-heading-title, .hk-una-riga .elementor-heading-title { white-space: nowrap; }

/* accordion delle domande: + che ruota */
.hk-faq .e-n-accordion-item { border-bottom: 1px solid var(--e-global-color-hk48422); }
.hk-faq .e-n-accordion-item:first-child { border-top: 1px solid var(--e-global-color-hk48422); }
.hk-faq .e-n-accordion-item-title { padding: 26px 0 !important; background: none !important; border: 0 !important; }
.hk-faq .e-n-accordion-item-title-icon { width: 38px; height: 38px; border: 1px solid var(--e-global-color-secondary); border-radius: 50%; display: grid !important; place-items: center; color: var(--e-global-color-accent); }
.hk-faq .e-n-accordion-item > [role="region"] { border: 0 !important; background: none !important; padding: 0 !important; }

@media (prefers-reduced-motion: reduce) {
	.hk-gira img, .hk-gira-inverso img { animation: none; }
	.hk-zoom { transition: none; }
}

.hk-stretto-62 .elementor-heading-title, .hk-stretto-62 .elementor-button-text, .hk-stretto-62 p { font-stretch: 62%; }
.hk-stretto-62 .elementor-heading-title, .hk-stretto-62 .elementor-button-text, .hk-stretto-62 p { font-stretch: 62%; }
.hk-stretto-62 .elementor-heading-title, .hk-stretto-62 .elementor-button-text, .hk-stretto-62 p { font-stretch: 62%; }
.hk-stretto-75 .elementor-heading-title, .hk-stretto-75 .elementor-button-text, .hk-stretto-75 p { font-stretch: 75%; }
/* ===== HOKUTO SITO: fine ===== */

/* ===== NUZ: aggiunte a mano (05/10/2026), fuori dai blocchi che si rigenerano ===== */
/* zoom delle card fluido: il blocco generato anima background-size, che ridisegna tutta la foto
   a ogni fotogramma e scatta. Qui la foto e' copiata in uno strato (::after) che si ingrandisce
   con transform, sotto la velatura (::before) e sotto i testi. */
.hk-zoom { isolation: isolate; overflow: hidden; background-size: cover !important; transition: none; }
.hk-zoom::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background-image: inherit; background-size: cover; background-position: inherit; background-repeat: no-repeat;
	transform: scale(1.03); transition: transform 1.4s cubic-bezier(.16, 1, .3, 1); will-change: transform;
}
.hk-zoom:hover { background-size: cover !important; }
.hk-zoom:hover::after { transform: scale(1.09); }
@media (prefers-reduced-motion: reduce) {
	.hk-zoom::after { transition: none; }
}

/* ===== NUZ: header fisso, sfondo solo quando si scorre (06/10/2026) ===== */
/* In cima resta trasparente sopra la hero; scorrendo prende lo sfondo pieno.
   Solo sul sito: nell'editor di Elementor l'header resta com'e'. */
body:not(.elementor-editor-active) .nuz-header-fisso {
	position: fixed !important;
	top: var(--wp-admin--admin-bar--height, 0px) !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	z-index: 999 !important;
	transition: background-color .35s ease, box-shadow .35s ease, padding .35s ease;
}
body.nuz-scorre .nuz-header-fisso {
	background-color: #110d0e !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
}
/* one page: i link del menu (#il-locale, #eventi...) non finiscono sotto l'header */
html { scroll-padding-top: 110px; }
@media (max-width: 767px) {
	html { scroll-padding-top: 80px; }
}