/* =========================================================
   template-easy · EasyConsulting — proposta «Fili»
   Grafica sul markup nativo del CMS, come template-tre:
   header e footer dagli elementi del pannello, pagine fatte di
   sezioni/aree/contenitori con elementi testo, link e immagine.
   Le classi impostate dal pannello agganciano lo stile:
   - sezione:  easy + ec-hero, ec-competenze, ec-anime, ec-manifesto,
               ec-esperienza, ec-striscia, ec-cta, pg-hero, pg-split,
               pg-servizi, pg-manifesto, pg-anime-titolo, pg-cta, pg-modulo
   - area:     ec-anima ec-anima--it|--hn, pg-hero__media, pg-hero__testo
   - elemento: ec-claim, ec-titolo, ec-intro, ec-sottotitolo, ec-rivela,
               ec-chiusa, ec-anni, ec-principio, pg-occhiello, pg-titolo,
               pg-intro, pg-evidenza, pg-servizio, pg-claim
   - link:     classe ec-btn (+ ec-btn--hn, ec-btn--scuro, ec-btn--grande)
   Colori: variabili di component/styleinline.php (editor di stile del pannello).
   ========================================================= */
:root {
    --ec-turchese: var(--color1, #0097B2);
    --ec-turchese-scuro: var(--color4, #00778C);   /* testo turchese su bianco: contrasto AA */
    --ec-turchese-chiaro: var(--color3, #E6F4F7);
    --ec-antracite: var(--color2, #2D2D2D);
    --ec-antracite-2: var(--color5, #252525);
    --ec-grigio: var(--color6, #5F6366);
    --ec-bianco: var(--color_bg, #FFFFFF);
    --ec-testo: #45494C;
    --ec-linea: rgba(45, 45, 45, .14);
    --hn-rosso: #C8102E;
    --hn-rosso-scuro: #9E0C24;

    --ec-font: var(--font-family-1, 'Ubuntu'), system-ui, sans-serif;
    --ec-gutter: clamp(20px, 5vw, 72px);
    --ec-max: 1320px;
    --ec-bordo: max(var(--ec-gutter), calc((100% - var(--ec-max)) / 2));
    --ec-header-h: 84px;
}

/* ---------- base ---------- */
html, body { font-family: var(--ec-font); }
body {
    background: var(--ec-bianco);
    color: var(--ec-antracite);
    font-weight: 300;
    font-size: clamp(17px, 1.05vw + 10px, 19px);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}
a, a:hover { color: inherit; }
:focus-visible { outline: 3px solid var(--ec-turchese); outline-offset: 3px; }
.easy h1, .easy h2, .easy h3 { font-family: var(--ec-font); margin: 0; text-wrap: balance; }
.easy p { margin: 0 0 1em; max-width: 62ch; }
/* gli elementi di un contenitore stanno in riga e vanno a capo (il CSS di sistema mette in colonna
   i contenitori allineati «in alto»); niente spazio dopo l'ultimo paragrafo dell'ultimo elemento */
section.easy div.colonnaarea > div.row { flex-direction: row; flex-wrap: wrap; align-content: flex-start; height: auto; }
.easy .colonnaarea > .row > div:last-child p:last-child { margin-bottom: 0; }
/* le foto della libreria riempiono il riquadro che le contiene */
.easy .cont_sing figure > picture { height: 100%; }

/* Le sezioni EasyConsulting gestiscono da sé spazi e altezze */
article section.easy { padding: 0; overflow: hidden; }
article section.easy:nth-child(1) { height: auto; }
.easy .row > * { padding-left: 0; padding-right: 0; }
.easy .colonnaarea { overflow: visible; }
.easy figure { margin: 0; }
.easy picture, .easy figure img { display: block; }

/* ---------- pulsanti (link del pannello con classe ec-btn) ---------- */
a.ec-btn {
    --bg: var(--ec-turchese);
    --fg: var(--ec-bianco);
    --bg-hover: var(--ec-antracite);
    --fg-hover: var(--ec-bianco);
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .5em;
    margin-top: 1.4rem;
    padding: .95em 1.7em;
    border-radius: 999px;
    background: var(--bg);
    color: var(--fg);
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: .01em;
    text-decoration: none;
    overflow: hidden;
    isolation: isolate;
    transition: color .35s ease;
}
a.ec-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--bg-hover);
    border-radius: inherit;
    transform: translateY(101%);
    transition: transform .45s cubic-bezier(.7, 0, .2, 1);
}
a.ec-btn:hover, a.ec-btn:focus-visible { color: var(--fg-hover); }
a.ec-btn:hover::before, a.ec-btn:focus-visible::before { transform: translateY(0); }
a.ec-btn.ec-btn--grande { padding: 1.15em 2.4em; font-size: 1.15rem; }
a.ec-btn.ec-btn--scuro { --bg: var(--ec-antracite); --bg-hover: var(--ec-bianco); --fg-hover: var(--ec-antracite); }
a.ec-btn.ec-btn--hn { --bg: var(--hn-rosso); --bg-hover: var(--hn-rosso-scuro); }
.ec-hero a.ec-btn, .pg-hero a.ec-btn { --bg-hover: var(--ec-bianco); --fg-hover: var(--ec-antracite); }

/* =========================================================
   HEADER (elementi del pannello: logo + menu orizzontale)
   ========================================================= */
#header.container-fluid {
    height: var(--ec-header-h);
    padding: 0 var(--ec-gutter);
    color: var(--ec-bianco);
    background: transparent;
    z-index: 100;
    transition: background-color .4s ease, color .4s ease, box-shadow .4s ease, height .4s ease;
}
#header.pos_fixed {
    --ec-header-h: 68px;
    background: rgba(255, 255, 255, .97);   /* niente backdrop-filter: farebbe da contenitore al menu mobile a tutto schermo */
    color: var(--ec-antracite);
    box-shadow: 0 1px 0 var(--ec-linea);
}
#header .sezheader { height: 100%; display: flex; align-items: center; gap: 2rem; }
#header .colheader { display: flex; align-items: center; padding: 0; }
#header .ch1 { flex: 0 0 auto; width: auto; }
#header .ch2 { flex: 1 1 auto; width: auto; justify-content: flex-end; }
#header .colheader a.logosito, #header .colheader a.logosito.logodesktop { display: block; width: clamp(160px, 16vw, 230px); }
#header a.logosito img { width: 100%; height: auto; }
header li { text-transform: none; }

/* menu orizzontale (sopra i 1024 px) */
#menu_header .contenitore-logo-menu { display: none; }
#menu_header .navbar-nav-menu { gap: clamp(1rem, 2.2vw, 2.4rem); justify-content: flex-end; }
#menu_header .nav-item { list-style: none; }
#menu_header .nav-item .nav-link {
    position: relative;
    padding: .4em 0;
    font-size: .98rem;
    font-weight: 400;
    line-height: 1.3;
    color: inherit;
    white-space: nowrap;
    text-decoration: none;
}
#menu_header .nav-item:not(.ec-cta) .nav-link::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 2px;
    background: var(--ec-turchese);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .4s cubic-bezier(.7, 0, .2, 1);
}
#menu_header .nav-item .nav-link:hover::after,
#menu_header .nav-item .nav-link:focus-visible::after,
#menu_header .nav-item.attivo .nav-link::after { transform: scaleX(1); transform-origin: left; }
#menu_header .nav-item.voce-hotelnerds .nav-link::after { background: var(--hn-rosso); }
/* «Parliamone»: voce del menu con classe ec-cta, disegnata come pulsante */
#menu_header .nav-item.ec-cta .nav-link {
    padding: .7em 1.3em;
    border-radius: 999px;
    background: var(--ec-turchese);
    color: var(--ec-bianco);
    font-weight: 500;
    font-size: .92rem;
    transition: background-color .35s ease;
}
#menu_header .nav-item.ec-cta .nav-link:hover { background: var(--ec-antracite); }
#header.pos_fixed #menu_header .nav-item.ec-cta .nav-link:hover {background: var(--ec-antracite);color: #fff;}
@media (min-width: 1025px) and (max-width: 1140px) {
    #menu_header .navbar-nav-menu { gap: 1.1rem; }
    #menu_header .nav-item .nav-link { font-size: .92rem; }
    #header .sezheader { gap: 1.2rem; }
}

