/* ============================================================
   HEURIS — foglio di stile unico (generato dagli ORIGINAL)
   ============================================================ */

/* ================= VARIABILI ================= */
:root {
    --accento: #C67A12;
    --accento-chiaro: #E8A94B;
    --accento-velo: #FDF3E4;
    --block: #B03A2E;
    --block-velo: #FBEDEB;
    --brand: var(--bs-primary);
    --brand-deep: var(--bb-primary-dark);
    --brand-ink: #0C1F1E;
    --brand-mid: #0E8C8C;
    --brand-pale: #7FC9C2;
    --ink: #132523;
    --line: #D3DEDC;
    --muted: #5A6B69;
    --paper: #F5F5F5;
    --warn: var(--bs-secondary);
    --warn-pale: var(--bb-secondary-dark);
}

/* ================= BASE / HEADER / FOOTER (comuni) =================
* {
    -webkit-font-smoothing: antialiased
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 112px
}

a {
    color: var(--brand)
}

.container {
    max-width: 1320px;
    padding-inline: 28px
}

.mono {
    font-family: 'IBM Plex Mono', monospace
}

.testata {
    position: sticky;
    top: 0;
    z-index: 900;
    background: rgba(12, 31, 30, .93);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(255, 255, 255, .12)
}

.testata .navbar-nav .nav-link {
    color: #D6E4E2;
    font-weight: 500;
    font-size: .96rem;
    padding: 1.05rem .9rem
}

.testata .nav-link:hover {
    color: #fff
}

.testata .nav-link:hover, .testata .nav-item.show .nav-link {
    color: #fff
}

.mega {
    border: 0;
    border-radius: 0;
    background: #0A1918;
    box-shadow: 0 22px 44px rgba(0, 0, 0, .4);
    padding: 1.4rem 1.7rem
}

.mega .col-titolo {
    font-size: .77rem;
    color: var(--brand-pale);
    margin-bottom: .55rem;
    font-weight: 600
}

.mega a {
    display: block;
    color: #D6E4E2;
    text-decoration: none;
    padding: .26rem 0;
    font-size: .93rem
}

.mega a:hover {
    color: #fff
}

.tasto {
    background: var(--brand);
    color: #fff;
    font-weight: 600;
    font-size: .93rem;
    padding: .62rem 1.2rem;
    border-radius: 2px;
    text-decoration: none;
    display: inline-block;
    border: 0
}

.tasto:hover {
    background: var(--brand-deep);
    color: #fff
}

.tasto.chiaro {
    background: #fff;
    color: var(--brand-ink)
}

.tasto.chiaro:hover {
    background: #D9EFEC;
    color: var(--brand-ink)
}

.tasto.ambra {
    background: var(--accento)
}

.tasto.ambra:hover {
    background: #A8650C;
    color: #fff
}

.tasto-vuoto {
    border: 1px solid rgba(255, 255, 255, .42);
    color: #fff;
    font-weight: 500;
    font-size: .93rem;
    padding: .62rem 1.2rem;
    border-radius: 2px;
    text-decoration: none;
    display: inline-block
}

.tasto-vuoto:hover {
    background: rgba(255, 255, 255, .12);
    color: #fff
}

.piede {
    background: var(--brand-ink);
    color: #9FB3B1;
    padding: 3.2rem 0 1.8rem;
    font-size: .92rem
}

.piede a {
    color: #C6D6D4;
    text-decoration: none;
    display: block;
    padding: .18rem 0
}

.piede a:hover {
    color: #fff
}

.piede .col-titolo {
    color: #fff;
    font-weight: 600;
    margin-bottom: .6rem;
    font-size: .92rem
}

.piede .coda {
    border-top: 1px solid rgba(255, 255, 255, .12);
    margin-top: 2.2rem;
    padding-top: 1.2rem;
    font-size: .85rem
}

:focus-visible {
    outline: 3px solid var(--accento-chiaro);
    outline-offset: 2px
}
 */

.briciole {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: #8FA5A3;
    margin-bottom: 1.2rem
}

.briciole a,
.briciole li {
    color: #8FA5A3 !important;
    text-decoration: none
}

.briciole a:hover {
    color: #fff
}

/* ================= KEYFRAMES COMUNI ================= */
@keyframes fl {
    to {
        stroke-dashoffset: -26
    }
}

@keyframes flusso {
    to {
        stroke-dashoffset: -26
    }
}

@keyframes lampeggia {
    0%,
    100% {
        opacity: .25
    }

    50% {
        opacity: .85
    }
}

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

@keyframes onda {
    0% {
        box-shadow: 0 0 0 0 rgba(232, 169, 75, .55)
    }
    70% {
        box-shadow: 0 0 0 16px rgba(232, 169, 75, 0)
    }
    100% {
        box-shadow: 0 0 0 0 rgba(232, 169, 75, 0)
    }
}

@keyframes scorre {
    to {
        stroke-dashoffset: -28
    }
}

@keyframes spinge {
    0%, 100% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(9px)
    }
}

@keyframes spinta {
    0%, 100% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(6px)
    }
}

/* ================= PAGINA: home ================= */
@keyframes deriva-home {
    from {
        transform: translate(0, 0)
    }
    to {
        transform: translate(56px, 56px)
    }
}

@keyframes pulsa-home {
    0%, 100% {
        opacity: .25
    }
    50% {
        opacity: 1
    }
}

@keyframes scorri-home {
    from {
        transform: translateX(0)
    }
    to {
        transform: translateX(700px)
    }
}

@keyframes traccia-home {
    0% {
        stroke-dashoffset: 900
    }
    45%, 80% {
        stroke-dashoffset: 0
    }
    100% {
        stroke-dashoffset: 900
    }
}

.pagina-home {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.6;
    margin: 0;
    overflow-x: hidden
}

.pagina-home text {
    font-family: 'IBM Plex Sans', system-ui, sans-serif !important;
}

.pagina-home h1, .pagina-home h2, .pagina-home h3 {
    letter-spacing: -.022em;
    line-height: 1.1;
    font-weight: 600;
    margin: 0
}

.pagina-home p {
    margin: 0;
    max-width: 66ch
}

.pagina-home .apertura {
    background: var(--brand-ink);
    color: #fff;
    padding: 4rem 0 4.6rem;
    position: relative;
    overflow: hidden
}

.pagina-home .apertura .container {
    position: relative
}

.pagina-home .trama {
    position: absolute;
    inset: -60px;
    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 56px 56px;
    animation: deriva-home 26s linear infinite
}

.pagina-home .occhio {
    font-size: .88rem;
    color: var(--brand-pale);
    font-weight: 500
}

.pagina-home .apertura h1 {
    font-size: clamp(2.3rem, 3.9vw, 3.5rem);
    color: #fff;
    margin-top: .9rem
}

.pagina-home .guidato {
    color: #C6D6D4;
    font-size: 1.08rem;
    max-width: 44ch;
    margin-top: 1.3rem
}

@media (min-width: 992px) {
    .pagina-home .sporgente {
        flex: 1 1 0;
        margin-right: -180px
    }
}

@media (max-width: 992px) {
    .pagina-home .sporgente {
        width: calc(100% + 28px);
        max-width: 100%;
        margin-right: -28px
    }
}

.pagina-home a.sw-link {
    display: block;
    text-decoration: none;
    position: relative
}

.pagina-home .sw {
    background: #0A1918;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .42);
    transition: border-color .3s ease
}

.pagina-home a.sw-link:hover .sw, .pagina-home a.sw-link:focus-visible .sw {
    border-color: var(--brand-pale)
}

.pagina-home .sw-barra {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .55rem .9rem;
    border-bottom: 1px solid rgba(255, 255, 255, .12)
}

.pagina-home .pall {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .22)
}

.pagina-home .sw-tit {
    font-size: .76rem;
    color: #8FA5A3;
    margin-left: .5rem
}

.pagina-home .spia {
    margin-left: auto;
    font-size: .72rem;
    color: var(--brand-pale);
    display: flex;
    align-items: center;
    gap: .4rem
}

.pagina-home .spia i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--brand-pale);
    display: inline-block;
    animation: pulsa-home 2.2s ease-in-out infinite
}

.pagina-home .sw-corpo {
    display: grid;
    grid-template-columns:1.7fr 1fr
}

.pagina-home .sw-pan {
    padding: 1.05rem 1.2rem
}

.pagina-home .sw-pan + .sw-pan {
    border-left: 1px solid rgba(255, 255, 255, .12)
}

.pagina-home .sw-pan h3 {
    font-size: .77rem;
    color: #8FA5A3;
    font-weight: 500;
    margin-bottom: .8rem
}

.pagina-home .riga {
    font-size: .76rem;
    color: #BFD3D1;
    display: flex;
    justify-content: space-between;
    padding: .27rem 0;
    border-bottom: 1px dotted rgba(255, 255, 255, .10)
}

.pagina-home .riga b {
    color: var(--brand-pale);
    font-weight: 500;
    font-variant-numeric: tabular-nums
}

.pagina-home .riga b.g {
    color: #E0A353
}

.pagina-home .riga b.r {
    color: #E27E70
}

.pagina-home .tot {
    display: flex;
    justify-content: space-between;
    font-size: .85rem;
    color: #fff;
    padding-top: .65rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums
}

.pagina-home .barra-op {
    transition: transform 1.1s cubic-bezier(.4, 0, .2, 1)
}

.pagina-home .cursore {
    animation: scorri-home 9s linear infinite
}

.pagina-home .invito {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .7rem 1.2rem;
    background: rgba(127, 201, 194, .12);
    border-top: 1px solid rgba(127, 201, 194, .3);
    font-size: .9rem;
    color: #DCEDEB;
    font-weight: 500;
}

.pagina-home .invito span.spinta {
    color: var(--brand-pale);
    animation: spinta 2.4s ease-in-out infinite
}

@media (max-width: 780px) {
    .pagina-home .sw-corpo {
        grid-template-columns:1fr
    }

    .pagina-home .sw-pan + .sw-pan {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, .12)
    }
}

.pagina-home .nastro {
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    overflow: hidden;
    padding: 1.1rem 0
}

.pagina-home .nastro-scorre {
    display: flex;
    gap: 3.4rem;
    width: max-content;
    animation: nastro 42s linear infinite
}

.pagina-home .nastro:hover .nastro-scorre {
    animation-play-state: paused
}

.pagina-home .nastro-voce {
    font-size: .95rem;
    color: var(--muted);
    white-space: nowrap
}

.pagina-home .nastro-voce b {
    color: var(--ink);
    font-weight: 600
}

.pagina-home section.blocco {
    padding: 5.2rem 0
}

.pagina-home section.blocco.chiaro {
    background: var(--paper)
}

.pagina-home section.blocco.scuro {
    background: var(--brand-ink);
    color: #fff
}

.pagina-home section.blocco.scuro h2, .pagina-home section.blocco.scuro h3 {
    color: #fff
}

.pagina-home section.blocco.scuro p {
    color: #C6D6D4
}

.pagina-home section.blocco.scuro a {
    color: var(--brand-pale)
}

.pagina-home .tit-lato {
    position: sticky;
    top: 100px;
    align-self: start
}

.pagina-home .tit-lato h2 {
    font-size: clamp(1.7rem, 2.6vw, 2.3rem)
}

.pagina-home .tit-lato p {
    color: var(--muted);
    font-size: 1rem;
    margin-top: .9rem
}

.pagina-home section.blocco.scuro .tit-lato p {
    color: #C6D6D4
}

@media (max-width: 992px) {
    .pagina-home .tit-lato {
        position: static
    }
}

.pagina-home .conf {
    border-top: 1px solid var(--line)
}

.pagina-home .conf-r {
    display: grid;
    grid-template-columns:1.05fr 1fr 1fr;
    border-bottom: 1px solid var(--line)
}

.pagina-home .conf-r > div {
    padding: 1.05rem 1.2rem;
    font-size: .94rem
}

.pagina-home .conf-r .cri {
    font-weight: 600
}

.pagina-home .conf-r .alt {
    color: var(--muted)
}

.pagina-home .conf-r .noi {
    background: #fff;
    border-left: 3px solid var(--brand)
}

.pagina-home .conf-r.capo {
    border-bottom: 2px solid var(--ink)
}

.pagina-home .conf-r.capo > div {
    padding: .25rem 1.2rem .5rem;
    font-size: .81rem;
    color: var(--muted)
}

.pagina-home .conf-r.capo .noi {
    color: var(--brand);
    font-weight: 600;
    background: transparent
}

@media (max-width: 820px) {
    .pagina-home .conf-r {
        grid-template-columns:1fr
    }

    .pagina-home .conf-r.capo {
        display: none
    }

    .pagina-home .conf-r .alt:before {
        content: "Altri APS — ";
        font-weight: 600
    }

    .pagina-home .conf-r .noi:before {
        content: "Heuris — ";
        color: var(--brand);
        font-weight: 600
    }

    .pagina-home .conf-r > div {
        padding: .45rem 1.2rem
    }

    .pagina-home .conf-r .cri {
        padding-top: 1.1rem
    }

    .pagina-home .conf-r .noi {
        padding-bottom: 1.1rem
    }
}

.pagina-home .flusso {
    stroke-dasharray: 7 6;
    animation: flusso 1.6s linear infinite
}

.pagina-home .flusso.ritorno {
    animation-direction: reverse
}

.pagina-home .avviso {
    border-left: 3px solid var(--warn);
    background: #FDF7EC;
    padding: 1.05rem 1.25rem;
    font-size: .96rem;
    margin-top: 2rem
}

.pagina-home section.blocco.scuro .avviso {
    background: rgba(198, 122, 18, .13);
    color: #F0DCBC
}

.pagina-home .misure {
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line)
}

.pagina-home .misura {
    background: #fff;
    padding: 1.4rem 1.5rem;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line)
}

.pagina-home .misura .valore {
    font-size: 2.3rem;
    font-weight: 600;
    letter-spacing: -.03em;
    font-variant-numeric: tabular-nums;
    color: var(--brand)
}

.pagina-home .misura .nome {
    font-size: .95rem;
    font-weight: 600;
    margin-top: .2rem
}

.pagina-home .misura .glossa {
    font-size: .88rem;
    color: var(--muted);
    margin-top: .35rem
}

.pagina-home .sparkline {
    margin-top: .7rem
}

.pagina-home .settori {
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line)
}

.pagina-home .settore {
    background: #fff;
    padding: 1.1rem 1.2rem;
    font-size: .95rem;
    transition: background .5s ease, color .5s ease;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line)
}

.pagina-home .settore.acceso {
    background: var(--brand);
    color: #fff
}

.pagina-home .settore.acceso a {
    color: #fff
}

.pagina-home .settore a {
    text-decoration: none;
    color: var(--ink);
    font-weight: 600;
    display: block
}

.pagina-home .settore em {
    font-style: normal;
    display: block;
    font-size: .85rem;
    color: var(--muted);
    margin-top: .15rem
}

.pagina-home .settore.acceso em {
    color: rgba(255, 255, 255, .85)
}

.pagina-home .modelli a {
    border: 1px solid var(--line);
    padding: .4rem .85rem;
    font-size: .92rem;
    text-decoration: none;
    color: var(--ink);
    background: #fff
}

.pagina-home .modelli a:hover {
    border-color: var(--brand);
    color: var(--brand)
}

.pagina-home .passi {
    list-style: none;
    padding: 0;
    margin: 1.8rem 0 0;
    counter-reset: p
}

.pagina-home .passi li {
    counter-increment: p;
    padding: .8rem 0 .8rem 3rem;
    position: relative;
    border-top: 1px solid rgba(255, 255, 255, .14);
    font-size: 1rem;
    color: #DCE8E7
}

.pagina-home .passi li:before {
    content: counter(p);
    position: absolute;
    left: 0;
    top: .75rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .84rem;
    color: var(--brand-pale);
    border: 1px solid rgba(127, 201, 194, .45);
    width: 1.75rem;
    height: 1.75rem;
    display: grid;
    place-items: center
}

.pagina-home .curva {
    stroke-dasharray: 900;
    animation: traccia-home 7s ease-in-out infinite
}

