/* =========================================================
   BLOCCO CSS 01 — BASE / VARIABILI
   ========================================================= */
:root {
    --ink:#153942; --teal:#174c59; --teal2:#2b7270; --orange:#e67c2e;
    --coral:#d85d3b; --yellow:#fff0a8; --mint:#d9f2e5; --sky:#dceff8;
    --lav:#eee3f8; --peach:#ffe0c1; --line:#d8e4e6; --muted:#587178;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:Arial,Helvetica,sans-serif; color:var(--ink); line-height:1.62; background:#fff; }
.wrap { width:min(1160px,calc(100% - 36px)); margin:auto; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { letter-spacing:-.035em; }
h2 { font-size:43px; line-height:1.1; margin:10px 0 20px; }
h3 { line-height:1.25; }
strong { font-weight:800; }
u { text-decoration-color:var(--orange); text-decoration-thickness:2px; text-underline-offset:3px; }
.kick { color:#bd4b2f; font-size:12px; font-weight:900; letter-spacing:.15em; }
.intro,.answer,.lead { font-size:18px; color:#48656c; }
.section { padding:86px 0; }
.yellow { background:var(--yellow); }
.coral { background:#ffded1; }
.mint { background:var(--mint); }
.lavender { background:var(--lav); }
.peach { background:var(--peach); }
.sky { background:var(--sky); }
.paleBlue { background:#eff7f8; }
.paleGreen { background:#edf8ef; }

/* =========================================================
   BLOCCO CSS 02 — HEADER / LOGO / MENU
   ========================================================= */
.siteHeader { position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid var(--line); box-shadow:0 5px 22px #1639420d; }
.nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.logo { display:flex; align-items:center; gap:10px; color:var(--teal); text-decoration:none; line-height:1; }
.logo svg { width:47px; height:47px; padding:6px; border:1px solid #cfe0e2; border-radius:13px; fill:none; stroke:var(--teal); stroke-width:3; background:#fff; }
.logo svg .drop { fill:var(--orange); stroke:none; }
.logo b,.logo small { display:block; }
.logo small { margin-top:5px; font-size:9px; letter-spacing:.21em; }
#mainNav { display:flex; gap:8px; align-items:center; }
#mainNav a { color:#31555d; text-decoration:none; font-size:13px; font-weight:700; padding:8px 10px; border:1px solid #c9dade; border-radius:9px; background:#fff; }
#mainNav a:hover { border-color:#7ba3ab; background:#f0f7f8; }
#mainNav .navCta { background:var(--teal); color:#fff; border-color:var(--teal); }
.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:var(--teal); margin:5px 0; }

/* =========================================================
   BLOCCO CSS 03 — HERO / CTA
   ========================================================= */
.hero { padding:75px 0 58px; background:linear-gradient(135deg,#f0f8f7 0%,#fff 52%,#fff0dd 100%); }
.heroGrid,.split,.leadGrid { display:grid; grid-template-columns:1fr 1fr; gap:55px; align-items:center; }
.hero h1 { font-size:55px; line-height:1.04; margin:13px 0 20px; }
.heroActions { display:flex; flex-wrap:wrap; gap:10px; margin:25px 0 18px; }
.btn,form button { display:inline-block; border:0; border-radius:11px; padding:14px 18px; background:var(--teal); color:#fff; font-weight:800; text-decoration:none; cursor:pointer; }
.btn.secondary { background:#fff; color:var(--teal); border:1px solid #9eb9bf; }
.trust { display:flex; flex-wrap:wrap; gap:15px; color:#587178; font-size:13px; font-weight:700; }
.heroPhoto { margin:0; position:relative; border-radius:26px; overflow:hidden; box-shadow:0 25px 60px #17343c25; min-height:500px; }
.heroPhoto img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.heroPhoto:after,.featurePhoto:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#09252cba,transparent 55%); }
.heroPhoto figcaption,.featurePhoto figcaption { position:absolute; z-index:2; left:20px; right:20px; bottom:18px; color:#fff; font-weight:800; }

/* =========================================================
   BLOCCO CSS 04 — CARD / GRIGLIE / ICONE
   ========================================================= */
.four,.three,.six,.criteria,.typeGrid,.brandGrid { display:grid; gap:14px; }
.four { grid-template-columns:repeat(4,1fr); }
.three { grid-template-columns:repeat(3,1fr); }
.six { grid-template-columns:repeat(3,1fr); }
.criteria { grid-template-columns:repeat(3,1fr); }
.typeGrid { grid-template-columns:repeat(3,1fr); }
.brandGrid { grid-template-columns:repeat(3,1fr); }
.quick { padding:0 0 28px; }
.quick .four { margin-top:-20px; position:relative; z-index:2; }
.quick article,.mechanism article,.criteria article,.typeGrid article,.cards article,.brandGrid article {
    background:#fff; border:1px solid var(--line); border-radius:17px; padding:22px;
    box-shadow:0 8px 24px #17343c0b;
}
.quick svg,.criteria svg { width:42px; height:42px; fill:none; stroke:var(--coral); stroke-width:2; }
.quick h2 { font-size:18px; letter-spacing:0; margin:9px 0 5px; }
.quick p,.criteria p,.typeGrid p,.brandGrid span { font-size:14px; color:#5a7379; margin-bottom:0; }
.mechanism article>b,.six article>b { font-size:29px; color:var(--orange); }
.typeGrid article>span { display:inline-block; margin-top:10px; padding:5px 8px; border-radius:20px; background:#eef5f6; font-size:11px; font-weight:800; color:#47666d; }
.criteria h3 { margin:8px 0 4px; }
.brandGrid b,.brandGrid span { display:block; }
.brandGrid b { color:var(--teal); font-size:18px; margin-bottom:7px; }

/* =========================================================
   BLOCCO CSS 05 — FOTO / CONTENUTI / LISTE
   ========================================================= */
.featurePhoto { min-height:430px; margin:0; border-radius:25px; position:relative; overflow:hidden; background-size:cover; background-position:center; box-shadow:0 20px 50px #17343c1f; }
.fpSteam,.fpGauge { background-image:url("../images/linea-vapore-pressione-scarico-condensa.jpg"); }
.fpPlant,.fpDetail { background-image:url("../images/impianto-vapore-recupero-condensa-industriale.jpg"); }
.fpTrap { background-image:url("../images/scaricatore-condensa-galleggiante-linea-vapore.jpg"); }
aside,.callout { padding:18px; background:#fff; border-left:4px solid var(--orange); border-radius:0 13px 13px 0; }
aside b,aside span,.callout b,.callout span { display:block; }
aside b,.callout b { color:#b94a2d; font-size:18px; }
.richList { padding:0; list-style:none; }
.richList li { position:relative; margin:10px 0; padding-left:25px; }
.richList li:before { content:""; position:absolute; left:0; top:.55em; width:9px; height:9px; border:3px solid var(--orange); transform:rotate(45deg); }
.numberList { padding:0; list-style:none; counter-reset:item; }
.numberList li { counter-increment:item; position:relative; padding-left:48px; margin:14px 0; }
.numberList li:before { content:counter(item); position:absolute; left:0; top:-3px; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--orange); color:#fff; font-weight:900; }

/* =========================================================
   BLOCCO CSS 06 — STRIP FOTO EMOZIONALI
   ========================================================= */
.visualStrip { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; padding:12px; background:#fff; }
.visualStrip figure { margin:0; height:330px; position:relative; overflow:hidden; border-radius:20px; }
.visualStrip img { width:100%; height:100%; object-fit:cover; }
.visualStrip figure:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#09252cc7,transparent 58%); }
.visualStrip figcaption { position:absolute; z-index:2; left:18px; right:18px; bottom:16px; color:#fff; }
.visualStrip b,.visualStrip span { display:block; }
.visualStrip b { font-size:19px; }
.visualStrip span { font-size:13px; color:#dcebed; }

/* =========================================================
   BLOCCO CSS 07 — SEZIONE SCURA / CONFRONTO / FLOW
   ========================================================= */
.dark { background:linear-gradient(135deg,#143d47,#25606a); color:#d9e9ec; }
.dark h2,.dark h3 { color:#fff; }
.dark .six article { padding:22px; border:1px solid #ffffff20; border-radius:16px; background:#ffffff0b; }
.dark .six p { color:#d6e7ea; }
.compare { overflow:hidden; border:1px solid #cadbdd; border-radius:16px; background:#fff; }
.compare>div { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; }
.compare>div>* { padding:13px; border-bottom:1px solid #e0e8ea; font-weight:400; }
.compare>div>b:first-child { font-weight:700; }
.compare .compareHead { background:var(--teal); color:#fff; }
.compare .compareHead b { font-weight:800; }
.note { margin-top:12px; font-size:12px; color:#60777d; }
.flow { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:30px; }
.flow span { padding:13px 15px; border-radius:11px; background:#fff; border:1px solid #bad5df; font-weight:800; font-size:13px; }
.flow i { color:var(--orange); font-size:24px; }

/* =========================================================
   BLOCCO CSS 08 — CHIP / FORM / CTA
   ========================================================= */
.chips { display:flex; flex-wrap:wrap; gap:9px; }
.chips span { padding:9px 13px; border:1px solid #d0dfe1; border-radius:30px; background:#f5f9f9; font-size:13px; font-weight:700; }
.leadBox,.partner { padding:82px 0; background:#123b45; color:#dcebed; }
.partner { background:#57372f; }
.leadBox h2,.partner h2 { color:#fff; }
.check { columns:2; padding-left:20px; }
form { padding:26px; border-radius:20px; background:#fff; color:var(--ink); box-shadow:0 20px 50px #071e2422; }
form label { display:grid; gap:5px; margin-bottom:12px; font-size:13px; font-weight:700; }
form input,form select,form textarea { width:100%; padding:12px; border:1px solid #c6d7da; border-radius:9px; font:inherit; background:#fff; }
.row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.privacy { display:flex!important; gap:8px!important; align-items:flex-start; font-weight:400!important; }
.privacy input { width:auto; margin-top:4px; }
.hp { position:absolute; left:-9999px; }
.provinceGrouped optgroup { color:var(--teal); background:#e8f3f4; font-weight:900; }
.provinceGrouped option { color:var(--ink); background:#fff; font-weight:400; }

/* =========================================================
   BLOCCO CSS 09 — FAQ / CTA FINALE / FOOTER
   ========================================================= */
.faqLayout { display:grid; grid-template-columns:300px 1fr; gap:45px; align-items:start; }
.faqIntro { position:sticky; top:105px; }
.faqs { display:grid; grid-template-columns:1fr 1fr; gap:10px; align-items:start; }
.faqs details { border:1px solid var(--line); border-radius:12px; background:#fff; padding:0 16px; }
.faqs details[open] { border-color:#eaa05c; box-shadow:0 8px 22px #17343c0d; }
.faqs summary { padding:14px 0; font-weight:800; cursor:pointer; }
.faqs p { color:#5a7177; font-size:14px; }
.finalCta { padding:75px 0; text-align:center; background:linear-gradient(135deg,#e5f3f4,#fff0c5); }
.finalCta .wrap { max-width:780px; }
.orangeBtn { background:var(--orange); }
footer { padding:43px 0; background:#0d2b32; color:#b9cdd1; }
.foot { display:flex; justify-content:space-between; gap:30px; align-items:center; }
.foot a { color:#fff; }

/* =========================================================
   BLOCCO CSS 10 — POPUP OPERATORI / ETICHETTA LATERALE
   ========================================================= */
.partnerPopup { position:fixed; inset:0; z-index:1000; display:none; pointer-events:none; }
.partnerPopup.show { display:block; }
.partnerPopupCard { position:absolute; top:92px; right:22px; width:min(390px,calc(100vw - 44px)); overflow:hidden; border-radius:20px; background:#fff; box-shadow:0 30px 90px #071f2659; pointer-events:auto; animation:popin .28s ease-out; }
.partnerPopupClose { position:absolute; z-index:2; right:12px; top:12px; width:36px; height:36px; border:0; border-radius:50%; background:#fff; color:var(--teal); font-size:25px; cursor:pointer; }
.partnerPopupTop { min-height:112px; padding:20px 58px 18px 25px; display:flex; align-items:center; justify-content:space-between; gap:14px; background:linear-gradient(135deg,#174c59,#2d776e); color:#fff; }
.partnerPopupTop span { font-size:11px; line-height:1.35; letter-spacing:.13em; font-weight:800; color:#fff3a8; }
.partnerPopupTop svg { width:76px; fill:none; stroke:#fff; stroke-width:3; }
.partnerPopupTop svg .drop { fill:var(--orange); stroke:none; }
.partnerPopupBody { padding:25px; }
.popupKick { font-size:11px; font-weight:800; letter-spacing:.15em; color:#c84f2f; }
.partnerPopupBody h2 { font-size:29px; margin:7px 0 14px; }
.partnerPopupBody p { font-size:15px; color:#536b71; }
.partnerPopupBody ul { padding:14px 18px 14px 35px; border-radius:13px; background:#fff0a8; color:#274950; }
.popupCta { display:flex; justify-content:space-between; align-items:center; padding:14px 16px; border-radius:11px; background:var(--orange); color:#fff; text-decoration:none; font-weight:800; }
.partnerPopupTab { position:fixed; z-index:999; top:190px; right:0; display:none; border:0; border-radius:12px 0 0 12px; padding:18px 10px; background:#174c59; color:#fff; box-shadow:0 12px 30px #071f2638; cursor:pointer; }
.partnerPopupTab.show { display:block; }
.partnerPopupTab span { display:block; writing-mode:vertical-rl; transform:rotate(180deg); font-size:11px; font-weight:900; letter-spacing:.14em; }
@keyframes popin { from { opacity:0; transform:translateX(18px) scale(.97); } to { opacity:1; transform:none; } }

/* =========================================================
   BLOCCO CSS 11 — RESPONSIVE
   ========================================================= */
@media (max-width:900px) {
    .burger { display:block; }
    #mainNav { display:none; position:absolute; top:68px; left:13px; right:13px; padding:13px; flex-direction:column; align-items:stretch; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 20px 50px #102f3a2e; }
    #mainNav.open { display:flex; }
    #mainNav a { padding:11px 13px; }
    #mainNav .navCta { text-align:center; }

    .heroGrid,.split,.leadGrid { grid-template-columns:1fr; }
    .four,.typeGrid,.criteria,.brandGrid { grid-template-columns:1fr 1fr; }
    .six,.three { grid-template-columns:1fr 1fr; }
    .visualStrip { grid-template-columns:1fr 1fr; }
    .visualStrip figure:last-child { grid-column:1/-1; }
    .faqLayout { grid-template-columns:1fr; }
    .faqIntro { position:static; }
    .hero h1 { font-size:45px; }
    .compare { overflow-x:auto; }
    .compare>div { min-width:780px; }
}
@media (max-width:600px) {
    .wrap { width:min(100% - 26px,1160px); }
    .section { padding:60px 0; }
    h2 { font-size:34px; }
    .hero { padding:50px 0; }
    .hero h1 { font-size:37px; }
    .heroPhoto { min-height:330px; }
    .four,.three,.six,.typeGrid,.criteria,.brandGrid,.row,.faqs,.visualStrip { grid-template-columns:1fr; }
    .visualStrip figure,.visualStrip figure:last-child { grid-column:auto; height:275px; }
    .quick .four { margin-top:0; }
    .featurePhoto { min-height:300px; }
    .check { columns:1; }
    .foot { display:block; }
    .partnerPopupCard { top:82px; right:10px; width:calc(100vw - 20px); max-height:82vh; overflow:auto; }
    .partnerPopupTab { top:165px; }
    .partnerPopupBody h2 { font-size:25px; }
}