/* selettore della lingua (elemento «lingue» del pannello, dopo il menu): lingua corrente | altre lingue */
#header .ch2 > span[aria-label], #header .ch2 > a.menulingua { font-size: .8rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; line-height: 1; white-space: nowrap; }
#header .ch2 > span[aria-label] { margin-left: clamp(1rem, 2vw, 1.8rem); padding-right: .65em; border-right: 1px solid currentColor; }
#header .ch2 > a.menulingua { padding-left: .65em; color: inherit; opacity: .6; text-decoration: none; transition: opacity .2s ease; }
#header .ch2 > a.menulingua + a.menulingua { margin-left: .4em; }
#header .ch2 > a.menulingua:hover, #header .ch2 > a.menulingua:focus-visible { opacity: 1; }
@media (max-width: 1024px) {
    #header .ch2 > span[aria-label] { order: 1; margin-left: auto; }
    #header .ch2 > a.menulingua { order: 2; }
    #header .ch2 > #bottone_menu_header { order: 3; margin-left: 1.2rem; }
}

/* Il CSS di sistema dà alle voci di menu margine, padding forzato e larghezza piena (pensati per
   il menu a comparsa di template-tre): qui le voci stanno in riga accanto al logo */
#menu_header .navbar-nav-menu > li { width: auto; margin: 0; flex-direction: row; }
#menu_header .navbar-nav-menu li.nav-item .nav-link { margin: 0; padding: .4em 0 !important; font-family: var(--ec-font); text-transform: none; letter-spacing: 0; }
#menu_header .navbar-nav-menu li.nav-item.ec-cta .nav-link { padding: .7em 1.3em !important; }
#menu_header .nav-item.ec-cta .nav-link:hover {background: #fff !important;color: var(--ec-turchese);}
#footer .navbar-nav-menu li.nav-item .nav-link { margin: 0; padding: 0 !important; font-family: var(--ec-font); font-size: inherit; line-height: 1.5; color: inherit; text-transform: none; letter-spacing: 0; justify-content: flex-start; }
#footer #menu_footer .navbar-nav-menu li { padding: 0; }
/* le foto animate da GSAP non devono avere la transizione «al passaggio» del CSS di sistema */
.easy picture img, .easy picture:hover img { transition: none; }

/* menu mobile del plugin (fino a 1024 px): pannello turchese a tutto schermo */
@media (max-width: 1024px) {
    #bottone_menu_header { margin-left: auto; }
    #bottone_menu_header .buttonmenu { color: inherit; padding: 8px; }
    #bottone_menu_header .buttonmenu .icon-bar { width: 26px; height: 2px; margin: 3px 0; background: currentColor; border-radius: 2px; }
    #menu_header.navbar-menu.menumobile {
        position: fixed;
        top: 0; bottom: auto; left: 0; right: 0;
        width: 100%;
        height: 100vh;
        height: 100dvh;
        padding: 0;
        background: var(--ec-turchese);
        color: var(--ec-bianco);
        opacity: 0;
        visibility: hidden;
        transition: opacity .35s ease, visibility 0s linear .35s;
        z-index: 200;
    }
    #menu_header.navbar-menu.menumobile.menu-aperto { opacity: 1; visibility: visible; transition: opacity .35s ease; }
    #menu_header .areamenu { height: 100%; display: flex; flex-direction: column; padding: 0 var(--ec-gutter) 48px; overflow-y: auto; }
    #menu_header #headermenumobile { display: flex; flex-direction: row; justify-content: flex-end; align-items: center; align-self: stretch; width: 100%; height: var(--ec-header-h); flex: none; }
    #menu_header .chiudi_menumobile { background: none; border: 0; color: inherit; font-size: 2rem; line-height: 1; padding: 8px; cursor: pointer; }
    #menu_header .contenitore-logo-menu { display: block; position: absolute; top: calc(var(--ec-header-h) / 2 - 16px); left: var(--ec-gutter); width: 190px; }
    #menu_header .contenitore-logo-menu img { width: 100%; height: auto; }
    #menu_header .navbar-nav-menu { flex-flow: column nowrap; align-items: flex-start; justify-content: center; gap: .6rem; flex: 1; }
    #menu_header.navbar-menu.menumobile li { width: auto; margin: 0; }
    #menu_header .navbar-nav-menu li.nav-item.ec-cta .nav-link {
    font-size: clamp(1.5rem, 7vw, 2rem);
    padding: 0 !important;
    padding: 15px !important;
    border-radius: 20px;
}
    #menu_header .nav-item:not(.ec-cta) .nav-link::after { background: var(--ec-bianco); }
    #menu_header .nav-item.voce-hotelnerds .nav-link::after { background: var(--hn-rosso); }
    #menu_header .nav-item.ec-cta { margin-top: 1.6rem; }
    #menu_header .navbar-nav-menu li.nav-item.ec-cta .nav-link { background: var(--ec-antracite);}
        #menu_header .navbar-nav-menu li.nav-item .nav-link {font-size: clamp(1.5rem, 7vw, 2rem);font-weight: 500;letter-spacing: -.02em;white-space: normal;padding: .1em 0 !important;color: inherit;background-color: transparent;justify-content: flex-start;}

}

