/* ==========================================================
   IDRO SISTEM — linguaggio visivo "sala caldaie"
   Carta + inchiostro, caldo (fiamma) contro freddo (ghiaccio).
   Display condensato come il logotipo, mono per dati e etichette.
   ========================================================== */
@font-face{font-family:"Big Shoulders Display";font-style:normal;font-weight:700 900;font-display:swap;src:url("../fonts/big-shoulders-display-latin.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/hanken-grotesk-latin.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/ibm-plex-mono-latin.woff2") format("woff2")}

:root{
  --ink:#0b1a2e; --ink-2:#16304f; --paper:#f2ede4; --paper-2:#e8e1d3; --white:#fffdf8;
  --flame:#ff5a1f; --flame-t:#e0430c; --flame-dd:#b3310a; --ice:#8fd0f5; --blue:#1d5fa8; --deep:#0b3a6b; --signal:#ffc928;
  --wa:#43d17a; --muted:#44546a;
  --f-d:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
  --f-b:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-m:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --accent:var(--flame);
  --hard:5px 5px 0 var(--ink);
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .1  0 0 0 0 .1  0 0 0 0 .15  0 0 0 .05 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font:400 1.0625rem/1.65 var(--f-b);color:var(--ink);background:var(--paper) var(--grain);-webkit-font-smoothing:antialiased;padding-bottom:calc(62px + env(safe-area-inset-bottom,0px));counter-reset:sec}
::selection{background:var(--flame);color:var(--ink)}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration-thickness:2px;text-underline-offset:.2em;text-decoration-color:var(--flame)}
a:hover{text-decoration-color:var(--ink)}
h1,h2,h3,h4{font-family:var(--f-d);font-weight:800;text-transform:uppercase;line-height:.95;letter-spacing:.005em;margin:0 0 .45em;color:var(--ink)}
h1{font-weight:900;font-size:clamp(3rem,2rem + 5vw,6.4rem);line-height:.88}
h2{font-size:clamp(2.4rem,1.6rem + 3.6vw,4.6rem)}
h3,.h3{font-size:clamp(1.55rem,1.3rem + .8vw,2rem);font-weight:800}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-70px;background:var(--ink);color:var(--paper);padding:10px 16px;z-index:400}
.skip:focus{top:10px}
.wrap{width:min(1240px,100% - 32px);margin-inline:auto}
.wrap--narrow{width:min(860px,100% - 32px)}
.center{text-align:left}
.muted{color:var(--muted)}.small{font-size:.92rem}.mt{margin-top:2rem}
.ico{width:1.25em;height:1.25em;flex:none;vertical-align:-.25em}
.ico--sm{width:1em;height:1em;vertical-align:-.12em}
.eyebrow,.kicker,.crumbs,.tag{font-family:var(--f-m);font-weight:500;letter-spacing:.04em;text-transform:uppercase;font-size:.78rem}

/* ---------- Header ---------- */
.site-header{position:-webkit-sticky;position:sticky;top:0;z-index:200;background:var(--paper);border-bottom:2px solid var(--ink);padding-top:env(safe-area-inset-top,0px)}
.nav-row{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px}
.brand{display:block;line-height:0}
.brand img{height:54px;width:auto}
.thermo-line{position:absolute;left:0;bottom:-2px;height:5px;width:calc(var(--p,0) * 100%);background:linear-gradient(90deg,var(--ice),var(--signal) 55%,var(--flame));pointer-events:none}
.nav-toggle{background:var(--ink);color:var(--paper);border:0;width:46px;height:46px;display:grid;place-items:center;cursor:pointer}
.nav-toggle__close{display:none}
.nav-toggle[aria-expanded="true"] .nav-toggle__open{display:none}
.nav-toggle[aria-expanded="true"] .nav-toggle__close{display:block}
.nav{display:none;position:fixed;top:calc(74px + env(safe-area-inset-top,0px));right:0;bottom:0;left:0;background:var(--ink);color:var(--paper);padding:20px 16px 90px;overflow:auto;z-index:150}
.nav.is-open{display:block}
.nav__list{list-style:none;display:grid}
.nav__list>li>a{display:block;font:800 2.3rem/1 var(--f-d);text-transform:uppercase;padding:12px 0;border-bottom:1px solid rgba(242,237,228,.18);text-decoration:none;color:var(--paper)}
.nav__chev{display:none}
.mega{display:grid;gap:14px;padding:10px 0 16px}
.mega{align-items:start}
.mega__col{display:grid;gap:2px;align-content:start}
.mega__title{font:500 .8rem var(--f-m);text-transform:uppercase;letter-spacing:.06em;color:var(--signal);text-decoration:none;display:flex;gap:8px;align-items:center;margin-top:10px}
.mega ul{list-style:none;display:grid}
.mega ul a{display:block;color:rgba(242,237,228,.85);text-decoration:none;padding:5px 0;font-size:1rem}
.nav__cta{margin-top:18px;width:100%}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:500 .88rem/1.1 var(--f-m);letter-spacing:.04em;text-transform:uppercase;padding:15px 20px;border:2px solid var(--ink);background:var(--white);color:var(--ink);text-decoration:none;cursor:pointer;box-shadow:var(--hard);transition:transform .12s,box-shadow .12s,background .12s;border-radius:0}
.btn:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink);color:var(--ink)}
.btn:active{transform:translate(5px,5px);box-shadow:0 0 0 var(--ink)}
.btn--primary{background:var(--flame)}
.btn--primary:hover{background:#ff7340}
.btn--wa{background:var(--wa)}
.btn--ghost{background:var(--white)}
.btn--lg{padding:18px 26px;font-size:.95rem}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin:1.6rem 0 0}
.btn-row--center{justify-content:flex-start}