.pagina-home .caso {
    border: 1px solid var(--line);
    padding: 1.4rem;
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.pagina-home .caso .settore-nome {
    font-size: .85rem;
    color: var(--muted)
}

.pagina-home .caso .esito {
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: -.02em
}

.pagina-home .caso a {
    margin-top: auto;
    font-weight: 600;
    text-decoration: none
}

.pagina-home .accordion-button {
    font-weight: 600;
    font-size: 1.03rem;
    color: var(--ink);
    background: #fff;
    box-shadow: none
}

.pagina-home .accordion-button:not(.collapsed) {
    color: var(--brand);
    background: #fff
}

.pagina-home .accordion-item {
    border: 0;
    border-bottom: 1px solid var(--line)
}

.pagina-home .accordion-body {
    color: var(--muted)
}

.pagina-home .chiusura {
    background: var(--brand);
    color: #fff;
    padding: 4.2rem 0
}

.pagina-home .chiusura h2 {
    color: #fff;
    font-size: clamp(1.8rem, 2.8vw, 2.4rem)
}

.pagina-home .chiusura p {
    color: rgba(255, 255, 255, .88);
    margin-top: .9rem
}

@media (prefers-reduced-motion: reduce) {
    .pagina-home *, .pagina-home *:before, .pagina-home *:after {
        animation: none !important;
        transition: none !important
    }

    .pagina-home .curva {
        stroke-dasharray: none
    }

    html {
        scroll-behavior: auto
    }
}

/* ================= PAGINA: 404 ================= */
@keyframes deriva-404 {
    from {
        transform: translate(0, 0)
    }

    to {
        transform: translate(60px, 60px)
    }
}

@keyframes scorri-404 {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(560px)
    }
}

@keyframes spia-404 {
    0%,
    100% {
        opacity: .25;
        transform: scale(.8)
    }

    50% {
        opacity: 1;
        transform: scale(1.15)
    }
}

@keyframes traccia-404 {
    to {
        stroke-dashoffset: 0
    }
}

.pagina-404 {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.62;
    margin: 0;
}

.pagina-404 h1, .pagina-404 h2, .pagina-404 h3 {
    letter-spacing: -.024em;
    line-height: 1.08;
    font-weight: 600;
    margin: 0;
    color: #ffffff;
}

.pagina-404 p {
    margin: 0 0 1.15rem
}

.pagina-404 .tratto {
    display: block;
    width: 54px;
    height: 4px;
    background: var(--accento);
    margin-bottom: .9rem
}

.pagina-404 .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .75rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-404 .scena {
    background: var(--brand-ink);
    color: #fff;
    position: relative;
    overflow: hidden;
    padding: 3.6rem 0 4.4rem;
    min-height: 74vh;
    display: flex;
    align-items: center
}

.pagina-404 .strato {
    position: absolute;
    inset: -16% -3%
}

.pagina-404 .strato.griglia {
    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 60px 60px;
    animation: deriva-404 34s linear infinite
}

.pagina-404 .strato.alone {
    background: radial-gradient(48% 62% at 74% 42%, rgba(198, 122, 18, .32), transparent 70%)
}

.pagina-404 .scena .container {
    position: relative;
    z-index: 3
}

.pagina-404 .codice {
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 600;
    font-size: clamp(6rem, 20vw, 17rem);
    line-height: .82;
    letter-spacing: -.06em;
    color: transparent;
    -webkit-text-stroke: 2px rgba(127, 201, 194, .45);
    position: relative;
    user-select: none
}

.pagina-404 .codice b {
    color: var(--accento-chiaro);
    -webkit-text-stroke: 0;
    font-weight: 600
}

.pagina-404 .stato {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    border: 1px solid var(--block);
    color: #F0A79E;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .3rem .8rem
}

.pagina-404 .spia {
    width: 7px;
    height: 7px;
    background: var(--block);
    border-radius: 50%;
    animation: spia-404 1.6s ease-in-out infinite
}

.pagina-404 .scena h1 {
    font-size: clamp(1.7rem, 3.4vw, 2.8rem);
    margin-top: 1.2rem;
    max-width: 20ch
}

.pagina-404 .scena .sotto {
    color: #C6D6D4;
    font-size: 1.08rem;
    max-width: 54ch;
    margin-top: 1.1rem
}

.pagina-404 .indirizzo {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .86rem;
    color: #8FA5A3;
    border-left: 3px solid var(--block);
    padding: .35rem 0 .35rem .8rem;
    margin: 1.4rem 0;
    word-break: break-all
}

.pagina-404 .indirizzo b {
    color: #F0A79E;
    font-weight: 500
}

.pagina-404 .piano {
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(255, 255, 255, .16);
    padding: 1.3rem 1.4rem
}

.pagina-404 .piano .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--brand-pale);
    margin-bottom: .9rem;
    display: flex;
    justify-content: space-between
}

.pagina-404 .riga-piano {
    stroke-dasharray: var(--l, 300);
    stroke-dashoffset: var(--l, 300);
    animation: traccia-404 1.2s ease forwards
}

.pagina-404 .vuoto {
    animation: lampeggia 1.8s ease-in-out infinite
}

.pagina-404 .cursore {
    animation: scorri-404 7s linear infinite
}

.pagina-404 .ricerca,
.form-search {
    display: flex;
    gap: .5rem;
    margin-top: 1.8rem;
    max-width: 520px
}

.pagina-404 .ricerca input,
.form-search {
    flex: 1;
    border: 1px solid rgba(255, 255, 255, .28);
    background: rgba(255, 255, 255, .06);
    color: #fff;
    padding: .62rem .8rem;
    border-radius: 2px;
    font-family: inherit;
    font-size: .95rem
}

.pagina-404 .ricerca input::placeholder {
    color: #8FA5A3
}

.pagina-404 .ricerca input:focus,
.form-search:focus {
    outline: 3px solid var(--accento-chiaro);
    border-color: transparent
}

.pagina-404 .destinazioni {
    padding: 4rem 0;
    background: var(--paper);
    border-top: 1px solid var(--line)
}

.pagina-404 .griglia {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 0;
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
    margin-top: 2rem
}

.pagina-404 .meta {
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: #fff;
    padding: 1.3rem 1.4rem;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: background .2s ease, transform .2s ease
}

.pagina-404 .meta:hover {
    background: var(--accento-velo);
    color: inherit;
    transform: translateY(-2px)
}

.pagina-404 .meta .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-404 .meta h3 {
    font-size: 1.02rem;
    margin: .45rem 0 .35rem
}

.pagina-404 .meta p {
    font-size: .9rem;
    color: var(--muted);
    margin: 0
}

.pagina-404 .zona-invito {
    background: var(--paper);
    padding: 0 0 0
}

.pagina-404 .invito {
    background: var(--brand);
    color: #fff;
    padding: 2.6rem 2.5rem;
    position: relative;
    margin-bottom: -4.5rem;
    z-index: 5;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22)
}

.pagina-404 .invito:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--accento)
}

.pagina-404 .invito h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.3vw, 1.9rem)
}

.pagina-404 .invito p {
    color: rgba(255, 255, 255, .9);
    margin-top: .8rem;
    max-width: 60ch
}

@media (prefers-reduced-motion: reduce) {
    .pagina-404 *, .pagina-404 *:before, .pagina-404 *:after {
        animation: none !important;
        transition: none !important
    }

    .pagina-404 .riga-piano {
        stroke-dashoffset: 0
    }

    html {
        scroll-behavior: auto
    }
}

.pagina-404 .list-group.node_search-results {
    --bs-list-group-bg: var(--brand-ink);
    margin-top: 1.5rem;
}

.pagina-404 .list-group.node_search-results .list-group-item {
    border: solid .5px var(--bs-link-color);
}

.pagina-404 .list-group.node_search-results .list-group-item a {
    color: var(--accento-chiaro);
}

.pagina-404 .list-group.node_search-results .list-group-item p {
    color: rgb(255 255 255 / 0.7);

}


/* ================= PAGINA: autore ================= */
@keyframes deriva-autore {
    from {
        transform: translate(0, 0)
    }

    to {
        transform: translate(60px, 60px)
    }
}

@keyframes spia-autore {
    0%, 100% {
        opacity: .25;
        transform: scale(.8)
    }
    50% {
        opacity: 1;
        transform: scale(1)
    }
}

.pagina-autore {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.62;
    margin: 0;
}

.pagina-autore h1, .pagina-autore h2, .pagina-autore h3 {
    letter-spacing: -.024em;
    line-height: 1.1;
    font-weight: 600;
    margin: 0
}

.pagina-autore p {
    margin: 0 0 1.15rem
}

.pagina-autore .tratto {
    display: block;
    width: 54px;
    height: 4px;
    background: var(--accento);
    margin-bottom: .9rem
}

.pagina-autore .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .75rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-autore .apertura {
    background: var(--brand-ink);
    color: #fff;
    position: relative;
    overflow: hidden;
    padding: 3.4rem 0 3.8rem
}

.pagina-autore .strato {
    position: absolute;
    inset: -16% -3%
}

.pagina-autore .strato.griglia {
    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 60px 60px;
    animation: deriva-autore 32s linear infinite
}

.pagina-autore .strato.alone {
    background: radial-gradient(46% 60% at 18% 44%, rgba(198, 122, 18, .28), transparent 70%)
}

.pagina-autore .apertura .container {
    position: relative;
    z-index: 3
}

.pagina-autore .ritratto {
    position: relative;
    aspect-ratio: 4/5;
    background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .06) 0 12px, rgba(255, 255, 255, .02) 12px 24px);
    border: 1px solid rgba(255, 255, 255, .2);
    display: grid;
    place-items: center;
    overflow: hidden
}

.pagina-autore .ritratto .sigla {
    font-family: 'IBM Plex Mono', monospace;
    font-size: clamp(3rem, 7vw, 5rem);
    font-weight: 600;
    color: rgba(127, 201, 194, .5);
    letter-spacing: -.04em
}

.pagina-autore .ritratto .quota {
    position: absolute;
    bottom: .7rem;
    left: .7rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .7rem;
    color: #8FA5A3;
    border: 1px dashed rgba(255, 255, 255, .28);
    padding: .18rem .5rem
}

.pagina-autore .ritratto .banda {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 5px;
    background: var(--accento)
}

.pagina-autore .ruolo {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    border: 1px solid var(--accento);
    color: var(--accento-chiaro);
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .3rem .8rem
}

.pagina-autore .spia {
    width: 7px;
    height: 7px;
    background: var(--accento-chiaro);
    border-radius: 50%;
    animation: spia-autore 2.4s ease-in-out infinite
}

.pagina-autore .apertura h1 {
    font-size: clamp(2.1rem, 4.4vw, 3.4rem);
    margin-top: 1.1rem
}

.pagina-autore .apertura .sintesi {
    color: #C6D6D4;
    font-size: 1rem;
    max-width: 58ch;
    margin-top: 1.2rem
}

.pagina-autore .competenze {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-top: 1.6rem
}

.pagina-autore .competenze span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    border: 1px solid rgba(255, 255, 255, .26);
    color: #C6D6D4;
    padding: .22rem .6rem
}

.pagina-autore .cifre {
    display: flex;
    flex-wrap: wrap;
    gap: 2.4rem;
    margin-top: 2rem;
    padding-top: 1.2rem;
    border-top: 1px solid rgba(255, 255, 255, .18)
}

.pagina-autore .cifra {
    font-family: 'IBM Plex Mono', monospace
}

.pagina-autore .cifra b {
    display: block;
    font-size: 1.9rem;
    font-weight: 600;
    color: var(--accento-chiaro);
    line-height: 1
}

.pagina-autore .cifra span {
    font-size: .76rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8FA5A3
}

.pagina-autore .sezione {
    padding: 4rem 0
}

.pagina-autore .sezione.chiara {
    background: var(--paper);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line)
}

.pagina-autore .sezione h2 {
    font-size: clamp(1.45rem, 2.2vw, 1.95rem)
}

.pagina-autore .misura {
    max-width: 760px
}

.pagina-autore .materie {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
    gap: 0;
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
    margin-top: 2rem
}

.pagina-autore .materia {
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 1.3rem 1.4rem;
    background: #fff
}

.pagina-autore .materia .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-autore .materia h3 {
    font-size: 1.02rem;
    margin: .45rem 0 .35rem
}

.pagina-autore .materia p {
    font-size: .9rem;
    color: var(--muted);
    margin: 0
}

.pagina-autore .articoli {
    border-top: 1px solid var(--line);
    margin-top: 2rem
}

.pagina-autore .articolo {
    display: grid;
    grid-template-columns:96px 1fr auto;
    gap: 1.2rem;
    align-items: center;
    border-bottom: 1px solid var(--line);
    padding: 1.1rem 0;
    text-decoration: none;
    color: inherit;
    transition: background .2s ease
}

.pagina-autore .articolo:hover {
    background: var(--accento-velo);
    color: inherit
}

.pagina-autore .articolo .data {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .78rem;
    color: var(--muted)
}

.pagina-autore .articolo h3 {
    font-size: 1.04rem;
    margin-bottom: .2rem
}

.pagina-autore .articolo p {
    font-size: .9rem;
    color: var(--muted);
    margin: 0
}

.pagina-autore .articolo .vai {
    font-family: 'IBM Plex Mono', monospace;
    color: var(--accento);
    font-size: .9rem
}

@media (max-width: 576px) {
    .pagina-autore .articolo {
        grid-template-columns:1fr;
        gap: .3rem
    }

    .pagina-autore .articolo .vai {
        display: none
    }
}

.pagina-autore .regole {
    list-style: none;
    padding: 0;
    margin: 1.8rem 0 0
}

.pagina-autore .regole li {
    position: relative;
    padding: .7rem 0 .7rem 2.3rem;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
    font-size: .97rem;
    color: #C6D6D4
}

.pagina-autore .regole li:first-child {
    border-top: 1px solid rgba(255, 255, 255, .14)
}

.pagina-autore .regole li:before {
    content: "";
    position: absolute;
    left: .2rem;
    top: 1.1rem;
    width: 10px;
    height: 10px;
    border: 2px solid var(--accento-chiaro);
    transform: rotate(45deg)
}

.pagina-autore .sezione.scura {
    background: var(--brand-ink);
    color: #fff;
    position: relative;
    overflow: hidden
}

.pagina-autore .sezione.scura h2 {
    color: #fff
}

.pagina-autore .sezione.scura p {
    color: #C6D6D4
}

.pagina-autore .scheda-aut {
    border: 1px solid var(--line);
    background: #fff;
    padding: 1.5rem 1.6rem;
    height: 100%
}

.pagina-autore .scheda-aut .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-autore .scheda-aut h3 {
    font-size: 1.05rem;
    margin: .5rem 0 .5rem
}

.pagina-autore .scheda-aut p {
    font-size: .93rem;
    color: var(--muted);
    margin: 0
}

.pagina-autore .zona-invito {
    background: var(--paper);
    padding: 3.4rem 0 0;
    border-top: 1px solid var(--line)
}

.pagina-autore .invito {
    background: var(--brand);
    color: #fff;
    padding: 2.6rem 2.5rem;
    position: relative;
    margin-bottom: -4.5rem;
    z-index: 5;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22)
}

.pagina-autore .invito:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--accento)
}

.pagina-autore .invito h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.3vw, 1.9rem)
}

.pagina-autore .invito p {
    color: rgba(255, 255, 255, .9);
    margin-top: .8rem;
    max-width: 60ch
}

.pagina-autore .segnaposto-testo {
    outline: 1px dashed rgba(198, 122, 18, .55);
    outline-offset: 3px
}

.pagina-autore .sale {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .7s ease, transform .7s ease
}

.pagina-autore .sale.visibile {
    opacity: 1;
    transform: none
}

.pagina-autore.pulito .segnaposto-testo {
    outline: 0
}

@media (prefers-reduced-motion: reduce) {
    .pagina-autore *, .pagina-autore *:before, .pagina-autore *:after {
        animation: none !important;
        transition: none !important
    }

    .pagina-autore .sale {
        opacity: 1;
        transform: none
    }

    html {
        scroll-behavior: auto
    }
}

/* ================= PAGINA: case-history ================= */
@keyframes deriva-case-history {
    from {
        transform: translate(0, 0)
    }
    to {
        transform: translate(48px, 48px)
    }
}

@keyframes spia-case-history {
    0%, 100% {
        opacity: .25;
        transform: scale(.8)
    }
    50% {
        opacity: 1;
        transform: scale(1)
    }
}

.pagina-case-history {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    line-height: 1.62;
    margin: 0;
}

.pagina-case-history h1, .pagina-case-history h2, .pagina-case-history h3 {
    letter-spacing: -.024em;
    line-height: 1.08;
    font-weight: 600;
    margin: 0
}