/* Pagine chiare (privacy, cookie, accessibilità: classe di pagina «pagina-chiara»): header scuro */
body.pagina-chiara #header.container-fluid { position: relative; color: var(--ec-antracite); background: var(--ec-bianco); box-shadow: 0 1px 0 var(--ec-linea); }
body.pagina-chiara article { max-width: var(--ec-max); margin: 0 auto; padding: 48px var(--ec-gutter) 80px; }

/* =========================================================
   FOOTER (elementi del pannello + riga legale di template-tre)
   ========================================================= */
#footer.container-fluid { display: block; padding: 0; margin: 0; background: var(--ec-antracite-2); color: rgba(255, 255, 255, .74); font-size: .95rem; }
#footer a { color: var(--ec-bianco); text-decoration: none; }
#footer a:hover, #footer a:focus-visible { color: var(--ec-turchese); }
#footer #sezfooter1 {
    max-width: var(--ec-max);
    margin: 0 auto;
    padding: clamp(64px, 10vh, 110px) var(--ec-gutter) 48px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 3rem;
    align-items: start;
}
#footer .colfooter { width: auto; max-width: none; padding: 0; text-align: left; display: flex; flex-direction: column; align-items: flex-start; }
#footer .logosito { display: block; width: 210px; margin-bottom: 1rem; }
#footer .logosito img { width: 100%; height: auto; }
#footer .label { display: block; margin: 0 0 1.1rem; color: var(--ec-bianco); font-weight: 500; font-size: 1rem; text-transform: none; }
#footer span.elem { display: block; margin: 0; font-family: inherit; color: inherit; font-size: inherit; }
#footer span.elem p { margin: 0 0 .6rem; max-width: 40ch; }
#footer .ec-footer-claim { color: var(--ec-turchese); font-style: italic; font-weight: 400; }
/* icone social (elemento «social» del pannello, plugin Link social): la colonna che le contiene torna a blocchi,
   così logo e testi restano su righe proprie e le icone (in linea) stanno una accanto all'altra */
#footer .colfooter:has(> .elemsocial) { display: block; }
#footer .elemsocial { display: inline-flex; margin: .9rem .6rem 0 0; }
#footer a.linksocial {
    display: inline-grid; place-items: center;
    width: 40px; height: 40px;
    border: 1px solid rgba(255, 255, 255, .28); border-radius: 50%;
    color: var(--ec-bianco); font-size: 1.15rem; line-height: 1;
    transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}
#footer a.linksocial:hover, #footer a.linksocial:focus-visible { background: var(--ec-turchese); border-color: var(--ec-turchese); color: var(--ec-bianco); }
#footer #menu_footer .navbar-nav-menu { flex-direction: column; align-items: flex-start; gap: .55rem; }
#footer #menu_footer .nav-item { list-style: none; text-transform: none; }
#footer #menu_footer .nav-link { padding: 0; justify-content: flex-start; line-height: 1.5; }
#footer #menu_footer .ec-cta { display: none; }
#footer #menu_footer .voce-hotelnerds .nav-link:hover { color: var(--ec-turchese); }
#footer #sezfooter3 {
    max-width: var(--ec-max);
    margin: 0 auto;
    padding: 24px var(--ec-gutter) 32px;
    border-top: 1px solid rgba(255, 255, 255, .12);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .6rem 2rem;
    font-size: .85rem;
}
#footer #sezfooter3 > .label { display: none; }
#footer #sezfooter3 .datiaziendali { width: auto; display: inline; margin: 0; }
#footer #sezfooter3 .datiaziendali .dat-aziend { display: inline; }
#footer #sezfooter3 .datiaziendali .dat-circin { display: none; }   /* CIR e CIN: codici delle strutture ricettive */
#footer #sezfooter3 span.elem { display: inline; margin: 0 1rem 0 0; }
#footer #sezfooter3 span.elem.easyc { margin: 0 0 0 auto; }
#footer #sezfooter3 .prefix { opacity: .7; margin-right: .3em; color: inherit; }
#footer #sezfooter3 .selezunder a { margin-right: 1.2rem; }

/* =========================================================
   HOME
   ========================================================= */
