/* EASYRE 2026 — aggiunte al foglio del mockup (style.css è generato dal mockup e non si tocca a mano).
   Qui: Montserrat sul nostro server, azzeramenti di WordPress, testata fissa, modulo «Prenota un incontro», rifiniture al
   passaggio del mouse, animazioni d'entrata (spente per chi le ha disattivate), accessibilità.
   Viene da sito.css del tema easytm-2026 (1.0.22), con il rosso di EASYRE al posto del blu; tolte le regole delle pagine
   EASYTM (tabelle, menu, etichette inglesi), che per EASYRE arrivano con le loro pagine. */

/* ---------- Montserrat variabile 100-900 (licenza OFL: assets/fonts/MONTSERRAT-OFL.txt) ---------- */
@font-face { font-family: Montserrat; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-wght-normal.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; }
@font-face { font-family: Montserrat; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-ext-wght-normal.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: Montserrat; font-style: italic; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-wght-italic.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; }
@font-face { font-family: Montserrat; font-style: italic; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-ext-wght-italic.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; }

/* ---------- WordPress: niente margini né contenitori in più ---------- */
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * + *, .is-layout-flow > * + *, .is-layout-constrained > * + * { margin-block-start: 0; }
main.contenuto, .wp-block-post-content { display: block; }
/* pagine corte (la home provvisoria, la 404 su uno schermo alto): il piè di pagina resta in fondo alla finestra, senza una
   striscia bianca sotto (trovata nelle foto del 29/09/2026 a 1440x900) */
