/* Manrope self-hosted (assets/fonts/manrope/, licenza OFL). */
@font-face {
    font-family: "Manrope";
    src: url("../fonts/manrope/Manrope-VariableFont_wght.woff2") format("woff2-variations");
    font-weight: 200 800;
    font-style: normal;
    font-display: swap;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    height: 100%;
}

body {
    margin: 0;
    min-height: 100%;
    background: #fff;
    color: #1a1a1a;
    font-family: "Manrope", system-ui, sans-serif;
    font-size: 1.125rem;
    line-height: 1.7;
}

::selection {
    background: #e7e2d8;
}

a {
    color: inherit;
}

a:focus-visible {
    outline: 2px solid #111;
    outline-offset: 3px;
}

.hb-salta {
    position: absolute;
    left: 1rem;
    top: -4rem;
    background: #111;
    color: #fff;
    padding: 0.45rem 0.75rem;
    text-decoration: none;
}

.hb-salta:focus {
    top: 1rem;
}

.hb-testata {
    padding: 1.1rem 1.5rem;
    background: #fff;
    border-bottom: 1px solid #e6e6e6;
}

.hb-testata-interno,
.hb-piede-interno {
    max-width: var(--hb-pagina, 76rem);
    margin: 0 auto;
}

.hb-testata-interno {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem 2rem;
}

.hb-marca {
    flex: 0 0 auto;
    color: #1d2327;
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: -0.03em;
    text-decoration: none;
}

.hb-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.35rem 1.35rem;
}

.hb-nav a {
    color: #1d2327;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-decoration: none;
    text-transform: uppercase;
}

.hb-nav a:hover,
.hb-nav a[aria-current="page"] {
    color: #2271b1;
}

.hb-lettura,
.hb-cornice {
    max-width: var(--hb-pagina, 76rem);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--hb-margine-lat, 1.5rem);
    padding-right: var(--hb-margine-lat, 1.5rem);
}

.hb-cornice {
    display: flex;
    flex-direction: column;
}

.hb-lettura {
    margin: 0 auto;
    padding-top: 4.5rem;
    padding-bottom: 3rem;
}

.hb-titolo {
    margin: 0;
    font-family: "Manrope", system-ui, sans-serif;
    font-size: clamp(2.6rem, 6vw, 4.4rem);
    font-weight: 500;
    letter-spacing: -0.035em;
    line-height: 1.05;
}

.hb-titolo-minore {
    font-size: clamp(2rem, 4vw, 2.75rem);
}

.hb-sottotitolo {
    margin: 1.25rem 0 0;
    color: inherit;
    opacity: 0.82;
    font-size: 1.3rem;
    line-height: 1.45;
}

/* Nessuno spazio tra i blocchi principali: lo decidono i loro margini. Dentro i contenitori vale la «Spaziatura dei blocchi» del pannello. */
.hb-flusso {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* :where() toglie la specificita': i blocchi che hanno un margine sopra loro (dal pannello o dall'importazione) lo tengono anche dopo un altro blocco. */
:where(.hb-blocco + .hb-blocco) {
    margin-top: 0;
}

.hb-pad-1 { padding-block: 0.35rem; }
.hb-pad-2 { padding-block: 0.7rem; }
.hb-pad-3 { padding-block: 1.05rem; }
.hb-pad-4 { padding-block: 1.5rem; }
.hb-pad-5 { padding-block: 2rem; }
.hb-pad-6 { padding-block: 2.6rem; }

.hb-largo-pieno {
    width: calc(100vw - var(--hb-sbw, 0px) - var(--hb-ml, 0px) - var(--hb-mr, 0px));
    max-width: calc(100vw - var(--hb-sbw, 0px) - var(--hb-ml, 0px) - var(--hb-mr, 0px));
    margin-left: calc(50% - 50vw + var(--hb-sbw, 0px) / 2 + var(--hb-ml, 0px));
    padding-inline: 1.5rem;
}

/* Contenitore a tutto schermo: i blocchi dentro restano nella larghezza della pagina (di partenza), o riempiono tutto con hb-interno-pieno */
.hb-largo-pieno:not(.hb-interno-pieno) > .hb-figli {
    width: 100%;
    max-width: var(--hb-pagina, 76rem);
    margin-inline: auto;
}

.hb-col-50 { max-width: 50%; }
.hb-col-33 { max-width: 33%; }
.hb-col-25 { max-width: 25%; }

.hb-blocco.hb-centra { align-self: center; }
.hb-wn-25 { width: 25%; }
.hb-wn-33 { width: 33.33%; }
.hb-wn-50 { width: 50%; }
.hb-wn-66 { width: 66%; }
.hb-wn-75 { width: 75%; }

.hb-su-4 { margin-top: 4px; }
.hb-su-8 { margin-top: 8px; }
.hb-su-12 { margin-top: 12px; }
.hb-su-16 { margin-top: 16px; }
.hb-su-24 { margin-top: 24px; }
.hb-su-32 { margin-top: 32px; }
.hb-su-40 { margin-top: 40px; }
.hb-su-48 { margin-top: 48px; }
.hb-su-64 { margin-top: 64px; }
.hb-su-80 { margin-top: 80px; }
.hb-giu-4 { margin-bottom: 4px; }
.hb-giu-8 { margin-bottom: 8px; }
.hb-giu-12 { margin-bottom: 12px; }
.hb-giu-16 { margin-bottom: 16px; }
.hb-giu-24 { margin-bottom: 24px; }
.hb-giu-32 { margin-bottom: 32px; }
.hb-giu-40 { margin-bottom: 40px; }
.hb-giu-48 { margin-bottom: 48px; }
.hb-giu-64 { margin-bottom: 64px; }
.hb-giu-80 { margin-bottom: 80px; }

.hb-dim-14 { font-size: 14px; }
.hb-dim-16 { font-size: 16px; }
.hb-dim-18 { font-size: 18px; }
.hb-dim-20 { font-size: 20px; }
.hb-dim-24 { font-size: 24px; }
.hb-dim-28 { font-size: 28px; }
.hb-dim-32 { font-size: 32px; }
.hb-dim-40 { font-size: 40px; }
.hb-dim-48 { font-size: 48px; }
.hb-dim-56 { font-size: 56px; }
.hb-dim-64 { font-size: 64px; }
.hb-dim-72 { font-size: 72px; }