/* ---------- apertura ---------- */
section.easy.ec-hero {
    display: flex;
    align-items: flex-end;
    min-height: 100svh;
    padding: calc(var(--ec-header-h) + 8vh) var(--ec-bordo) clamp(64px, 12vh, 140px);
    color: var(--ec-bianco);
}
section.easy.ec-hero > .area { width: 100%; position: relative; z-index: 1; }
.ec-fili { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0;
    -webkit-mask-image: linear-gradient(to right, transparent 30%, #000 62%); mask-image: linear-gradient(to right, transparent 30%, #000 62%); }
.ec-fili path { fill: none; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.ec-claim p {
    display: inline-flex;
    align-items: center;
    gap: .7em;
    margin-bottom: 1.6rem;
    font-size: clamp(1rem, .6vw + .8rem, 1.25rem);
    font-weight: 400;
    font-style: italic;
    color: var(--ec-turchese);
}
.ec-claim p::before { content: ""; width: 2.4em; height: 2px; background: currentColor; }
.ec-titolo h1 {
    font-size: clamp(2.7rem, 6.4vw, 6.6rem);
    line-height: .98;
    font-weight: 500;
    letter-spacing: -.035em;
    max-width: 14ch;
    margin-bottom: clamp(1.6rem, 4vh, 3rem);
}
.ec-intro { display: grid; grid-template-columns: repeat(2, minmax(0, 34ch)); gap: 1.2rem 3rem; color: rgba(255, 255, 255, .78); }
.ec-intro p { margin: 0; }
section.easy.ec-hero a.ec-btn { margin-top: 2.4rem; }

/* ---------- due competenze ---------- */
section.easy.ec-competenze { padding: clamp(90px, 14vh, 170px) var(--ec-bordo) clamp(56px, 9vh, 110px); align-items: flex-end; }
section.easy.ec-competenze > .area { padding-right: 2.5rem; }
section.easy.ec-competenze h2, section.easy.ec-manifesto h2, section.easy.ec-esperienza h2,
.pg-split h2, .pg-servizi h2, .pg-anime-titolo h2, .pg-modulo h2 {
    font-size: clamp(2.1rem, 4.2vw, 4rem);
    line-height: 1.04;
    font-weight: 500;
    letter-spacing: -.03em;
}
section.easy.ec-competenze p { color: var(--ec-grigio); }

/* ---------- le due anime (home e Chi siamo) ---------- */
section.easy.ec-anime { align-items: stretch; }
section.easy.ec-anime > .area.ec-anima { flex-direction: column; }
.ec-anima--it { background: var(--ec-turchese-chiaro); }
.ec-anima--hn { background: var(--ec-antracite); color: var(--ec-bianco); }
.ec-anima .cont_sing figure { aspect-ratio: 16 / 10; overflow: hidden; }
.ec-anima .cont_sing img { width: 100%; height: 118%; object-fit: cover; will-change: transform; }
.ec-anima .colonnaarea > .row > div:not(.cont_sing) { padding-left: var(--ec-gutter); padding-right: var(--ec-gutter); }
.ec-anima .colonnaarea > .row > .cont_sing + div { padding-top: clamp(36px, 5vw, 80px); }
.ec-anima .colonnaarea > .row > div:last-child { padding-bottom: clamp(48px, 6vw, 96px); }
.ec-anima h3 { font-size: clamp(2rem, 3.2vw, 3.1rem); font-weight: 700; letter-spacing: -.03em; line-height: 1; margin-bottom: .5rem; }
.ec-anima .ec-sottotitolo p { font-size: 1.25rem; font-weight: 700; margin-bottom: 1.6rem; }
.ec-anima--it .ec-sottotitolo p { color: var(--ec-turchese-scuro); }
.ec-anima--hn .ec-sottotitolo p { color: var(--hn-rosso); }
.ec-anima--it p { color: var(--ec-testo); }
.ec-anima--hn p { color: rgba(255, 255, 255, .9); }

/* ---------- manifesto ---------- */
section.easy.ec-manifesto { padding: clamp(110px, 18vh, 220px) var(--ec-bordo); }
section.easy.ec-manifesto > .area { max-width: 1100px; margin: 0 auto; }
section.easy.ec-manifesto h2 { color: var(--ec-turchese-scuro); margin-bottom: clamp(2rem, 5vh, 3.5rem); max-width: 16ch; }
.ec-rivela p { font-size: clamp(1.55rem, 2.6vw, 2.5rem); line-height: 1.28; font-weight: 400; letter-spacing: -.015em; max-width: 34ch; margin-bottom: .8em; }
.ec-rivela .ec-parola { color: rgba(45, 45, 45, .16); }
.ec-chiusa p { margin-top: clamp(2rem, 5vh, 3.5rem); padding-left: 1.4rem; border-left: 3px solid var(--ec-turchese); color: var(--ec-grigio); font-size: 1.15rem; max-width: 48ch; }

/* ---------- esperienza ---------- */
section.easy.ec-esperienza {padding: clamp(90px, 10vh, 170px) var(--ec-bordo) clamp(70px, 10vh, 120px);color: var(--ec-bianco);align-items: center;}
#home-esperienza .col-sm-12.col-md-5.area {
    margin-bottom: 20px;
}
section.easy.ec-esperienza > .area:first-of-type { padding-right: 4rem; }
.ec-anni p {
    display: flex;
    align-items: flex-start;
    margin: 0;
    font-size: clamp(9rem, 20vw, 20rem);
    line-height: .8;
    font-weight: 700;
    letter-spacing: -.06em;
    color: var(--ec-turchese) !important;
    -webkit-text-stroke: 2px var(--ec-turchese);
    font-variant-numeric: tabular-nums;
}
.ec-anni p span:not(.ec-anni__num) { font-size: .4em; color: var(--ec-turchese); -webkit-text-stroke: 0; margin-left: .05em; }
section.easy.ec-esperienza .ec-anni p { color: transparent; }
section.easy.ec-esperienza h2 { margin-bottom: 1.6rem; }
section.easy.ec-esperienza p { color: rgba(255, 255, 255, .78); }
section.easy.ec-esperienza .ec-principio p { color: var(--ec-bianco); font-weight: 400; font-size: 1.2rem; margin-top: 1em; }

/* ---------- striscia fotografica ---------- */
section.easy.ec-striscia { padding: 0; }
section.easy.ec-striscia .cont_sing figure { height: clamp(260px, 52vh, 560px); overflow: hidden; clip-path: inset(0 var(--ec-gutter)); }
section.easy.ec-striscia .cont_sing img { width: 100%; height: 130%; object-fit: cover; }

/* ---------- chiamata finale ---------- */
section.easy.ec-cta, section.easy.pg-cta { padding: clamp(110px, 18vh, 210px) var(--ec-bordo); color: var(--ec-bianco); text-align: center; }
section.easy.ec-cta div.colonnaarea div.row, section.easy.pg-cta div.colonnaarea div.row { justify-content: center; text-align: center; }
section.easy.ec-cta .cont_sing { width: clamp(64px, 6vw, 92px); margin: 0 auto 2rem; }
section.easy.ec-cta .cont_sing img { width: 100%; height: auto; }
section.easy.ec-cta h2, section.easy.pg-cta h2 { font-size: clamp(2.4rem, 5.4vw, 5.4rem); line-height: 1; font-weight: 500; letter-spacing: -.035em; max-width: 15ch; margin: 0 auto 1.6rem; }
section.easy.ec-cta p, section.easy.pg-cta p { margin: 0 auto; color: rgba(255, 255, 255, .92); }
section.easy.ec-cta a.ec-btn, section.easy.pg-cta a.ec-btn { margin-top: 2.6rem; }

/* =========================================================
   PAGINE INTERNE
   ========================================================= */
.pg-occhiello p { display: inline-flex; align-items: center; gap: .7em; margin-bottom: 1.4rem; color: var(--ec-turchese); font-style: italic; font-weight: 400; font-size: 1.1rem; }
.pg-occhiello p::before { content: ""; width: 2.4em; height: 2px; background: currentColor; }
.pg-evidenza p { font-size: 1.25rem; font-weight: 400; padding-left: 1.2rem; border-left: 3px solid var(--ec-turchese); }

/* ---------- apertura delle pagine interne ---------- */
section.easy.pg-hero { min-height: 100vh; min-height: 100svh; color: var(--ec-bianco); align-items: stretch; }
section.easy.pg-hero > .area.pg-hero__media { position: relative; }
section.easy.pg-hero .pg-hero__media div.colonnaarea, section.easy.pg-hero .pg-hero__media div.colonnaarea > div.row, section.easy.pg-hero .pg-hero__media .cont_sing { height: 100%; }
.pg-hero__media .cont_sing figure { position: relative; height: 100%; overflow: hidden; }
.pg-hero__media .cont_sing picture { height: 100%; }
.pg-hero__media .cont_sing img { width: 100%; height: 100%; object-fit: cover; /*filter: grayscale(1) contrast(1.05);*/ } 
.pg-hero__media .cont_sing figure::after { content: ""; position: absolute; inset: 0; /*background: var(--ec-turchese);*/ mix-blend-mode: multiply; opacity: .75; }
section.easy.pg-hero > .area.pg-hero__testo { align-items: flex-end; padding: calc(var(--ec-header-h) + 9vh) var(--ec-gutter) 10vh; }
.pg-titolo h1 { font-size: clamp(2.5rem, 5vw, 5rem); line-height: 1.02; font-weight: 500; letter-spacing: -.035em; max-width: 16ch; margin-bottom: 2rem; }
.pg-intro p { color: rgba(255, 255, 255, .78); }
section.easy.pg-hero .pg-evidenza p { color: var(--ec-bianco); margin-top: 1.2rem; }

/* ---------- testo e foto affiancati ---------- */
section.easy.pg-split { padding: clamp(90px, 14vh, 160px) var(--ec-bordo); align-items: center; }
section.easy.pg-split > .area { align-items: center; }
section.easy.pg-split > .area:first-of-type { padding-right: clamp(2rem, 4vw, 6rem); }
section.easy.pg-split > .area + .area { padding-left: clamp(0rem, 1vw, 1rem); }
section.easy.pg-split h2 { margin-bottom: 1.8rem; }
section.easy.pg-split p { color: var(--ec-testo); }
section.easy.pg-split .pg-evidenza p { color: var(--ec-antracite); }
section.easy.pg-split .cont_sing figure { aspect-ratio: 4 / 5; overflow: hidden; }
section.easy.pg-split .cont_sing img { width: 100%; height: 115%; object-fit: cover; }

/* ---------- servizi ---------- */
section.easy.pg-servizi { padding: clamp(90px, 14vh, 160px) var(--ec-bordo); background: var(--ec-turchese-chiaro); }
section.easy.pg-servizi h2 { margin-bottom: 4rem; max-width: 20ch; }
section.easy.pg-servizi .colonnaarea > .row + .row { gap: 0; }
.pg-servizio { position: relative; padding-top: 2rem !important; padding-right: 3rem !important; }
.pg-servizio::before { content: ""; position: absolute; top: 0; left: 0; right: 3rem; height: 3px; background: var(--ec-turchese); transform-origin: left; transform: scaleX(var(--linea, 1)); }
.pg-servizio h3 { font-size: 1.7rem; font-weight: 700; letter-spacing: -.02em; margin-bottom: .4rem; }
.pg-servizio p:first-of-type { color: var(--ec-turchese-scuro); font-weight: 400; font-size: 1.15rem; }
.pg-servizio p { color: var(--ec-testo); }

/* ---------- manifesto delle pagine interne ---------- */
section.easy.pg-manifesto { padding: clamp(110px, 18vh, 200px) var(--ec-bordo); color: rgba(255, 255, 255, .8); }
section.easy.pg-manifesto > .area { max-width: 900px; margin: 0 auto; }
section.easy.pg-manifesto h2 { color: var(--ec-bianco); font-size: clamp(2.2rem, 4.6vw, 4.4rem); line-height: 1.02; font-weight: 500; letter-spacing: -.035em; margin-bottom: 2rem; }
section.easy.pg-manifesto p { font-size: 1.2rem; }
.pg-claim p { color: var(--ec-turchese); font-style: italic; font-size: clamp(1.6rem, 2.6vw, 2.4rem); margin-top: 2rem; }

/* ---------- titolo delle due anime (Chi siamo) ---------- */
section.easy.pg-anime-titolo { padding: clamp(90px, 14vh, 160px) var(--ec-bordo) clamp(40px, 6vh, 64px); }

/* ---------- modulo contatti (plugin Form) ---------- */
section.easy.pg-modulo { padding: clamp(90px, 14vh, 150px) var(--ec-gutter); }
section.easy.pg-modulo > .area { max-width: 980px; margin: 0 auto; }
section.easy.pg-modulo h2 { margin-bottom: 2.4rem; }
section.easy.pg-modulo .el-form { width: 100%; padding: 0; }
section.easy.pg-modulo .formrichiesta { display: grid; grid-template-columns: 1fr 1fr; gap: 1.6rem 2rem; margin: 0; }
section.easy.pg-modulo .formrichiesta > * { width: auto; max-width: none; padding: 0; margin: 0; }
section.easy.pg-modulo .input-group.controls { display: flex; flex-direction: column; gap: .45rem; }
section.easy.pg-modulo .input-group.controls[data-tipocampo="note"],
section.easy.pg-modulo .formrichiesta > :not(.input-group) { grid-column: 1 / -1; }
section.easy.pg-modulo .formrichiesta .input-group label.hidelabel {
    position: static; height: auto; margin: 0; padding: 0;
    color: var(--ec-antracite); font-size: .95rem; font-weight: 500; text-transform: none; letter-spacing: 0;
}
section.easy.pg-modulo .formrichiesta .input-group input.form-control,
section.easy.pg-modulo .formrichiesta .input-group textarea.form-control {
    height: auto; padding: .8em 0; margin: 0;
    font: 300 1.05rem var(--ec-font); color: var(--ec-antracite); letter-spacing: 0;
    border: 0; border-bottom: 2px solid rgba(45, 45, 45, .3); border-radius: 0; background: transparent;
}
section.easy.pg-modulo .formrichiesta .form-control::placeholder { color: transparent; }
section.easy.pg-modulo .formrichiesta .input-group textarea.form-control { min-height: 8em; resize: vertical; }
section.easy.pg-modulo .formrichiesta .input-group .form-control:focus { outline: none; border-bottom-color: var(--ec-turchese); }
section.easy.pg-modulo .formrichiesta .row.controls, section.easy.pg-modulo .formrichiesta .row.azioneinvio { margin: 0; padding: 0; }
section.easy.pg-modulo .formrichiesta .form-check-label { font-size: .95rem; text-transform: none; letter-spacing: 0; color: var(--ec-testo); }
section.easy.pg-modulo form label.infocaptcha { font-style: normal; color: var(--ec-grigio); }
section.easy.pg-modulo a { color: var(--ec-turchese-scuro); text-decoration: underline; }
section.easy.pg-modulo form .button.btn-invioform {
    display: inline-flex; width: auto; min-width: 0; margin: 1.6rem 0 0;
    padding: 1.05em 2.4em; border: 0; border-radius: 999px;
    font: 500 1.1rem var(--ec-font); cursor: pointer;
    background-color: var(--ec-turchese); color: var(--ec-bianco);
    transition: background-color .35s ease;
}
section.easy.pg-modulo form .button.btn-invioform[type="text"] { background-color: var(--ec-turchese-chiaro); color: var(--ec-grigio); cursor: not-allowed; }
section.easy.pg-modulo form .button.btn-invioform[type="submit"]:hover { background-color: var(--ec-antracite); color: var(--ec-bianco); }

/* ---------- HotelNerds in Contatti: foto di sfondo della sezione ---------- */
section.easy.pg-cta--hn { background-color: var(--ec-antracite); }
section.easy.pg-cta--hn::before { content: ""; position: absolute; inset: 0; background: rgba(37, 37, 37, .72); z-index: 0; }

/* =========================================================
   Animazioni: le aperture restano nascoste finché js/easy.js non ha
   impostato il punto di partenza (classe ec-pronto); se lo script non
   parte, dopo 3 secondi si mostrano comunque.
   ========================================================= */
@keyframes ec-mostra { to { visibility: visible; } }
.ec-js:not(.ec-pronto) section.easy.ec-hero > .area,
.ec-js:not(.ec-pronto) section.easy.pg-hero > .area {
    visibility: hidden;
    animation: ec-mostra 0s linear 3s forwards;
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ---------- footer: riga dei dati societari (elemento «personalizza» del pannello, riga 2) ---------- */
#footer #sezfooter2 { max-width: var(--ec-max); margin: 0 auto; padding: 0 var(--ec-gutter) 20px; display: block; }
#footer #sezfooter2 .colfooter { width: 100%; }
#footer span.elem p.ec-footer-societa { margin: 0; max-width: none; font-size: .85rem; line-height: 1.7; color: rgba(255, 255, 255, .62); }
#footer .ec-footer-societa a { color: rgba(255, 255, 255, .85); }
/* i dati aziendali della riga legale standard sono già nella riga sopra */
#footer #sezfooter3 .datiaziendali { display: none; }

/* ---------- pagine Privacy, Cookie, Accessibilità (testi del plugin privacycookie) ---------- */
body.pagina-chiara article section { padding: 0; height: auto !important; overflow: visible; }   /* il CSS di sistema fissa a 400px la prima sezione */
body.pagina-chiara article .colonnaelemento { width: 100%; max-width: 860px; margin: 0 auto; flex: none; }
body.pagina-chiara article { padding-top: 0; }
body.pagina-chiara article .colonnaelemento { max-width: 1080px; }
body.pagina-chiara .privacy-policy, body.pagina-chiara .cookie-policy, body.pagina-chiara .accessibility-policy { color: var(--ec-testo); font-size: 1.02rem; }

/* apertura: fascia turchese chiaro a tutta larghezza con occhiello e titolo */
body.pagina-chiara h1.titpagina {
    position: relative;
    margin: 0 0 clamp(2.6rem, 5vw, 4rem);
    padding: clamp(5rem, 11vw, 9rem) 0 clamp(2.4rem, 5vw, 3.6rem);
    font-family: var(--ec-font);
    font-size: clamp(2.4rem, 5.4vw, 4.4rem);
    font-weight: 500;
    letter-spacing: -.04em;
    line-height: 1.02;
    color: var(--ec-antracite);
    background: var(--ec-turchese-chiaro);
    box-shadow: 0 0 0 100vmax var(--ec-turchese-chiaro);   /* la fascia esce dal contenitore fino ai bordi dello schermo */
    clip-path: inset(0 -100vmax);
}
body.pagina-chiara h1.titpagina::before {
    content: "Informazioni legali";
    display: flex; align-items: center; gap: .7em;
    margin-bottom: 1.1rem;
    font-size: 1.05rem; font-style: italic; font-weight: 400; letter-spacing: 0;
    color: var(--ec-turchese-scuro);
}
html[lang="en"] body.pagina-chiara h1.titpagina::before { content: "Legal information"; }
body.pagina-chiara h1.titpagina::after {
    content: "EASYCONSULTING S.R.L. · Innovation Made Easy";
    display: block;
    margin-top: 1.4rem;
    font-size: .8rem; font-weight: 500; letter-spacing: .14em; line-height: 1.4;
    color: var(--ec-grigio);
}

/* capitoli: titolo e testo separati da una linea sottile */
body.pagina-chiara h2.titprivacy {
    margin: 0;
    padding: 2rem 0 .8rem;
    border-top: 1px solid var(--ec-linea);
    font-family: var(--ec-font);
    font-size: .92rem;
    font-weight: 500;
    letter-spacing: .08em;
    line-height: 1.45;
    color: var(--ec-antracite);
}
body.pagina-chiara h2.titprivacy::before {
    content: ""; display: block; width: 28px; height: 3px; margin-bottom: 1rem;
    background: var(--ec-turchese); border-radius: 2px;
}
body.pagina-chiara article p { margin: 0 0 .6rem; line-height: 1.75; }
body.pagina-chiara .titprivacy + div, body.pagina-chiara .titprivacy ~ div { padding-bottom: 1.6rem; }
body.pagina-chiara article strong { font-weight: 500; color: var(--ec-antracite); }
body.pagina-chiara article a { color: var(--ec-turchese-scuro); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color .2s ease; }
body.pagina-chiara article a:hover { color: var(--ec-antracite); }

/* dati societari: scheda con etichette piccole sopra i valori */
body.pagina-chiara .privacy-policy > p { margin: 0; padding: .85rem 1.2rem; max-width: none; background: var(--ec-turchese-chiaro); border-bottom: 1px solid rgba(0, 119, 140, .12); }
body.pagina-chiara .privacy-policy > h2 + p { border-radius: 10px 10px 0 0; }
body.pagina-chiara .privacy-policy > p:has(+ h2) { border-radius: 0 0 10px 10px; border-bottom: 0; margin-bottom: 2.4rem; }
body.pagina-chiara .labelprivacy { display: block; margin-bottom: .15rem; font-size: .74rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--ec-grigio); }
body.pagina-chiara .datoprivacy { color: var(--ec-antracite); font-weight: 500; }

/* da desktop: titoli dei capitoli in una colonna a sinistra, testo a destra */
@media (min-width: 992px) {
    /* il contenitore dei testi è quello che ha il titolo come figlio diretto (nella cookie policy c'è un div in più) */
    body.pagina-chiara article div:has(> h1.titpagina) {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 2.3fr);
        align-items: start;
    }
    body.pagina-chiara article div:has(> h1.titpagina) > * { grid-column: 2; }
    body.pagina-chiara article div:has(> h1.titpagina) > h1.titpagina { grid-column: 1 / -1; }
    body.pagina-chiara article div:has(> h1.titpagina) > h2.titprivacy { grid-column: 1; padding-right: 3rem; }
    /* la linea continua anche sopra il testo del capitolo */
    body.pagina-chiara h2.titprivacy + div { padding-top: calc(2rem + 1rem + 3px); border-top: 1px solid var(--ec-linea); }
    body.pagina-chiara .privacy-policy > h2 + p { margin-top: 2rem; }
    body.pagina-chiara .privacy-policy > h2:first-of-type { border-top: 0; }
    body.pagina-chiara .privacy-policy > h2:first-of-type + p { margin-top: calc(2rem + 1rem + 3px); }
    body.pagina-chiara .privacy-policy > p {/* display: flex; */gap: 1rem;padding: .7rem 1.4rem;align-items: baseline;}
    body.pagina-chiara .privacy-policy > p .labelprivacy { flex: 0 0 11.5rem; margin: 0; }
}


h3 strong, h2 strong, p strong {
    font-weight: 700;
}

body:is([data-tipopag="privacy"],[data-tipopag="cookie"],[data-tipopag="accessibility"]) :is(.privacy-policy,.cookie-policy,.accessibility-policy) p {
    text-align: left!important;
    color: #3d3d3d!important;
    line-height: 1.8!important;
    margin: 0 0 16px!important
}

body:is([data-tipopag="privacy"],[data-tipopag="cookie"],[data-tipopag="accessibility"]) :is(.privacy-policy,.cookie-policy,.accessibility-policy) strong {
    color: #2d2d2d
}

body:is([data-tipopag="privacy"],[data-tipopag="cookie"],[data-tipopag="accessibility"]) :is(.privacy-policy,.cookie-policy,.accessibility-policy) a {
    color: #c8102e!important;
    text-decoration: underline;
    text-underline-offset: 3px
}


/* =========================================================
   FAQ (plugin plgn-faq) · sezione con id «faq»
   Numero + «filo» turchese: al passaggio si tende e spinge la
   domanda, all'apertura scende in verticale lungo la risposta.
   ========================================================= */
/* base: quello che le sezioni «easy» ricevono dal template */
article section#faq {
    padding: clamp(90px, 14vh, 160px) var(--ec-bordo);
    height: auto;
    overflow: visible;                      /* serve al titolo «sticky» da desktop */
    counter-reset: ec-faq;
}
#faq.row > *, #faq .row > * { padding-left: 0; padding-right: 0; }
#faq .colonnaarea { overflow: visible; }
#faq div.colonnaarea > div.row {
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    height: auto;
    column-gap: clamp(2rem, 6vw, 7rem);
    row-gap: 2.6rem;
}