.wp-site-blocks { min-height: 100vh; display: flex; flex-direction: column; }
.wp-site-blocks > main { flex: 1 0 auto; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
html { scroll-padding-top: 90px; }

/* ---------- accessibilità ---------- */
.salta { position: absolute; left: -999px; top: 10px; z-index: 100; background: var(--rosso); color: #fff; padding: 10px 16px; border-radius: 10px; font-weight: 700; }
.salta:focus { left: 12px; text-decoration: none; }
/* contorno del fuoco da tastiera: rosso del marchio sui fondi chiari (6,60:1 sul bianco), rosso chiaro sui fondi scuri
   (7,31:1 su #0E1216, dove il rosso farebbe 2,85:1). Come sul sito EASYTM, con i colori di EASYRE. */
:focus-visible { outline: 3px solid var(--rosso); outline-offset: 3px; border-radius: 6px; }
.band.dark :focus-visible, .cta-dark :focus-visible, footer.site :focus-visible { outline-color: var(--rosso-chiaro); }
.btn:focus-visible, .btn-ghost:focus-visible, .btn-light:focus-visible { outline-offset: 4px; }

/* ---------- testata fissa in alto (il mockup lo prevede per il sito vero) ---------- */
header.site { position: sticky; top: 0; z-index: 40; transition: box-shadow .25s ease; }
header.site.scorso { box-shadow: 0 8px 28px rgba(16, 40, 60, .08); }
nav.menu a { transition: color .2s ease, border-color .2s ease; }

/* ---------- il pulsante che apre il menu (parte 3, dal sito EASYTM): compare sotto i 914 px, la soglia misurata sulle voci
   di EASYRE (in fondo al foglio del mockup, «soglie del menu»); nel menu aperto i nomi interi e le tendine diventano un elenco
   piatto con le etichette «Per chi» e «Che cosa fa», senza le domande e con le icone a 32 px, per tenerlo corto
   (Pagine\Navigazione.md, 2.5; regole della tendina nel menu del telefono provate per il sito EASYTM il 27/09/2026) ---------- */
.menu-apri { display: none; background: none; border: 0; padding: 4px; margin: 0; cursor: pointer; color: var(--nero); line-height: 0; border-radius: 8px; }
.menu-apri .icona-chiudi { display: none; }
header.site.aperta .menu-apri .icona-menu { display: none; }
header.site.aperta .menu-apri .icona-chiudi { display: inline; }
nav.menu .solo-tel { display: none; }
@media (max-width: 913px) {
	.menu-apri { display: inline-flex; }
	/* il menu aperto scende sotto la testata; se è più alto della finestra scorre al suo interno (la testata è fissa) */
	header.site.aperta nav.menu { display: flex; flex-direction: column; align-items: stretch; gap: 0; position: absolute; top: 74px; left: 0; right: 0; max-height: calc(100vh - 74px); max-height: calc(100dvh - 74px); overflow-y: auto; overscroll-behavior: contain; margin: 0; background: #fff; padding: 6px 28px 18px; border-bottom: 1px solid var(--bordo); box-shadow: 0 16px 32px rgba(16, 40, 60, .12); font-size: 15px; animation: menu-giu .22s ease; }
	header.site.aperta nav.menu .nome-intero { display: inline; }
	header.site.aperta nav.menu .nome-corto { display: none; }
	/* le voci senza tendina con lo stesso colore delle righe delle tendine (grigie sembravano spente; foto del 29/09/2026) */
	header.site.aperta nav.menu > a { align-self: flex-start; white-space: normal; padding: 10px 0; text-wrap: balance; }
	header.site.aperta nav.menu > a:not(.on):not(.solo-tel) { color: var(--nero); }
	header.site.aperta nav.menu .gruppo { display: block; width: 100%; }
	header.site.aperta nav.menu .gruppo > button { display: none; }
	header.site.aperta nav.menu .etichetta { display: block; padding: 12px 0 4px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--grigio); }
	header.site.aperta nav.menu .pannello { display: block; position: static; padding: 0; opacity: 1; transform: none; transition: none; }
	header.site.aperta nav.menu .voci { width: auto; padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none; }
	header.site.aperta nav.menu .voci li + li { border-top: 0; }
	header.site.aperta nav.menu .voce { gap: 12px; padding: 6px 0; border-radius: 0; }
	header.site.aperta nav.menu .voce:hover { background: none; }
	header.site.aperta nav.menu .voce .ico { width: 32px; height: 32px; border-radius: 8px; flex-shrink: 0; }
	header.site.aperta nav.menu .voce .ico svg { width: 19px; height: 19px; }
	header.site.aperta nav.menu .voce a { font-size: 15px; font-weight: 600; text-wrap: balance; }
	header.site.aperta nav.menu .voce .domanda { display: none; }
	header.site.aperta nav.menu .voce a:after { border-radius: 8px; }
}
@media (max-width: 760px) {
	/* il pulsante della testata sparisce sotto i 760 px (regola nel foglio del mockup): qui entra nel menu aperto */
	header.site.aperta nav.menu .solo-tel { display: inline-block; color: var(--rosso); font-weight: 700; }
}
@media (max-width: 350px) {
	header.site.aperta nav.menu { padding-left: 20px; padding-right: 20px; }
}
@keyframes menu-giu { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---------- rifiniture al passaggio del mouse (lo stato fermo resta quello del mockup) ---------- */
.btn, .btn-ghost, .btn-light { transition: background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 12px 26px rgba(186, 12, 47, .28); }
.btn-ghost:hover { background: var(--tinta); text-decoration: none; }
.btn-light:hover { background: var(--tinta); text-decoration: none; }
.card { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.band.light .card:hover, .band.alt .card:hover, .hero .card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(16, 40, 60, .11); }
footer.site a { transition: color .2s ease; }
footer.site a:hover { color: #fff; text-decoration: none; }

/* ---------- animazioni d'entrata: solo con JavaScript e solo per chi non le ha disattivate ---------- */
html.js-anim .anim { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1); }
html.js-anim .anim.visibile { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { html.js-anim .anim { opacity: 1; transform: none; transition: none; } }

/* ---------- il modulo «Prenota un incontro»: stesso aspetto delle caselle del mockup ---------- */
.form-incontro { margin: 0; }
.form-incontro .form { margin-top: 28px; }
.form-incontro .form input { width: 100%; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); border-radius: 10px; padding: 12px 14px; color: #fff; font: inherit; font-size: 14px; line-height: 1.4; transition: border-color .2s ease, background-color .2s ease; }
.form-incontro .form input::placeholder { color: var(--soft); opacity: 1; }
.form-incontro .form input:focus { border-color: var(--rosso-chiaro); background: rgba(255, 255, 255, .09); outline: none; }
.form-incontro .form input:user-invalid { border-color: #e0a33a; }
.form-incontro .consenso { display: flex; gap: 10px; align-items: flex-start; margin-top: 16px; font-size: 13px; color: var(--soft); max-width: 720px; cursor: pointer; }
.form-incontro .consenso input { margin: 4px 0 0; accent-color: var(--rosso); flex-shrink: 0; }
/* riga dell'informativa sotto la casella degli inviti: al posto di una casella obbligatoria del consenso */
.form-incontro .informativa { margin: 12px 0 0; font-size: 13px; color: var(--soft); max-width: 720px; }
.form-incontro .informativa a { color: var(--txt-dark); text-decoration: underline; }
.form-incontro .cta { margin-top: 22px; }
.form-incontro button.btn-light { border: 0; cursor: pointer; font-family: inherit; }
.form-incontro .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* campi con il messaggio sotto la casella, scritto da easyre.js prima dell'invio */
.form-incontro .form .campo { display: block; min-width: 0; }
.form-incontro .form input[aria-invalid="true"] { border-color: #f0c36a; }
.errore-campo { display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.4; font-weight: 600; color: #f0c36a; }
.errore-campo[hidden] { display: none; }
.form-incontro button.btn-light:disabled { opacity: .7; cursor: wait; }
.form-esito { margin-top: 18px; font-size: 15px; font-weight: 600; max-width: 720px; }
/* la riga in inglese per chi arriva dalla pagina inglese (?da=en), sul fondo scuro del modulo: bianco su #0E1216 */
.nota-en { margin: 24px 0 0; max-width: 720px; padding: 12px 14px; font-size: 14px; line-height: 1.5; color: #fff; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); border-radius: 10px; }
.form-esito.ok { color: #fff; }
.form-esito.no { color: #f0c36a; }