.hb-liv-h2 .hb-titolo { font-size: clamp(2rem, 4vw, 2.75rem); }
.hb-liv-h3 .hb-titolo { font-size: 1.75rem; }
.hb-liv-h4 .hb-titolo { font-size: 1.35rem; }
.hb-liv-h5 .hb-titolo { font-size: 1.15rem; }
.hb-liv-h6 .hb-titolo { font-size: 1rem; }
.hb-dim-14 .hb-titolo,
.hb-dim-16 .hb-titolo,
.hb-dim-18 .hb-titolo,
.hb-dim-20 .hb-titolo,
.hb-dim-24 .hb-titolo,
.hb-dim-28 .hb-titolo,
.hb-dim-32 .hb-titolo,
.hb-dim-40 .hb-titolo,
.hb-dim-48 .hb-titolo,
.hb-dim-56 .hb-titolo,
.hb-dim-64 .hb-titolo,
.hb-dim-72 .hb-titolo { font-size: inherit; }

.hb-blocco-riga > .hb-figli,
.hb-blocco-colonne > .hb-figli,
.hb-blocco-colonna > .hb-figli,
.hb-blocco-contenuto > .hb-figli, .hb-blocco-gruppo > .hb-figli,
.hb-blocco-header > .hb-figli,
.hb-blocco-footer > .hb-figli {
    display: flex;
    gap: 1rem;
    min-height: 0;
}

.hb-editor .hb-blocco-contenuto,
.hb-editor .hb-blocco-gruppo,
.hb-editor .hb-blocco-riga,
.hb-editor .hb-blocco-colonne,
.hb-editor .hb-blocco-colonna,
.hb-editor .hb-blocco-header,
.hb-editor .hb-blocco-footer {
    position: relative;
}

/* Come in WordPress: nessun tratteggio e nessuna etichetta a riposo. Il nome del blocco e dove ti trovi stanno nella barra;
   il contorno compare solo sul contenitore selezionato o passando sull'icona del genitore nella barra. */
.hb-editor .hb-etichetta {
    display: none;
}

.hb-editor .hb-evidenzia {
    outline: 2px solid #2271b1;
    outline-offset: -2px;
    box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 0.7);
}

.hb-slot {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
    border: 0;
    color: #787c82;
    font-size: 1.25rem;
    line-height: 1;
}