/* titolo con occhiello */
#faq .colonnaarea > .row > div:has(> h3) { flex: 0 0 100%; max-width: 100%; }
#faq h3 {
    margin: 0;
    font-family: var(--ec-font);
    font-size: clamp(2.1rem, 4.2vw, 4rem);
    line-height: 1.04;
    font-weight: 500;
    letter-spacing: -.03em;
    color: var(--ec-antracite);
    text-wrap: balance;
}
#faq h3::before {
    content: "Domande frequenti";
    display: block;
    margin-bottom: 1.1rem;
    padding-left: 3.1em;
    background: linear-gradient(currentColor, currentColor) left center / 2.4em 2px no-repeat;
    font-size: 1.1rem;
    font-style: italic;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.3;
    color: var(--ec-turchese-scuro);
}
html[lang="en"] #faq h3::before { content: "Frequently asked questions"; }

/* elenco */
#faq .faq-container { flex: 1 1 100%; max-width: 100%; margin: 0; padding: 0; border-top: 1px solid var(--ec-linea); }
#faq .faq-item {
    --q: clamp(1.15rem, .8vw + .85rem, 1.45rem);   /* corpo della domanda */
    --num: 1.4;                                     /* larghezza del numero (em) */
    --spazio: .9;                                   /* spazio tra numero, filo e testo (em) */
    --filo-chiuso: 1.2;
    --filo-aperto: 3;
    counter-increment: ec-faq;
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--ec-linea);
    border-radius: 0;
    background: none;
    box-shadow: none;
}