.pagina-case-history p {
    margin: 0 0 1.15rem
}

.pagina-case-history .tratto {
    display: block;
    width: 54px;
    height: 4px;
    background: var(--accento);
    margin-bottom: .95rem
}

.pagina-case-history .copertina {
    position: relative;
    background: var(--brand-ink);
    color: #fff;
    overflow: hidden;
    min-height: 82vh;
    display: flex;
    align-items: flex-end;
    padding: 7rem 0 3rem
}

.pagina-case-history .strato {
    position: absolute;
    inset: -14% -2%;
    will-change: transform
}

.pagina-case-history .strato.sfondo {
    background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .045) 0 18px, transparent 18px 36px)
}

.pagina-case-history .strato.griglia {
    background-image: linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);
    background-size: 64px 64px
}

.pagina-case-history .strato.alone {
    background: radial-gradient(52% 60% at 78% 34%, rgba(198, 122, 18, .36), transparent 68%)
}

.pagina-case-history .strato.nastro {
    background: linear-gradient(105deg, transparent 46%, rgba(198, 122, 18, .2) 46% 52%, transparent 52%)
}

.pagina-case-history .copertina .container {
    position: relative;
    z-index: 3
}

.pagina-case-history .marchio-settore {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    border: 1px solid var(--accento);
    color: var(--accento-chiaro);
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .3rem .8rem
}

.pagina-case-history .spia {
    width: 7px;
    height: 7px;
    background: var(--accento-chiaro);
    border-radius: 50%;
    animation: spia-case-history 2.2s ease-in-out infinite
}

.pagina-case-history .copertina h1 {
    font-size: clamp(2.3rem, 5.6vw, 4.6rem);
    margin-top: 1.4rem;
    max-width: 17ch;
    text-wrap: balance
}

.pagina-case-history .copertina .sotto {
    color: #C6D6D4;
    font-size: clamp(1.05rem, 1.5vw, 1.3rem);
    max-width: 56ch;
    margin-top: 1.4rem
}

.pagina-case-history .salto {
    display: flex;
    align-items: flex-end;
    gap: 1.2rem;
    margin-top: 2.6rem
}

.pagina-case-history .salto .da, .pagina-case-history .salto .a {
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 600;
    line-height: .85;
    letter-spacing: -.05em
}

.pagina-case-history .salto .da {
    font-size: clamp(3rem, 7vw, 6rem);
    color: rgba(255, 255, 255, .34)
}

.pagina-case-history .salto .a {
    font-size: clamp(4.4rem, 11vw, 9.5rem);
    color: var(--accento-chiaro)
}

.pagina-case-history .salto .freccia {
    font-size: clamp(1.6rem, 3vw, 2.6rem);
    color: #fff;
    padding-bottom: .9rem;
    animation: spinge 2.6s ease-in-out infinite
}

.pagina-case-history .salto .did {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .78rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #8FA5A3;
    padding-bottom: 1rem;
    max-width: 12ch;
    line-height: 1.35
}

.pagina-case-history .barra-dati {
    position: fixed;
    top: var(--height-menu);
    z-index: 10;
    background: var(--brand-deep);
    color: #fff;
    transform: translateY(-100%);
    opacity: 0;
    transition: transform .35s ease, opacity .35s ease;
    pointer-events: none;
    width: 100%;
}

@media (max-width: 768px) {
    .pagina-case-history .barra-dati {
        display: none;
    }
}

.pagina-case-history .barra-dati.viva {
    transform: none;
    opacity: 1;
    pointer-events: auto
}

.pagina-case-history .barra-dati .riga {
    display: flex;
    gap: 2.2rem;
    overflow-x: auto;
    padding: .6rem 0;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .82rem;
    white-space: nowrap;
    align-items: center
}

.pagina-case-history .barra-dati b {
    color: var(--accento-chiaro);
    font-weight: 600
}

.pagina-case-history .scheda-efficienza {
    background: var(--brand-ink);
    color: #fff;
    padding: 3.4rem 0 3.8rem;
    position: relative;
    overflow: hidden
}

.pagina-case-history .scheda-efficienza .velo {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px);
    background-size: 48px 48px;
    animation: deriva-case-history 30s linear infinite
}

.pagina-case-history .scheda-efficienza .container {
    position: relative
}

.pagina-case-history .se-cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento-chiaro)
}

.pagina-case-history .se-tit {
    font-size: clamp(1.4rem, 2.2vw, 1.9rem);
    color: #fff;
    margin: .5rem 0 2rem
}

.pagina-case-history .se-griglia {
    border-top: 1px solid rgba(255, 255, 255, .16);
    border-left: 1px solid rgba(255, 255, 255, .16)
}

.pagina-case-history .se-cella {
    border-right: 1px solid rgba(255, 255, 255, .16);
    border-bottom: 1px solid rgba(255, 255, 255, .16);
    padding: 1.15rem 1.25rem
}

.pagina-case-history .se-cella .et {
    font-size: .8rem;
    color: #8FA5A3;
    line-height: 1.35;
    min-height: 2.4em
}

.pagina-case-history .se-cella .vl {
    font-family: 'IBM Plex Mono', monospace;
    font-size: clamp(1.3rem, 2.4vw, 1.9rem);
    font-weight: 600;
    color: #fff;
    margin-top: .45rem;
    letter-spacing: -.02em
}

.pagina-case-history .se-cella.forte {
    background: rgba(198, 122, 18, .14)
}

.pagina-case-history .se-cella.forte .vl {
    color: var(--accento-chiaro)
}

.pagina-case-history .se-cella .um {
    font-size: .8rem;
    color: #8FA5A3;
    font-family: 'IBM Plex Sans', sans-serif;
    margin-left: .25rem
}

.pagina-case-history .se-nota {
    font-size: .84rem;
    color: #8FA5A3;
    margin-top: 1.2rem
}

.pagina-case-history .quadrante {
    border: 1px solid rgba(255, 255, 255, .16);
    padding: 1.3rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.pagina-case-history .arco {
    stroke-dasharray: var(--len);
    stroke-dashoffset: var(--len);
    transition: stroke-dashoffset 1.6s cubic-bezier(.2, .7, .3, 1)
}

.pagina-case-history .visibile .arco {
    stroke-dashoffset: var(--off)
}

.pagina-case-history .corpo {
    padding: 3.6rem 0 3rem
}

.pagina-case-history .indice {
    position: sticky;
    top: 112px;
    align-self: start;
    border-left: 1px solid var(--line);
    padding-left: 1.1rem
}

.pagina-case-history .indice .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .8rem
}

.pagina-case-history .indice a {
    display: block;
    font-size: .87rem;
    color: var(--muted);
    text-decoration: none;
    padding: .26rem 0 .26rem 1.05rem;
    margin-left: -1.15rem;
    border-left: 2px solid transparent;
    line-height: 1.34
}

.pagina-case-history .indice a:hover {
    color: var(--ink)
}

.pagina-case-history .indice a.attivo {
    color: var(--brand);
    font-weight: 600;
    border-left-color: var(--accento)
}

@media (max-width: 992px) {
    .pagina-case-history .indice {
        position: static;
        margin-bottom: 2.2rem
    }
}

.pagina-case-history article h2 {
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    margin: 3rem 0 1.1rem
}

.pagina-case-history article h2:first-of-type {
    margin-top: 0
}

.pagina-case-history article p {
    text-align: justify;
}

.pagina-case-history article .sommario {
    font-size: 1.2rem;
    line-height: 1.45;
    text-align: left;
    border-left: 3px solid var(--accento);
    padding-left: 1.3rem;
    color: var(--brand-deep)
}

.pagina-case-history article ul {
    padding-left: 1.1rem
}

.pagina-case-history article li {
    margin-bottom: 1rem
}

.pagina-case-history article cite {
    font-style: normal;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 1em;
    color: var(--brand-deep)
}

.pagina-case-history article abbr {
    text-decoration: underline dotted;
    cursor: help
}

.pagina-case-history article dfn {
    font-style: normal;
    font-weight: 600;
    color: var(--accento)
}

.pagina-case-history .fascia {
    position: relative;
    overflow: hidden;
    padding: 5rem 0;
    margin: 3.4rem 0;
    color: #fff;
    background: var(--brand-ink)
}

.pagina-case-history .fascia .sf {
    position: absolute;
    inset: -18% 0;
    will-change: transform;
    background: repeating-linear-gradient(118deg, rgba(255, 255, 255, .05) 0 3px, transparent 3px 30px)
}

.pagina-case-history .fascia .alone {
    position: absolute;
    inset: 0;
    background: radial-gradient(46% 70% at 22% 50%, rgba(2, 102, 102, .6), transparent 70%)
}

.pagina-case-history .fascia .container {
    position: relative;
    z-index: 2
}

.pagina-case-history .fascia h2 {
    color: #fff
}

.pagina-case-history .fascia p {
    color: #C6D6D4;
}

.pagina-case-history .numerone {
    font-family: 'IBM Plex Mono', monospace;
    font-size: clamp(3.4rem, 9vw, 7.5rem);
    font-weight: 600;
    line-height: .88;
    letter-spacing: -.05em;
    color: var(--accento-chiaro)
}

.pagina-case-history .numerone .um {
    font-size: .28em;
    color: #C6D6D4;
    letter-spacing: 0;
    margin-left: .4rem
}

.pagina-case-history .grafico {
    border: 1px solid var(--line);
    background: var(--paper);
    margin: 2.6rem 0
}

.pagina-case-history .grafico .tela {
    padding: 1.5rem
}

.pagina-case-history .grafico figcaption {
    border-top: 1px solid var(--line);
    background: #fff;
    padding: .75rem 1.4rem;
    font-size: .85rem;
    color: var(--muted)
}

.pagina-case-history .linea-cassa {
    stroke-dasharray: var(--l);
    stroke-dashoffset: var(--l);
    transition: stroke-dashoffset 2.2s ease
}

.pagina-case-history .visibile .linea-cassa {
    stroke-dashoffset: 0
}

.pagina-case-history .colonna {
    transform-origin: 50% 100%;
    transform: scaleY(0);
    transition: transform 1s cubic-bezier(.2, .7, .3, 1)
}

.pagina-case-history .visibile .colonna {
    transform: scaleY(1)
}

.pagina-case-history .segnaposto {
    aspect-ratio: 16/7;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 12px, #F3F6F5 12px 24px);
    border: 1px solid var(--line);
    display: grid;
    place-items: center;
    margin: 2.4rem 0
}

.pagina-case-history .segnaposto span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .25rem .7rem;
    background: #fff
}

.pagina-case-history .sale {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .8s ease, transform .8s ease
}

.pagina-case-history .sale.visibile {
    opacity: 1;
    transform: none
}

.pagina-case-history .avviso {
    border-left: 3px solid var(--accento);
    background: var(--accento-velo);
    padding: 1.2rem 1.4rem;
    margin: 2.2rem 0
}

.pagina-case-history .avviso .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .4rem
}

.pagina-case-history .avviso p {
    margin: 0;
    text-align: left;
    max-width: none
}

.pagina-case-history .accordion-button {
    font-weight: 600;
    font-size: 1.02rem;
    color: var(--ink);
    background: #fff;
    box-shadow: none
}

.pagina-case-history .accordion-button:not(.collapsed) {
    color: var(--accento);
    background: #fff
}

.pagina-case-history .accordion-item {
    border: 0;
    border-bottom: 1px solid var(--line)
}

.pagina-case-history .accordion-body {
    color: var(--muted)
}

.pagina-case-history .accordion-body p {
    text-align: left;
    margin: 0;
    max-width: none
}

.pagina-case-history .zona-invito {
    background: var(--paper);
    padding: 3.4rem 0 0;
    border-top: 1px solid var(--line)
}

.pagina-case-history .invito {
    background: var(--brand);
    color: #fff;
    padding: 2.8rem 2.6rem;
    position: relative;
    margin-bottom: -4.5rem;
    z-index: 5;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22)
}

.pagina-case-history .invito:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--accento)
}

.pagina-case-history .invito h2 {
    color: #fff;
    font-size: clamp(1.5rem, 2.5vw, 2.05rem)
}

.pagina-case-history .invito p {
    color: rgba(255, 255, 255, .9);
    margin-top: .9rem;
    max-width: 62ch
}

.pagina-case-history .altre {
    background: var(--paper);
    padding: 5.6rem 0 3.8rem;
    border-top: 1px solid var(--line)
}

.pagina-case-history .altre .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-case-history .pista {
    display: flex;
    gap: 1.2rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 1rem;
    margin-top: 1.5rem
}

.pagina-case-history .scheda {
    flex: 0 0 310px;
    scroll-snap-align: start;
    background: #fff;
    border: 1px solid var(--line);
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease
}

.pagina-case-history .scheda:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 34px rgba(0, 0, 0, .1);
    color: inherit
}

.pagina-case-history .scheda .riq {
    aspect-ratio: 16/10;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 10px, #F3F6F5 10px 20px);
    border-bottom: 1px solid var(--line);
    display: grid;
    place-items: center;
    position: relative
}

.pagina-case-history .scheda .riq span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .72rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .2rem .55rem;
    background: #fff
}

.pagina-case-history .scheda .cifra {
    position: absolute;
    left: 0;
    bottom: 0;
    background: var(--accento);
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .8rem;
    padding: .22rem .6rem
}

.pagina-case-history .scheda .testo-s {
    padding: 1rem 1.1rem 1.2rem
}

.pagina-case-history .scheda h3 {
    font-size: 1rem;
    margin-bottom: .45rem
}

.pagina-case-history .scheda p {
    font-size: .87rem;
    color: var(--muted);
    margin: 0
}

@media (prefers-reduced-motion: reduce) {
    .pagina-case-history *, .pagina-case-history *:before, .pagina-case-history *:after {
        animation: none !important;
        transition: none !important
    }

    .pagina-case-history .sale {
        opacity: 1;
        transform: none
    }

    html {
        scroll-behavior: auto
    }
}

/* ================= PAGINA: configure-to-order ================= */
@keyframes deriva-configure-to-order {
    from {
        transform: translate(0, 0)
    }

    to {
        transform: translate(58px, 58px)
    }
}

body.pagina-configure-to-order {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.62;
    margin: 0;
}

body.pagina-configure-to-order h1, body.pagina-configure-to-order h2, body.pagina-configure-to-order h3 {
    letter-spacing: -.024em;
    line-height: 1.1;
    font-weight: 600;
    margin: 0
}

body.pagina-configure-to-order p {
    margin: 0 0 1.15rem
}

body.pagina-configure-to-order .misura {
    max-width: 760px
}

body.pagina-configure-to-order .tratto {
    display: block;
    width: 54px;
    height: 4px;
    background: var(--accento);
    margin-bottom: .9rem
}

body.pagina-configure-to-order .b-apertura {
    background: var(--brand-ink);
    color: #fff;
    padding: 3.2rem 0 3.4rem;
    position: relative;
    overflow: hidden
}

body.pagina-configure-to-order .b-apertura .vel {
    position: absolute;
    inset: -20%;
    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 58px 58px;
    animation: deriva-configure-to-order 30s linear infinite
}

body.pagina-configure-to-order .b-apertura .container {
    position: relative
}

body.pagina-configure-to-order .b-occhiello {
    display: inline-block;
    background: var(--accento);
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: .28rem .75rem
}

body.pagina-configure-to-order .b-apertura h1 {
    font-size: clamp(2rem, 4vw, 3.3rem);
    margin-top: 1.1rem;
    max-width: 19ch
}

body.pagina-configure-to-order .b-apertura .sotto {
    color: #C6D6D4;
    font-size: 1rem;
    max-width: 58ch;
    margin-top: 1.2rem
}

body.pagina-configure-to-order .b-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 1.8rem;
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, .18);
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8FA5A3
}

body.pagina-configure-to-order .b-meta b {
    color: var(--accento-chiaro);
    font-weight: 500
}

body.pagina-configure-to-order .b-definizione {
    border: 1px solid var(--line);
    border-left: 5px solid var(--accento);
    background: #fff;
    padding: 1.5rem 1.7rem;
    margin: 2.4rem 0;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .05)
}

body.pagina-configure-to-order .b-definizione .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento);
    margin-bottom: .5rem
}

body.pagina-configure-to-order .b-definizione p {
    font-size: 1rem;
    line-height: 1.5;
    margin: 0
}

body.pagina-configure-to-order .b-indice {
    background: var(--paper);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 2.4rem 0;
    margin: 2.8rem 0
}