.hb-blocco-contenuto > .hb-figli, .hb-blocco-gruppo > .hb-figli,
.hb-blocco-colonna > .hb-figli,
.hb-blocco-header > .hb-figli,
.hb-blocco-footer > .hb-figli { flex-direction: column; }
.hb-blocco-colonna { min-width: 0; container-type: inline-size; }
.hb-blocco-colonna > .hb-figli > .hb-blocco { min-width: 0; max-width: 100%; }
.hb-blocco-colonna > .hb-figli > .hb-blocco.hb-w-px { max-width: none; }
.hb-blocco-colonna .hb-titolo,
.hb-blocco-colonna .hb-sottotitolo,
.hb-blocco-colonna .hb-testo {
    max-width: 100%;
    overflow-wrap: break-word;
}
.hb-blocco-colonna .hb-titolo {
    font-size: clamp(1.2rem, 11cqi, 2rem);
    letter-spacing: -0.02em;
}
.hb-editor .hb-blocco-colonna > .hb-figli { padding: 0.15rem 0.45rem; }
.hb-editor .hb-blocco-colonna > .hb-figli:not(:has(> .hb-blocco)) {
    min-height: 2rem;
    padding: 0;
    align-items: center;
    justify-content: center;
}
.hb-editor .hb-blocco-colonna .hb-selezionato { outline-offset: 1px; }
.hb-blocco-riga > .hb-figli { flex-direction: row; align-items: flex-start; }
.hb-blocco-riga > .hb-figli > .hb-blocco { flex: 1 1 0; min-width: 0; }
.hb-blocco-riga.hb-align-centro > .hb-figli { justify-content: center; }
.hb-blocco-riga.hb-align-destra > .hb-figli { justify-content: flex-end; }
.hb-blocco-riga.hb-align-centro > .hb-figli > .hb-blocco,
.hb-blocco-riga.hb-align-destra > .hb-figli > .hb-blocco { flex: 0 1 auto; }
.hb-blocco-colonne > .hb-figli { gap: 0; align-items: start; }
.hb-colnum-2 > .hb-figli { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.hb-colnum-3 > .hb-figli { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.hb-colnum-4 > .hb-figli { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; }

.hb-testo h1,
.hb-testo h2,
.hb-testo h3,
.hb-testo h4,
.hb-testo h5,
.hb-testo h6 { margin: 0.6em 0 0.3em; line-height: 1.2; }
.hb-testo h1 { font-size: 2rem; }
.hb-testo h2 { font-size: clamp(1.7rem, 3.2vw, 2.4rem); letter-spacing: -0.02em; }
.hb-testo h3 { font-size: 1.3rem; }
.hb-testo h4 { font-size: 1.1rem; }
.hb-testo h5 { font-size: 1rem; }
.hb-testo h6 { font-size: 0.9rem; }

@media (max-width: 700px) {
    .hb-blocco-riga > .hb-figli,
    .hb-colnum-2 > .hb-figli,
    .hb-colnum-3 > .hb-figli,
    .hb-colnum-4 > .hb-figli,
    .hb-blocco-colonne > .hb-figli {
        display: flex;
        flex-direction: column;
    }
    .hb-blocco-colonna {
        width: 100%;
        max-width: 100%;
        container-type: normal;
    }
    /* Colonne con «Impila su telefono» spento: restano affiancate, con le loro misure. */
    .hb-blocco-colonne.hb-no-impila > .hb-figli {
        display: grid;
        flex-direction: row;
    }
}

/* Blog: articolo singolo ed elenco */
.hb-articolo-meta {
    margin: 0 0 1.2rem;
    color: #6b6b6b;
    font-size: 0.95rem;
}

.hb-articolo-immagine {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 0 1.5rem;
}

.hb-titolo-elenco {
    margin-bottom: 2rem;
}

.hb-scheda-articolo {
    margin: 0 0 2.2rem;
    padding: 0 0 2.2rem;
    border-bottom: 1px solid #e6e6e6;
}

.hb-scheda-immagine img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    margin: 0 0 1rem;
}

.hb-scheda-titolo {
    margin: 0 0 0.3rem;
    font-size: 1.6rem;
    line-height: 1.25;
    letter-spacing: -0.01em;
}

.hb-scheda-titolo a {
    text-decoration: none;
}

.hb-scheda-titolo a:hover {
    text-decoration: underline;
}

.hb-scheda-riassunto {
    margin: 0.6rem 0 0.8rem;
}

.hb-scheda-leggi {
    margin: 0;
}

.hb-scheda-leggi a {
    font-weight: 600;
}

.hb-ricerca {
    display: flex;
    gap: 0.5rem;
    margin: 0 0 2rem;
}

.hb-ricerca-etichetta {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.hb-ricerca input {
    flex: 1;
    min-width: 0;
    padding: 0.55rem 0.75rem;
    border: 1px solid #c9c9c9;
    background: #fff;
    color: inherit;
    font: inherit;
    font-size: 1rem;
}

.hb-ricerca button {
    padding: 0.55rem 1rem;
    border: 1px solid #1a1a1a;
    background: #1a1a1a;
    color: #fff;
    font: inherit;
    font-size: 1rem;
    cursor: pointer;
}

.hb-articolo-tassonomia {
    margin: 1.2rem 0 0;
    color: #6b6b6b;
    font-size: 0.95rem;
}

.hb-articolo-tassonomia a {
    color: inherit;
}

.hb-intro-elenco {
    margin-top: -1.2rem;
    margin-bottom: 2rem;
}

.hb-paginazione {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.95rem;
}

.hb-pag-stato {
    color: #6b6b6b;
}

.hb-paginazione {
    flex-wrap: wrap;
}

.hb-paginazione a {
    display: inline-block;
    padding: 0.55rem 0.9rem;
    border: 1px solid #d6d6d6;
    text-decoration: none;
}

.hb-ricerca input,
.hb-ricerca button {
    min-height: 44px;
}

@media (max-width: 560px) {
    .hb-scheda-titolo {
        font-size: 1.35rem;
    }

    .hb-paginazione {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    .hb-pag-stato {
        order: -1;
    }

    .hb-paginazione a {
        padding: 0.8rem 1rem;
    }

    .hb-paginazione span:empty {
        display: none;
    }
}

.hb-testo p {
    margin: 0 0 1.1em;
}

.hb-testo s {
    text-decoration: line-through;
}

.hb-testo code,
.hb-testo kbd {
    font-family: ui-monospace, Consolas, monospace;
    font-size: 0.92em;
}

.hb-testo kbd {
    border: 1px solid #1e1e1e;
    padding: 0 0.25em;
}

.hb-testo mark {
    background: #f6e7a2;
    color: inherit;
}

.hb-testo p:last-child {
    margin-bottom: 0;
}

.hb-testo a {
    text-underline-offset: 0.15em;
}

.hb-blocco-immagine {
    margin-left: 0;
    margin-right: 0;
    max-width: 100%;
}

.hb-blocco-riga > .hb-figli > .hb-blocco-immagine,
.hb-blocco-colonna > .hb-figli > .hb-blocco-immagine,
.hb-blocco-contenuto > .hb-figli > .hb-blocco-immagine,
.hb-blocco-gruppo > .hb-figli > .hb-blocco-immagine,
.hb-blocco-header > .hb-figli > .hb-blocco-immagine,
.hb-blocco-footer > .hb-figli > .hb-blocco-immagine {
    flex: 0 0 auto;
    max-width: 100%;
}

.hb-blocco-immagine img {
    display: block;
    max-width: 100%;
    height: auto;
}

.hb-didascalia {
    margin-top: 0.65rem;
    color: #666;
    font-size: 0.875rem;
    line-height: 1.45;
}

.hb-align-centro {
    text-align: center;
}

.hb-align-destra {
    text-align: right;
}

.hb-blocco-menu > .hb-voci {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.125rem;
    align-items: center;
}

.hb-blocco-menu.hb-align-centro > .hb-voci {
    justify-content: center;
}

.hb-blocco-menu.hb-align-destra > .hb-voci {
    justify-content: flex-end;
}

.hb-blocco-menu > .hb-voci a {
    color: inherit;
    text-decoration: none;
}

.hb-blocco-menu .hb-voce {
    position: relative;
}

.hb-blocco-menu .hb-sotto {
    display: none;
    position: absolute;
    z-index: 5;
    top: 100%;
    left: 0;
    min-width: 200px;
    padding: 8px 0;
    gap: 0;
    border: 1px solid var(--hb-t-bordo, #dcdcde);
    border-radius: 0;
    background: var(--hb-menu-fondo, var(--hb-t-fondo-alt, #f4f4f1));
    text-align: left;
    flex-direction: column;
}

.hb-blocco-menu.hb-align-destra .hb-sotto {
    left: auto;
    right: 0;
}

/* Testo dei sottomenu: di partenza segue il menu; si puo' scegliere a parte */
.hb-blocco-menu.hb-sotto-sinistra .hb-sotto { text-align: left; }
.hb-blocco-menu.hb-sotto-centro .hb-sotto { text-align: center; }
.hb-blocco-menu.hb-sotto-destra .hb-sotto { text-align: right; }

/* Il sottomenu sta attaccato alla voce (resta aperto passando dal collegamento al riquadro) e sopra le fasce che seguono */
.hb-blocco:has(> .hb-figli .hb-blocco-menu .hb-sotto),
.hb-blocco:has(> .hb-figli .hb-blocco-menu .hb-voce) {
    position: relative;
    z-index: 20;
}

.hb-blocco-menu .hb-voce:hover > .hb-sotto,
.hb-blocco-menu .hb-voce:focus-within > .hb-sotto {
    display: flex;
}

.hb-blocco-menu .hb-sotto a {
    padding: 8px 14px;
    border-radius: 0;
    white-space: nowrap;
}

/* Le voci seguono colore, dimensione, peso e tipografia scelti per il blocco; al passaggio del mouse si schiariscono */
.hb-blocco-menu > .hb-voci > a,
.hb-blocco-menu .hb-voce > a {
    transition: opacity 0.15s ease;
}

.hb-blocco-menu > .hb-voci > a:hover,
.hb-blocco-menu > .hb-voci > a:focus-visible,
.hb-blocco-menu .hb-voce > a:hover,
.hb-blocco-menu .hb-voce:focus-within > a,
.hb-blocco-menu .hb-sotto a:hover,
.hb-blocco-menu .hb-sotto a:focus-visible {
    opacity: 0.7;
}

@media (min-width: 761px) {
    .hb-blocco-menu > .hb-voci > a,
    .hb-blocco-menu .hb-voce > a {
        display: inline-flex;
        align-items: center;
        min-height: 2.5rem;
    }

    .hb-blocco-menu .hb-voce > a::after {
        display: inline-block;
        width: 0.32em;
        height: 0.32em;
        margin: -0.2em 0 0 0.45em;
        opacity: 0.7;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg);
        vertical-align: middle;
        content: "";
    }
}

.hb-blocco-contenuto.hb-align-centro > .hb-figli > .hb-blocco-immagine,
.hb-blocco-gruppo.hb-align-centro > .hb-figli > .hb-blocco-immagine,
.hb-blocco-colonna.hb-align-centro > .hb-figli > .hb-blocco-immagine,
.hb-blocco-header.hb-align-centro > .hb-figli > .hb-blocco-immagine,
.hb-blocco-footer.hb-align-centro > .hb-figli > .hb-blocco-immagine {
    align-self: center;
}

.hb-blocco-contenuto.hb-align-destra > .hb-figli > .hb-blocco-immagine,
.hb-blocco-gruppo.hb-align-destra > .hb-figli > .hb-blocco-immagine,
.hb-blocco-colonna.hb-align-destra > .hb-figli > .hb-blocco-immagine,
.hb-blocco-header.hb-align-destra > .hb-figli > .hb-blocco-immagine,
.hb-blocco-footer.hb-align-destra > .hb-figli > .hb-blocco-immagine {
    align-self: flex-end;
}

.hb-blocco-contenuto > .hb-figli > .hb-ha-misura.hb-align-centro,
.hb-blocco-gruppo > .hb-figli > .hb-ha-misura.hb-align-centro,
.hb-blocco-colonna > .hb-figli > .hb-ha-misura.hb-align-centro,
.hb-blocco-header > .hb-figli > .hb-ha-misura.hb-align-centro,
.hb-blocco-footer > .hb-figli > .hb-ha-misura.hb-align-centro,
article > .hb-flusso > .hb-ha-misura.hb-align-centro,
.hb-cornice > .hb-ha-misura.hb-align-centro,
.hb-blocco-contenuto > .hb-figli > .hb-blocco-immagine.hb-align-centro,
.hb-blocco-gruppo > .hb-figli > .hb-blocco-immagine.hb-align-centro,
.hb-blocco-colonna > .hb-figli > .hb-blocco-immagine.hb-align-centro,
.hb-blocco-header > .hb-figli > .hb-blocco-immagine.hb-align-centro,
.hb-blocco-footer > .hb-figli > .hb-blocco-immagine.hb-align-centro,
article > .hb-flusso > .hb-blocco-immagine.hb-align-centro,
.hb-cornice > .hb-blocco-immagine.hb-align-centro {
    align-self: center;
}

.hb-blocco-contenuto > .hb-figli > .hb-ha-misura.hb-align-destra,
.hb-blocco-gruppo > .hb-figli > .hb-ha-misura.hb-align-destra,
.hb-blocco-colonna > .hb-figli > .hb-ha-misura.hb-align-destra,
.hb-blocco-header > .hb-figli > .hb-ha-misura.hb-align-destra,
.hb-blocco-footer > .hb-figli > .hb-ha-misura.hb-align-destra,
article > .hb-flusso > .hb-ha-misura.hb-align-destra,
.hb-cornice > .hb-ha-misura.hb-align-destra,
.hb-blocco-contenuto > .hb-figli > .hb-blocco-immagine.hb-align-destra,
.hb-blocco-gruppo > .hb-figli > .hb-blocco-immagine.hb-align-destra,
.hb-blocco-colonna > .hb-figli > .hb-blocco-immagine.hb-align-destra,
.hb-blocco-header > .hb-figli > .hb-blocco-immagine.hb-align-destra,
.hb-blocco-footer > .hb-figli > .hb-blocco-immagine.hb-align-destra,
article > .hb-flusso > .hb-blocco-immagine.hb-align-destra,
.hb-cornice > .hb-blocco-immagine.hb-align-destra {
    align-self: flex-end;
}

.hb-align-centro .hb-sottotitolo,
.hb-align-destra .hb-sottotitolo {
    margin-left: auto;
    margin-right: auto;
}

.hb-align-destra .hb-sottotitolo {
    margin-right: 0;
}

.hb-piede {
    padding: 0 1.5rem 3.5rem;
}

.hb-piede-interno {
    border-top: 1px solid #ececec;
    padding-top: 1.25rem;
    color: #666;
    font-size: 0.875rem;
}

@media (max-width: 640px) {
    .hb-lettura {
        padding-top: 3rem;
    }
}

/* Le pagine a blocchi non hanno spazio proprio sopra e sotto: lo decidono i blocchi (come in WordPress). Articoli ed elenchi del blog lo tengono. */
.hb-lettura.hb-lettura-blocchi {
    padding-top: 0;
    padding-bottom: 0;
}

/* Selettore di lingua del sito: piccolo, in alto, con punti toccabili da 44 px. */
.hb-lingue {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.25rem;
    padding: 0.25rem 1rem 0;
    font-size: 0.875rem;
}

.hb-lingua {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: 0 0.75rem;
    color: inherit;
    text-decoration: none;
}

a.hb-lingua {
    text-decoration: underline;
}

.hb-lingua-attiva {
    font-weight: 700;
}

/* Menu del sito sul telefono: un pulsante apre l'elenco, i sottomenu si aprono con il loro pulsante. */
.hb-menu-apri,
.hb-sotto-apri {
    display: none;
}

@media (max-width: 760px) {
    .hb-js .hb-blocco-menu .hb-menu-apri {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2.75rem;
        height: 2.75rem;
        padding: 0;
        border: 1px solid currentColor;
        border-radius: 0;
        background: transparent;
        color: inherit;
        cursor: pointer;
    }

    .hb-menu-barre,
    .hb-menu-barre::before,
    .hb-menu-barre::after {
        display: block;
        width: 1.25rem;
        height: 2px;
        background: currentColor;
        border-radius: 1px;
        content: "";
    }

    .hb-menu-barre {
        position: relative;
    }

    .hb-menu-barre::before,
    .hb-menu-barre::after {
        position: absolute;
        left: 0;
    }

    .hb-menu-barre::before {
        top: -6px;
    }

    .hb-menu-barre::after {
        top: 6px;
    }

    .hb-js .hb-blocco-menu.hb-menu-aperto .hb-menu-barre {
        background: transparent;
    }

    .hb-js .hb-blocco-menu.hb-menu-aperto .hb-menu-barre::before {
        top: 0;
        transform: rotate(45deg);
    }

    .hb-js .hb-blocco-menu.hb-menu-aperto .hb-menu-barre::after {
        top: 0;
        transform: rotate(-45deg);
    }

    /* L'elenco si apre come un pannello sopra la pagina (largo quanto lo schermo, sotto il pulsante): non spinge giù il resto. */
    .hb-js .hb-blocco-menu > .hb-voci {
        display: none;
        position: fixed;
        top: var(--hb-menu-top, 3.5rem);
        right: 0;
        left: 0;
        z-index: 1000;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        box-sizing: border-box;
        max-height: calc(100vh - var(--hb-menu-top, 3.5rem));
        margin: 0;
        padding: 0.5rem 1.5rem 1.5rem;
        overflow-y: auto;
        overscroll-behavior: contain;
        border-bottom: 1px solid var(--hb-t-bordo, #dcdcde);
        background: var(--hb-menu-fondo, var(--hb-t-fondo, #fff));
        box-shadow: none;
        text-align: inherit;
    }

    .hb-js .hb-blocco-menu > .hb-voci a {
        color: inherit;
        background-image: none;
    }

    .hb-js .hb-blocco-menu.hb-menu-aperto > .hb-voci {
        display: flex;
    }

    .hb-blocco-menu > .hb-voci a {
        display: flex;
        align-items: center;
        min-height: 2.75rem;
        padding: 0.5rem 0;
    }

    .hb-blocco-menu.hb-align-centro > .hb-voci a {
        justify-content: center;
    }

    .hb-blocco-menu.hb-align-destra > .hb-voci a {
        justify-content: flex-end;
    }

    .hb-blocco-menu.hb-sotto-sinistra .hb-sotto a {
        justify-content: flex-start;
    }

    .hb-blocco-menu.hb-sotto-centro .hb-sotto a {
        justify-content: center;
    }

    .hb-blocco-menu.hb-sotto-destra .hb-sotto a {
        justify-content: flex-end;
    }

    .hb-blocco-menu .hb-voce {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        column-gap: 0.75rem;
    }

    .hb-blocco-menu .hb-voce > a {
        flex: 1 1 0;
        min-width: 0;
    }

    .hb-js .hb-blocco-menu .hb-sotto-apri {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2rem;
        height: 2rem;
        padding: 0;
        border: 1px solid currentColor;
        border-radius: 0;
        background: transparent;
        color: inherit;
        cursor: pointer;
    }

    .hb-sotto-apri::before {
        width: 0.5rem;
        height: 0.5rem;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
        content: "";
    }

    .hb-blocco-menu .hb-voce.hb-aperta > .hb-sotto-apri::before {
        transform: rotate(-135deg);
    }

    .hb-js .hb-blocco-menu .hb-sotto,
    .hb-js .hb-blocco-menu .hb-voce:hover > .hb-sotto,
    .hb-js .hb-blocco-menu .hb-voce:focus-within > .hb-sotto {
        display: none;
        position: static;
        width: 100%;
        min-width: 0;
        padding: 0 0 0 12px;
        border: 0;
        background: transparent;
    }

    .hb-js .hb-blocco-menu .hb-voce.hb-aperta > .hb-sotto {
        display: flex;
        margin: 0 0 8px;
    }

    .hb-blocco-menu .hb-sotto a {
        padding: 6px 0;
        font-size: 0.95em;
        white-space: normal;
    }
}

/* Commenti sotto l'articolo */
.hb-commenti {
    max-width: 44rem;
    margin: 3rem auto 2rem;
}

.hb-commenti-titolo {
    margin: 0 0 1rem;
    font-size: 1.4rem;
}

.hb-commento {
    margin: 0 0 1.2rem;
    padding: 0 0 1rem;
    border-bottom: 1px solid #e6e6e6;
}

.hb-commento-testa {
    margin: 0 0 0.3rem;
}

.hb-commento-testa time {
    margin-left: 0.4rem;
    color: #6b6b6b;
    font-size: 0.85rem;
}

.hb-commento-testo {
    overflow-wrap: anywhere;
}

.hb-commento-azioni {
    margin: 0.4rem 0 0;
    font-size: 0.9rem;
}

.hb-commento-azioni a {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
}

.hb-commento-risposte {
    margin: 1rem 0 0 1rem;
    padding-left: 1rem;
    border-left: 3px solid #e6e6e6;
}

.hb-commento-risposte .hb-commento {
    margin-bottom: 0.8rem;
    padding-bottom: 0.8rem;
}

.hb-commenti-avviso {
    margin: 0 0 1rem;
    padding: 0.7rem 0.8rem;
    background: #fcf0f1;
    color: #8a2424;
}

.hb-commenti-ok {
    background: #edfaef;
    color: #1d4f27;
}

.hb-commenti-modulo {
    margin: 2rem 0 0;
}

.hb-commenti-modulo label {
    display: block;
    margin: 0 0 0.3rem;
    font-weight: 600;
}

.hb-commenti-modulo textarea {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-height: 8rem;
    margin: 0 0 0.8rem;
    padding: 0.6rem;
    border: 1px solid #8c8f94;
    font: inherit;
    font-size: 16px;
}

.hb-commenti-invia {
    min-height: 2.75rem;
    padding: 0 1.2rem;
    border: 0;
    background: #2271b1;
    color: #fff;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.hb-commenti-annulla {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    margin-left: 0.8rem;
}

.hb-commenti-altri a,
.hb-commenti-accedi a {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
}

.hb-esca {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Icone dei testi: maschere (un file in assets/icone per ognuna, caricato solo se serve). Prendono il colore del testo. */
.hb-i {
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    vertical-align: -0.25em;
    background: currentColor;
    -webkit-mask: var(--hb-icona) center / contain no-repeat;
    mask: var(--hb-icona) center / contain no-repeat;
}

.hb-i-grande {
    width: 2.4em;
    height: 2.4em;
}

.hb-i-enorme {
    width: 4em;
    height: 4em;
}
.hb-i-calendario { --hb-icona: url("../icone/calendario.svg"); }
.hb-i-utente { --hb-icona: url("../icone/utente.svg"); }
.hb-i-euro { --hb-icona: url("../icone/euro.svg"); }
.hb-i-grafico { --hb-icona: url("../icone/grafico.svg"); }
.hb-i-lucchetto { --hb-icona: url("../icone/lucchetto.svg"); }
.hb-i-messaggio { --hb-icona: url("../icone/messaggio.svg"); }
.hb-i-casa { --hb-icona: url("../icone/casa.svg"); }
.hb-i-ricerca { --hb-icona: url("../icone/ricerca.svg"); }
.hb-i-stella { --hb-icona: url("../icone/stella.svg"); }
.hb-i-cuore { --hb-icona: url("../icone/cuore.svg"); }
.hb-i-spunta { --hb-icona: url("../icone/spunta.svg"); }
.hb-i-freccia { --hb-icona: url("../icone/freccia.svg"); }
.hb-i-mail { --hb-icona: url("../icone/mail.svg"); }
.hb-i-telefono { --hb-icona: url("../icone/telefono.svg"); }
.hb-i-mondo { --hb-icona: url("../icone/mondo.svg"); }
.hb-i-orologio { --hb-icona: url("../icone/orologio.svg"); }
.hb-i-fulmine { --hb-icona: url("../icone/fulmine.svg"); }
.hb-i-scudo { --hb-icona: url("../icone/scudo.svg"); }
.hb-i-ingranaggio { --hb-icona: url("../icone/ingranaggio.svg"); }
.hb-i-carrello { --hb-icona: url("../icone/carrello.svg"); }
.hb-i-razzo { --hb-icona: url("../icone/razzo.svg"); }
.hb-i-libro { --hb-icona: url("../icone/libro.svg"); }
.hb-i-posizione { --hb-icona: url("../icone/posizione.svg"); }
.hb-i-occhio { --hb-icona: url("../icone/occhio.svg"); }

/* Pulsanti, tabelle e fisarmoniche nei testi */
.hb-testo a.hb-pulsante,
.hb-testo a.hb-pulsante-contorno,
.hb-testo a.hb-pulsante-freccia {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    min-height: 2.75rem;
    padding: 0.5em 1.4em;
    border: 2px solid var(--hb-t-azione, #111);
    border-radius: 999px;
    background: var(--hb-t-azione, #111);
    color: var(--hb-t-azione-testo, #fff);
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
}

.hb-testo a.hb-pulsante-contorno {
    background: transparent;
    color: var(--hb-t-azione, #111);
}

.hb-testo a.hb-pulsante-freccia {
    padding-inline: 0;
    border-color: transparent;
    background: transparent;
    color: inherit;
}

.hb-testo a.hb-pulsante-freccia::after {
    content: "→";
    transition: transform 0.15s;
}

.hb-testo a.hb-pulsante-freccia:hover::after {
    transform: translateX(0.25em);
}

.hb-testo table {
    width: 100%;
    margin: 1rem 0;
    border-collapse: collapse;
    table-layout: fixed;
}

.hb-testo th,
.hb-testo td {
    padding: 0.7rem 0.9rem;
    border-bottom: 1px solid var(--hb-t-bordo, #e6e6e6);
    text-align: left;
    vertical-align: top;
    overflow-wrap: anywhere;
}

.hb-testo th {
    font-weight: 700;
}

.hb-testo tbody tr:nth-child(even) {
    background: rgba(127, 127, 127, 0.08);
}

.hb-testo details {
    border-bottom: 1px solid var(--hb-t-bordo, #e6e6e6);
}

.hb-testo summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 2.75rem;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}

.hb-testo summary::-webkit-details-marker {
    display: none;
}

.hb-testo summary::after {
    content: "+";
    font-size: 1.5em;
    line-height: 1;
}

.hb-testo details[open] > summary::after {
    content: "−";
}

.hb-testo details > :not(summary) {
    margin: 0 0 1rem;
}

/* Sfondi dei blocchi: immagine di fondo e strato colorato (due elementi in testa al blocco), angoli e ombra */
.hb-ha-sfondo,
.hb-blocco[class*="hb-ang-"] {
    position: relative;
    overflow: hidden;
}

.hb-ha-sfondo {
    isolation: isolate;
}

.hb-sfondo-img,
.hb-strato {
    position: absolute;
    inset: 0;
    z-index: -1;
}

.hb-sfondo-img {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
}

.hb-blocco:has(> .hb-strato) {
    position: relative;
    isolation: isolate;
}

.hb-ang-8 { border-radius: 8px; }
.hb-ang-16 { border-radius: 16px; }
.hb-ang-24 { border-radius: 24px; }
.hb-ang-32 { border-radius: 32px; }
.hb-ang-48 { border-radius: 48px; }

.hb-ombra-1 { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12); }
.hb-ombra-2 { box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14); }
.hb-ombra-3 { box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22); }

/* Colori del tema oltre a fondo e testo: accento e fondo alternativo (per i pattern e le fasce di sezione) */
.hb-tema-fondo-alt { background-color: var(--hb-t-fondo-alt, transparent); }
.hb-tema-fondo-accento { background-color: var(--hb-t-accento, #2f5bea); color: var(--hb-t-azione-testo, #fff); }
.hb-tema-testo-accento { color: var(--hb-t-accento, #2f5bea); }

/* Parti di testo dei pattern: sopratitolo, testo d'apertura, numero in evidenza, distintivo */
.hb-testo p.hb-kicker {
    margin: 0 0 0.6rem;
    font-size: 0.8em;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hb-t-accento, #2f5bea);
}

.hb-testo p.hb-lead {
    font-size: 1.25em;
    line-height: 1.5;
    opacity: 0.85;
}

.hb-testo p.hb-numero {
    margin: 0;
    font-size: clamp(2.5rem, 6vw, 4.5rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.03em;
}

.hb-testo p.hb-piccolo {
    font-size: 0.85em;
    opacity: 0.75;
}

.hb-testo p.hb-distintivo {
    display: inline-block;
    margin: 0 0 1rem;
    padding: 0.25rem 0.9rem;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 0.8em;
    font-weight: 600;
}

.hb-testo .hb-maiuscolo { text-transform: uppercase; }

/* Rientro di paragrafi e citazioni (in rem). Senza classe la citazione resta con il rientro di partenza del browser. */
.hb-testo p.hb-rientro-0, .hb-testo blockquote.hb-rientro-0 { margin-left: 0; }
.hb-testo p.hb-rientro-1, .hb-testo blockquote.hb-rientro-1 { margin-left: 1rem; }
.hb-testo p.hb-rientro-2, .hb-testo blockquote.hb-rientro-2 { margin-left: 2rem; }
.hb-testo p.hb-rientro-3, .hb-testo blockquote.hb-rientro-3 { margin-left: 3rem; }
.hb-testo p.hb-rientro-4, .hb-testo blockquote.hb-rientro-4 { margin-left: 4rem; }
.hb-testo p.hb-rientro-6, .hb-testo blockquote.hb-rientro-6 { margin-left: 6rem; }

/* Pulsanti per sfondi colorati o scuri */
.hb-testo a.hb-pulsante-chiaro,
.hb-testo a.hb-pulsante-contorno-chiaro {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    min-height: 2.75rem;
    padding: 0.5em 1.4em;
    border: 2px solid currentColor;
    border-radius: 999px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
}

.hb-testo a.hb-pulsante-chiaro {
    border-color: #fff;
    background: #fff;
    color: #111;
}

.hb-testo a.hb-pulsante-contorno-chiaro {
    background: transparent;
    color: inherit;
}

.hb-testo p + p > a.hb-pulsante,
.hb-testo p > a.hb-pulsante + a.hb-pulsante-contorno,
.hb-testo p > a + a { margin-left: 0.6rem; }

body {
    overflow-x: clip;
}

/* Collegamento semplice per piedi e sfondi scuri: prende il colore del testo */
.hb-testo a.hb-freccia {
    color: inherit;
    text-decoration: none;
}

.hb-testo a.hb-freccia:hover {
    text-decoration: underline;
}

/* Pulsante WhatsApp del sito */
.hb-wa {
    position: fixed;
    bottom: 1.25rem;
    z-index: 900;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.hb-wa-destra {
    right: 1.25rem;
    align-items: flex-end;
}

.hb-wa-sinistra {
    left: 1.25rem;
    align-items: flex-start;
}

.hb-js .hb-wa:not(.hb-wa-pronto) {
    display: none;
}

.hb-wa-fab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #25d366;
    color: #fff;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.hb-wa-fab:hover,
.hb-wa-fab:focus-visible {
    background: #1fb855;
}

.hb-wa-pannello {
    box-sizing: border-box;
    width: min(21rem, calc(100vw - 2.5rem));
    max-height: calc(100vh - 7rem);
    overflow-y: auto;
    border: 1px solid var(--hb-t-bordo, #dcdcde);
    background: var(--hb-t-fondo, #fff);
    color: var(--hb-t-testo, #1d2327);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18);
}

.hb-wa-pannello[hidden] {
    display: none;
}

.hb-wa-testa {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: #128c7e;
    color: #fff;
}

.hb-wa-marchio {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
}

.hb-wa-chiudi {
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
}

.hb-wa-corpo {
    padding: 1rem;
}

.hb-wa-bolla {
    margin: 0 0 0.5rem;
    padding: 0.6rem 0.8rem;
    background: var(--hb-t-fondo-alt, #f0f2f5);
}

.hb-wa-privacy {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0.75rem 0;
    font-size: 0.85rem;
}

.hb-wa-privacy input {
    flex: 0 0 auto;
    margin-top: 0.2rem;
}

.hb-wa-operatori {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hb-wa-op {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--hb-t-bordo, #dcdcde);
    color: inherit;
    text-decoration: none;
}

.hb-wa-op:hover,
.hb-wa-op:focus-visible {
    border-color: #25d366;
}

.hb-wa-op.hb-wa-bloccato {
    opacity: 0.5;
    cursor: not-allowed;
}

.hb-wa-op > .hb-wa-icona {
    flex: 0 0 auto;
    color: #25d366;
}

.hb-wa-iniziale {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: #128c7e;
    color: #fff;
    font-weight: 600;
}

.hb-wa-chi {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
}

.hb-wa-nome {
    font-weight: 600;
}

.hb-wa-ruolo {
    font-size: 0.85rem;
    opacity: 0.7;
}

/* Blocco Pulsante: il blocco stesso e' il pulsante. Colori, bordo, angoli, spazi e misure del pannello valgono sopra questi valori di partenza */
:where(.hb-blocco-pulsante) {
    box-sizing: border-box;
    padding: 0.5em 1.4em;
    border: 2px solid transparent;
    border-radius: 999px;
    background: var(--hb-t-azione, #111);
    color: var(--hb-t-azione-testo, #fff);
    font-weight: 600;
    line-height: 1.2;
}

:where(.hb-blocco-pulsante.hb-asp-contorno) {
    background: transparent;
    color: var(--hb-t-azione, #111);
    border-color: var(--hb-t-azione, #111);
}

:where(.hb-blocco-pulsante.hb-asp-chiaro) {
    background: #fff;
    color: #111;
}

:where(.hb-blocco-pulsante.hb-asp-contorno-chiaro) {
    background: transparent;
    color: #fff;
    border-color: currentColor;
}

:where(.hb-blocco-pulsante.hb-asp-freccia) {
    padding-inline: 0;
    background: transparent;
    color: inherit;
}

.hb-blocco-pulsante.hb-forma-quadrato {
    border-radius: 0;
}

.hb-blocco-pulsante.hb-forma-soft {
    border-radius: 6px;
}

.hb-blocco-pulsante.hb-forma-tondo {
    border-radius: 14px;
}

.hb-blocco-pulsante.hb-forma-pillola {
    border-radius: 999px;
}

.hb-blocco-pulsante {
    position: relative;
    width: fit-content;
    max-width: 100%;
    align-self: flex-start;
}

.hb-blocco-pulsante.hb-align-centro {
    align-self: center;
}

.hb-blocco-pulsante.hb-align-destra {
    align-self: flex-end;
}

.hb-blocco-riga > .hb-figli > .hb-blocco-pulsante {
    flex: 0 1 auto;
    align-self: auto;
}

.hb-pulsante-el,
.hb-pulsante-testo {
    display: block;
    color: inherit;
    text-align: center;
    text-decoration: none;
    overflow-wrap: anywhere;
}

/* Il collegamento copre tutto il pulsante, anche lo spazio dentro */
a.hb-pulsante-el::before {
    position: absolute;
    inset: 0;
    content: "";
}

.hb-asp-freccia .hb-pulsante-el::after,
.hb-asp-freccia .hb-pulsante-testo::after {
    margin-left: 0.5em;
    content: "→";
    transition: transform 0.15s;
}

.hb-asp-freccia:hover .hb-pulsante-el::after {
    transform: translateX(0.25em);
}

/* Moduli (form) del sito */
.hb-modulo {
    max-width: 44rem;
}

.hb-modulo-campi {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.hb-modulo-campo {
    min-width: 0;
}

.hb-modulo-intera {
    grid-column: 1 / -1;
}

@media (max-width: 600px) {
    .hb-modulo-meta {
        grid-column: 1 / -1;
    }
}

.hb-modulo label,
.hb-modulo legend {
    display: block;
    margin: 0 0 0.35rem;
    font-weight: 600;
}

.hb-modulo input[type="text"],
.hb-modulo input[type="email"],
.hb-modulo input[type="tel"],
.hb-modulo input[type="date"],
.hb-modulo select,
.hb-modulo textarea {
    box-sizing: border-box;
    width: 100%;
    padding: 0.7rem 0.8rem;
    border: 1px solid #7a7a81;
    border-radius: 0;
    background: var(--hb-t-fondo, #fff);
    color: var(--hb-t-testo, inherit);
    font: inherit;
}

.hb-modulo input:focus,
.hb-modulo select:focus,
.hb-modulo textarea:focus {
    border-color: var(--hb-t-testo, #1a1a1a);
    outline: none;
}

.hb-modulo fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.hb-modulo .hb-modulo-opzione {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0 0 0.35rem;
    font-weight: 400;
}

.hb-modulo .hb-modulo-opzione input {
    flex: 0 0 auto;
    margin-top: 0.3rem;
}

.hb-modulo-obbl {
    color: #b3261e;
}

.hb-modulo-verifica,
.hb-modulo-invia {
    margin-top: 1rem;
}

.hb-modulo-invia {
    padding: 0.75rem 1.6rem;
    border: 2px solid transparent;
    border-radius: 999px;
    background: var(--hb-t-azione, #111);
    color: var(--hb-t-azione-testo, #fff);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.hb-modulo-invia:disabled {
    opacity: 0.6;
    cursor: wait;
}

.hb-modulo-esito {
    margin: 1rem 0 0;
    padding: 0.75rem 1rem;
    border-left: 4px solid #1a7f37;
    background: var(--hb-t-fondo-alt, #f4f4f1);
}

.hb-modulo-esito[hidden] {
    display: none;
}

.hb-modulo-esito.hb-modulo-errore {
    border-left-color: #b3261e;
}

.hb-modulo-segnaposto {
    padding: 1rem;
    border: 1px dashed #949494;
    background: #f6f7f7;
    color: #1e1e1e;
}

.hb-shortcode-segnaposto {
    padding: 1rem;
    border: 1px dashed #949494;
    background: #f6f7f7;
    color: #1e1e1e;
}

.hb-shortcode-segnaposto code {
    margin-left: 0.5rem;
    font-size: 0.95em;
    overflow-wrap: anywhere;
}

.hb-shortcode-segnaposto span:not(:empty) {
    display: block;
    margin-top: 0.25rem;
    color: #b32d2e;
    font-size: 0.85em;
}

.hb-modulo-segnaposto span {
    margin-left: 0.5rem;
    color: #50575e;
    font-size: 0.85em;
}

/* Blocco Negozio: nell'editor un riquadro col nome della parte (la parte vera si vede sul sito). */
.hb-negozio-segnaposto {
    padding: 1rem;
    border: 1px dashed #949494;
    background: #f6f7f7;
    color: #1e1e1e;
}

.hb-negozio-segnaposto span {
    margin-left: 0.5rem;
    color: #50575e;
    font-size: 0.85em;
}

/* Menu: orientamento verticale (piè di pagina, barre laterali) e comportamento sul telefono. */
.hb-blocco-menu.hb-menu-vert > .hb-voci {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.4rem;
}

.hb-blocco-menu.hb-menu-vert.hb-align-centro > .hb-voci {
    align-items: center;
}

.hb-blocco-menu.hb-menu-vert.hb-align-destra > .hb-voci {
    align-items: flex-end;
}

.hb-blocco-menu.hb-menu-vert .hb-voce {
    display: flex;
    flex-direction: column;
    align-items: inherit;
}

/* In verticale i sottomenu stanno sempre aperti sotto la loro voce, rientrati. */
.hb-blocco-menu.hb-menu-vert .hb-sotto {
    display: flex;
    position: static;
    min-width: 0;
    padding: 0.25rem 0 0 1rem;
    border: 0;
    background: transparent;
    gap: 0.3rem;
}

.hb-blocco-menu.hb-menu-vert .hb-sotto-apri {
    display: none !important;
}

@media (max-width: 760px) {
    .hb-js .hb-blocco-menu.hb-menu-tel-sempre .hb-menu-apri,
    .hb-js .hb-blocco-menu.hb-menu-tel-mai .hb-menu-apri {
        display: none;
    }

    .hb-js .hb-blocco-menu.hb-menu-tel-sempre > .hb-voci,
    .hb-js .hb-blocco-menu.hb-menu-tel-mai > .hb-voci {
        display: flex;
        position: static;
        max-height: none;
        padding: 0;
        overflow: visible;
        border: 0;
        background: transparent;
    }

    .hb-js .hb-blocco-menu.hb-menu-tel-mai > .hb-voci {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }

    .hb-blocco-menu.hb-menu-tel-mai > .hb-voci a {
        min-height: 0;
        padding: 0;
    }

    .hb-js .hb-blocco-menu.hb-menu-vert > .hb-voci {
        flex-direction: column;
        align-items: flex-start;
    }

    .hb-js .hb-blocco-menu.hb-menu-vert .hb-sotto {
        display: flex;
        position: static;
        margin: 0;
    }
}

/* Blocco Dati strutturati: nell'editor un riquadro con i tipi dichiarati (sul sito esce solo lo script, invisibile). */
.hb-ld-segnaposto {
    padding: 0.8rem 1rem;
    border: 1px dashed #949494;
    background: #f6f7f7;
    color: #1e1e1e;
}

.hb-ld-segnaposto span {
    margin-left: 0.5rem;
    color: #50575e;
    font-size: 0.85em;
}

/* Contenitore con un'altezza maggiore del contenuto: dove sta il contenuto (alto di partenza, centro, basso). */
.hb-blocco.hb-v-centro,
.hb-blocco.hb-v-basso {
    display: flex;
    flex-direction: column;
}

.hb-blocco.hb-v-centro { justify-content: center; }
.hb-blocco.hb-v-basso { justify-content: flex-end; }

.hb-blocco.hb-v-centro > .hb-figli,
.hb-blocco.hb-v-basso > .hb-figli {
    width: 100%;
    flex: 0 0 auto;
}

/* Spaziatore (spazio vuoto: la sua altezza e' tutto) e Separatore (linea nel colore del testo del blocco). */
.hb-spaziatore {
    display: block;
    height: 100%;
}

.hb-blocco-separatore {
    width: 100%;
}

.hb-separatore {
    display: block;
    width: 100%;
    height: 0;
    margin: 0;
    border: 0;
    border-top: 1px solid currentColor;
    opacity: 0.35;
}

/* Un blocco con larghezza propria dentro una Riga la mantiene (di partenza i figli di una riga si dividono in parti uguali). */
.hb-blocco-riga > .hb-figli > .hb-blocco.hb-ha-misura {
    flex: 0 1 auto;
}

/* Riga che va a capo (flexWrap di WordPress): i blocchi hanno la loro larghezza naturale e, se non ci stanno, scendono sotto. */
.hb-blocco-riga.hb-riga-wrap > .hb-figli {
    flex-wrap: wrap;
}

.hb-blocco-riga.hb-riga-wrap > .hb-figli > .hb-blocco {
    flex: 1 1 auto;
}

.hb-blocco-riga.hb-riga-wrap > .hb-figli > .hb-blocco.hb-ha-misura {
    flex: 0 1 auto;
}
/* Tabella dei cookie ([cookie_tabella]): sul telefono ogni cookie è una scheda */
.hb-ck-tabella {
    margin: 1rem 0;
}

.hb-ck-tabella table {
    width: 100%;
    border-collapse: collapse;
}

.hb-ck-tabella th,
.hb-ck-tabella td {
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--hb-t-bordo, #d9d9d4);
    text-align: left;
    vertical-align: top;
}

.hb-ck-tabella th {
    background: var(--hb-t-fondo-alt, #f4f4f1);
}

.hb-ck-tabella code {
    overflow-wrap: anywhere;
}

@media (max-width: 639px) {
    .hb-ck-tabella thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }

    .hb-ck-tabella tr {
        display: block;
        margin: 0 0 0.75rem;
        border: 1px solid var(--hb-t-bordo, #d9d9d4);
    }

    .hb-ck-tabella td {
        display: block;
        border: 0;
        border-bottom: 1px solid var(--hb-t-bordo, #d9d9d4);
    }

    .hb-ck-tabella td:last-child {
        border-bottom: 0;
    }

    .hb-ck-tabella td::before {
        content: attr(data-etichetta);
        display: block;
        color: var(--hb-t-tenue, #6b6b6b);
        font-size: 0.75rem;
        font-weight: 600;
    }
}