/* domanda: numero · filo · testo */
#faq .faq-item .faq-question {
    --filo: var(--filo-chiuso);
    display: flex;
    align-items: flex-start;
    gap: calc(var(--spazio) * 1em);
    margin: 0;
    padding: 1.7rem 0;
    list-style: none;
    cursor: pointer;
    background: none;
    border: 0;
    font-family: var(--ec-font);
    font-size: var(--q);
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -.01em;
    text-transform: none;
    color: var(--ec-antracite);
}
#faq .faq-item .faq-question::-webkit-details-marker { display: none; }
#faq .faq-item .faq-question::before {
    content: counter(ec-faq, decimal-leading-zero);
    order: -2;
    flex: none;
    position: static;
    min-width: calc(var(--num) * 1em);
    width: auto;
    height: auto;
    transform: none;
    background: none;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    color: var(--ec-turchese-scuro);
}
#faq .faq-item .faq-question::after {
    content: "";
    order: -1;
    flex: none;
    position: static;
    width: calc(var(--filo) * 1em);
    height: 2px;
    margin-top: calc(.65em - 1px);          /* a metà della prima riga */
    transform: none;
    border: 0;
    border-radius: 2px;
    background: var(--ec-turchese);
    transition: width .55s cubic-bezier(.7, 0, .2, 1);
}
#faq .faq-item .faq-question:hover,
#faq .faq-item .faq-question:focus-visible,
#faq .faq-item[open] > .faq-question { --filo: var(--filo-aperto); }
#faq .faq-item .faq-question:focus-visible { outline: 3px solid var(--ec-turchese); outline-offset: 6px; }