body.pagina-configure-to-order .b-indice .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento);
    margin-bottom: 1.1rem
}

body.pagina-configure-to-order .b-indice a {
    display: flex;
    gap: .7rem;
    align-items: baseline;
    text-decoration: none;
    color: var(--ink);
    padding: .42rem 0;
    border-bottom: 1px dotted var(--line);
    font-size: .95rem;
    line-height: 1.35
}

body.pagina-configure-to-order .b-indice a:hover {
    color: var(--brand)
}

body.pagina-configure-to-order .b-indice a span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .78rem;
    color: var(--accento);
    min-width: 1.7rem
}

body.pagina-configure-to-order .b-testo h2 {
    font-size: clamp(1.45rem, 2.2vw, 1.95rem);
    margin: 2.8rem 0 1rem
}

body.pagina-configure-to-order .b-testo h3 {
    font-size: 1.05rem;
    margin: 1.6rem 0 .5rem
}

body.pagina-configure-to-order .b-testo p {
    text-align: justify
}

body.pagina-configure-to-order .b-contrasto {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 2.6rem 0;
    border: 1px solid var(--line)
}

@media (max-width: 768px) {
    body.pagina-configure-to-order .b-contrasto {
        grid-template-columns: 1fr
    }
}

body.pagina-configure-to-order .b-contrasto > div {
    padding: 1.5rem 1.6rem
}

body.pagina-configure-to-order .b-contrasto > div:first-child {
    background: var(--accento-velo);
    border-right: 1px solid var(--line)
}

body.pagina-configure-to-order .b-contrasto .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: .6rem
}

body.pagina-configure-to-order .b-contrasto > div:first-child .et {
    color: var(--accento)
}

body.pagina-configure-to-order .b-contrasto > div:last-child .et {
    color: var(--brand)
}

body.pagina-configure-to-order .b-contrasto p {
    margin: 0;
    font-size: .97rem
}

body.pagina-configure-to-order .b-condizioni {
    counter-reset: c;
    list-style: none;
    padding: 0;
    margin: 2.4rem 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line)
}

body.pagina-configure-to-order .b-condizioni li {
    counter-increment: c;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 1.3rem 1.4rem;
    font-size: .95rem
}

body.pagina-configure-to-order .b-condizioni li:before {
    content: counter(c, decimal-leading-zero);
    display: block;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 1.5rem;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .5rem
}

body.pagina-configure-to-order .b-condizioni li b {
    display: block;
    margin-bottom: .3rem
}

body.pagina-configure-to-order .b-formula {
    background: var(--brand-ink);
    color: #fff;
    padding: 1.6rem 1.8rem;
    margin: 2.4rem 0;
    border-left: 5px solid var(--accento)
}

body.pagina-configure-to-order .b-formula .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento-chiaro);
    margin-bottom: .7rem
}

body.pagina-configure-to-order .b-formula .eq {
    font-family: 'IBM Plex Mono', monospace;
    font-size: clamp(.95rem, 1.7vw, 1.2rem);
    line-height: 1.6
}

body.pagina-configure-to-order .b-formula .eq b {
    color: var(--accento-chiaro);
    font-weight: 600
}

body.pagina-configure-to-order .b-formula .gl {
    font-size: .88rem;
    color: #A9BFBD;
    margin: .9rem 0 0
}

body.pagina-configure-to-order .b-bilancia {
    margin: 2.6rem 0;
    border: 1px solid var(--line)
}

body.pagina-configure-to-order .b-bilancia .testa {
    display: grid;
    grid-template-columns: 1fr 1fr
}

body.pagina-configure-to-order .b-bilancia .testa div {
    padding: .75rem 1.2rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #fff
}

body.pagina-configure-to-order .b-bilancia .testa .si {
    background: var(--brand)
}

body.pagina-configure-to-order .b-bilancia .testa .no {
    background: var(--block)
}

body.pagina-configure-to-order .b-bilancia .riga {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--line)
}

body.pagina-configure-to-order .b-bilancia .riga div {
    padding: .9rem 1.2rem;
    font-size: .95rem
}

body.pagina-configure-to-order .b-bilancia .riga div:first-child {
    border-right: 1px solid var(--line);
    background: #fff
}

body.pagina-configure-to-order .b-bilancia .riga div:last-child {
    background: var(--block-velo)
}

@media (max-width: 576px) {
    body.pagina-configure-to-order .b-bilancia .testa, body.pagina-configure-to-order .b-bilancia .riga {
        grid-template-columns: 1fr
    }

    body.pagina-configure-to-order .b-bilancia .riga div:first-child {
        border-right: 0;
        border-bottom: 1px solid var(--line)
    }
}

body.pagina-configure-to-order .b-avviso {
    border-left: 4px solid var(--accento);
    background: var(--accento-velo);
    padding: 1.2rem 1.4rem;
    margin: 2.2rem 0
}

body.pagina-configure-to-order .b-avviso .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .4rem
}

body.pagina-configure-to-order .b-avviso p {
    margin: 0;
    text-align: left
}

body.pagina-configure-to-order .b-grido {
    margin: 3rem 0;
    padding: 2rem 0;
    border-top: 4px solid var(--accento);
    border-bottom: 1px solid var(--line)
}

body.pagina-configure-to-order .b-grido p {
    font-size: clamp(1.3rem, 2.4vw, 1.85rem);
    line-height: 1.28;
    font-weight: 600;
    color: var(--brand-deep);
    margin: 0;
    text-align: left;
    max-width: 26ch
}

body.pagina-configure-to-order .b-spunte {
    list-style: none;
    padding: 0;
    margin: 2rem 0
}

body.pagina-configure-to-order .b-spunte li {
    position: relative;
    padding: .65rem 0 .65rem 2.4rem;
    border-bottom: 1px solid var(--line);
    font-size: .97rem
}

body.pagina-configure-to-order .b-spunte li:first-child {
    border-top: 1px solid var(--line)
}

body.pagina-configure-to-order .b-spunte li:before {
    content: "";
    position: absolute;
    left: .2rem;
    top: 1.05rem;
    width: 11px;
    height: 11px;
    border: 2px solid var(--accento);
    transform: rotate(45deg)
}

body.pagina-configure-to-order .b-scala {
    background: var(--brand-ink);
    color: #fff;
    padding: 3.4rem 0;
    margin: 3rem 0;
    position: relative;
    overflow: hidden
}

body.pagina-configure-to-order .b-scala .alone {
    position: absolute;
    inset: 0;
    background: radial-gradient(48% 70% at 22% 50%, rgba(2, 102, 102, .55), transparent 70%)
}

body.pagina-configure-to-order .b-scala .container {
    position: relative
}

body.pagina-configure-to-order .b-scala h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.2vw, 1.9rem)
}

body.pagina-configure-to-order .b-scala p {
    color: #C6D6D4
}

body.pagina-configure-to-order .scorre {
    stroke-dasharray: 8 6;
    animation: scorre 1.5s linear infinite
}

body.pagina-configure-to-order .opzione {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity .5s ease, transform .5s ease
}

body.pagina-configure-to-order .visibile .opzione {
    opacity: 1;
    transform: none
}

body.pagina-configure-to-order .visibile .opzione:nth-of-type(2) {
    transition-delay: .12s
}

body.pagina-configure-to-order .visibile .opzione:nth-of-type(3) {
    transition-delay: .24s
}

body.pagina-configure-to-order .visibile .opzione:nth-of-type(4) {
    transition-delay: .36s
}

body.pagina-configure-to-order .accordion-button {
    font-weight: 600;
    font-size: 1.02rem;
    color: var(--ink);
    background: #fff;
    box-shadow: none
}

body.pagina-configure-to-order .accordion-button:not(.collapsed) {
    color: var(--accento);
    background: #fff
}

body.pagina-configure-to-order .accordion-item {
    border: 0;
    border-bottom: 1px solid var(--line)
}

body.pagina-configure-to-order .accordion-body p {
    text-align: left;
    margin: 0;
    color: var(--muted)
}

body.pagina-configure-to-order .b-zona-invito {
    background: var(--paper);
    padding: 3.4rem 0 0;
    border-top: 1px solid var(--line);
    margin-top: 3.4rem
}

body.pagina-configure-to-order .b-invito {
    background: var(--brand);
    color: #fff;
    padding: 2.7rem 2.5rem;
    position: relative;
    margin-bottom: -4.5rem;
    z-index: 5;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22)
}

body.pagina-configure-to-order .b-invito:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--accento)
}

body.pagina-configure-to-order .b-invito h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.4vw, 2rem)
}

body.pagina-configure-to-order .b-invito p {
    color: rgba(255, 255, 255, .9);
    margin-top: .9rem;
    max-width: 62ch
}

body.pagina-configure-to-order .b-correlati {
    background: var(--paper);
    padding: 5.6rem 0 3.6rem;
    border-top: 1px solid var(--line)
}

body.pagina-configure-to-order .b-correlati .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

body.pagina-configure-to-order .pista {
    display: flex;
    gap: 1.1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 1rem;
    margin-top: 1.4rem
}

body.pagina-configure-to-order .scheda {
    flex: 0 0 300px;
    scroll-snap-align: start;
    background: #fff;
    border: 1px solid var(--line);
    text-decoration: none;
    color: inherit;
    transition: transform .25s ease, box-shadow .25s ease
}

body.pagina-configure-to-order .scheda:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(0, 0, 0, .1);
    color: inherit
}

body.pagina-configure-to-order .scheda .riq {
    aspect-ratio: 16/10;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 10px, #F3F6F5 10px 20px);
    border-bottom: 1px solid var(--line);
    display: grid;
    place-items: center;
    position: relative
}

body.pagina-configure-to-order .scheda .riq span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .72rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .2rem .55rem;
    background: #fff
}

body.pagina-configure-to-order .scheda .sig {
    position: absolute;
    left: 0;
    bottom: 0;
    background: var(--accento);
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .78rem;
    padding: .2rem .6rem
}

body.pagina-configure-to-order .scheda .tx {
    padding: .95rem 1.05rem 1.15rem
}

body.pagina-configure-to-order .scheda h3 {
    font-size: 1rem;
    margin-bottom: .4rem
}

body.pagina-configure-to-order .scheda p {
    font-size: .87rem;
    color: var(--muted);
    margin: 0
}

body.pagina-configure-to-order .sale {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .7s ease, transform .7s ease
}

body.pagina-configure-to-order .sale.visibile {
    opacity: 1;
    transform: none
}

@media (prefers-reduced-motion: reduce) {
    body.pagina-configure-to-order *, body.pagina-configure-to-order *:before, body.pagina-configure-to-order *:after {
        animation: none !important;
        transition: none !important
    }

    body.pagina-configure-to-order .sale, body.pagina-configure-to-order .opzione {
        opacity: 1;
        transform: none
    }

    html {
        scroll-behavior: auto
    }
}

/* ================= PAGINA: contatti ================= */
@keyframes spia-contatti {
    0%, 100% {
        opacity: .25;
        transform: scale(.8)
    }
    50% {
        opacity: 1;
        transform: scale(1)
    }
}

.pagina-contatti {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.62;
    margin: 0;
}

.pagina-contatti h1, .pagina-contatti h2, .pagina-contatti h3 {
    letter-spacing: -.024em;
    line-height: 1.1;
    font-weight: 600;
    margin: 0
}

.pagina-contatti p {
    margin: 0 0 1.15rem
}

.pagina-contatti .tratto {
    display: block;
    width: 54px;
    height: 4px;
    background: var(--accento);
    margin-bottom: .9rem
}

.pagina-contatti .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .75rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-contatti .apertura {
    background: var(--brand-ink);
    color: #fff;
    position: relative;
    overflow: hidden;
    padding: 3.4rem 0 5.6rem
}

.pagina-contatti .strato {
    position: absolute;
    inset: -18% -3%;
    will-change: transform
}

.pagina-contatti .strato.griglia {
    background-image: linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);
    background-size: 62px 62px
}

.pagina-contatti .strato.alone {
    background: radial-gradient(50% 62% at 74% 40%, rgba(198, 122, 18, .34), transparent 70%)
}

.pagina-contatti .strato.diagonale {
    background: repeating-linear-gradient(118deg, rgba(255, 255, 255, .045) 0 3px, transparent 3px 32px)
}

.pagina-contatti .apertura .container {
    position: relative;
    z-index: 3
}

.pagina-contatti .apertura h1 {
    font-size: clamp(2.1rem, 4.4vw, 3.6rem);
    margin-top: 1.1rem;
    max-width: 16ch
}

.pagina-contatti .apertura .sotto {
    color: #C6D6D4;
    font-size: 1rem;
    max-width: 52ch;
    margin-top: 1.3rem
}

.pagina-contatti .marchio {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    border: 1px solid var(--accento);
    color: var(--accento-chiaro);
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .3rem .8rem
}

.pagina-contatti .spia {
    width: 7px;
    height: 7px;
    background: var(--accento-chiaro);
    border-radius: 50%;
    animation: spia-contatti 2.2s ease-in-out infinite
}

.pagina-contatti .promesse {
    list-style: none;
    padding: 0;
    margin: 2.2rem 0 0
}

.pagina-contatti .promesse li {
    position: relative;
    padding: .5rem 0 .5rem 2.1rem;
    color: #C6D6D4;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    font-size: 1rem
}

.pagina-contatti .promesse li:before {
    content: "";
    position: absolute;
    left: .15rem;
    top: .95rem;
    width: 10px;
    height: 10px;
    border: 2px solid var(--accento-chiaro);
    transform: rotate(45deg)
}

.pagina-contatti .contatti-diretti {
    display: flex;
    flex-wrap: wrap;
    gap: 1.6rem;
    margin-top: 2rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .86rem
}

.pagina-contatti .contatti-diretti a {
    color: var(--accento-chiaro);
    text-decoration: none
}

.pagina-contatti .contatti-diretti a:hover {
    color: #fff
}

.pagina-contatti .scheda-modulo {
    background: #fff;
    color: var(--ink);
    border-top: 5px solid var(--accento);
    box-shadow: 0 30px 70px rgba(0, 0, 0, .3);
    padding: 1.9rem 1.9rem 2.1rem
}

.pagina-contatti .scheda-modulo h2 {
    font-size: 1.3rem
}

.pagina-contatti .scheda-modulo .glossa {
    font-size: .92rem;
    color: var(--muted);
    margin: .5rem 0 1.4rem
}

.pagina-contatti .campo {
    margin-bottom: .95rem
}

.pagina-contatti .campo label {
    display: block;
    font-size: .82rem;
    font-weight: 600;
    margin-bottom: .28rem
}

.pagina-contatti .campo .aiuto {
    font-size: .78rem;
    color: var(--muted);
    font-weight: 400
}

.pagina-contatti .campo input, .pagina-contatti .campo select, .pagina-contatti .campo textarea {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 2px;
    padding: .55rem .7rem;
    font-size: .95rem;
    font-family: inherit;
    background: #fff
}

.pagina-contatti .campo input:focus, .pagina-contatti .campo select:focus, .pagina-contatti .campo textarea:focus {
    border-color: var(--brand);
    outline: 2px solid var(--brand-pale);
    outline-offset: 0
}

.pagina-contatti .campo .obb {
    color: var(--block)
}

.pagina-contatti .gruppo-scelte {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
    gap: .5rem
}

.pagina-contatti .scelta {
    position: relative
}

.pagina-contatti .scelta input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0
}

.pagina-contatti .scelta span {
    display: block;
    border: 1px solid var(--line);
    padding: .5rem .6rem;
    font-size: .86rem;
    cursor: pointer;
    text-align: center;
    transition: all .18s ease
}

.pagina-contatti .scelta input:checked + span {
    border-color: var(--accento);
    background: var(--accento-velo);
    color: var(--accento);
    font-weight: 600
}

.pagina-contatti .scelta input:focus-visible + span {
    outline: 3px solid var(--brand-pale)
}

.pagina-contatti .privacy {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
    font-size: .84rem;
    color: var(--muted);
    margin: 1rem 0
}

.pagina-contatti .privacy input {
    margin-top: .3rem
}

.pagina-contatti .esca {
    position: absolute;
    left: -9999px
}

.pagina-contatti .misuratore {
    border: 1px solid var(--line);
    background: var(--paper);
    padding: .8rem .9rem;
    margin-bottom: 1.2rem
}

.pagina-contatti .misuratore .riga {
    display: flex;
    justify-content: space-between;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    color: var(--muted);
    margin-bottom: .4rem
}