/* ---------- Section skeleton ---------- */
.section{padding:clamp(56px,7vw,110px) 0;position:relative}
.section--tint{background:var(--paper-2);border-block:2px solid var(--ink)}
.section--slim{padding:clamp(32px,4vw,56px) 0}
.section--dark{background:var(--ink);color:var(--paper);background-image:linear-gradient(rgba(242,237,228,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(242,237,228,.06) 1px,transparent 1px);background-size:56px 56px;border-block:2px solid var(--ink)}
.section--dark h2,.section--dark h3{color:var(--paper)}
.section__head{display:grid;gap:10px;max-width:980px;margin:0 0 clamp(30px,4vw,54px);text-align:left}
.section__head.center{margin-inline:0;text-align:left}
.section__head h2{margin:0}
.section__head p{font-size:1.15rem;max-width:62ch;margin:.4em 0 0;color:var(--muted)}
.section--dark .section__head p{color:rgba(242,237,228,.75)}
.eyebrow{display:block;color:var(--flame-dd);margin:0 0 .4em}
.section__head .eyebrow::before,.split .eyebrow::before{counter-increment:sec;content:counter(sec,decimal-leading-zero) " / ";color:var(--ink)}
.eyebrow--light{color:var(--signal)}
.section--dark .eyebrow::before{color:var(--paper)}
.lead{font-size:clamp(1.12rem,1rem + .5vw,1.32rem);line-height:1.5;max-width:56ch;color:var(--ink-2)}
.grid{display:grid;gap:22px}

/* ---------- Cards (targhette) ---------- */
.card{background:var(--white);border:2px solid var(--ink);padding:26px;display:flex;flex-direction:column;gap:2px;position:relative;color:var(--ink);transition:transform .15s,box-shadow .15s}
.card h3{margin-bottom:.3em}
.card h3 a{text-decoration:none}
.card h3 a:hover{color:var(--flame-dd)}
.card p{color:var(--muted);margin-bottom:.8em}
.card--tint{background:var(--paper-2)}
.card--tint::before,.form-card::before{content:"";position:absolute;inset:7px;pointer-events:none;background:
  radial-gradient(circle at 0 0,var(--ink) 2px,transparent 2.6px) 0 0/100% 100% no-repeat,
  radial-gradient(circle at 100% 0,var(--ink) 2px,transparent 2.6px) 0 0/100% 100% no-repeat,
  radial-gradient(circle at 0 100%,var(--ink) 2px,transparent 2.6px) 0 0/100% 100% no-repeat,
  radial-gradient(circle at 100% 100%,var(--ink) 2px,transparent 2.6px) 0 0/100% 100% no-repeat;opacity:.6}
.card--link{text-decoration:none}
.card--link:hover{transform:translate(-4px,-4px);box-shadow:var(--hard);color:var(--ink)}
.card--link h3{color:var(--ink)}
.card--row{flex-direction:row;align-items:center;gap:20px}
.card--row>.ico{margin-left:auto;color:var(--flame-dd)}
.card--row p{margin:0}
.card--photo{padding:0;overflow:hidden}
.card--photo>*:not(.card__img){margin-inline:24px}
.card--photo>h3{margin-top:20px}
.card--photo>.linklist,.card--photo>.more{margin-bottom:24px}
.card__img{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--paper-2);border-bottom:2px solid var(--ink)}
.card__img img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;transition:transform .5s}
.card--photo:hover .card__img img{transform:scale(1.05)}
.chip-ico{display:inline-flex;color:var(--flame-dd);margin-bottom:10px}
.chip-ico .ico{width:34px;height:34px;stroke-width:1.5}
.chip-ico--wa{color:#168a46}
.more{display:inline-flex;gap:8px;align-items:center;font:500 .8rem var(--f-m);text-transform:uppercase;letter-spacing:.05em;color:var(--ink);margin-top:auto;border-bottom:2px solid var(--flame);align-self:flex-start;padding-bottom:2px}
.card--link:hover .more{gap:14px}
.linklist{list-style:none;display:grid;margin:8px 0 4px}
.linklist a{display:block;padding:9px 0;border-top:1px solid rgba(11,26,46,.25);text-decoration:none;font-weight:500;font-size:.98rem}
.linklist a::after{content:" →";color:var(--flame-dd)}
.linklist a:hover{background:var(--signal);padding-inline:8px}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;border-bottom:2px solid var(--ink)}
.hero__grid{display:grid;gap:30px;padding:30px 0 56px}
.kicker{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin-bottom:22px;color:var(--ink)}
.kicker b{background:var(--ink);color:var(--paper);padding:3px 8px;font-weight:500}
.hero h1{margin-bottom:.28em}
.hero h1 span{display:block}
.hero h1 .hot{color:var(--flame-t)}
.hero h1 .cold{color:var(--blue)}
.hero h1 small{display:inline-block;margin-top:.2em;font:500 clamp(.9rem,.8rem + .5vw,1.15rem)/1.2 var(--f-m);letter-spacing:.04em;background:var(--signal);padding:.5em .8em;color:var(--ink);transform:rotate(-1.5deg)}
.hero__base{margin-top:26px;color:var(--muted)}
.hero__art{position:relative;min-height:430px}
.splitphoto{position:relative;width:100%;aspect-ratio:4/4.6;border:2px solid var(--ink);background:var(--ink);overflow:hidden;box-shadow:12px 12px 0 var(--flame)}
.splitphoto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.splitphoto__l img{object-position:35% 50%}
.splitphoto__r{position:absolute;inset:0;filter:drop-shadow(-3px 0 0 var(--ink))}
.splitphoto__r div{position:absolute;inset:0;clip-path:polygon(60% 0,100% 0,100% 100%,36% 100%)}
.splitphoto__r img{object-position:55% 50%}
.tag{position:absolute;z-index:3;padding:6px 10px;background:var(--signal);color:var(--ink);border:2px solid var(--ink)}
.tag--l{left:12px;bottom:12px}
.tag--r{right:12px;top:12px;background:var(--ice)}
.stamp{position:absolute;z-index:5;right:-10px;bottom:-26px;width:150px;height:150px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;border:3px solid var(--paper);box-shadow:0 0 0 2px var(--ink)}
.stamp svg{width:100%;height:100%;animation:spin 28s linear infinite}
.stamp text{font:500 11.5px var(--f-m);letter-spacing:.2em;fill:var(--paper);text-transform:uppercase}
.stamp strong{position:absolute;font:900 2.1rem/1 var(--f-d);color:var(--flame)}
@keyframes spin{to{transform:rotate(360deg)}}