/* risposta: il testo si allinea alla domanda, il filo scende dal punto in cui parte il trattino */
#faq .faq-answer-wrap { margin: 0; padding: 0; border: 0; background: none; }
#faq .faq-answer {
    --attacco: calc(var(--q) * (var(--num) + var(--spazio)));
    position: relative;
    margin: 0;
    padding: 0 0 2.2rem calc(var(--q) * (var(--num) + var(--spazio) * 2 + var(--filo-aperto)));
    background: none;
    border: 0;
    color: var(--ec-testo);
}
#faq .faq-answer::before {
    content: "";
    position: absolute;
    top: .4em;
    bottom: 2.2rem;
    left: var(--attacco);
    width: 2px;
    border-radius: 2px;
    background: var(--ec-turchese);
    transform: scaleY(0);
    transform-origin: top;
}
#faq .faq-item[open] .faq-answer::before { animation: ec-faq-filo .7s cubic-bezier(.7, 0, .2, 1) .1s forwards; }
#faq .faq-answer p { margin: 0 0 .8em; max-width: 62ch; }
#faq .faq-answer p:last-child { margin-bottom: 0; }
#faq .faq-item[open] .faq-answer p { animation: ec-faq-testo .6s ease .25s both; }
#faq .faq-answer a { color: var(--ec-turchese-scuro); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color .2s ease; }
#faq .faq-answer a:hover { color: var(--ec-antracite); }
@keyframes ec-faq-filo { to { transform: scaleY(1); } }
@keyframes ec-faq-testo { from { opacity: 0; transform: translateY(.5em); } }