.pagina-contatti .misuratore .riga b {
    color: var(--accento)
}

.pagina-contatti .barra {
    height: 6px;
    background: var(--line);
    position: relative;
    overflow: hidden
}

.pagina-contatti .barra i {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    background: var(--accento);
    transition: width .4s ease
}

.pagina-contatti .misuratore .nota {
    font-size: .78rem;
    color: var(--muted);
    margin: .5rem 0 0;
    min-height: 2.2em
}

.pagina-contatti .sezione {
    padding: 4rem 0
}

.pagina-contatti .sezione.chiara {
    background: var(--paper);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line)
}

.pagina-contatti .sezione.scura {
    background: var(--brand-ink);
    color: #fff;
    position: relative;
    overflow: hidden
}

.pagina-contatti .sezione.scura h2, .pagina-contatti .sezione.scura h3 {
    color: #fff
}

.pagina-contatti .sezione.scura p {
    color: #C6D6D4
}

.pagina-contatti .sezione h2 {
    font-size: clamp(1.5rem, 2.3vw, 2rem)
}

.pagina-contatti .passi {
    counter-reset: p;
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
    gap: 0;
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
    margin-top: 2.2rem
}

.pagina-contatti .passo {
    counter-increment: p;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 1.5rem 1.5rem 1.7rem;
    background: #fff;
    position: relative
}

.pagina-contatti .passo:before {
    content: counter(p, decimal-leading-zero);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--accento);
    display: block;
    margin-bottom: .6rem
}

.pagina-contatti .passo h3 {
    font-size: 1.05rem;
    margin-bottom: .4rem
}

.pagina-contatti .passo p {
    font-size: .93rem;
    color: var(--muted);
    margin: 0
}

.pagina-contatti .passo .durata {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted);
    margin-top: .8rem;
    display: block
}

.pagina-contatti .tipi {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
    gap: 0;
    border-top: 1px solid rgba(255, 255, 255, .16);
    border-left: 1px solid rgba(255, 255, 255, .16);
    margin-top: 2.2rem
}

.pagina-contatti .tipo {
    border-right: 1px solid rgba(255, 255, 255, .16);
    border-bottom: 1px solid rgba(255, 255, 255, .16);
    padding: 1.3rem 1.4rem;
    transition: background .25s ease
}

.pagina-contatti .tipo:hover {
    background: rgba(198, 122, 18, .12)
}

.pagina-contatti .tipo h3 {
    font-size: 1rem;
    color: #fff
}

.pagina-contatti .tipo p {
    font-size: .9rem;
    color: #A9BFBD;
    margin: .35rem 0 0
}

.pagina-contatti .tipo .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento-chiaro)
}

.pagina-contatti .franchezza {
    border-left: 4px solid var(--block);
    background: #FBEDEB;
    padding: 1.3rem 1.5rem;
    margin-top: 2rem
}

.pagina-contatti .franchezza .et {
    color: var(--block)
}

.pagina-contatti .franchezza ul {
    margin: .8rem 0 0;
    padding-left: 1.1rem
}

.pagina-contatti .franchezza li {
    font-size: .95rem;
    margin-bottom: .4rem
}

.pagina-contatti .recapito {
    border: 1px solid var(--line);
    padding: 1.4rem 1.5rem;
    height: 100%;
    background: #fff
}

.pagina-contatti .recapito .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-contatti .recapito h3 {
    font-size: 1.05rem;
    margin: .5rem 0 .5rem
}

.pagina-contatti .recapito p {
    font-size: .93rem;
    color: var(--muted);
    margin: 0
}

.pagina-contatti .recapito a {
    font-weight: 600
}

.pagina-contatti .mappa {
    aspect-ratio: 16/9;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 12px, #F3F6F5 12px 24px);
    border: 1px solid var(--line);
    display: grid;
    place-items: center
}

.pagina-contatti .mappa span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .25rem .7rem;
    background: #fff
}

.pagina-contatti .accordion-button {
    font-weight: 600;
    font-size: 1rem;
    color: var(--ink);
    background: #fff;
    box-shadow: none
}

.pagina-contatti .accordion-button:not(.collapsed) {
    color: var(--accento);
    background: #fff
}

.pagina-contatti .accordion-item {
    border: 0;
    border-bottom: 1px solid var(--line)
}

.pagina-contatti .accordion-body p {
    margin: 0;
    color: var(--muted)
}

.pagina-contatti .sale {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .7s ease, transform .7s ease
}

.pagina-contatti .sale.visibile {
    opacity: 1;
    transform: none
}

@media (prefers-reduced-motion: reduce) {
    .pagina-contatti *, .pagina-contatti *:before, .pagina-contatti *:after {
        animation: none !important;
        transition: none !important
    }

    .pagina-contatti .sale {
        opacity: 1;
        transform: none
    }

    html {
        scroll-behavior: auto
    }
}

/* ================= PAGINA: articolo-manutenzione ================= */
@keyframes deriva-articolo-manutenzione {
    from {
        transform: translate(0, 0)
    }
    to {
        transform: translate(56px, 56px)
    }
}

@keyframes pulsa-articolo-manutenzione {
    0%, 100% {
        opacity: .3
    }
    50% {
        opacity: 1
    }
}

.pagina-articolo {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.6;
    margin: 0;
}

.pagina-articolo h1, .pagina-articolo h2, .pagina-articolo h3 {
    letter-spacing: -.022em;
    line-height: 1.15;
    font-weight: 600;
    margin: 0
}

.pagina-articolo p {
    margin: 0 0 1.1rem;
    max-width: 66ch
}

.pagina-articolo .avanzamento {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    background: var(--accento);
    width: 0;
    z-index: 1200;
    transition: width .1s linear
}

.pagina-articolo .apertura {
    background: var(--brand-ink);
    color: #fff;
    padding: 3.4rem 0 3.8rem;
    position: relative;
    overflow: hidden
}

.pagina-articolo .apertura .container {
    position: relative
}

.pagina-articolo .trama {
    position: absolute;
    inset: -60px;
    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 56px 56px;
    animation: deriva-articolo-manutenzione 26s linear infinite
}

.pagina-articolo .etichetta {
    display: inline-block;
    background: var(--accento);
    color: #fff;
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .28rem .7rem
}

.pagina-articolo .apertura h1 {
    font-size: clamp(2rem, 3.4vw, 3rem);
    color: #fff;
    margin-top: 1rem;
    max-width: 20ch
}

.pagina-articolo .occhiello-sotto {
    color: #C6D6D4;
    font-size: 1rem;
    max-width: 52ch;
    margin-top: 1.2rem
}

.pagina-articolo .firma {
    margin-top: 2rem;
    padding-top: 1.1rem;
    border-top: 1px solid rgba(255, 255, 255, .16);
    font-size: 1rem;
    color: #8FA5A3
}

.pagina-articolo .firma b {
    display: block;
    color: #fff;
    font-weight: 500;
    font-size: 1rem;
    margin-top: .15rem;
    font-family: monospace;
}

.pagina-articolo .sintesi {
    background: #0A1918;
    border: 1px solid rgba(255, 255, 255, .15);
    border-left: 3px solid var(--accento);
    padding: 1.4rem 1.5rem
}

.pagina-articolo .sintesi h2 {
    font-size: .78rem;
    color: var(--accento-chiaro);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    margin-bottom: 1rem
}

.pagina-articolo .sintesi .voce {
    display: flex;
    gap: .9rem;
    padding: .55rem 0;
    border-bottom: 1px dotted rgba(255, 255, 255, .14);
    font-size: .9rem;
    color: #BFD3D1
}

.pagina-articolo .sintesi .voce:last-of-type {
    border-bottom: 0
}

.pagina-articolo .sintesi .voce .sig {
    font-family: 'IBM Plex Mono', monospace;
    color: var(--brand-pale);
    min-width: 5.2rem
}

.pagina-articolo .sintesi .coda {
    margin-top: 1.1rem;
    font-size: .82rem;
    color: #8FA5A3
}

.pagina-articolo .nastro {
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    overflow: hidden;
    padding: .9rem 0
}

.pagina-articolo .nastro-scorre {
    display: flex;
    gap: 3.4rem;
    width: max-content;
    animation: nastro 40s linear infinite
}

.pagina-articolo .nastro:hover .nastro-scorre {
    animation-play-state: paused
}

.pagina-articolo .nastro-voce {
    font-size: .92rem;
    color: var(--muted);
    white-space: nowrap
}

.pagina-articolo .nastro-voce b {
    color: var(--ink);
    font-weight: 600
}

.pagina-articolo .corpo {
    padding: 3.6rem 0 4.4rem
}

.pagina-articolo .indice {
    position: sticky;
    top: 104px;
    align-self: start;
    border-left: 1px solid var(--line);
    padding-left: 1.1rem
}

.pagina-articolo .indice .cap {
    font-size: .74rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted);
    font-weight: 600;
    margin-bottom: .8rem
}

.pagina-articolo .indice a {
    display: block;
    font-size: .88rem;
    color: var(--muted);
    text-decoration: none;
    padding: .28rem 0;
    border-left: 2px solid transparent;
    margin-left: -1.15rem;
    padding-left: 1.05rem;
    line-height: 1.35
}

.pagina-articolo .indice a:hover {
    color: var(--ink)
}

.pagina-articolo .indice a.attivo {
    color: var(--brand);
    font-weight: 600;
    border-left-color: var(--accento)
}

@media (max-width: 992px) {
    .pagina-articolo .indice {
        position: static;
        margin-bottom: 2.4rem
    }
}

.pagina-articolo article h2 {
    font-size: clamp(1.45rem, 2.1vw, 1.85rem);
    margin: 3rem 0 1.1rem;
    padding-top: .4rem
}

.pagina-articolo article h2:first-of-type {
    margin-top: 0
}

.pagina-articolo article h2 .num {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .82rem;
    color: var(--accento);
    display: block;
    font-weight: 500;
    letter-spacing: .06em;
    margin-bottom: .5rem
}

.pagina-articolo article h3 {
    font-size: 1.06rem;
    margin: 1.8rem 0 .6rem
}

.pagina-articolo article p {
    text-align: justify
}

.pagina-articolo article .sommario {
    font-size: 1.13rem;
    color: var(--ink);
    border-left: 3px solid var(--brand);
    padding-left: 1.2rem;
    text-align: left
}

.pagina-articolo article .sommario strong {
    font-weight: 600
}

.pagina-articolo .citazione {
    margin: 2.4rem 0;
    padding: 1.6rem 0 1.6rem 1.8rem;
    border-left: 4px solid var(--accento);
    font-size: 1.2rem;
    line-height: 1.45;
    color: var(--brand-deep);
    font-weight: 500;
    max-width: none
}

.pagina-articolo .citazione p {
    max-width: none;
    margin: 0;
    text-align: left
}

.pagina-articolo .avviso {
    border-left: 3px solid var(--accento);
    background: var(--accento-velo);
    padding: 1.15rem 1.35rem;
    margin: 2.2rem 0
}

.pagina-articolo .avviso .cap {
    font-size: .74rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .4rem
}

.pagina-articolo .avviso p {
    margin: 0;
    text-align: left
}

.pagina-articolo .figura {
    margin: 2.6rem 0;
    border: 1px solid var(--line);
    background: var(--paper)
}

.pagina-articolo .figura .tela {
    padding: 1.4rem
}

.pagina-articolo .figura figcaption {
    border-top: 1px solid var(--line);
    padding: .7rem 1.4rem;
    font-size: .84rem;
    color: var(--muted);
    background: #fff
}

.pagina-articolo .flusso {
    stroke-dasharray: 7 6;
    animation: flusso 1.6s linear infinite
}

.pagina-articolo .flusso.ritorno {
    animation-direction: reverse
}

.pagina-articolo .pulsa {
    animation: pulsa-articolo-manutenzione 2.4s ease-in-out infinite
}

.pagina-articolo .misure {
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
    margin: 2.4rem 0
}

.pagina-articolo .misura {
    background: #fff;
    padding: 1.3rem 1.4rem;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line)
}

.pagina-articolo .misura .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--brand);
    letter-spacing: -.02em
}

.pagina-articolo .misura .nome {
    font-size: .94rem;
    font-weight: 600;
    margin-top: .3rem
}

.pagina-articolo .misura .glossa {
    font-size: .88rem;
    color: var(--muted);
    margin: .35rem 0 0;
    text-align: left
}

.pagina-articolo .errori {
    counter-reset: e;
    list-style: none;
    padding: 0;
    margin: 2rem 0
}

.pagina-articolo .errori li {
    counter-increment: e;
    position: relative;
    padding: .9rem 0 .9rem 3.2rem;
    border-top: 1px solid var(--line);
    font-size: 1rem
}

.pagina-articolo .errori li:last-child {
    border-bottom: 1px solid var(--line)
}

.pagina-articolo .errori li:before {
    content: counter(e, decimal-leading-zero);
    position: absolute;
    left: 0;
    top: .85rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .8rem;
    color: var(--accento);
    border: 1px solid var(--accento);
    width: 1.9rem;
    height: 1.9rem;
    display: grid;
    place-items: center
}

.pagina-articolo .accordion-button {
    font-weight: 600;
    font-size: 1.02rem;
    color: var(--ink);
    background: #fff;
    box-shadow: none
}

.pagina-articolo .accordion-button:not(.collapsed) {
    color: var(--brand);
    background: #fff
}

.pagina-articolo .accordion-item {
    border: 0;
    border-bottom: 1px solid var(--line)
}

.pagina-articolo .accordion-body {
    color: var(--muted)
}

.pagina-articolo .accordion-body p {
    text-align: left;
    margin: 0
}

.pagina-articolo .autore {
    background: var(--paper);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 2.4rem 0;
    margin-top: 3.4rem
}

.pagina-articolo .ritratto {
    width: 84px;
    height: 84px;
    background: #0A1918;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border: .5px solid var(--bs-primary);
}

.pagina-articolo .ritratto span {
    font-family: 'IBM Plex Mono', monospace;
    color: var(--brand-pale);
    font-size: 1.4rem
}

.pagina-articolo .autore .ruolo {
    font-size: .8rem;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600
}

.pagina-articolo .autore h2 {
    font-size: 1.2rem;
    margin: .3rem 0 .5rem
}

.pagina-articolo .autore p {
    font-size: .95rem;
    color: var(--muted);
    margin: 0;
    max-width: 70ch
}

.pagina-articolo .chiusura {
    background: var(--brand);
    color: #fff;
    padding: 3.8rem 0;
    position: relative;
    overflow: hidden
}

.pagina-articolo .chiusura .trama {
    opacity: .55
}

.pagina-articolo .chiusura h2 {
    color: #fff;
    font-size: clamp(1.6rem, 2.6vw, 2.2rem)
}

.pagina-articolo .chiusura p {
    color: rgba(255, 255, 255, .9);
    margin-top: .9rem;
    max-width: 62ch
}

.pagina-articolo .altre {
    padding: 3.6rem 0 4rem
}

.pagina-articolo .altre .cap {
    font-size: .76rem;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600
}

.pagina-articolo .pista {
    display: flex;
    gap: 1.2rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 1rem;
    margin-top: 1.6rem;
    scrollbar-width: thin
}

.pagina-articolo .scheda {
    flex: 0 0 320px;
    scroll-snap-align: start;
    border: 1px solid var(--line);
    background: #fff;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    transition: border-color .25s ease, transform .25s ease
}

.pagina-articolo .scheda:hover {
    border-color: var(--brand);
    transform: translateY(-3px);
    color: inherit
}

.pagina-articolo .segnaposto {
    aspect-ratio: 16/9;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 10px, #F3F6F5 10px 20px);
    border-bottom: 1px solid var(--line);
    display: grid;
    place-items: center;
    position: relative
}

.pagina-articolo .segnaposto .misura-txt {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .72rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .2rem .55rem;
    background: #fff
}

.pagina-articolo .scheda .testo {
    padding: 1rem 1.1rem 1.2rem
}

.pagina-articolo .scheda .sett {
    font-size: .74rem;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--muted);
    font-weight: 600
}

.pagina-articolo .scheda h3 {
    font-size: 1.02rem;
    margin: .4rem 0 .5rem
}

.pagina-articolo .scheda .est {
    font-size: .88rem;
    color: var(--muted);
    margin: 0
}

.pagina-articolo .scheda .leggi {
    margin-top: .9rem;
    font-size: .88rem;
    font-weight: 600;
    color: var(--brand)
}

