* {
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
}
body {
    margin: 0;
    font-family: Arial,sans-serif;
    color: #17343c;
    line-height: 1.6;
}
.wrap {
    width: min(1160px,calc(100% - 36px));
    margin: auto;
}
header {
    position: sticky;
    top: 0;
    z-index: 10;
    background: #fff;
    border-bottom: 1px solid #dce6e8;
}
.nav {
    height: 76px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.logo {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #164451;
    text-decoration: none;
    line-height: 1;
}
.logo svg {
    width: 46px;
    fill: none;
    stroke: #164451;
    stroke-width: 3;
    background: #e8f1f2;
    border-radius: 13px;
    padding: 7px;
}
.logo b,.logo small {
    display: block;
}
.logo small {
    font-size: 10px;
    letter-spacing: .22em;
    margin-top: 5px;
}
.nav nav {
    display: flex;
    gap: 20px;
    align-items: center;
}
.nav nav a {
    color: #31535c;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
}
.pill {
    background: #174c59 !important;
    color: #fff !important;
    padding: 10px 15px;
    border-radius: 30px;
}
.hero {
    padding: 82px 0;
    background: linear-gradient(135deg,#f1f7f7,#fff,#f8efeb);
}
.heroGrid,.split,.leadGrid,.faqGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 58px;
    align-items: center;
}
.kick {
    color: #b64a34;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .16em;
}
.hero h1 {
    font-size: 58px;
    line-height: 1.04;
    letter-spacing: -.045em;
    margin: 14px 0;
}
.lead,.answer {
    font-size: 19px;
    color: #49666d;
}
.btn,form button {
    display: inline-block;
    background: #174c59;
    color: #fff;
    border: 0;
    border-radius: 11px;
    padding: 14px 19px;
    text-decoration: none;
    font-weight: 900;
    cursor: pointer;
}
.btn.alt {
    background: #fff;
    color: #174c59;
    border: 1px solid #aac0c5;
}
.warm {
    background: #d55b40;
}
.trust {
    font-size: 13px;
    font-weight: bold;
    color: #587179;
}
.machine {
    background: #fff;
    padding: 20px;
    border: 1px solid #d8e4e6;
    border-radius: 25px;
    box-shadow: 0 25px 60px #17343c22;
}
.machine svg {
    width: 100%;
}
.machine rect,.machine ellipse {
    fill: #dfe9eb;
    stroke: #174c59;
    stroke-width: 8;
}
.machine path {
    fill: none;
    stroke: #174c59;
    stroke-width: 13;
}
.machine .hot {
    stroke: #d25940;
    stroke-width: 9;
}
.machine .cold {
    stroke: #267b99;
    stroke-width: 9;
}
.machine small {
    color: #637b81;
}
.quick {
    padding-bottom: 25px;
}
.four,.three {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 15px;
}
.quick .four {
    margin-top: -18px;
}
.four article,.three article,.criteria article {
    background: #fff;
    border: 1px solid #dce6e8;
    padding: 23px;
    border-radius: 17px;
}
.quick i {
    font-size: 27px;
    color: #b64a34;
}
.quick h2 {
    font-size: 18px;
}
.quick p,.types p,.criteria p {
    font-size: 14px;
    color: #60777d;
}
.section {
    padding: 88px 0;
}
.section h2,.leadbox h2,.partner h2,.final h2 {
    font-size: 43px;
    line-height: 1.1;
    letter-spacing: -.035em;
    margin: 10px 0 20px;
}
.soft {
    background: #f3f7f7;
}
.photo {
    min-height: 430px;
    border-radius: 25px;
    background: #315c66 center/cover;
    position: relative;
    box-shadow: 0 25px 60px #17343c20;
}
.p1 {
    background-image: linear-gradient(#17343c22,#17343c99),url("../images/applicazione-industriale.jpg");
}
.p2 {
    background-image: linear-gradient(#17343c22,#17343c99),url("../images/materiali-scambiatore.jpg");
}
.p3 {
    background-image: linear-gradient(#17343c22,#17343c99),url("../images/impianto-scambio-termico.jpg");
}
.photo span {
    position: absolute;
    bottom: 18px;
    left: 18px;
    background: #fff;
    padding: 8px 11px;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 900;
}
aside {
    background: #f8f0ed;
    border-left: 4px solid #d55b40;
    padding: 18px;
    margin-top: 22px;
}
.steps b,.industries b {
    font-size: 28px;
    color: #d55b40;
}
.types article {
    min-height: 190px;
}
.dark {
    background: #123942;
    color: #c6d8dc;
}
.dark h2,.dark h3 {
    color: #fff;
}
.three {
    grid-template-columns: repeat(3,1fr);
}
.industries article {
    background: #ffffff08;
    border-color: #ffffff20;
}
.chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.chips span {
    background: #e8f1f2;
    border-radius: 30px;
    padding: 8px 12px;
    font-weight: bold;
    font-size: 13px;
}
.criteria {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 15px;
}
.leadbox,.partner {
    padding: 82px 0;
    background: #123942;
    color: #d7e5e7;
}
.leadbox h2,.partner h2 {
    color: #fff;
}
.partner {
    background: #59342c;
    color: #f2dcd5;
}
form {
    background: #fff;
    color: #17343c;
    padding: 27px;
    border-radius: 21px;
}
form label {
    display: grid;
    gap: 5px;
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 13px;
}
form input,form select,form textarea {
    padding: 12px;
    border: 1px solid #c8d8db;
    border-radius: 9px;
    font: inherit;
    width: 100%;
}
.row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.privacy {
    display: flex !important;
    align-items: flex-start;
    gap: 8px !important;
}
.privacy input {
    width: auto;
}
.hp {
    position: absolute;
    left: -9999px;
}
.check {
    columns: 2;
    padding-left: 18px;
}
.textlink {
    color: #b94a34;
    font-weight: bold;
}
.compare {
    border: 1px solid #d9e4e6;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
}
.compare>div {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
.compare>div>* {
    padding: 14px;
    border-bottom: 1px solid #e4ebed;
}
.compare>div:first-child {
    background: #174c59;
    color: #fff;
}
.faqGrid {
    align-items: start;
}
.faqs details {
    border: 1px solid #dce6e8;
    border-radius: 12px;
    padding: 0 17px;
    margin-bottom: 8px;
}
.faqs summary {
    font-weight: bold;
    padding: 15px 0;
    cursor: pointer;
}
.faqs p {
    color: #5c747a;
}
.final {
    text-align: center;
    padding: 75px 0;
    background: #e8f1f2;
}
.final .wrap {
    max-width: 800px;
}
footer {
    background: #0d2b32;
    color: #b9cdd1;
    padding: 45px 0;
}
.foot {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;
}
.foot a {
    color: #fff;
}
@media (max-width:900px) {
    .nav nav a:not(.pill) {
        display: none;
    }
    .heroGrid,.split,.leadGrid,.faqGrid {
        grid-template-columns: 1fr;
    }
    .four,.three,.criteria {
        grid-template-columns: 1fr 1fr;
    }
    .hero h1 {
        font-size: 45px;
    }
    .foot {
        display: block;
    }
}
@media (max-width:560px) {
    .hero {
        padding: 55px 0;
    }
    .hero h1 {
        font-size: 38px;
    }
    .four,.three,.criteria,.row {
        grid-template-columns: 1fr;
    }
    .section {
        padding: 62px 0;
    }
    .section h2,.leadbox h2,.partner h2,.final h2 {
        font-size: 34px;
    }
    .quick .four {
        margin-top: 0;
    }
    .check {
        columns: 1;
    }
    .compare {
        overflow-x: auto;
    }
    .compare>div {
        min-width: 650px;
    }
    .logo b {
        font-size: 13px;
    }
    .logo small {
        font-size: 8px;
    }
    .pill {
        font-size: 11px !important;
    }
}
/* V2: menu, colori, immagini, marchi */
header {
    box-shadow: 0 5px 24px rgba(20,58,67,.06);
}
.nav nav a:not(.pill) {
    border: 1px solid #c9dade;
    border-radius: 9px;
    padding: 8px 10px;
    background: #fff;
}
.nav nav a:hover {
    border-color: #6f9da7;
    background: #eef7f8;
}
.burger {
    display: none;
    width: 44px;
    height: 42px;
    border: 1px solid #abc3c8;
    border-radius: 10px;
    background: #fff;
    padding: 9px;
}
.burger span {
    display: block;
    height: 2px;
    background: #174c59;
    margin: 5px 0;
}
.section:nth-of-type(4) {
    background: #fff4ed;
}
.section:nth-of-type(6) {
    background: #eef8f3;
}
.section:nth-of-type(8) {
    background: #f7f2fb;
}
.section:nth-of-type(10) {
    background: #fff7dc;
}
.visual-strip {
    padding: 22px 0;
    background: #fff;
}
.visual-grid {
    display: grid;
    grid-template-columns: 1.15fr .85fr 1fr;
    gap: 12px;
    width: min(1360px,calc(100% - 28px));
    margin: auto;
}
.emo {
    height: 330px;
    margin: 0;
    border-radius: 22px;
    overflow: hidden;
    position: relative;
    background-size: cover;
    background-position: center;
    box-shadow: 0 16px 45px rgba(20,55,64,.15);
}
.emo figcaption {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 17px;
    color: #fff;
}
.emo figcaption b,.emo figcaption span {
    display: block;
}
.emo figcaption b {
    font-size: 20px;
}
.emo figcaption span {
    font-size: 13px;
    color: #dbe9eb;
}
.brands {
    background: linear-gradient(135deg,#eef6ff,#fff7ef);
}
.brandgrid {
    display: grid;
    grid-template-columns: repeat(5,1fr);
    gap: 12px;
    margin-top: 28px;
}
.brandgrid article {
    background: #fff;
    border: 1px solid #d8e4e6;
    border-radius: 15px;
    padding: 18px;
    box-shadow: 0 9px 25px rgba(25,61,70,.05);
}
.brandgrid b,.brandgrid span {
    display: block;
}
.brandgrid b {
    font-size: 17px;
    color: #174c59;
}
.brandgrid span {
    font-size: 12px;
    color: #647a80;
    margin-top: 6px;
}
.brandnote {
    font-size: 13px;
    color: #60777d;
}
strong {
    color: #173f4b;
}
u {
    text-decoration-color: #d35b40;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}
.credits {
    max-width: 1160px;
    margin: 20px auto 0;
    padding-top: 18px;
    border-top: 1px solid #ffffff18;
    font-size: 11px;
    color: #78959b;
}
.provinceGrouped optgroup {
    font-weight: 900;
    color: #174c59;
    background: #eaf4f5;
}
.provinceGrouped option {
    font-weight: 400;
    color: #17343c;
    background: #fff;
}
@media (max-width:900px) {
    .burger {
        display: block;
    }
    .nav nav {
        display: none;
        position: absolute;
        top: 68px;
        left: 13px;
        right: 13px;
        background: #fff;
        border: 1px solid #d6e3e5;
        border-radius: 16px;
        padding: 13px;
        box-shadow: 0 20px 50px rgba(16,50,58,.18);
        flex-direction: column;
        align-items: stretch;
        gap: 7px;
    }
    .nav nav.open {
        display: flex;
    }
    .nav nav a {
        display: block !important;
    }
    .nav nav a:not(.pill) {
        padding: 11px 13px;
    }
    .nav .pill {
        text-align: center;
    }
    .visual-grid {
        grid-template-columns: 1fr 1fr;
    }
    .emo-c {
        grid-column: 1/-1;
    }
    .brandgrid {
        grid-template-columns: repeat(2,1fr);
    }
}
@media (max-width:560px) {
    .visual-grid {
        grid-template-columns: 1fr;
    }
    .emo,.emo-c {
        grid-column: auto;
        height: 270px;
    }
    .brandgrid {
        grid-template-columns: 1fr;
    }
    .heroGrid,.split,.leadGrid,.faqGrid {
        gap: 32px;
    }
    .machine {
        order: 2;
    }
    .photo {
        min-height: 300px;
    }
    .trust {
        line-height: 2;
    }
    .nav {
        height: 68px;
    }
    .section p,.section li {
        font-size: 16px;
    }
    .answer {
        font-size: 18px;
    }
    .four article,.three article,.criteria article {
        padding: 20px;
    }
}
/* V3 */
.dark {
    background: linear-gradient(135deg,#173f4b,#245d68) !important;
    color: #eef8f9 !important;
}
.dark h2,.dark h3 {
    color: #fff !important;
}
.dark p {
    color: #d7e9ec !important;
}
.dark .industries article {
    background: rgba(255,255,255,.09) !important;
}
.yellow {
    background: #fff0a8;
}
.coral {
    background: #ffd8c8;
}
.mint {
    background: #d6f2e3;
}
.lavender {
    background: #e9dcf8;
}
.peach {
    background: #ffe1b7;
}
.sky {
    background: #d6eefb;
}
.featurePhoto {
    min-height: 430px;
    margin: 0;
    border-radius: 26px;
    background-size: cover;
    background-position: center;
    position: relative;
    box-shadow: 0 20px 55px rgba(26,57,64,.18);
    overflow: hidden;
}
.featurePhoto:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg,rgba(8,35,42,.7),transparent 55%);
}
.featurePhoto figcaption {
    position: absolute;
    z-index: 2;
    bottom: 18px;
    left: 20px;
    color: #fff;
    font-weight: 900;
}
.fp1 {
    background-image: url("../images/scambiatore-calore-piastre-industriale.jpg");
}
.fp2 {
    background-image: url("../images/scambiatore-calore-fascio-tubiero.jpg");
}
.fp3 {
    background-image: url("../images/impianto-scambiatori-calore-industriale.jpg");
}
.fp4 {
    background-image: url("../images/tubazioni-scambio-termico-industriale.jpg");
}
.p1 {
    background-image: linear-gradient(#17343c18,#17343c70),url("../images/impianto-scambiatori-calore-industriale.jpg") !important;
}
.p2 {
    background-image: linear-gradient(#17343c18,#17343c70),url("../images/scambiatore-calore-piastre-industriale.jpg") !important;
}
.p3 {
    background-image: linear-gradient(#17343c18,#17343c70),url("../images/tubazioni-scambio-termico-industriale.jpg") !important;
}
.emo-a {
    background-image: linear-gradient(0deg,#09252cb8,#09252c08),url("../images/scambiatore-calore-piastre-industriale.jpg") !important;
}
.emo-b {
    background-image: linear-gradient(0deg,#09252cb8,#09252c08),url("../images/scambiatore-calore-fascio-tubiero.jpg") !important;
}
.emo-c {
    background-image: linear-gradient(0deg,#09252cb8,#09252c08),url("../images/impianto-scambiatori-calore-industriale.jpg") !important;
}
.richlist {
    list-style: none;
    padding: 0;
}
.richlist li {
    margin: 10px 0;
    padding-left: 24px;
    position: relative;
}
.richlist li:before {
    content: "";
    position: absolute;
    left: 0;
    top: .55em;
    width: 9px;
    height: 9px;
    border: 3px solid #e56c36;
    transform: rotate(45deg);
}
.iconGrid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 15px;
    margin-top: 28px;
}
.iconGrid article {
    background: #ffffffc9;
    border: 1px solid #174c5920;
    padding: 22px;
    border-radius: 18px;
}
.iconGrid svg {
    width: 42px;
    fill: none;
    stroke: #d95e34;
    stroke-width: 2;
}
.iconGrid p {
    font-size: 14px;
    color: #526b72;
}
.callout {
    background: #fff;
    border: 2px solid #efa044;
    border-radius: 15px;
    padding: 18px;
}
.callout b,.callout span {
    display: block;
}
.callout b {
    color: #b84b2c;
    font-size: 18px;
}
.bigchips span {
    background: #fff;
    border: 1px solid #efaa51;
}
.numberlist {
    list-style: none;
    padding: 0;
    counter-reset: x;
}
.numberlist li {
    counter-increment: x;
    margin: 14px 0;
    padding-left: 46px;
    position: relative;
}
.numberlist li:before {
    content: counter(x);
    position: absolute;
    left: 0;
    top: -3px;
    width: 33px;
    height: 33px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #f28a35;
    color: #fff;
    font-weight: 900;
}
.faqGrid {
    grid-template-columns: 300px 1fr !important;
}
.faqs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    align-items: start;
}
.faqs details {
    margin: 0 !important;
    background: #fff;
}
.faqs details[open] {
    border-color: #ed9849;
    box-shadow: 0 8px 22px #17343c12;
}
strong {
    font-weight: 850;
}
u {
    text-decoration-color: #e26636 !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 3px;
}
@media (max-width:900px) {
    .iconGrid {
        grid-template-columns: 1fr 1fr;
    }
    .faqGrid {
        grid-template-columns: 1fr !important;
    }
}
@media (max-width:620px) {
    .iconGrid,.faqs {
        grid-template-columns: 1fr;
    }
    .featurePhoto {
        min-height: 290px;
    }
    .hero h1 {
        font-size: 36px !important;
    }
}
/* V4 */
.compare>div:not(:first-child)>span,.compare>div:not(:first-child)>b {
    font-weight: 400;
}
.compare>div:not(:first-child)>b:first-child {
    font-weight: 700;
}
.section p,.section li,.section .answer {
    font-weight: 400;
}
.section p strong,.section li strong {
    font-weight: 700;
}
.partnerPopup {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(8,31,37,.46);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
}
.partnerPopup.show {
    display: flex;
}
.partnerPopupCard {
    width: min(390px,calc(100vw - 28px));
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 30px 90px rgba(7,31,38,.34);
    position: relative;
    animation: popin .28s ease-out;
}
.partnerPopupClose {
    position: absolute;
    right: 12px;
    top: 12px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: #fff;
    color: #174c59;
    font-size: 25px;
    cursor: pointer;
    z-index: 2;
}
.partnerPopupTop {
    min-height: 112px;
    padding: 20px 58px 18px 25px;
    background: linear-gradient(135deg,#174c59,#2d776e);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.partnerPopupTop span {
    font-size: 11px;
    line-height: 1.35;
    letter-spacing: .13em;
    font-weight: 800;
    color: #fff3a8;
}
.partnerPopupTop svg {
    width: 82px;
    min-width: 82px;
    fill: none;
    stroke: #fff;
    stroke-width: 3;
}
.partnerPopupBody {
    padding: 25px;
}
.popupKick {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .15em;
    color: #c84f2f;
}
.partnerPopupBody h2 {
    font-size: 29px;
    line-height: 1.08;
    letter-spacing: -.03em;
    margin: 7px 0 14px;
    color: #17343c;
}
.partnerPopupBody p {
    font-size: 15px;
    color: #536b71;
    margin: 0 0 14px;
}
.partnerPopupBody ul {
    margin: 0 0 20px;
    padding: 14px 18px 14px 35px;
    background: #fff3bf;
    border-radius: 13px;
    color: #274950;
}
.partnerPopupBody li {
    margin: 4px 0;
    font-size: 14px;
}
.popupCta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #e78024;
    color: #fff;
    text-decoration: none;
    font-weight: 800;
    border-radius: 11px;
    padding: 14px 16px;
}
.popupCta:hover {
    background: #cf6f16;
}
@keyframes popin {
    from {
        opacity: 0;
        transform: translateY(15px) scale(.97);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
@media (max-width:560px) {
    .partnerPopup {
        align-items: flex-end;
        padding: 10px;
    }
    .partnerPopupCard {
        width: 100%;
        max-height: 90vh;
        overflow: auto;
    }
    .partnerPopupBody h2 {
        font-size: 25px;
    }
}
/* =========================================================
   BLOCCO CSS — IMMAGINI SEO / FIGURE SEMANTICHE
   ========================================================= */
.photo,
.emo,
.featurePhoto {
    background-image: none !important;
    overflow: hidden;
}
.photo img,
.emo img,
.featurePhoto img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.photo::after,
.emo::after,
.featurePhoto::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(8, 35, 42, .62), transparent 58%);
    pointer-events: none;
}
.photo figcaption,
.emo figcaption,
.featurePhoto figcaption {
    position: absolute;
    z-index: 2;
}
.photo figcaption {
    bottom: 18px;
    left: 18px;
    background: #fff;
    color: #17343c;
    padding: 8px 11px;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 900;
}
/* =========================================================
   BLOCCO CSS — LAYER OPERATORI / ETICHETTA LATERALE
   ========================================================= */
.partnerPopup {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: none;
    pointer-events: none;
    background: transparent;
}
.partnerPopup.show {
    display: block;
}
.partnerPopupCard {
    position: absolute;
    top: 92px;
    right: 22px;
    width: min(390px, calc(100vw - 44px));
    max-height: calc(100vh - 115px);
    overflow: auto;
    pointer-events: auto;
}
.partnerPopupTab {
    position: fixed;
    z-index: 999;
    right: 0;
    top: 185px;
    display: none;
    border: 0;
    border-radius: 12px 0 0 12px;
    padding: 15px 9px;
    background: #174c59;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(7, 31, 38, .22);
}
.partnerPopupTab.show {
    display: block;
}
.partnerPopupTab:hover {
    background: #e78024;
}
@media (max-width: 560px) {
    .partnerPopupCard {
        top: auto;
        right: 10px;
        bottom: 10px;
        width: calc(100vw - 20px);
        max-height: 88vh;
    }
    .partnerPopupTab {
        top: 145px;
    }
}