/* telefono: filo più corto, risposta meno rientrata */
@media (max-width: 767px) {
    #faq .faq-item { --spazio: .7; --filo-chiuso: .9; --filo-aperto: 1.8; }
    #faq .faq-item .faq-question { padding: 1.4rem 0; }
    #faq .faq-answer { padding-left: calc(var(--attacco) + 1.1rem); }
}

/* desktop: titolo fermo a sinistra, domande a destra */
@media (min-width: 992px) {
    #faq .colonnaarea > .row > div:has(> h3) {
        flex: 0 0 30%;
        max-width: 30%;
        position: sticky;
        top: calc(var(--ec-header-h) + 2rem);
        align-self: flex-start;
    }
    #faq .faq-container { flex: 1 1 0; max-width: none; min-width: 0; }
}


/* =========================================================
   ESITO DEL MODULO (popup #esitoSendForm del plugin Form)
   All'apertura un filo turchese si tende sul bordo alto;
   al passaggio su «Chiudi» si riavvolge, come anteprima
   della chiusura.
   ========================================================= */
#esitoSendForm {
    position: fixed;
    inset: 0;
    z-index: 300;                           /* sopra header (100) e menu mobile (200) */
    padding: var(--ec-gutter);
    background: rgba(37, 37, 37, .62);
    font-family: var(--ec-font);
}
#esitoSendForm.show-modal {
    display: flex;
    align-items: center;
    justify-content: center;
    animation: ec-esito-velo .35s ease both;
}

/* card */
#esitoSendForm .modal-content {
    position: relative;
    width: min(100%, 520px);
    margin: 0;
    padding: clamp(2.4rem, 5vw, 3.4rem) clamp(1.6rem, 5vw, 3.2rem) clamp(1.8rem, 4vw, 2.6rem);
    border: 0;
    border-radius: 18px;
    background: var(--ec-bianco);
    box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .35);
    overflow: hidden;
    text-align: left;
}
#esitoSendForm.show-modal .modal-content {animation: ec-esito-entra .55s cubic-bezier(.2, .8, .2, 1) .05s both;padding: 25px;width: auto;}

/* il filo sul bordo alto */
#esitoSendForm .modal-content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--ec-turchese);
    transform-origin: left;
    transition: transform .55s cubic-bezier(.7, 0, .2, 1);
}
#esitoSendForm.show-modal .modal-content::before { animation: ec-esito-filo .8s cubic-bezier(.7, 0, .2, 1) .25s both; }
#esitoSendForm .modal-content:has(#chiudiesitoForm:hover, #chiudiesitoForm:focus-visible)::before { transform: scaleX(.16); }

/* messaggio */
#esitoSendForm .modal-body { margin: 0; padding: 0; }
#esitoSendForm #testopopup {
    margin: 0;
    max-width: none;
    font-size: clamp(1.3rem, 1vw + 1rem, 1.6rem);
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: -.02em;
    color: var(--ec-antracite);
    text-wrap: balance;
}
#esitoSendForm #testopopup span { color: inherit; font: inherit; }
#esitoSendForm #testopopup:has(.esito_success)::before {
    content: "Grazie";
    display: block;
    margin-bottom: 1rem;
    padding-left: 3.1em;
    background: linear-gradient(currentColor, currentColor) left center / 2.4em 2px no-repeat;
    font-size: 1.05rem;
    font-style: italic;
    font-weight: 400;
    letter-spacing: 0;
    color: var(--ec-turchese-scuro);
    display: none;
}
html[lang="en"] #esitoSendForm #testopopup:has(.esito_success)::before { content: "Thank you"; }
/* messaggi diversi dal successo (es. errore): in rosso */
#esitoSendForm #testopopup > span:not(.esito_success) { color: var(--hn-rosso-scuro); }

/* pulsante Chiudi: stesso riempimento dal basso dei pulsanti del sito */
#esitoSendForm .modal-footer {display: flex;justify-content: center;margin: 1.8rem 0 0;padding: 0;border: 0;margin-top: 0;}
#esitoSendForm #chiudiesitoForm {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: .9em 1.8em;
    border: 0;
    border-radius: 999px;
    background: var(--ec-antracite);
    color: var(--ec-bianco);
    font: 500 1rem/1.2 var(--ec-font);
    letter-spacing: .01em;
    text-shadow: none;
    box-shadow: none;
    cursor: pointer;
    overflow: hidden;
    isolation: isolate;
    transition: color .35s ease;
}
#esitoSendForm #chiudiesitoForm::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: inherit;
    background: var(--ec-turchese);
    transform: translateY(101%);
    transition: transform .45s cubic-bezier(.7, 0, .2, 1);
}
#esitoSendForm #chiudiesitoForm:hover::before,
#esitoSendForm #chiudiesitoForm:focus-visible::before { transform: translateY(0); }
#esitoSendForm #chiudiesitoForm:focus-visible { outline: 3px solid var(--ec-turchese); outline-offset: 3px; }

@keyframes ec-esito-velo { from { opacity: 0; } }
@keyframes ec-esito-entra { from { opacity: 0; transform: translateY(18px) scale(.98); } }
@keyframes ec-esito-filo { from { scale: 0 1; } }


#footer .col-sm-5 span.elem:nth-child(6) {
    display: none;
}

#footer a {
    color: inherit;
}