@media (prefers-reduced-motion: reduce) {
    .pagina-articolo *, .pagina-articolo *:before, .pagina-articolo *:after {
        animation: none !important;
        transition: none !important
    }

    html {
        scroll-behavior: auto
    }
}

/* ================= PAGINA: software-mes ================= */
@keyframes deriva-software-mes {
    from {
        transform: translate(0, 0)
    }
    to {
        transform: translate(56px, 56px)
    }
}

body.pagina-software-mes {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.6;
    margin: 0;
}

body.pagina-software-mes h1, body.pagina-software-mes h2, body.pagina-software-mes h3 {
    letter-spacing: -.022em;
    line-height: 1.12;
    font-weight: 600;
    margin: 0
}

body.pagina-software-mes p {
    margin: 0 0 1.1rem;
    max-width: 70ch
}

body.pagina-software-mes .tratto {
    display: block;
    width: 54px;
    height: 4px;
    background: var(--accento);
    margin-bottom: .9rem
}

body.pagina-software-mes .avanzamento {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    background: var(--accento);
    width: 0;
    z-index: 1200
}

body.pagina-software-mes .apertura {
    background: var(--brand-ink);
    color: #fff;
    padding: 3.4rem 0 3.8rem;
    position: relative;
    overflow: hidden
}

body.pagina-software-mes .trama {
    position: absolute;
    inset: -60px;
    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 56px 56px;
    animation: deriva-software-mes 28s linear infinite
}

body.pagina-software-mes .apertura .container {
    position: relative
}

body.pagina-software-mes .etichetta {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: var(--accento);
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .28rem .75rem
}

body.pagina-software-mes .apertura h1 {
    font-size: clamp(2rem, 3.6vw, 3.1rem);
    margin-top: 1.1rem;
    max-width: 20ch
}

body.pagina-software-mes .apertura .sotto {
    color: #C6D6D4;
    font-size: 1.1rem;
    max-width: 56ch;
    margin-top: 1.2rem
}

body.pagina-software-mes .firma {
    display: flex;
    flex-wrap: wrap;
    gap: 1.8rem;
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, .16);
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8FA5A3
}

body.pagina-software-mes .firma b {
    color: var(--accento-chiaro);
    font-weight: 500
}

body.pagina-software-mes .sintesi {
    background: #0A1918;
    border: 1px solid rgba(255, 255, 255, .15);
    border-left: 3px solid var(--accento);
    padding: 1.4rem 1.5rem
}

body.pagina-software-mes .sintesi h2 {
    font-size: .78rem;
    font-family: 'IBM Plex Mono', monospace;
    color: var(--accento-chiaro);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 1rem
}

body.pagina-software-mes .sintesi .voce {
    display: flex;
    gap: .9rem;
    padding: .55rem 0;
    border-bottom: 1px dotted rgba(255, 255, 255, .14);
    font-size: .92rem;
    color: #BFD3D1
}

body.pagina-software-mes .sintesi .voce:last-of-type {
    border-bottom: 0
}

body.pagina-software-mes .sintesi .voce .sig {
    font-family: 'IBM Plex Mono', monospace;
    color: var(--brand-pale);
    min-width: 4.4rem
}

body.pagina-software-mes .nastro {
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    overflow: hidden;
    padding: .9rem 0
}

body.pagina-software-mes .nastro-scorre {
    display: flex;
    gap: 3.4rem;
    width: max-content;
    animation: nastro 38s linear infinite
}

body.pagina-software-mes .nastro:hover .nastro-scorre {
    animation-play-state: paused
}

body.pagina-software-mes .nastro-voce {
    font-size: .92rem;
    color: var(--muted);
    white-space: nowrap
}

body.pagina-software-mes .nastro-voce b {
    color: var(--ink);
    font-weight: 600
}

body.pagina-software-mes .corpo {
    padding: 3.4rem 0 3rem
}

body.pagina-software-mes .indice {
    position: sticky;
    top: 104px;
    align-self: start;
    border-left: 1px solid var(--line);
    padding-left: 1.1rem
}

body.pagina-software-mes .indice .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .8rem
}

body.pagina-software-mes .indice a {
    display: block;
    font-size: .87rem;
    color: var(--muted);
    text-decoration: none;
    padding: .26rem 0 .26rem 1.05rem;
    margin-left: -1.15rem;
    border-left: 2px solid transparent;
    line-height: 1.34
}

body.pagina-software-mes .indice a:hover {
    color: var(--ink)
}

body.pagina-software-mes .indice a.attivo {
    color: var(--brand);
    font-weight: 600;
    border-left-color: var(--accento)
}

@media (max-width: 992px) {
    body.pagina-software-mes .indice {
        position: static;
        margin-bottom: 2.2rem
    }
}

body.pagina-software-mes article h2 {
    font-size: clamp(1.45rem, 2.1vw, 1.9rem);
    margin: 3rem 0 1.1rem
}

body.pagina-software-mes article h2:first-of-type {
    margin-top: 0
}

body.pagina-software-mes article h2 .num {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .8rem;
    color: var(--accento);
    display: block;
    font-weight: 500;
    letter-spacing: .08em;
    margin-bottom: .45rem
}

body.pagina-software-mes article p {
    text-align: justify
}

body.pagina-software-mes article .sommario {
    font-size: 1.14rem;
    text-align: left;
    border-left: 3px solid var(--brand);
    padding-left: 1.2rem;
    color: var(--brand-deep);
    max-width: none
}

body.pagina-software-mes article dfn {
    font-style: normal;
    font-weight: 600
}

body.pagina-software-mes article abbr {
    text-decoration: underline dotted;
    cursor: help
}

body.pagina-software-mes .piena {
    margin-left: calc(50% - 50vw)
}

body.pagina-software-mes .fascia {
    padding: 3.4rem 0;
    margin: 3.2rem 0;
    position: relative;
    overflow: hidden;
    background: var(--brand-ink);
    color: #fff
}

body.pagina-software-mes .fascia h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.1vw, 1.85rem);
    margin: 0
}

body.pagina-software-mes .fascia p {
    color: #C6D6D4;
    text-align: left;
    max-width: 60ch
}

body.pagina-software-mes .monogramma {
    position: absolute;
    inset: 0;
    opacity: .05;
    background-size: 120px 120px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='57' height='55'><path d='M19.26 27.26V45.34c0 .68-.56 1.22-1.25 1.22h-4.28c-.69 0-1.25-.54-1.25-1.22V12.25c0-.32.13-.63.37-.86l2.65-2.6c.24-.23.55-.36.89-.36h1.62c.69 0 1.25.55 1.25 1.22v9.26c0 .67.56 1.22 1.25 1.22h10.27c.33 0 .65.13.88.36l2.66 2.6c.23.23.36.54.36.87v.85c0 .68-.56 1.22-1.25 1.22H20.51c-.69 0-1.25.55-1.25 1.22zm24.46 15.48c0 .33-.13.64-.36.87l-2.66 2.6c-.24.23-.56.36-.89.36h-1.61c-.69 0-1.25-.54-1.25-1.22V35.31c0-.68-.57-1.22-1.26-1.22H25.43c-.34 0-.65-.13-.89-.36l-2.66-2.6c-.24-.23-.37-.54-.37-.86v-.86c0-.68.56-1.22 1.25-1.22h12.93c.69 0 1.26-.55 1.26-1.22V9.66c0-.68.56-1.22 1.25-1.22h4.27c.69 0 1.25.54 1.25 1.22v33.08z' fill='%23ffffff'/></svg>")
}

body.pagina-software-mes .fascia .container {
    position: relative
}

body.pagina-software-mes .fascia figcaption {
    border-top: 1px solid rgba(255, 255, 255, .18);
    margin-top: 1.1rem;
    padding-top: .75rem;
    font-size: .86rem;
    color: #A9BFBD
}

body.pagina-software-mes .flusso {
    stroke-dasharray: 7 6;
    animation: flusso 1.6s linear infinite
}

body.pagina-software-mes .sale {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .7s ease, transform .7s ease
}

body.pagina-software-mes .sale.visibile {
    opacity: 1;
    transform: none
}

body.pagina-software-mes .livello {
    opacity: 0;
    transform: translateX(-14px);
    transition: opacity .55s ease, transform .55s ease
}

body.pagina-software-mes .visibile .livello {
    opacity: 1;
    transform: none
}

body.pagina-software-mes .visibile .livello:nth-child(2) {
    transition-delay: .12s
}

body.pagina-software-mes .visibile .livello:nth-child(3) {
    transition-delay: .24s
}

body.pagina-software-mes .visibile .livello:nth-child(4) {
    transition-delay: .36s
}

body.pagina-software-mes .visibile .livello:nth-child(5) {
    transition-delay: .48s
}

body.pagina-software-mes .moduli {
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
    margin: 2.4rem 0
}

body.pagina-software-mes .modulo {
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 1.3rem 1.4rem;
    background: #fff;
    height: 100%
}

body.pagina-software-mes .modulo .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

body.pagina-software-mes .modulo h3 {
    font-size: 1rem;
    margin: .45rem 0 .35rem
}

body.pagina-software-mes .modulo p {
    font-size: .9rem;
    color: var(--muted);
    margin: 0;
    text-align: left;
    max-width: none
}

body.pagina-software-mes .protocolli {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 1.6rem 0 2.4rem
}

body.pagina-software-mes .protocolli span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .8rem;
    border: 1px solid var(--line);
    padding: .3rem .7rem;
    background: #fff
}

body.pagina-software-mes .nav-tabs {
    border-bottom: 1px solid var(--line)
}

body.pagina-software-mes .nav-tabs .nav-link {
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    color: var(--muted);
    font-weight: 600;
    font-size: .95rem;
    padding: .8rem 1.1rem
}

body.pagina-software-mes .nav-tabs .nav-link.active {
    color: var(--brand);
    border-bottom-color: var(--accento);
    background: transparent
}

body.pagina-software-mes .tab-pane .num-grande {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 2.4rem;
    color: var(--accento);
    font-weight: 600;
    line-height: 1
}

body.pagina-software-mes .finestra {
    aspect-ratio: 16/10;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 12px, #F3F6F5 12px 24px);
    border: 1px solid var(--line);
    display: grid;
    place-items: center
}

body.pagina-software-mes .finestra span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .75rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .22rem .6rem;
    background: #fff
}

body.pagina-software-mes .avviso {
    border-left: 4px solid var(--accento);
    background: var(--accento-velo);
    padding: 1.2rem 1.4rem;
    margin: 2.2rem 0
}

body.pagina-software-mes .avviso .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .4rem
}

body.pagina-software-mes .avviso p {
    margin: 0;
    text-align: left;
    max-width: none
}

body.pagina-software-mes .requisiti {
    border: 1px solid var(--line);
    background: var(--paper);
    padding: 1.3rem 1.4rem;
    margin: 2rem 0
}

body.pagina-software-mes .requisiti .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento);
    margin-bottom: .8rem
}

body.pagina-software-mes .requisiti ul {
    list-style: none;
    padding: 0;
    margin: 0
}

body.pagina-software-mes .requisiti li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px dotted var(--line);
    padding: .45rem 0;
    font-size: .93rem
}

body.pagina-software-mes .requisiti li:last-child {
    border-bottom: 0
}

body.pagina-software-mes .requisiti li b {
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 500;
    color: var(--brand-deep);
    text-align: right
}

body.pagina-software-mes .filetto-lungo {
    border: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--accento) 0 22%, var(--line) 22%);
    margin: 3rem 0 0
}

body.pagina-software-mes .accordion-button {
    font-weight: 600;
    font-size: 1.02rem;
    color: var(--ink);
    background: #fff;
    box-shadow: none
}

body.pagina-software-mes .accordion-button:not(.collapsed) {
    color: var(--accento);
    background: #fff
}

body.pagina-software-mes .accordion-item {
    border: 0;
    border-bottom: 1px solid var(--line)
}

body.pagina-software-mes .accordion-body p {
    text-align: left;
    margin: 0;
    color: var(--muted);
    max-width: none
}

body.pagina-software-mes .zona-invito {
    background: var(--paper);
    padding: 3.4rem 0 0;
    border-top: 1px solid var(--line)
}

body.pagina-software-mes .invito {
    background: var(--brand);
    color: #fff;
    padding: 2.7rem 2.5rem;
    position: relative;
    margin-bottom: -4.5rem;
    z-index: 5;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22)
}

body.pagina-software-mes .invito:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--accento)
}

body.pagina-software-mes .invito h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.4vw, 2rem)
}

body.pagina-software-mes .invito p {
    color: rgba(255, 255, 255, .9);
    margin-top: .8rem;
    max-width: 62ch
}

body.pagina-software-mes .altre {
    background: var(--paper);
    padding: 5.6rem 0 3.6rem;
    border-top: 1px solid var(--line)
}

body.pagina-software-mes .altre .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

body.pagina-software-mes .pista {
    display: flex;
    gap: 1.1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 1rem;
    margin-top: 1.4rem
}

body.pagina-software-mes .scheda {
    flex: 0 0 300px;
    scroll-snap-align: start;
    background: #fff;
    border: 1px solid var(--line);
    text-decoration: none;
    color: inherit;
    transition: transform .25s ease, box-shadow .25s ease
}

body.pagina-software-mes .scheda:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(0, 0, 0, .1);
    color: inherit
}

body.pagina-software-mes .scheda .riq {
    aspect-ratio: 16/10;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 10px, #F3F6F5 10px 20px);
    border-bottom: 1px solid var(--line);
    display: grid;
    place-items: center;
    position: relative
}

body.pagina-software-mes .scheda .riq span.q {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .72rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .2rem .55rem;
    background: #fff
}

body.pagina-software-mes .scheda .cifra {
    position: absolute;
    left: 0;
    bottom: 0;
    background: var(--accento);
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .78rem;
    padding: .2rem .6rem
}

body.pagina-software-mes .scheda .tx {
    padding: .95rem 1.05rem 1.15rem
}

body.pagina-software-mes .scheda h3 {
    font-size: 1rem;
    margin-bottom: .4rem
}

body.pagina-software-mes .scheda p {
    font-size: .87rem;
    color: var(--muted);
    margin: 0;
    max-width: none
}

@media (prefers-reduced-motion: reduce) {
    body.pagina-software-mes *, body.pagina-software-mes *:before, body.pagina-software-mes *:after {
        animation: none !important;
        transition: none !important
    }

    body.pagina-software-mes .sale, body.pagina-software-mes .livello {
        opacity: 1;
        transform: none
    }

    html {
        scroll-behavior: auto
    }
}

/* ================= PAGINA: modelli-produttivi ================= */
@keyframes deriva-modelli-produttivi {
    from {
        transform: translate(0, 0)
    }

    to {
        transform: translate(58px, 58px)
    }
}

.pagina-modelli-produttivi {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.6;
    margin: 0;
}

.pagina-modelli-produttivi h1, .pagina-modelli-produttivi h2, .pagina-modelli-produttivi h3 {
    letter-spacing: -.022em;
    line-height: 1.12;
    font-weight: 600;
    margin: 0
}

.pagina-modelli-produttivi p {
    margin: 0 0 1.1rem;
    max-width: 70ch
}

.pagina-modelli-produttivi .tratto {
    display: block;
    width: 54px;
    height: 4px;
    background: var(--accento);
    margin-bottom: .9rem
}

.pagina-modelli-produttivi .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .75rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-modelli-produttivi .avanzamento {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    background: var(--accento);
    width: 0;
    z-index: 1200
}

.pagina-modelli-produttivi .apertura {
    background: var(--brand-ink);
    color: #fff;
    padding: 3.2rem 0 3.4rem;
    position: relative;
    overflow: hidden
}

.pagina-modelli-produttivi .strato {
    position: absolute;
    inset: -18% -3%
}

.pagina-modelli-produttivi .strato.griglia {
    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 58px 58px;
    animation: deriva-modelli-produttivi 30s linear infinite
}

.pagina-modelli-produttivi .strato.alone {
    background: radial-gradient(48% 62% at 76% 40%, rgba(198, 122, 18, .3), transparent 70%)
}

.pagina-modelli-produttivi .apertura .container {
    position: relative;
    z-index: 3
}

.pagina-modelli-produttivi .etichetta {
    display: inline-block;
    background: var(--accento);
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .28rem .75rem
}

.pagina-modelli-produttivi .apertura h1 {
    font-size: clamp(2rem, 3.8vw, 3.2rem);
    margin-top: 1.1rem;
    max-width: 19ch
}