.ticker{background:var(--ink);color:var(--paper);overflow:hidden;border-block:2px solid var(--ink);white-space:nowrap}
.ticker__in{display:inline-flex;animation:tick 46s linear infinite;padding:10px 0}
.ticker span{font:800 clamp(1.6rem,3vw,2.5rem)/1 var(--f-d);text-transform:uppercase;padding-inline:18px;display:inline-flex;align-items:center;gap:36px}
.ticker span::after{content:"";width:14px;height:14px;background:var(--flame);transform:rotate(45deg)}
.ticker span:nth-child(3n+2)::after{background:var(--ice)}
@keyframes tick{to{transform:translateX(-50%)}}

.brandbar{background:var(--white);border-bottom:2px solid var(--ink)}
.brandbar__in{display:flex;flex-direction:column;gap:14px;padding:22px 0}
.brandbar p{margin:0;color:var(--ink)}
.brandbar ul{list-style:none;display:flex;flex-wrap:wrap;gap:16px 48px;align-items:center}
.brandbar img{height:36px;width:auto}

/* ---------- Termostato ---------- */
.thermo{--bg:var(--paper-2);background:var(--bg);border-block:2px solid var(--ink);transition:background .5s}
.thermo[data-state="cold"]{--bg:#a9dcf8}
.thermo[data-state="hot"]{--bg:#ff9a63}
.thermo__grid{display:grid;gap:34px}
.thermo__val{display:block;font:900 clamp(6rem,3rem + 16vw,13rem)/.8 var(--f-d);color:var(--ink);letter-spacing:-.02em;margin:.1em 0 .2em}
.thermo__val sup{font-size:.4em;vertical-align:top;position:relative;top:.1em;margin-left:.04em}
.thermo__ui{display:grid;gap:18px}
.range{-webkit-appearance:none;appearance:none;width:100%;height:30px;background:transparent;cursor:pointer;margin:0}
.range::-webkit-slider-runnable-track{height:18px;background:linear-gradient(90deg,#6ec0ef,#f2ede4 50%,#ff5a1f);border:2px solid var(--ink)}
.range::-moz-range-track{height:14px;background:linear-gradient(90deg,#6ec0ef,#f2ede4 50%,#ff5a1f);border:2px solid var(--ink)}
.range::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:44px;margin-top:-14px;background:var(--ink);border:3px solid var(--white);box-shadow:0 0 0 2px var(--ink);cursor:grab}
.range::-moz-range-thumb{width:24px;height:40px;background:var(--ink);border:3px solid var(--white);border-radius:0;box-shadow:0 0 0 2px var(--ink)}
.scale{display:flex;justify-content:space-between;font:500 .72rem var(--f-m);color:var(--ink);margin-top:-6px}
.answers{display:grid}
.ans{display:none;background:var(--white);border:2px solid var(--ink);padding:24px;box-shadow:var(--hard)}
.js .thermo[data-state="cold"] .ans--cold,.js .thermo[data-state="mid"] .ans--mid,.js .thermo[data-state="hot"] .ans--hot{display:block;animation:pop .35s}
html:not(.js) .ans{display:block;margin-bottom:16px}
@keyframes pop{from{transform:translateY(8px);opacity:0}}
.ans h3{margin-bottom:.2em}
.ans p{color:var(--muted)}
.ans .linklist{margin-bottom:4px}

/* ---------- Pannelli servizi ---------- */
.panels{display:grid;gap:0;border:2px solid var(--ink)}
.panel{position:relative;min-height:380px;color:var(--paper);overflow:hidden;background:var(--ink);border-bottom:2px solid var(--ink)}
.panel:last-child{border-bottom:0}
.panel>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9;transition:transform .7s,opacity .3s}
.panel::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(11,26,46,.1) 0,rgba(11,26,46,.88) 72%)}
.panel::after{content:"";position:absolute;left:0;right:0;top:0;height:10px;z-index:2;background:var(--ac)}
.panel--hot{--ac:var(--flame)}.panel--cold{--ac:var(--ice)}.panel--mix{--ac:linear-gradient(90deg,var(--ice),var(--flame))}
.panel__in{position:relative;z-index:3;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:30px 24px 26px;min-height:380px}
.panel__n{font:500 .8rem var(--f-m);letter-spacing:.06em;position:absolute;top:28px;left:24px;color:var(--signal)}
.panel h3{color:var(--paper);font-size:clamp(2.4rem,2rem + 2vw,3.6rem);margin-bottom:.15em}
.panel h3 a{text-decoration:none}
.panel p{color:rgba(242,237,228,.85);max-width:34ch}
.panel .linklist a{border-color:rgba(242,237,228,.3);color:var(--paper)}
.panel .linklist a::after{color:var(--signal)}
.panel .linklist a:hover{background:var(--signal);color:var(--ink)}
.panel:hover>img{transform:scale(1.05);opacity:1}

.pillars{list-style:none;display:grid;border:2px solid var(--ink);background:var(--white);margin-top:34px}
.pillars li{padding:20px 22px;border-bottom:2px solid var(--ink);display:grid;gap:2px}
.pillars li:last-child{border-bottom:0}
.pillars strong{font:800 1.9rem/1 var(--f-d);text-transform:uppercase}
.pillars span{color:var(--muted);font-size:.97rem}

/* ---------- Perché (dark) ---------- */
.feat{border-top:3px solid var(--flame);padding:18px 0 0}
.feat:nth-child(even){border-color:var(--ice)}
.feat .n{font:500 .78rem var(--f-m);color:var(--signal);letter-spacing:.06em}
.feat h3{font-size:2rem;margin:.2em 0 .3em}
.feat p{color:rgba(242,237,228,.78);margin:0}

/* ---------- Tubo (passaggi) ---------- */
.steps{list-style:none;position:relative;padding-left:74px;display:grid;gap:0}
.steps::before{content:"";position:absolute;left:18px;top:6px;bottom:6px;width:12px;border:2px solid var(--ink);background:linear-gradient(180deg,var(--flame),#ff9a63 40%,#6ec0ef 80%,var(--blue))}
.step{position:relative;padding:0 0 30px;display:block}
.step:last-child{padding-bottom:0}
.step__n{position:absolute;left:-73px;top:-4px;width:48px;height:48px;background:var(--paper);border:2px solid var(--ink);display:grid;place-items:center;font:500 1rem var(--f-m);box-shadow:3px 3px 0 var(--ink)}
.step__n::after{content:"";position:absolute;left:100%;top:50%;width:14px;height:12px;margin-top:-6px;background:var(--ink)}
.step h3{font-size:1.9rem;margin:0 0 .15em}
.step p{margin:0;color:var(--muted);max-width:56ch}
.steps--compact .step h3{font-size:1.5rem}

/* ---------- Media ---------- */
.videos{align-items:start}
.video{margin:0;background:var(--ink);border:2px solid var(--ink);box-shadow:var(--hard);max-width:420px;width:100%}
.video video{width:100%;aspect-ratio:478/850;object-fit:cover;background:var(--ink)}
.video figcaption{display:flex;align-items:center;gap:10px;font:500 .78rem var(--f-m);text-transform:uppercase;letter-spacing:.04em;color:var(--paper);padding:11px 14px;background:var(--ink)}
.video figcaption::before{content:"";width:10px;height:10px;border-radius:50%;background:#ff3b30;animation:blink 1.6s steps(2) infinite}
@keyframes blink{50%{opacity:.2}}
.gallery{counter-reset:foto}
.shot{margin:0;border:2px solid var(--ink);background:var(--white);counter-increment:foto}
.shot img{width:100%;aspect-ratio:3/4;object-fit:cover}
.shot figcaption{padding:10px 12px;font:500 .74rem var(--f-m);text-transform:uppercase;letter-spacing:.04em;border-top:2px solid var(--ink)}
.shot figcaption::before{content:"Foto " counter(foto,decimal-leading-zero) " — ";color:var(--flame-dd)}
.photo{margin:0;border:2px solid var(--ink);box-shadow:12px 12px 0 var(--ice);background:var(--paper-2)}
.photo img{width:100%;height:auto}
.photo--small{margin-bottom:26px;max-width:420px;box-shadow:8px 8px 0 var(--flame)}
.photo--wide{margin-bottom:34px}
.split{display:grid;gap:36px}
.split--center{align-items:center}

/* ---------- Prosa ---------- */
.prose{max-width:66ch}
.prose h2{font-size:clamp(2rem,1.5rem + 1.8vw,3rem);margin-top:1.3em}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:1.4em;font-size:1.7rem}
.prose ul,.prose ol{padding-left:1.2em;margin:0 0 1.2em}
.prose li{margin-bottom:.45em}
.prose li::marker{color:var(--flame-t)}
.prose--center{margin-inline:0}
.prose--article{max-width:none;font-size:1.12rem}
.prose--article>p:first-of-type{font-size:1.3rem;border-left:6px solid var(--flame);padding-left:18px;color:var(--ink)}
.meta{font:500 .78rem var(--f-m);text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.ticks{list-style:none;display:grid;gap:0;margin:1.2rem 0 1.4rem;border-top:2px solid var(--ink)}
.ticks li{display:flex;gap:14px;align-items:center;padding:13px 0;border-bottom:1px solid rgba(11,26,46,.3);font-weight:600}
.ticks .ico{width:24px;height:24px;background:var(--signal);border:2px solid var(--ink);padding:2px;stroke-width:3}

/* ---------- Zone ---------- */
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.chips a{display:inline-flex;gap:6px;align-items:center;border:2px solid var(--ink);background:var(--white);padding:7px 12px;font:500 .8rem var(--f-m);text-transform:uppercase;letter-spacing:.03em;text-decoration:none}
.chips a:hover{background:var(--ink);color:var(--paper)}
.chips a .ico{color:var(--flame-dd)}
.chips--stack{flex-direction:column;align-items:flex-start}
.zindex{display:grid;gap:34px}
.zarea h3{font:500 .8rem var(--f-m);letter-spacing:.06em;color:var(--flame-dd);border-bottom:2px solid var(--ink);padding-bottom:10px;margin:0 0 0}
.zarea p.znote{font-size:.92rem;color:var(--muted);margin:8px 0 6px}
.zarea ul{list-style:none}
.zarea a{display:flex;justify-content:space-between;align-items:center;gap:12px;font:800 clamp(1.9rem,1.5rem + 1.4vw,2.6rem)/1 var(--f-d);text-transform:uppercase;padding:11px 4px;border-bottom:1px solid var(--ink);text-decoration:none;transition:background .15s,padding .15s}
.zarea a::after{content:"→";font-family:var(--f-b);font-weight:400;font-size:.7em;color:var(--flame-t);transition:transform .15s}
.zarea a:hover{background:var(--flame);padding-inline:14px}
.zarea a:hover::after{transform:translateX(6px);color:var(--ink)}
.zarea .zi{display:block;font:400 .9rem/1.4 var(--f-b);text-transform:none;color:var(--muted);margin-top:4px}
.zarea a.is-base{background:var(--signal)}
.zarea a.is-base::before{content:"Sede";font:500 .68rem var(--f-m);letter-spacing:.05em;background:var(--ink);color:var(--paper);padding:3px 6px;order:3}
.zarea a .zname{flex:1}

/* ---------- Page hero ---------- */
.phero{border-bottom:2px solid var(--ink);padding:24px 0 52px;position:relative;overflow:hidden}
.phero--hot{--accent:var(--flame)}.phero--cold{--accent:var(--ice)}.phero--mix{--accent:var(--signal)}
.phero__in{display:grid;gap:34px;align-items:center}
.phero h1{font-size:clamp(2.7rem,1.8rem + 5.2vw,5.8rem);max-width:15ch;line-height:.9}
.phero--simple h1{max-width:18ch}
.phero--simple{padding-bottom:44px}
.phero--simple .lead{margin-bottom:0}
.phero__media{position:relative;border:2px solid var(--ink);box-shadow:12px 12px 0 var(--accent);aspect-ratio:4/3;background:var(--paper-2);margin-right:12px}
.phero__img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.phero__tag{position:absolute;left:-2px;bottom:-2px;background:var(--signal);border:2px solid var(--ink);padding:7px 11px;font:500 .74rem var(--f-m);text-transform:uppercase;letter-spacing:.04em}
.crumbs{margin-bottom:22px}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px 8px}
.crumbs li+li::before{content:"/";margin-right:8px;color:var(--flame-dd)}
.crumbs a{text-decoration:none;color:var(--muted)}
.crumbs a:hover{color:var(--ink);text-decoration:underline}
.crumbs [aria-current]{color:var(--ink)}
.brand-lockup{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:18px}
.brand-lockup img{width:auto;background:var(--white);border:2px solid var(--ink);padding:6px 12px;height:58px}
.brand-lockup span{font:500 .75rem var(--f-m);text-transform:uppercase;background:var(--ink);color:var(--paper);padding:8px 10px;letter-spacing:.04em}
.brandlist{list-style:none;display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;margin-top:14px}
.brandlist img{height:30px;width:auto}
.card--brand__logo{height:64px;display:flex;align-items:center;margin-bottom:12px}
.card--brand__logo img{width:auto;height:54px}

/* ---------- FAQ ---------- */
.faq{counter-reset:q;border-top:2px solid var(--ink)}
.faq__item{border-bottom:2px solid var(--ink);counter-increment:q}
.faq__item summary{list-style:none;cursor:pointer;display:flex;gap:16px;align-items:center;padding:20px 4px;font:700 1.18rem/1.3 var(--f-b)}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary::before{content:"Q" counter(q);font:500 .78rem var(--f-m);color:var(--flame-dd);flex:none;width:2.4em}
.faq__item summary span{flex:1}
.faq__ico{width:30px;height:30px;padding:5px;border:2px solid var(--ink);background:var(--signal);transition:transform .2s;flex:none}
.faq__item[open] .faq__ico{transform:rotate(45deg);background:var(--flame)}
.faq__item[open] summary{background:var(--white)}
.faq__a{padding:4px 4px 24px calc(2.4em + 16px + 4px)}
.faq__a p{margin:0;max-width:62ch;color:var(--ink-2)}

/* ---------- CTA ---------- */
.cta-band{background:var(--flame);color:var(--ink);border-top:2px solid var(--ink);overflow:hidden;position:relative}
.cta-band::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-45deg,transparent 0 22px,rgba(11,26,46,.07) 22px 24px);pointer-events:none}
.cta-band__in{position:relative;padding:clamp(44px,6vw,84px) 0;display:grid;gap:16px}
.cta-band h2{font:500 .82rem var(--f-m);text-transform:uppercase;letter-spacing:.05em;margin:0;line-height:1.3}
.bigtel{font:900 clamp(3.6rem,2rem + 12vw,12rem)/.85 var(--f-d);letter-spacing:-.01em;color:var(--ink);text-decoration:none;display:inline-block}
.bigtel:hover{color:var(--paper)}
.cta-band p{margin:0;max-width:52ch;font-size:1.15rem;font-weight:500}
.cta-band .btn-row{margin-top:6px}

/* ---------- Form ---------- */
.form-card{background:var(--white);border:2px solid var(--ink);padding:clamp(22px,3vw,38px);box-shadow:12px 12px 0 var(--ice);position:relative}
.form{display:grid;gap:18px;position:relative}
.field{display:grid;gap:7px}
.field-row{display:grid;gap:18px}
.field label{font:500 .76rem var(--f-m);text-transform:uppercase;letter-spacing:.05em}
.field input,.field select,.field textarea{width:100%;font:inherit;color:var(--ink);background:var(--paper);border:2px solid var(--ink);padding:13px 14px;min-height:52px;border-radius:0}
.field textarea{resize:vertical;min-height:130px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;background:var(--white);box-shadow:5px 5px 0 var(--flame)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.check{display:flex;gap:12px;align-items:flex-start;font-size:.93rem;color:var(--muted)}
.check input{width:22px;height:22px;margin-top:2px;accent-color:var(--ink);flex:none}
.notice{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border:2px solid var(--ink);margin-bottom:18px;position:relative}
.notice--ok{background:#c9f3d7}.notice--err{background:#ffd3c4}
.notice--ok .ico{width:28px;height:28px;stroke-width:3}
.contact-cards{display:grid;gap:14px}
.contact{display:flex;gap:16px;align-items:center;background:var(--white);border:2px solid var(--ink);padding:16px 18px;text-decoration:none;color:var(--ink);transition:transform .12s,box-shadow .12s}
.contact .chip-ico{margin:0}
.contact strong{display:block;font:500 .74rem var(--f-m);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.contact__big{font:800 1.9rem/1 var(--f-d);text-transform:uppercase}
a.contact:hover{transform:translate(-3px,-3px);box-shadow:var(--hard)}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:rgba(242,237,228,.8);font-size:.97rem;overflow:hidden;position:relative}
.footer__grid{display:grid;gap:34px;padding:60px 0 28px}
.footer__logo{width:auto;height:84px;background:var(--paper);padding:8px 12px;margin-bottom:18px}
.footer__about p{max-width:44ch}
.footer__about strong{color:var(--paper)}
.site-footer address{font-style:normal;display:grid;gap:9px;margin-top:10px}
.site-footer a{color:var(--paper);text-decoration:none}
.site-footer a:hover{color:var(--signal);text-decoration:underline}
.site-footer address a,.site-footer address span{display:inline-flex;gap:8px;align-items:center}
.footer__h{font:500 .78rem var(--f-m);text-transform:uppercase;letter-spacing:.08em;color:var(--signal);margin-bottom:14px}
.footer__col ul{list-style:none;display:grid;gap:8px}
.footer__bar{border-top:1px solid rgba(242,237,228,.2);font-size:.86rem}
.footer__bar-in{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;padding:18px 0}
.footer__bar p{margin:0}
.footer__mark{font:900 clamp(4.6rem,2rem + 19.5vw,22rem)/.74 var(--f-d);text-transform:uppercase;white-space:nowrap;color:transparent;-webkit-text-stroke:2px rgba(242,237,228,.28);margin:0 0 -.1em -.02em;user-select:none;pointer-events:none;letter-spacing:-.01em}

/* ---------- Barra mobile ---------- */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:190;transform:translateZ(0);display:grid;grid-template-columns:1.2fr 1fr 1fr;background:var(--ink);border-top:2px solid var(--ink);padding-bottom:env(safe-area-inset-bottom)}
.mbar a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 4px 8px;font:500 .68rem var(--f-m);text-transform:uppercase;letter-spacing:.04em;color:var(--paper);text-decoration:none;border-right:1px solid rgba(242,237,228,.2)}
.mbar a:first-child{background:var(--flame);color:var(--ink)}
.mbar a:nth-child(2){background:var(--wa);color:var(--ink)}
.mbar .ico{width:21px;height:21px}

/* ---------- ≥ 720 ---------- */
@media (min-width:720px){
  .grid--2{grid-template-columns:repeat(2,1fr)}
  .grid--3{grid-template-columns:repeat(2,1fr)}
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .field-row{grid-template-columns:1fr 1fr}
  .footer__grid{grid-template-columns:1.4fr 1fr 1fr 1fr}
  .brandbar__in{flex-direction:row;align-items:center;justify-content:space-between}
  .pillars{grid-template-columns:repeat(3,1fr)}
  .pillars li{border-bottom:0;border-right:2px solid var(--ink)}
  .pillars li:last-child{border-right:0}
  .zindex{grid-template-columns:repeat(3,1fr);gap:28px}
  .gallery .shot:nth-child(even){margin-top:42px}
  .cta-band__in{grid-template-columns:1fr auto;align-items:end}
  .cta-band h2,.cta-band .bigtel{grid-column:1/-1}
}
/* ---------- ≥ 980 ---------- */
@media (min-width:980px){
  body{padding-bottom:0}
  .mbar{display:none}
  .nav-row{min-height:78px}
  .brand img{height:60px}
  .nav-toggle{display:none}
  .nav{display:flex!important;position:static;inset:auto;background:none;color:var(--ink);padding:0;overflow:visible;align-items:center;gap:18px}
  .nav__list{display:flex;gap:2px;align-items:center}
  .nav__list>li{position:relative}
  .nav__list>li>a{font:500 .8rem var(--f-m);letter-spacing:.05em;border:0;padding:11px 11px;color:var(--ink);white-space:nowrap;position:relative}
  .nav__list>li>a::after{content:"";position:absolute;left:11px;right:11px;bottom:5px;height:3px;background:var(--flame);transform:scaleX(0);transform-origin:left;transition:transform .2s}
  .nav__list>li>a:hover::after,.has-sub:focus-within>a::after{transform:scaleX(1)}
  .nav__chev{display:inline-block}
  .nav__cta{margin:0;width:auto;padding:13px 17px}
  .mega{display:none;position:absolute;left:-200px;top:calc(100% + 2px);width:min(900px,94vw);grid-template-columns:repeat(4,1fr);gap:22px;padding:26px;background:var(--paper);border:2px solid var(--ink);box-shadow:var(--hard)}
  .has-sub:hover .mega,.has-sub:focus-within .mega{display:grid}
  .has-sub::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px}
  .mega__title{color:var(--flame-dd);margin-top:0;border-bottom:2px solid var(--ink);padding-bottom:8px;margin-bottom:6px}
  .mega ul a{color:var(--ink);font-size:.95rem}
  .mega ul a:hover{color:var(--flame-dd);text-decoration:underline}
  .hero__grid{grid-template-columns:1.22fr .78fr;gap:64px;padding:56px 0 76px;align-items:center}
  .phero__in{grid-template-columns:1.15fr .85fr;gap:60px}
  .grid--3{grid-template-columns:repeat(3,1fr)}
  .grid--4{grid-template-columns:repeat(4,1fr)}
  .split{grid-template-columns:1.1fr .9fr;gap:70px}
  .split--center{grid-template-columns:1fr 1fr}
  .split--steps{grid-template-columns:.8fr 1.2fr;align-items:start}
  .split--steps>.sticky{position:sticky;top:110px}
  .thermo__grid{grid-template-columns:.9fr 1.1fr;align-items:center;gap:70px}
  .panels{grid-template-columns:repeat(3,1fr);transition:grid-template-columns .5s}
  .panels:has(.panel:nth-child(1):hover),.panels:has(.panel:nth-child(1):focus-within){grid-template-columns:1.7fr 1fr 1fr}
  .panels:has(.panel:nth-child(2):hover),.panels:has(.panel:nth-child(2):focus-within){grid-template-columns:1fr 1.7fr 1fr}
  .panels:has(.panel:nth-child(3):hover),.panels:has(.panel:nth-child(3):focus-within){grid-template-columns:1fr 1fr 1.7fr}
  .panel{min-height:600px;border-bottom:0;border-right:2px solid var(--ink)}
  .panel:last-child{border-right:0}
  .panel__in{min-height:600px;padding:34px 28px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.site-header,.mbar,.cta-band,.site-footer,.ticker{display:none}}

/* Markfy: in modalità modifica si vedono tutte le risposte del termostato */
body.bfr-editing .thermo .ans{display:block!important;margin-bottom:14px}

.footer__legal a{color:inherit}