.pagina-modelli-produttivi .apertura .sotto {
    color: #C6D6D4;
    font-size: 1.1rem;
    max-width: 58ch;
    margin-top: 1.2rem
}

.pagina-modelli-produttivi .consolle {
    background: var(--brand-ink);
    color: #fff;
    padding: 0 0 4.2rem;
    position: relative;
    overflow: hidden
}

.pagina-modelli-produttivi .telaio {
    background: #0A1918;
    border: 1px solid rgba(255, 255, 255, .16);
    border-top: 4px solid var(--accento)
}

.pagina-modelli-produttivi .telaio .capo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding: .9rem 1.3rem;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8FA5A3
}

.pagina-modelli-produttivi .scelte {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    padding: 1rem 1.3rem;
    border-bottom: 1px solid rgba(255, 255, 255, .14)
}

.pagina-modelli-produttivi .scelte button {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .24);
    color: #C6D6D4;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .84rem;
    padding: .42rem .9rem;
    border-radius: 2px;
    transition: all .22s ease
}

.pagina-modelli-produttivi .scelte button:hover {
    border-color: var(--accento-chiaro);
    color: #fff
}

.pagina-modelli-produttivi .scelte button.attivo {
    background: var(--accento);
    border-color: var(--accento);
    color: #fff;
    font-weight: 600
}

.pagina-modelli-produttivi .tubo {
    padding: 1.6rem 1.3rem 1.2rem
}

.pagina-modelli-produttivi .fasi {
    display: grid;
    grid-template-columns:repeat(6, 1fr);
    gap: .35rem;
    position: relative
}

.pagina-modelli-produttivi .fase {
    border: 1px solid rgba(255, 255, 255, .18);
    padding: .7rem .6rem;
    text-align: center;
    transition: background .45s ease, border-color .45s ease, color .45s ease
}

.pagina-modelli-produttivi .fase .n {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .68rem;
    color: #8FA5A3;
    display: block;
    margin-bottom: .25rem
}

.pagina-modelli-produttivi .fase .t {
    font-size: .82rem;
    line-height: 1.25
}

.pagina-modelli-produttivi .fase.spinta {
    background: rgba(198, 122, 18, .22);
    border-color: var(--accento)
}

.pagina-modelli-produttivi .fase.tirata {
    background: rgba(2, 102, 102, .4);
    border-color: var(--brand-mid)
}

@media (max-width: 768px) {
    .pagina-modelli-produttivi .fasi {
        grid-template-columns:repeat(3, 1fr)
    }
}

.pagina-modelli-produttivi .asse {
    position: relative;
    height: 54px;
    margin-top: .6rem
}

.pagina-modelli-produttivi .linea {
    position: absolute;
    left: 0;
    right: 0;
    top: 26px;
    height: 1px;
    background: rgba(255, 255, 255, .2)
}

.pagina-modelli-produttivi .indicatore {
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    transition: left .55s cubic-bezier(.2, .7, .3, 1);
    text-align: center
}

.pagina-modelli-produttivi .indicatore .asta {
    width: 2px;
    height: 26px;
    background: var(--accento-chiaro);
    margin: 0 auto
}

.pagina-modelli-produttivi .indicatore .pallino {
    width: 13px;
    height: 13px;
    background: var(--accento-chiaro);
    border-radius: 50%;
    margin: -6px auto 0;
    box-shadow: 0 0 0 0 rgba(232, 169, 75, .6);
    animation: onda 2.2s ease-out infinite
}

.pagina-modelli-produttivi .indicatore .voce {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .7rem;
    color: var(--accento-chiaro);
    margin-top: .3rem;
    white-space: nowrap
}

.pagina-modelli-produttivi .legenda {
    display: flex;
    gap: 1.4rem;
    flex-wrap: wrap;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .72rem;
    color: #8FA5A3;
    padding: 0 1.3rem 1rem
}

.pagina-modelli-produttivi .legenda i {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: .35rem;
    vertical-align: -1px
}

.pagina-modelli-produttivi .legenda .p {
    background: rgba(198, 122, 18, .6);
    border: 1px solid var(--accento)
}

.pagina-modelli-produttivi .legenda .t {
    background: rgba(2, 102, 102, .7);
    border: 1px solid var(--brand-mid)
}

.pagina-modelli-produttivi .pannello {
    display: grid;
    grid-template-columns:1.3fr 1fr;
    gap: 0;
    border-top: 1px solid rgba(255, 255, 255, .14)
}

@media (max-width: 992px) {
    .pagina-modelli-produttivi .pannello {
        grid-template-columns:1fr
    }
}

.pagina-modelli-produttivi .pannello .testo {
    padding: 1.4rem 1.3rem
}

.pagina-modelli-produttivi .pannello .testo h3 {
    font-size: 1.2rem;
    color: #fff
}

.pagina-modelli-produttivi .pannello .testo .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento-chiaro)
}

.pagina-modelli-produttivi .pannello .testo p {
    color: #C6D6D4;
    font-size: .95rem;
    margin: .7rem 0 0;
    max-width: 52ch
}

.pagina-modelli-produttivi .pannello .testo .peso {
    margin-top: 1rem;
    font-size: .9rem;
    color: #A9BFBD
}

.pagina-modelli-produttivi .pannello .testo .peso b {
    color: #fff;
    font-weight: 600
}

.pagina-modelli-produttivi .pannello .misure {
    border-left: 1px solid rgba(255, 255, 255, .14);
    padding: 1.4rem 1.3rem
}

@media (max-width: 992px) {
    .pagina-modelli-produttivi .pannello .misure {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, .14)
    }
}

.pagina-modelli-produttivi .misura-riga {
    margin-bottom: 1rem
}

.pagina-modelli-produttivi .misura-riga .nome {
    display: flex;
    justify-content: space-between;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8FA5A3;
    margin-bottom: .32rem
}

.pagina-modelli-produttivi .misura-riga .nome b {
    color: var(--accento-chiaro);
    font-weight: 500
}

.pagina-modelli-produttivi .barretta {
    height: 6px;
    background: rgba(255, 255, 255, .12);
    position: relative;
    overflow: hidden
}

.pagina-modelli-produttivi .barretta i {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    background: var(--accento);
    transition: width .55s cubic-bezier(.2, .7, .3, 1)
}

.pagina-modelli-produttivi .vaiApagina {
    margin-top: 1rem;
    display: inline-block
}

.pagina-modelli-produttivi .scala {
    margin-top: 2.4rem
}

.pagina-modelli-produttivi .riga-modello {
    display: grid;
    grid-template-columns:repeat(6, 1fr) 170px;
    gap: .3rem;
    align-items: center;
    margin-bottom: .45rem;
    cursor: pointer
}

.pagina-modelli-produttivi .riga-modello .barra-lt {
    grid-row: 1;
    height: 34px;
    background: var(--brand-mid);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 .8rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .78rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform .8s cubic-bezier(.2, .7, .3, 1), background .3s ease
}

.pagina-modelli-produttivi .visibile .riga-modello .barra-lt {
    transform: scaleX(1)
}

.pagina-modelli-produttivi .blocco-modello:nth-of-type(2) .barra-lt {
    transition-delay: .14s
}

.pagina-modelli-produttivi .blocco-modello:nth-of-type(3) .barra-lt {
    transition-delay: .28s
}

.pagina-modelli-produttivi .blocco-modello:nth-of-type(4) .barra-lt {
    transition-delay: .42s
}

.pagina-modelli-produttivi .blocco-modello:nth-of-type(5) .barra-lt {
    transition-delay: .56s
}

.pagina-modelli-produttivi .riga-fasi {
    display: grid;
    grid-template-columns:repeat(6, 1fr) 170px;
    gap: .3rem;
    margin-bottom: 1.1rem
}

.pagina-modelli-produttivi .cella-fase {
    background: var(--brand-ink);
    color: #fff;
    font-size: .82rem;
    line-height: 1.2;
    text-align: center;
    padding: .7rem .4rem;
    transition: background .3s ease, transform .3s ease
}

.pagina-modelli-produttivi .targa {
    grid-column: 7;
    grid-row: 1 / span 2;
    background: var(--brand);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 600;
    font-size: .92rem;
    line-height: 1.2;
    padding: .6rem;
    letter-spacing: .02em;
    transition: background .3s ease
}

.pagina-modelli-produttivi .blocco-modello {
    margin-bottom: 1.3rem
}

.pagina-modelli-produttivi .blocco-modello.acceso .barra-lt {
    background: var(--accento)
}

.pagina-modelli-produttivi .blocco-modello.acceso .cella-fase {
    background: var(--brand-deep)
}

.pagina-modelli-produttivi .blocco-modello.acceso .targa {
    background: var(--accento)
}

.pagina-modelli-produttivi .blocco-modello:hover .barra-lt {
    background: var(--accento-chiaro)
}

.pagina-modelli-produttivi .blocco-modello .griglia-interna {
    display: grid;
    gap: .45rem
}

@media (max-width: 768px) {
    .pagina-modelli-produttivi .riga-modello, .pagina-modelli-produttivi .riga-fasi, .pagina-modelli-produttivi .scala-cap {
        grid-template-columns:repeat(6, 1fr) 92px;
        gap: .22rem
    }

    .pagina-modelli-produttivi .cella-fase {
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        height: 124px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: .74rem;
        line-height: 1.1;
        padding: .5rem .18rem;
        white-space: nowrap
    }

    .pagina-modelli-produttivi .cella-fase:hover, .pagina-modelli-produttivi .cella-fase:focus-visible {
        transform: rotate(180deg) translateX(2px)
    }

    .pagina-modelli-produttivi .riga-modello .barra-lt {
        font-size: .6rem;
        height: 26px;
        padding: 0 .4rem;
        letter-spacing: .03em
    }

    .pagina-modelli-produttivi .targa {
        font-size: .7rem;
        padding: .4rem .2rem
    }

    .pagina-modelli-produttivi .vai-targa {
        display: none
    }

    .pagina-modelli-produttivi .suggerimento {
        max-width: min(330px, calc(100vw - 24px))
    }
}

@media (max-width: 400px) {
    .pagina-modelli-produttivi .cella-fase {
        font-size: .68rem;
        height: 118px
    }

    .pagina-modelli-produttivi .riga-modello, .pagina-modelli-produttivi .riga-fasi, .pagina-modelli-produttivi .scala-cap {
        grid-template-columns:repeat(6, 1fr) 78px
    }
}

.pagina-modelli-produttivi .scala-cap {
    display: grid;
    grid-template-columns:repeat(6, 1fr) 170px;
    gap: .3rem;
    margin-bottom: .6rem
}

.pagina-modelli-produttivi .scala-cap span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .68rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--muted);
    text-align: center
}

@media (max-width: 768px) {
    .pagina-modelli-produttivi .scala-cap span {
        font-size: .58rem
    }
}

.pagina-modelli-produttivi .targa {
    flex-direction: column;
    gap: .3rem
}

.pagina-modelli-produttivi .vai-targa {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .66rem;
    letter-spacing: .06em;
    text-transform: none;
    opacity: 0;
    transition: opacity .25s ease
}

.pagina-modelli-produttivi .blocco-modello:hover .vai-targa, .pagina-modelli-produttivi .blocco-modello:focus-visible .vai-targa {
    opacity: .85
}

.pagina-modelli-produttivi .cella-fase {
    cursor: help
}

.pagina-modelli-produttivi .cella-fase:hover, .pagina-modelli-produttivi .cella-fase:focus-visible {
    background: var(--brand-deep);
    transform: translateY(-2px)
}

.pagina-modelli-produttivi .tooltip .tooltip-inner {
    background: #0A1918;
    color: #D6E4E2;
    border-left: 3px solid var(--accento);
    border-radius: 2px;
    font-size: .85rem;
    line-height: 1.45;
    max-width: 320px;
    text-align: left;
    padding: .7rem .85rem
}

.pagina-modelli-produttivi .tooltip .tooltip-arrow:before {
    border-top-color: #0A1918;
    border-bottom-color: #0A1918
}

.pagina-modelli-produttivi .tooltip.show {
    opacity: 1
}

.pagina-modelli-produttivi a.blocco-modello {
    display: block;
    text-decoration: none;
    color: inherit
}

.pagina-modelli-produttivi a.blocco-modello:hover, .pagina-modelli-produttivi a.blocco-modello:focus-visible {
    color: inherit
}

.pagina-modelli-produttivi .suggerimento {
    position: fixed;
    z-index: 1400;
    max-width: 330px;
    background: #0A1918;
    color: #D6E4E2;
    border-left: 3px solid var(--accento);
    padding: .75rem .9rem;
    font-size: .86rem;
    line-height: 1.45;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .35);
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .18s ease, transform .18s ease;
    pointer-events: none
}

.pagina-modelli-produttivi .suggerimento.visibile {
    opacity: 1;
    transform: none
}

.pagina-modelli-produttivi .suggerimento .capo-tip {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .68rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento-chiaro);
    display: block;
    margin-bottom: .35rem
}

.pagina-modelli-produttivi .corpo {
    padding: 3.6rem 0 2rem
}

.pagina-modelli-produttivi .sezione {
    padding: 4rem 0
}

.pagina-modelli-produttivi .sezione.chiara {
    background: var(--paper);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line)
}

.pagina-modelli-produttivi .sezione.scura {
    background: var(--brand-ink);
    color: #fff;
    position: relative;
    overflow: hidden
}

.pagina-modelli-produttivi .sezione.scura h2 {
    color: #fff
}

.pagina-modelli-produttivi .sezione.scura p {
    color: #C6D6D4
}

.pagina-modelli-produttivi .monogramma {
    position: absolute;
    inset: 0;
    opacity: .05;
    background-size: 120px 120px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='57' height='55'><path d='M19.26 27.26V45.34c0 .68-.56 1.22-1.25 1.22h-4.28c-.69 0-1.25-.54-1.25-1.22V12.25c0-.32.13-.63.37-.86l2.65-2.6c.24-.23.55-.36.89-.36h1.62c.69 0 1.25.55 1.25 1.22v9.26c0 .67.56 1.22 1.25 1.22h10.27c.33 0 .65.13.88.36l2.66 2.6c.23.23.36.54.36.87v.85c0 .68-.56 1.22-1.25 1.22H20.51c-.69 0-1.25.55-1.25 1.22zm24.46 15.48c0 .33-.13.64-.36.87l-2.66 2.6c-.24.23-.56.36-.89.36h-1.61c-.69 0-1.25-.54-1.25-1.22V35.31c0-.68-.57-1.22-1.26-1.22H25.43c-.34 0-.65-.13-.89-.36l-2.66-2.6c-.24-.23-.37-.54-.37-.86v-.86c0-.68.56-1.22 1.25-1.22h12.93c.69 0 1.26-.55 1.26-1.22V9.66c0-.68.56-1.22 1.25-1.22h4.27c.69 0 1.25.54 1.25 1.22v33.08z' fill='%23ffffff'/></svg>")
}

.pagina-modelli-produttivi .sezione .container {
    position: relative
}

.pagina-modelli-produttivi .sezione h2 {
    font-size: clamp(1.5rem, 2.3vw, 2rem)
}

.pagina-modelli-produttivi .confronto {
    width: 100%;
    border-collapse: collapse;
    margin-top: 2rem;
    font-size: .92rem;
    background: #fff
}

.pagina-modelli-produttivi .confronto th, .pagina-modelli-produttivi .confronto td {
    border: 1px solid var(--line);
    padding: .7rem .8rem;
    text-align: left;
    vertical-align: top
}

.pagina-modelli-produttivi .confronto thead th {
    background: var(--brand-ink);
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: 500;
    position: sticky;
    top: 66px;
    z-index: 5
}

.pagina-modelli-produttivi .confronto tbody th {
    background: var(--paper);
    font-weight: 600;
    width: 190px
}

.pagina-modelli-produttivi .confronto td.forte {
    background: var(--accento-velo);
    color: var(--accento);
    font-weight: 600
}

.pagina-modelli-produttivi .giro-tabella {
    overflow-x: auto
}

.pagina-modelli-produttivi .modelli {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
    gap: 0;
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
    margin-top: 2.2rem
}

.pagina-modelli-produttivi .modello {
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: #fff;
    padding: 1.4rem 1.4rem 1.5rem;
    text-decoration: none;
    color: inherit;
    position: relative;
    overflow: hidden;
    transition: background .25s ease
}

.pagina-modelli-produttivi .modello:hover {
    background: var(--accento-velo);
    color: inherit
}

.pagina-modelli-produttivi .modello:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 4px;
    width: 0;
    background: var(--accento);
    transition: width .4s ease
}

.pagina-modelli-produttivi .modello:hover:before {
    width: 100%
}

.pagina-modelli-produttivi .modello .sig {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    color: var(--accento)
}

.pagina-modelli-produttivi .modello h3 {
    font-size: 1.05rem;
    margin: .45rem 0 .4rem
}

.pagina-modelli-produttivi .modello p {
    font-size: .9rem;
    color: var(--muted);
    margin: 0;
    max-width: none
}

.pagina-modelli-produttivi .modello .vai {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .86rem;
    color: var(--brand);
    margin-top: .8rem;
    display: block
}

.pagina-modelli-produttivi .modello.da-fare {
    background: repeating-linear-gradient(135deg, #fff 0 10px, #FAFBFB 10px 20px)
}

.pagina-modelli-produttivi .modello.da-fare .vai {
    color: var(--muted)
}

.pagina-modelli-produttivi .avviso {
    border-left: 4px solid var(--accento);
    background: var(--accento-velo);
    padding: 1.2rem 1.4rem;
    margin: 2rem 0
}

.pagina-modelli-produttivi .avviso .cap {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .4rem
}

.pagina-modelli-produttivi .avviso p {
    margin: 0;
    max-width: none
}

.pagina-modelli-produttivi .zona-invito {
    background: var(--paper);
    padding: 3.4rem 0 0;
    border-top: 1px solid var(--line)
}

.pagina-modelli-produttivi .invito {
    background: var(--brand);
    color: #fff;
    padding: 2.7rem 2.5rem;
    position: relative;
    margin-bottom: -4.5rem;
    z-index: 5;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22)
}

.pagina-modelli-produttivi .invito:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--accento)
}

.pagina-modelli-produttivi .invito h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.4vw, 2rem)
}

.pagina-modelli-produttivi .invito p {
    color: rgba(255, 255, 255, .9);
    margin-top: .8rem;
    max-width: 62ch
}

.pagina-modelli-produttivi .sale {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .7s ease, transform .7s ease
}

.pagina-modelli-produttivi .sale.visibile {
    opacity: 1;
    transform: none
}

@media (prefers-reduced-motion: reduce) {
    .pagina-modelli-produttivi *, .pagina-modelli-produttivi *:before, .pagina-modelli-produttivi *:after {
        animation: none !important;
        transition: none !important
    }

    .pagina-modelli-produttivi .sale {
        opacity: 1;
        transform: none
    }

    html {
        scroll-behavior: auto
    }
}

/* ================= PAGINA: pagina-base ================= */
@keyframes deriva-pagina-base {
    from {
        transform: translate(0, 0)
    }

    to {
        transform: translate(58px, 58px)
    }
}

.pagina-pagina-base {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    color: var(--ink);
    font-size: 16px;
    line-height: 1.50;
    margin: 0;
}

.pagina-pagina-base h1, .pagina-pagina-base h2, .pagina-pagina-base h3 {
    letter-spacing: -.024em;
    line-height: 1.1;
    font-weight: 600;
    margin: 0
}

.pagina-pagina-base p {
    margin: 0 0 1.15rem
}

.pagina-pagina-base .misura {
    max-width: 760px
}

.pagina-pagina-base .tratto {
    display: block;
    width: 54px;
    height: 4px;
    background: var(--accento);
    margin-bottom: .9rem
}

.pagina-pagina-base .apertura {
    color: #fff;
    padding: 3.2rem 0 3.4rem;
    position: relative;
    overflow: hidden
}

.pagina-pagina-base .bg-title-page {
    background: var(--brand-ink);
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    z-index: -1;
}

.pagina-pagina-base .apertura .vel {
    position: absolute;
    inset: -20%;
    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 58px 58px;
    animation: deriva-pagina-base 30s linear infinite;
    z-index: -1;
}

.pagina-pagina-bas .apertura .container {
    position: relative
}

.pagina-pagina-base .occhiello {
    display: inline-block;
    background: var(--accento);
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: .28rem .75rem
}

.pagina-pagina-base .apertura h1 {
    font-size: clamp(2rem, 4vw, 3.3rem);
    margin-top: 1.1rem;
    max-width: 19ch
}

.pagina-pagina-base .apertura .sotto {
    color: #C6D6D4;
    font-size: 1.12rem;
    max-width: 58ch;
    margin-top: 1.2rem
}

.pagina-pagina-base .meta {
    display: flex;
    flex-wrap: wrap;
    gap: 1.8rem;
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, .18);
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8FA5A3
}

.pagina-pagina-base .meta b {
    color: var(--accento-chiaro);
    font-weight: 500
}

.pagina-pagina-base .definizione {
    border: 1px solid var(--line);
    border-left: 5px solid var(--accento);
    background: #fff;
    padding: 1.5rem 1.7rem;
    margin: 2.4rem 0;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .05)
}

.pagina-pagina-base .definizione .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento);
    margin-bottom: .5rem
}

.pagina-pagina-base .definizione p {
    font-size: 1.12rem;
    line-height: 1.5;
    margin: 0
}

.pagina-pagina-base .indice {
    background: var(--paper);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 2.4rem 0;
    margin: 2.8rem 0
}

.pagina-pagina-base .indice .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento);
    margin-bottom: 1.1rem
}

@media (min-width: 567px) {
    .pagina-pagina-base .indice-content {
        column-count: 2;
        column-gap: 50px;
    }
}


@media (min-width: 768px) {
    .pagina-pagina-base .indice-content {
        column-count: 3;
        column-gap: 50px;
    }
}

.pagina-pagina-base .indice li::marker {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .78rem;
    color: var(--accento);
    min-width: 1.7rem
}

.pagina-pagina-base .indice a {
    display: flex;
    gap: .7rem;
    align-items: baseline;
    text-decoration: none;
    color: var(--ink);
    padding: .42rem 0;
    border-bottom: 1px dotted var(--line);
    font-size: .95rem;
    line-height: 1.35
}

.pagina-pagina-base .indice a:hover {
    color: var(--brand)
}

.pagina-pagina-base .testo h2 {
    font-size: clamp(1.45rem, 2.2vw, 1.95rem);
    margin: 2.8rem 0 1rem
}

.pagina-pagina-base .testo h3 {
    font-size: 1.05rem;
    margin: 1.6rem 0 .5rem
}

.pagina-pagina-base .testo p {
    text-align: justify
}

.pagina-pagina-base .scala {
    color: #fff;
    padding: 3rem 0;
    margin: 3rem 0;
    position: relative;
    overflow: hidden
}

.pagina-pagina-base .scala .alone {
    position: absolute;
    inset: 0;
    background: radial-gradient(48% 70% at 20% 50%, rgba(2, 102, 102, .55), transparent 70%)
}

.pagina-pagina-base .scala .container {
    position: relative
}

.pagina-pagina-base .scala h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.2vw, 1.9rem)
}

.pagina-pagina-base .scala p {
    color: #C6D6D4
}

.pagina-pagina-base .tappa {
    fill: none;
    stroke-width: 2
}

.pagina-pagina-base .scorre {
    stroke-dasharray: 8 6;
    animation: scorre 1.5s linear infinite
}

.pagina-pagina-base .contrasto {
    display: grid;
    grid-template-columns:1fr 1fr;
    gap: 0;
    margin: 2.6rem 0;
    border: 1px solid var(--line)
}

@media (max-width: 768px) {
    .pagina-pagina-base .contrasto {
        grid-template-columns:1fr
    }
}

.pagina-pagina-base .contrasto > div {
    padding: 1.5rem 1.6rem
}

.pagina-pagina-base .contrasto > div:first-child {
    background: var(--accento-velo);
    border-right: 1px solid var(--line)
}

.pagina-pagina-base .contrasto .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: .6rem
}

.pagina-pagina-base .contrasto > div:first-child .et {
    color: var(--accento)
}

.pagina-pagina-base .contrasto > div:last-child .et {
    color: var(--brand)
}

.pagina-pagina-base .contrasto p {
    margin: 0;
    font-size: .97rem
}

.pagina-pagina-base .condizioni {
    counter-reset: c;
    list-style: none;
    padding: 0;
    margin: 2.4rem 0;
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
    gap: 0;
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line)
}

.pagina-pagina-base .condizioni li {
    counter-increment: c;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 1.3rem 1.4rem;
    font-size: .95rem
}

.pagina-pagina-base .condizioni li:before {
    content: counter(c, decimal-leading-zero);
    display: block;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 1.5rem;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .5rem
}

.pagina-pagina-base .condizioni li b {
    display: block;
    margin-bottom: .3rem
}

.pagina-pagina-base .formula {
    background: var(--brand-ink);
    color: #fff;
    padding: 1.6rem 1.8rem;
    margin: 2.4rem 0;
    border-left: 5px solid var(--accento)
}

.pagina-pagina-base .formula .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--accento-chiaro);
    margin-bottom: .7rem
}

.pagina-pagina-base .formula .eq {
    font-family: 'IBM Plex Mono', monospace;
    font-size: clamp(.95rem, 1.7vw, 1.2rem);
    line-height: 1.6
}

.pagina-pagina-base .formula .eq b {
    color: var(--accento-chiaro);
    font-weight: 600
}

.pagina-pagina-base .formula .gl {
    font-size: .88rem;
    color: #A9BFBD;
    margin: .9rem 0 0
}

.pagina-pagina-base .bilancia {
    margin: 2.6rem 0;
    border: 1px solid var(--line)
}

.pagina-pagina-base .bilancia .testa {
    display: grid;
    grid-template-columns:1fr 1fr
}

.pagina-pagina-base .bilancia .testa div {
    padding: .75rem 1.2rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #fff
}

.pagina-pagina-base .bilancia .testa .si {
    background: var(--brand)
}

.pagina-pagina-base .bilancia .testa .no {
    background: var(--block)
}

.pagina-pagina-base .bilancia .riga {
    display: grid;
    grid-template-columns:1fr 1fr;
    border-top: 1px solid var(--line)
}

.pagina-pagina-base .bilancia .riga div {
    padding: .9rem 1.2rem;
    font-size: .95rem
}

.pagina-pagina-base .bilancia .riga div:first-child {
    border-right: 1px solid var(--line);
    background: #fff
}

.pagina-pagina-base .bilancia .riga div:last-child {
    background: var(--block-velo)
}

@media (max-width: 576px) {
    .pagina-pagina-base .bilancia .testa, .pagina-pagina-base .bilancia .riga {
        grid-template-columns:1fr
    }

    .pagina-pagina-base .bilancia .riga div:first-child {
        border-right: 0;
        border-bottom: 1px solid var(--line)
    }
}

.pagina-pagina-base .avviso {
    border-left: 4px solid var(--accento);
    background: var(--accento-velo);
    padding: 1.2rem 1.4rem;
    margin: 2.2rem 0
}

.pagina-pagina-base .avviso .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .74rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento);
    font-weight: 600;
    margin-bottom: .4rem
}

.pagina-pagina-base .avviso p {
    margin: 0;
    text-align: left
}

.pagina-pagina-base .grido {
    margin: 3rem 0;
    padding: 2rem 0;
    border-top: 4px solid var(--accento);
    border-bottom: 1px solid var(--line)
}

.pagina-pagina-base .grido p {
    font-size: clamp(1.3rem, 2.4vw, 1.85rem);
    line-height: 1.28;
    font-weight: 600;
    color: var(--brand-deep);
    margin: 0;
    text-align: left;
    max-width: 26ch
}

.pagina-pagina-base .spunte {
    list-style: none;
    padding: 0;
    margin: 2rem 0
}

.pagina-pagina-base .spunte li {
    position: relative;
    padding: .65rem 0 .65rem 2.4rem;
    border-bottom: 1px solid var(--line);
    font-size: .97rem
}

.pagina-pagina-base .spunte li:first-child {
    border-top: 1px solid var(--line)
}

.pagina-pagina-base .spunte li:before {
    content: "";
    position: absolute;
    left: .2rem;
    top: 1.05rem;
    width: 11px;
    height: 11px;
    border: 2px solid var(--accento);
    transform: rotate(45deg)
}

.pagina-pagina-base .figura {
    margin: 2.6rem 0
}

.pagina-pagina-base .figura .riq {
    aspect-ratio: 16/7;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 12px, #F3F6F5 12px 24px);
    border: 1px solid var(--line);
    display: grid;
    place-items: center
}

.pagina-pagina-base .figura .riq span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .25rem .7rem;
    background: #fff
}

.pagina-pagina-base .figura figcaption {
    font-size: .86rem;
    color: var(--muted);
    margin-top: .6rem
}

.pagina-pagina-base .accordion-button {
    font-weight: 600;
    font-size: 1.02rem;
    color: var(--ink);
    background: #fff;
    box-shadow: none
}

.pagina-pagina-base .accordion-button:not(.collapsed) {
    color: var(--accento);
    background: #fff
}

.pagina-pagina-base .accordion-item {
    border: 0;
    border-bottom: 1px solid var(--line)
}

.pagina-pagina-base .accordion-body {
    color: var(--muted)
}

.pagina-pagina-base .accordion-body p {
    text-align: left;
    margin: 0
}

.pagina-pagina-base .zona-invito {
    background: var(--paper);
    padding: 3.4rem 0 0;
    border-top: 1px solid var(--line);
    margin-top: 3.4rem
}

.pagina-pagina-base .invito {
    background: var(--brand);
    color: #fff;
    padding: 2.7rem 2.5rem;
    position: relative;
    margin-bottom: -4.5rem;
    z-index: 5;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22)
}

.pagina-pagina-base .invito:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--accento)
}

.pagina-pagina-base .invito h2 {
    color: #fff;
    font-size: clamp(1.4rem, 2.4vw, 2rem)
}

.pagina-pagina-base .invito p {
    color: rgba(255, 255, 255, .9);
    margin-top: .9rem;
    max-width: 62ch
}

.pagina-pagina-base .correlati {
    background: var(--paper);
    padding: 5.6rem 0 3.6rem;
    border-top: 1px solid var(--line)
}

.pagina-pagina-base .correlati .et {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .76rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accento)
}

.pagina-pagina-base .pista {
    display: flex;
    gap: 1.1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 1rem;
    margin-top: 1.4rem
}

.pagina-pagina-base .scheda {
    flex: 0 0 300px;
    scroll-snap-align: start;
    background: #fff;
    border: 1px solid var(--line);
    text-decoration: none;
    color: inherit;
    transition: transform .25s ease, box-shadow .25s ease
}

.pagina-pagina-base .scheda:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(0, 0, 0, .1);
    color: inherit
}

.pagina-pagina-base .scheda .riq {
    aspect-ratio: 16/10;
    background: repeating-linear-gradient(135deg, #E8EDEC 0 10px, #F3F6F5 10px 20px);
    border-bottom: 1px solid var(--line);
    display: grid;
    place-items: center
}

.pagina-pagina-base .scheda .riq span {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .72rem;
    color: #8A9C9A;
    border: 1px dashed #B9C7C5;
    padding: .2rem .55rem;
    background: #fff
}

.pagina-pagina-base .scheda .tx {
    padding: .95rem 1.05rem 1.15rem
}

.pagina-pagina-base .scheda h3 {
    font-size: 1rem;
    margin-bottom: .4rem
}

.pagina-pagina-base .scheda p {
    font-size: .87rem;
    color: var(--muted);
    margin: 0
}

.pagina-pagina-base .catalogo {
    background: #fff;
    border-top: 3px solid var(--accento);
    padding: 3rem 0
}

.pagina-pagina-base .catalogo code {
    font-family: 'IBM Plex Mono', monospace;
    font-size: .88rem;
    color: var(--accento);
    background: var(--accento-velo);
    padding: .1rem .4rem
}

.pagina-pagina-base .catalogo li {
    margin-bottom: .5rem;
    font-size: .95rem
}

.pagina-pagina-base .sale {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .7s ease, transform .7s ease
}

.pagina-pagina-base .sale.visibile {
    opacity: 1;
    transform: none
}

@media (prefers-reduced-motion: reduce) {
    .pagina-pagina-base *, .pagina-pagina-base *:before, .pagina-pagina-base *:after {
        animation: none !important;
        transition: none !important
    }

    .pagina-pagina-base .sale {
        opacity: 1;
        transform: none
    }

    html {
        scroll-behavior: auto
    }
}