@font-face{font-family:'SkDisp';src:url(../fonts/disp.ttf) format('truetype');font-weight:100 900;font-display:swap;}
@font-face{font-family:'SkBody';src:url(../fonts/body-r.ttf) format('truetype');font-weight:100 450;font-display:swap;}
@font-face{font-family:'SkBody';src:url(../fonts/body-b.ttf) format('truetype');font-weight:451 900;font-display:swap;}
@font-face{font-family:'SkMono';src:url(../fonts/mono.ttf) format('truetype');font-weight:100 900;font-display:swap;}

:root{
  color-scheme: only light;   /* vincolante: blocca lo scurimento automatico iOS/WebKit */
  --ink:#151515; --ink-2:#1F1F1F; --ink-3:#2B2B2B;
  --gold:#CFB374; --gold-dk:#856A2E; --lime:#C2D545; --lime-dk:#A8BB2E;
  --paper:#fff; --grey:#F4F4F2; --grey-2:#E6E6E2;
  --txt:#3A3A38; --muted:#8A8A85;
  --maxw:1200px; --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:100px; background:#FFFFFF; color-scheme:only light;}
body{margin:0; background:var(--paper); color:var(--ink);
  font-family:'SkBody',-apple-system,system-ui,sans-serif;
  font-size:17.5px; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden;}
img{max-width:100%; display:block;}
a{color:inherit;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 26px; width:100%;}
:focus-visible{outline:3px solid var(--lime); outline-offset:3px;}
h1,h2,h3,h4{font-family:'SkDisp',sans-serif; font-weight:700; letter-spacing:-.025em; line-height:1.07; margin:0;}
.t1{font-size:clamp(36px,5.6vw,66px); letter-spacing:-.03em; line-height:1.03;}
.t2{font-size:clamp(28px,4vw,48px);}
.t3{font-size:clamp(22px,2.6vw,31px);}
.mono{font-family:'SkMono',monospace; font-size:12.5px; letter-spacing:.06em; text-transform:uppercase;}
.lead{font-size:clamp(17px,1.85vw,19.5px); line-height:1.6; color:var(--txt);}
p{margin:0 0 18px;} p:last-child{margin-bottom:0;}

.rv{opacity:0; transform:translateY(20px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.rv.on{opacity:1; transform:none;}
.dl1{transition-delay:.08s}.dl2{transition-delay:.16s}.dl3{transition-delay:.24s}.dl4{transition-delay:.32s}

/* TOP BAR */
.topbar{background:var(--ink-2); color:rgba(255,255,255,.72); font-size:13px;}
.topbar .wrap{display:flex; align-items:center; gap:20px; padding-top:9px; padding-bottom:9px; flex-wrap:wrap;}
.topbar a{text-decoration:none; transition:color .2s;} .topbar a:hover{color:var(--lime);}
.topbar .sp{flex:1;} .topbar .zone{color:var(--gold); letter-spacing:.06em;}

/* HEADER + NAV con sottomenu */
body > header{position:sticky; top:0; z-index:80; background:rgba(21,21,21,.96);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid rgba(255,255,255,.09);}
.nav{display:flex; align-items:center; gap:16px; padding:12px 26px; max-width:var(--maxw); margin:0 auto; position:relative;}
.nav .logo img{height:34px; width:auto;}
.nav .sp{flex:1;}
.menu{display:flex; gap:2px; align-items:center;}
.menu > li{list-style:none; position:relative;}
.menu ul{list-style:none; margin:0; padding:0;}
.menu a{display:block; text-decoration:none; color:rgba(255,255,255,.8); font-size:14.5px; font-weight:500;
  padding:9px 12px; border-radius:4px; white-space:nowrap; transition:color .2s, background .2s;}
.menu a:hover{color:#fff; background:rgba(255,255,255,.08);}
.menu a.act{color:var(--lime);}
.has-sub > a::after{content:"▾"; font-size:10px; margin-left:6px; opacity:.7;}
.sub{position:absolute; top:100%; left:0; min-width:262px; background:var(--ink-2);
  border:1px solid rgba(255,255,255,.12); border-radius:6px; padding:7px; opacity:0; visibility:hidden;
  transform:translateY(-6px); transition:opacity .22s, transform .22s, visibility .22s; box-shadow:0 18px 46px rgba(0,0,0,.5);}
.has-sub:hover .sub, .has-sub:focus-within .sub{opacity:1; visibility:visible; transform:none;}
.sub a{font-size:14px; padding:9px 12px; color:rgba(255,255,255,.78);}
.btn-q{background:var(--lime); color:var(--ink); text-decoration:none; font-weight:700; font-size:14.5px;
  padding:11px 20px; border-radius:4px; white-space:nowrap; transition:background .2s, transform .2s var(--ease);}
.btn-q:hover{background:#fff; transform:translateY(-1px);}
.burger{display:none; background:none; border:none; color:#fff; padding:8px; cursor:pointer;}
.burger svg{width:26px; height:26px;}

/* BOTTONI */
.b{display:inline-block; text-decoration:none; font-weight:700; font-size:15px; padding:14px 26px; border-radius:4px;
  transition:transform .2s var(--ease), background .2s, border-color .2s, color .2s;}
.b-lime{background:var(--lime); color:var(--ink);} .b-lime:hover{background:var(--ink); color:#fff; transform:translateY(-2px);}
.b-out{border:1.5px solid rgba(255,255,255,.42); color:#fff;} .b-out:hover{border-color:var(--lime); color:var(--lime); transform:translateY(-2px);}
.b-dark{background:var(--ink); color:#fff;} .b-dark:hover{background:var(--ink-3); transform:translateY(-2px);}
.b-line{border:1.5px solid var(--ink); color:var(--ink);} .b-line:hover{background:var(--ink); color:#fff;}
.btns{display:flex; gap:12px; flex-wrap:wrap;}

/* HOME HERO */
.hero{position:relative; min-height:clamp(540px,88svh,840px); display:flex; align-items:center; background:var(--ink); overflow:hidden;}
.hero-bg{position:absolute; inset:0;}
.hero-bg img{width:100%; height:100%; object-fit:cover; object-position:62% 58%; transform:scale(calc(1.045 - var(--p,0)*.045));}
.hero-bg::after{content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(21,21,21,.94) 0%, rgba(21,21,21,.78) 38%, rgba(21,21,21,.30) 72%, rgba(21,21,21,.55) 100%);}
.hero-in{position:relative; z-index:2; padding:70px 0; color:#fff;}
.hero .mono{color:var(--lime); margin-bottom:20px;}
.hero .t1{color:#fff; max-width:15ch;} .hero .t1 em{font-style:normal; color:var(--lime);}
.hero p{color:rgba(255,255,255,.82); max-width:46ch; margin:24px 0 34px; font-size:clamp(16.5px,1.8vw,19px);}
.hero-strip{position:absolute; bottom:0; left:0; right:0; z-index:3; display:flex; background:rgba(21,21,21,.88); border-top:2px solid var(--lime);}
.hero-strip div{flex:1; padding:15px 20px; border-right:1px solid rgba(255,255,255,.12); color:#fff;}
.hero-strip div:last-child{border-right:none;}
.hero-strip b{display:block; font-family:'SkDisp',sans-serif; font-size:20px; color:var(--lime); line-height:1.1;}
.hero-strip div > span{font-size:12.5px; color:rgba(255,255,255,.66);}
.hero-strip b span{font-size:inherit; color:inherit;}

/* HERO PAGINE INTERNE */
.phero{background:var(--ink); color:#fff; padding:clamp(52px,9vh,88px) 0 clamp(46px,7vh,70px); position:relative; overflow:hidden;}
.phero::after{content:""; position:absolute; right:-6%; top:-40%; width:46vw; height:180%;
  background:radial-gradient(ellipse at center, rgba(194,213,69,.11) 0%, rgba(194,213,69,0) 62%);}
.phero .wrap{position:relative; z-index:2;}
.crumb{font-family:'SkMono',monospace; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.5); margin-bottom:16px;}
.crumb a{text-decoration:none; color:var(--gold);} .crumb a:hover{color:var(--lime);}
.phero .t1{color:#fff; max-width:20ch;}
.phero p{color:rgba(255,255,255,.78); max-width:62ch; margin-top:20px; font-size:clamp(16.5px,1.8vw,19px);}

/* SEZIONI */
.sec{padding:clamp(58px,8.5vh,100px) 0; background:var(--paper);}
.sec.grey{background:var(--grey);}
.sec.dark{background:var(--ink); color:#fff;}
.sec.dark .lead{color:rgba(255,255,255,.76);}
.shead{max-width:62ch; margin-bottom:clamp(34px,4.6vh,52px);}
.shead .mono{color:var(--gold-dk); margin-bottom:13px;}
.sec.dark .shead .mono{color:var(--lime);}
.shead p{margin:16px 0 0;}

/* COLONNE TESTO+IMG */
.split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,58px); align-items:center;}
.split.wide-l{grid-template-columns:1.15fr .85fr;}
.split img{border-radius:10px;}
.prose h3{font-size:clamp(20px,2.3vw,26px); margin:32px 0 12px;}
.prose h3:first-child{margin-top:0;}
.prose ul{margin:0 0 18px; padding-left:0; list-style:none;}
.prose ul li{position:relative; padding-left:26px; margin-bottom:10px; color:var(--txt);}
.prose ul li::before{content:""; position:absolute; left:6px; top:11px; width:7px; height:7px; background:var(--lime); border-radius:2px;}
.prose p{color:var(--txt);}

/* CARD GRIGLIE */
.grid2{display:grid; grid-template-columns:repeat(2,1fr); gap:20px;}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.grid4{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.card{background:var(--paper); border:1px solid var(--grey-2); border-radius:8px; padding:30px 28px;
  display:flex; flex-direction:column; text-decoration:none; transition:transform .3s var(--ease), box-shadow .3s, border-color .3s;}
a.card:hover{transform:translateY(-4px); box-shadow:0 14px 40px rgba(21,21,21,.09); border-color:var(--lime);}
.card .tag{display:inline-block; font-family:'SkMono',monospace; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  background:var(--ink); color:var(--lime); padding:5px 10px; border-radius:3px; align-self:flex-start; margin-bottom:15px;}
.card h3{font-size:23px; margin-bottom:11px;}
.card p{margin:0 0 18px; color:var(--txt); font-size:16.5px; flex:1;}
.card .go{font-weight:700; font-size:15px; color:var(--ink);}
.spec{border-top:1px solid var(--grey-2); padding-top:14px; display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:auto;}
.spec div{font-family:'SkMono',monospace; font-size:12px; color:var(--muted); letter-spacing:.04em;}
.spec b{display:block; font-family:'SkBody',sans-serif; font-size:15px; color:var(--ink); letter-spacing:0; font-weight:700; text-transform:none;}

/* FASI */
.phase{display:flex; gap:20px; padding:22px 0; border-top:1px solid rgba(255,255,255,.14);}
.phase:last-child{border-bottom:1px solid rgba(255,255,255,.14);}
.phase .n{font-family:'SkMono',monospace; font-size:13px; color:var(--lime); padding-top:4px; flex-shrink:0; letter-spacing:.08em;}
.phase h4{font-size:20px; margin-bottom:6px;}
.phase p{margin:0; color:rgba(255,255,255,.72); font-size:16px;}

/* VALORI */
.vals{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.val{border-top:3px solid var(--lime); padding-top:18px;}
.val h4{font-size:19px; margin-bottom:8px;} .val p{margin:0; font-size:15.5px; color:var(--txt);}
.sec.dark .val p{color:rgba(255,255,255,.72);}

/* TABELLA DATI / SCHEDE */
.tbl{width:100%; border-collapse:collapse; font-size:16px;}
.tbl th{text-align:left; font-family:'SkMono',monospace; font-size:11.5px; letter-spacing:.07em; text-transform:uppercase;
  color:var(--muted); font-weight:400; padding:0 14px 10px 0; border-bottom:2px solid var(--ink);}
.tbl td{padding:14px 14px 14px 0; border-bottom:1px solid var(--grey-2); vertical-align:top; color:var(--txt);}
.tbl td:first-child{color:var(--ink); font-weight:700;}
.todo{display:inline-block; font-family:'SkMono',monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  background:#FFF4D6; color:#8A6A12; border:1px dashed #D9B34A; padding:4px 9px; border-radius:3px;}

/* FLOTTA / GALLERIE */
.fleet{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
.fleet figure{margin:0; border-radius:8px; overflow:hidden; background:var(--ink-3); aspect-ratio:4/3;}
.fleet img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease);}
.fleet figure:hover img{transform:scale(1.05);}

/* REALIZZAZIONI */
.work{border-radius:8px; overflow:hidden; background:var(--paper); border:1px solid var(--grey-2); display:flex; flex-direction:column;}
.work .ph{aspect-ratio:16/10; overflow:hidden; background:var(--grey-2);}
.work .ph img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease);}
.work:hover .ph img{transform:scale(1.05);}
.work .tx{padding:20px 22px 22px;}
.work .mono{color:var(--gold-dk); margin-bottom:8px; font-size:11.5px;}
.work h4{font-size:19px; margin-bottom:6px;} .work p{margin:0; font-size:15px; color:var(--txt);}

/* PARTNERS */
.plogos{display:flex; align-items:center; justify-content:center; gap:clamp(34px,7vw,86px); flex-wrap:wrap;}
.plogos img{height:clamp(44px,5.5vw,64px); width:auto; opacity:.82; filter:grayscale(1); transition:opacity .3s, filter .3s;}
.plogos img:hover{opacity:1; filter:none;}

/* FORM */
.form{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.form .full{grid-column:1 / -1;}
.form label{display:block; font-family:'SkMono',monospace; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:7px;}
.form input,.form select,.form textarea{width:100%; padding:13px 14px; border:1px solid var(--grey-2); border-radius:5px;
  font-family:'SkBody',sans-serif; font-size:16px; color:var(--ink); background:var(--paper); transition:border-color .2s;}
.form textarea{min-height:132px; resize:vertical;}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--lime); outline:none;}
.form .priv{font-size:13.5px; color:var(--muted);}

/* CTA */
.cta{background:var(--lime); color:var(--ink); padding:clamp(58px,8vh,92px) 0;}
.cta .t2{max-width:18ch;}
.cta p{margin:18px 0 30px; max-width:52ch; font-size:clamp(17px,1.85vw,19px); color:rgba(21,21,21,.82);}

/* FOOTER */
footer{background:var(--ink); color:rgba(255,255,255,.62); padding:58px 0 32px; font-size:15px;}
.fg{display:grid; grid-template-columns:1.5fr 1fr 1fr 1.1fr; gap:34px;}
footer .flogo{height:40px; width:auto; margin-bottom:18px;}
footer h5{font-family:'SkMono',monospace; font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--lime); margin:0 0 14px; font-weight:400;}
footer ul{list-style:none; margin:0; padding:0;} footer li{margin-bottom:8px;}
footer a{color:rgba(255,255,255,.74); text-decoration:none; transition:color .2s;} footer a:hover{color:var(--lime);}
.fb{border-top:1px solid rgba(255,255,255,.12); margin-top:40px; padding-top:20px; font-size:12.5px;
  color:rgba(255,255,255,.42); display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;}

@media (max-width:1050px){
  .menu{display:none;}
  .burger{display:block;}
  .menu.open{display:block; position:absolute; top:100%; left:0; right:0; background:var(--ink);
    border-bottom:1px solid rgba(255,255,255,.12); margin:0; padding:8px 16px 18px;
    max-height:calc(100vh - 100%); overflow-y:auto; overscroll-behavior:contain;}
  .menu.open > li{border-bottom:1px solid rgba(255,255,255,.07);}
  .menu.open a{padding:13px 8px;}
  .has-sub > a::after{content:"";}
  .sub{position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none;
    background:transparent; padding:0 0 8px 14px; min-width:0;}
  .sub a{color:rgba(255,255,255,.62); padding:9px 8px;}
  .split,.split.wide-l{grid-template-columns:1fr;}
  .grid4{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:760px){
  .grid2,.grid3{grid-template-columns:1fr;}
  .vals{grid-template-columns:1fr; gap:18px;}
  .fleet{grid-template-columns:repeat(2,1fr);}
  .form{grid-template-columns:1fr;}
  .hero-strip{flex-wrap:wrap;}
  .hero-strip div{flex:1 1 50%; border-bottom:1px solid rgba(255,255,255,.12); padding:12px 16px;}
  .hero-in{padding:40px 0 216px;} .hero{min-height:auto;}
  .fg{grid-template-columns:1fr;}
  .tbl,.tbl tbody,.tbl tr,.tbl td{display:block; width:100%;}
  .tbl thead{display:none;}
  .tbl tr{border-bottom:1px solid var(--grey-2); padding:12px 0;}
  .tbl td{border:none; padding:3px 0;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .rv{opacity:1 !important; transform:none !important; transition:none !important;}
  .hero-bg img{transform:none !important;}
}

/* immagine affiancata che segue la lettura sui testi lunghi */
@media (min-width:1051px){
  .split.wide-l > div:last-child{position:sticky; top:118px;}
}

/* tabella su fondo scuro */
.sec.dark .tbl th{color:rgba(255,255,255,.66); border-bottom-color:#fff;}
.sec.dark .tbl td{color:rgba(255,255,255,.82); border-bottom-color:rgba(255,255,255,.18);}
.sec.dark .tbl td:first-child{color:var(--lime); font-family:'SkMono',monospace; font-size:13.5px; white-space:nowrap;}


/* ===== immagini scontornate usate come strato di sfondo ===== */
.bg-layer{position:relative; overflow:hidden;}
.bg-mark{
  position:absolute; left:-6%; top:50%; width:min(46vw,520px); height:auto;
  opacity:.06; pointer-events:none; user-select:none; z-index:1;
  transform:translateY(calc(-50% + (var(--bp,.5) - .5) * -90px)) rotate(-4deg);
  will-change:transform;
}
.bg-mark.right{left:auto; right:-8%; transform:translateY(calc(-50% + (var(--bp,.5) - .5) * 70px)) rotate(5deg);}
@media (max-width:760px){ .bg-mark{width:78vw; opacity:.05;} }
@media (prefers-reduced-motion:reduce){ .bg-mark{transform:translateY(-50%) !important;} }


/* etichette: oro chiaro sui fondi scuri, oro scuro sui fondi chiari */
.sec.dark .shead .mono, .phero .shead .mono{color:var(--lime);}
.hero .mono, .topbar .zone, .crumb a{color:var(--gold);}
.card .go{color:var(--ink);}


/* ===== rete di sicurezza se il sistema forza comunque il tema scuro ===== */
@media (prefers-color-scheme: dark){
  html, body{ background:#FFFFFF !important; color:var(--ink) !important; }
  .sec{ background:var(--paper) !important; }
  .sec.grey{ background:var(--grey) !important; }
  .sec.dark{ background:var(--ink) !important; }
  .card{ background:var(--paper) !important; }
  .prose p, .prose li, .shead p, .lead, .card p, .val p, .step p{ color:var(--txt) !important; }
  .sec.dark .lead, .sec.dark .shead p, .sec.dark .val p{ color:rgba(255,255,255,.78) !important; }
  h1,h2,h3,h4{ color:var(--ink) !important; }
  .hero h1, .hero p, .phero h1, .phero p,
  .sec.dark h2, .sec.dark h3, .sec.dark h4{ color:#FFFFFF !important; }
  .hero .t1 em{ color:var(--lime) !important; }
  .tbl td{ color:var(--txt) !important; } .tbl td:first-child{ color:var(--ink) !important; }
  .sec.dark .tbl td{ color:rgba(255,255,255,.82) !important; }
  .sec.dark .tbl td:first-child{ color:var(--lime) !important; }
  .form input, .form select, .form textarea{ background:#FFFFFF !important; color:var(--ink) !important; }
  .cta, .cta h2, .cta p{ background-color:var(--lime); color:var(--ink) !important; }
  .cta h2{ background:none; }
  footer{ background:var(--ink) !important; }
}


/* ===== manifesto ancorato: il testo si accende scorrendo ===== */
.pin{position:relative; background:var(--ink); height:300vh;}
.pin-in{position:sticky; top:0; height:100svh; display:flex; align-items:center; overflow:hidden; background:var(--ink);}
.pin .ln{display:block; color:#fff; opacity:.13; transform:translateY(14px);
  transition:opacity .65s var(--ease), transform .65s var(--ease), color .65s var(--ease);}
.pin .ln.on{opacity:1; transform:none;}
.pin .ln.hi.on{color:var(--lime);}
.pin-glow{position:absolute; width:72vmax; height:72vmax; left:50%; top:50%; pointer-events:none;
  transform:translate(-50%,-50%) scale(calc(.55 + var(--p,0)*.75));
  background:radial-gradient(circle, rgba(194,213,69,.13) 0%, rgba(194,213,69,0) 62%);}
.pin .mono{color:var(--lime); margin-bottom:26px;}

/* riquadri di testo che salgono a scaglioni */
.frames{display:grid; gap:18px;}
.frame{
  background:var(--paper); border:1px solid var(--grey-2); border-radius:10px;
  padding:clamp(26px,3vw,38px) clamp(24px,3vw,40px);
  transform:translateY(calc((1 - var(--fp,1)) * 34px));
  opacity:calc(.25 + var(--fp,1) * .75);
  transition:box-shadow .4s var(--ease);
}
.frame:hover{box-shadow:0 16px 44px rgba(21,21,21,.08);}
.frame h3{font-size:clamp(21px,2.4vw,27px); color:var(--brown, var(--ink)); margin-bottom:14px;}
.frame p{color:var(--txt);}
.frame .mono{color:var(--gold-dk); margin-bottom:12px;}
.frame.dk{background:var(--ink); border-color:var(--ink);}
.frame.dk h3{color:#fff;} .frame.dk p{color:rgba(255,255,255,.80);} .frame.dk .mono{color:var(--lime);}

@media (max-width:900px){ .pin{height:265vh;} }
@media (prefers-reduced-motion:reduce){
  .pin{height:auto;} .pin-in{position:static; height:auto; padding:70px 0;}
  .pin .ln{opacity:1; transform:none;}
  .frame{transform:none; opacity:1;}
}
@media (prefers-color-scheme: dark){
  .pin, .pin-in{ background:var(--ink) !important; }
  .pin .ln{ color:#fff !important; } .pin .ln.hi.on{ color:var(--lime) !important; }
  .frame{ background:var(--paper) !important; } .frame p{ color:var(--txt) !important; }
  .frame h3{ color:var(--ink) !important; }
  .frame.dk{ background:var(--ink) !important; }
  .frame.dk h3{ color:#fff !important; } .frame.dk p{ color:rgba(255,255,255,.80) !important; }
}



/* ===== schema del pompaggio, disegnato dallo scorrimento ===== */
.pompa-wrap{max-width:960px;}
.pompa{width:100%; height:auto; overflow:visible;}
.pompa .pl{fill:none; stroke:rgba(255,255,255,.34); stroke-width:1.6;
  stroke-dasharray:var(--len,900); stroke-dashoffset:calc(var(--len,900) * (1 - var(--a,0)));}
.pompa .tk{fill:none; stroke:var(--lime); stroke-width:2;
  stroke-dasharray:var(--len,400); stroke-dashoffset:calc(var(--len,400) * (1 - var(--b,0)));}
.pompa .wh{fill:none; stroke:var(--lime); stroke-width:2; opacity:var(--b,0);}
.pompa .tubo{fill:none; stroke:var(--gold); stroke-width:3; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:var(--len,700); stroke-dashoffset:calc(var(--len,700) * (1 - var(--c,0)));}
.pompa .getto{fill:var(--lime); opacity:.85;
  transform:scaleX(var(--d,0)); transform-origin:474px 141px;}
.pompa .q{stroke:rgba(255,255,255,.28); stroke-width:1; stroke-dasharray:4 5; opacity:var(--c,0);}
.pompa .lbl{fill:rgba(255,255,255,.72); font-family:'SkMono',monospace; font-size:12px; letter-spacing:.05em;}
.pompa .q-t{opacity:var(--c,0);}
.pompa .piano{fill:var(--ink); opacity:var(--d,0); font-weight:700;}
@media (max-width:700px){ .pompa .lbl{font-size:15px;} }
@media (prefers-reduced-motion:reduce){
  .pompa .pl,.pompa .tk,.pompa .tubo{stroke-dashoffset:0 !important;}
  .pompa .wh,.pompa .q,.pompa .q-t,.pompa .piano{opacity:1 !important;}
  .pompa .getto{transform:scaleX(1) !important;}
}

/* numeri che salgono entrando in vista */
[data-count]{font-variant-numeric:tabular-nums;}


/* ===== icone social nella barra in alto ===== */
.topbar .social{display:inline-flex; align-items:center; gap:15px; margin-left:4px;}
.topbar .social a{display:inline-flex; color:rgba(255,255,255,.68); transition:color .2s, transform .2s var(--ease);}
.topbar .social a:hover{color:var(--lime); transform:translateY(-1px);}
.topbar .social svg{width:17px; height:17px; display:block;}
@media (max-width:560px){ .topbar .social{gap:18px;} .topbar .social svg{width:19px; height:19px;} }


/* ===== schede tecniche per marchio ===== */
.brand-nav{display:flex; flex-wrap:wrap; gap:9px; margin-bottom:clamp(38px,5vh,58px);}
.brand-nav a{display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  font-size:14px; font-weight:600; color:var(--ink); background:var(--paper);
  border:1px solid var(--grey-2); border-radius:100px; padding:8px 15px;
  transition:border-color .2s, background .2s, transform .2s var(--ease);}
.brand-nav a span{font-family:'SkMono',monospace; font-size:11.5px; color:var(--muted);}
.brand-nav a:hover{border-color:var(--lime); transform:translateY(-2px);}

.brands{display:grid; gap:clamp(20px,3vh,32px);}
.brand{background:var(--paper); border:1px solid var(--grey-2); border-radius:12px;
  padding:clamp(24px,3vw,34px); scroll-margin-top:120px;}
.brand-h{display:flex; align-items:center; gap:clamp(20px,3vw,32px); flex-wrap:wrap;
  padding-bottom:20px; border-bottom:2px solid var(--ink); margin-bottom:20px;}
.brand-logo{flex:0 0 auto; width:clamp(120px,15vw,170px); height:64px;
  display:flex; align-items:center; justify-content:center;}
.brand-logo img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;}
.brand-t{flex:1; min-width:200px;}
.brand-t h3{font-size:clamp(20px,2.3vw,25px); margin-bottom:4px;}
.brand-t p{margin:0; color:var(--muted); font-size:15px;}
.brand-n{display:inline-block; margin-top:9px; font-family:'SkMono',monospace; font-size:11.5px;
  letter-spacing:.06em; text-transform:uppercase; background:var(--ink); color:var(--lime);
  padding:4px 10px; border-radius:3px;}

.brand-l{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:2px 26px;}
.brand-l a{display:flex; align-items:baseline; justify-content:space-between; gap:14px;
  text-decoration:none; padding:11px 4px; border-bottom:1px solid var(--grey-2);
  transition:color .2s, padding-left .2s var(--ease);}
.brand-l a:hover{color:var(--lime-dk); padding-left:9px;}
.brand-l .nome{font-weight:600; color:inherit; font-size:15.5px;}
.brand-l a:hover .nome{color:var(--lime-dk);}
.brand-l .peso{font-family:'SkMono',monospace; font-size:11.5px; color:var(--muted); white-space:nowrap;}

@media (max-width:820px){ .brand-l{grid-template-columns:1fr;} }
@media (prefers-color-scheme: dark){
  .brand, .brand-nav a{background:var(--paper) !important;}
  .brand-t h3, .brand-l .nome, .brand-nav a{color:var(--ink) !important;}
}


/* ===== griglia loghi produttori ===== */
.plogo-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2.4vw,30px);}
.plogo{margin:0; background:var(--paper); border:1px solid var(--grey-2); border-radius:10px;
  padding:clamp(22px,2.4vw,32px) clamp(18px,2vw,26px); display:flex; flex-direction:column;
  align-items:center; text-align:center; gap:16px;
  transition:transform .3s var(--ease), box-shadow .3s, border-color .3s;}
.plogo:hover{transform:translateY(-4px); box-shadow:0 14px 40px rgba(21,21,21,.09); border-color:var(--lime);}
.plogo img{height:52px; width:auto; max-width:100%; object-fit:contain;
  filter:grayscale(1); opacity:.72; transition:filter .3s, opacity .3s;}
.plogo:hover img{filter:none; opacity:1;}
.plogo figcaption{display:flex; flex-direction:column; gap:5px;}
.plogo strong{font-size:15.5px; color:var(--ink);}
.plogo span{font-size:13.5px; color:var(--muted); line-height:1.45;}
@media (max-width:900px){ .plogo-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:460px){ .plogo-grid{grid-template-columns:1fr;} }
@media (prefers-color-scheme: dark){ .plogo{background:var(--paper) !important;} .plogo strong{color:var(--ink) !important;} }


/* ===== banda loghi scorrevole ===== */
.marquee{overflow:hidden; position:relative; padding:8px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);}
.marquee-track{display:flex; align-items:center; width:max-content;
  animation:scorri 46s linear infinite; will-change:transform; backface-visibility:hidden;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee img{height:44px; width:auto; flex:0 0 auto; margin-right:clamp(46px,6vw,84px);
  filter:grayscale(1); opacity:.62; transition:filter .35s, opacity .35s;}
.marquee img:hover{filter:none; opacity:1;}
@keyframes scorri{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
@media (max-width:560px){ .marquee img{height:34px;} .marquee-track{animation-duration:34s;} }
@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none; flex-wrap:wrap; justify-content:center; width:auto; gap:28px;}
  .marquee img{margin-right:0;}
  .marquee{-webkit-mask-image:none; mask-image:none;}
}

/* ===== palazzo alto nello schema del pompaggio ===== */
.pompa .pl2{fill:none; stroke:rgba(255,255,255,.30); stroke-width:1.5;
  stroke-dasharray:var(--len,400); stroke-dashoffset:calc(var(--len,400) * (1 - var(--c,0)));}

/* ===== certificazioni nel piè di pagina ===== */
.certs{display:flex; align-items:center; gap:clamp(22px,3vw,38px); flex-wrap:wrap;
  margin-top:40px; padding-top:26px; border-top:1px solid rgba(255,255,255,.12);}
.certs-t{font-family:'SkMono',monospace; font-size:11.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--lime);}



/* torre nello schema del pompaggio */
.pompa .tr{fill:none; stroke:rgba(255,255,255,.30); stroke-width:1.6;
  stroke-dasharray:var(--len,400); stroke-dashoffset:calc(var(--len,400) * (1 - var(--d,0)));}
.pompa .tr-t{fill:none; stroke:var(--gold); stroke-width:2; stroke-linecap:round;
  stroke-dasharray:var(--len,30); stroke-dashoffset:calc(var(--len,30) * (1 - var(--d,0)));}

/* griglia partner: 3 colonne (9 loghi = 3 righe piene) e colori veri */
.plogo-grid{grid-template-columns:repeat(3,1fr);}
.plogo img{filter:none; opacity:1;}
@media (max-width:900px){ .plogo-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:460px){ .plogo-grid{grid-template-columns:1fr;} }

/* certificazioni */
.certs-t{font-family:'SkMono',monospace; font-size:11.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--lime); margin:0 0 14px;}


/* ===== certificazioni: scontornate, stessa scala ottica ===== */
.certs{display:flex; align-items:center; gap:clamp(22px,3vw,38px); flex-wrap:wrap; margin-top:26px;}
.cert{background:none; border:none; padding:0;}
.certs img{display:block; width:auto; opacity:.9; transition:opacity .3s;}
.certs img:hover{opacity:1;}
.cert-sq{height:54px;}
.cert-wide{height:32px;}
.certs-chiaro img{opacity:1;}
@media (max-width:560px){ .cert-sq{height:44px;} .cert-wide{height:26px;} }

/* logo nella barra: più leggibile da schermo grande */
body > header .nav .logo img{height:44px;}
@media (max-width:1050px){ body > header .nav .logo img{height:38px;} }
@media (max-width:560px){ body > header .nav .logo img{height:34px;} }

/* credito di realizzazione */
.credito{color:rgba(255,255,255,.42);}
.credito a{color:rgba(255,255,255,.68); text-decoration:none; border-bottom:1px solid rgba(194,213,69,.45);
  padding-bottom:1px; transition:color .2s, border-color .2s;}
.credito a:hover{color:var(--lime); border-color:var(--lime);}


/* ===== realizzazioni ===== */
.filtri{display:flex; flex-wrap:wrap; gap:9px; margin-bottom:clamp(30px,4vh,44px);}
.f-btn{font-family:'SkBody',sans-serif; font-size:14px; font-weight:600; color:var(--ink);
  background:var(--paper); border:1px solid var(--grey-2); border-radius:100px;
  padding:8px 16px; cursor:pointer; display:inline-flex; align-items:center; gap:8px;
  transition:border-color .2s, background .2s, color .2s;}
.f-btn span{font-family:'SkMono',monospace; font-size:11.5px; color:var(--muted);}
.f-btn:hover{border-color:var(--lime);}
.f-btn.att{background:var(--ink); color:#fff; border-color:var(--ink);}
.f-btn.att span{color:var(--lime);}

.cantieri{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,24px);}
.cant{border:1px solid var(--grey-2); border-radius:10px; overflow:hidden; background:var(--paper);
  display:flex; flex-direction:column; transition:transform .3s var(--ease), box-shadow .3s;}
.cant:hover{transform:translateY(-4px); box-shadow:0 16px 44px rgba(21,21,21,.10);}
.cant-tx{padding:18px 20px 22px;}
.cant-tx .mono{color:var(--gold-dk); font-size:11.5px; margin-bottom:7px;}
.cant-tx h3{font-size:19px; margin-bottom:5px; line-height:1.2;}
.cant-tx p{margin:0; font-size:14.5px; color:var(--muted);}
.cant[hidden]{display:none;}
@media (max-width:900px){ .cantieri{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .cantieri{grid-template-columns:1fr;} }
@media (prefers-color-scheme: dark){ .cant, .f-btn{background:var(--paper) !important;}
  .cant-tx h3, .f-btn{color:var(--ink) !important;} .f-btn.att{background:var(--ink) !important; color:#fff !important;} }


/* foto dei cantieri: scorrimento col dito */
.cant-ph{position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--grey-2);}
.scorri{display:flex; height:100%; overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch; scrollbar-width:none;}
.scorri::-webkit-scrollbar{display:none;}
.scorri img{flex:0 0 100%; width:100%; height:100%; object-fit:cover; scroll-snap-align:center;
  user-select:none; -webkit-user-drag:none;}
.punti{position:absolute; left:0; right:0; bottom:9px; z-index:2; display:flex;
  justify-content:center; gap:6px; pointer-events:none;}
.punti span{width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.55);
  box-shadow:0 0 0 1px rgba(21,21,21,.30); transition:background .25s, transform .25s;}
.punti span.on{background:var(--lime); transform:scale(1.3);}


/* ===== stratigrafia disegnata a linee ===== */
.strato-box{position:relative;}
.strato{width:100%; height:auto; overflow:visible;}
.strato .dl{fill:none; stroke:var(--lime); stroke-width:1.8; stroke-linecap:round;
  stroke-dasharray:var(--len,900); stroke-dashoffset:calc(var(--len,900) * (1 - var(--d,0)));}
.strato .onda{stroke:var(--gold); stroke-width:2.4; stroke-dasharray:9 7; opacity:var(--d,0);}
.strato .cella{fill:rgba(255,255,255,.26); opacity:var(--d,0);}
.strato .tubo{fill:none; stroke:var(--gold); stroke-width:1.9; opacity:var(--d,0);}
.strato .guida{stroke:rgba(255,255,255,.22); stroke-width:1; opacity:var(--d,0);}
.strato text{fill:rgba(255,255,255,.80); font-family:'SkMono',monospace; font-size:12.5px;
  letter-spacing:.04em; opacity:var(--d,0);}
.strato .lay{--d:0;}
.sec:not(.dark) .strato .dl{stroke:var(--lime-dk);}
.sec:not(.dark) .strato .guida{stroke:rgba(21,21,21,.20);}
.sec:not(.dark) .strato text{fill:var(--txt);}
.sec:not(.dark) .strato .cella{fill:rgba(21,21,21,.18);}
@media (max-width:700px){ .strato text{font-size:15px;} }
@media (prefers-reduced-motion:reduce){
  .strato .lay{--d:1 !important;} .strato .dl{stroke-dashoffset:0 !important;}
}


/* ===== riquadro mappa ===== */
.mappa iframe{width:100%; height:230px; border:0; display:block; filter:grayscale(.25);}
.mappa-tx{padding:22px 24px 26px;}
.mappa-tx h3{margin-bottom:8px;}
.mappa-tx p{margin:0; color:var(--txt); font-size:15.5px;}
@media (max-width:560px){ .mappa iframe{height:190px;} }


/* ===== mappa a caricamento manuale ===== */
.mappa-load{width:100%; border:none; background:var(--ink); color:#fff; cursor:pointer;
  padding:34px 24px; display:flex; align-items:center; gap:16px; text-align:left;
  font-family:'SkBody',sans-serif; font-size:15px; line-height:1.45; transition:background .2s;}
.mappa-load:hover{background:var(--ink-3);}
.mappa-load strong{color:var(--lime);}
.mappa-ico{font-size:26px; color:var(--lime); line-height:1;}
.mappa iframe{width:100%; height:240px; border:0; display:block;}

/* ===== allegati nel modulo ===== */
.form input[type=file]{padding:11px 12px; background:var(--grey); border:1px dashed var(--grey-2);
  cursor:pointer; font-size:14.5px;}
.form input[type=file]::file-selector-button{font-family:'SkBody',sans-serif; font-weight:700;
  font-size:13.5px; border:none; background:var(--ink); color:#fff; padding:7px 13px;
  border-radius:4px; margin-right:12px; cursor:pointer;}
.opz{font-family:'SkBody',sans-serif; text-transform:none; letter-spacing:0; color:var(--muted); font-weight:400;}
.aiuto{margin:8px 0 0; font-size:13.5px; color:var(--muted);}


/* ===== pagine legali ===== */
.legale{max-width:74ch;}
.legale .prose h3{font-size:clamp(19px,2.1vw,23px); margin-top:38px;}
.legale .prose h3:first-child{margin-top:0;}
.legale .prose p, .legale .prose li{font-size:16.5px;}
.legale .agg{margin-top:34px; padding-top:20px; border-top:1px solid var(--grey-2); color:var(--muted); font-size:15px;}
@media (prefers-color-scheme: dark){ }


/* riga prodotto nelle schede tecniche: nome sopra, descrizione sotto */
.brand-l a{display:grid; grid-template-columns:1fr auto; align-items:start; gap:3px 16px; padding:12px 4px;}
.brand-l .nome{grid-column:1; grid-row:1;}
.brand-l .peso{grid-column:2; grid-row:1; align-self:center;}
.brand-l .desc{grid-column:1 / -1; grid-row:2; font-size:13px; color:var(--muted); line-height:1.4;}
.brand-l a:hover .desc{color:var(--txt);}


/* ===== rifinitura certificazioni e immagini ===== */
.certs{gap:clamp(26px,3.4vw,44px); align-items:center;}
.certs img{transition:opacity .3s var(--ease), transform .3s var(--ease);}
.certs img:hover{transform:translateY(-2px);}
.cert-sq{height:58px;}
.cert-wide{height:34px;}
@media (max-width:560px){ .cert-sq{height:46px;} .cert-wide{height:27px;} .certs{gap:22px;} }

/* immagini: resa uniforme e nitida ovunque */
img{image-rendering:auto;}
.split img, .az-img img, .frame img, .prose img{border-radius:10px; width:100%; height:auto; display:block;}
.plogo img{image-rendering:-webkit-optimize-contrast;}

/* la griglia flotta: bordi coerenti con le altre schede */
.fleet figure{border:1px solid rgba(255,255,255,.10);}
.sec:not(.dark) .fleet figure{border-color:var(--grey-2);}

/* collegamento all'informativa dentro il modulo */
.form .priv a{color:#5F7A0F; border-bottom:1px solid rgba(95,122,15,.4);}
.form .priv a:hover{color:var(--ink);}

/* i quattro principi: due colonne su schermo grande, una sul telefono */
.frames-2{grid-template-columns:repeat(2,1fr);}
@media (max-width:760px){ .frames-2{grid-template-columns:1fr;} }

/* ===== colonna foto nella pagina Azienda ===== */
.colonna-foto{display:flex; flex-direction:column; gap:18px; position:sticky; top:118px;}
.colonna-foto figure{margin:0; border-radius:10px; overflow:hidden; background:var(--grey-2);
  aspect-ratio:3/2;}
.colonna-foto img{width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s var(--ease);}
.colonna-foto figure:hover img{transform:scale(1.04);}
@media (max-width:1050px){ .colonna-foto{position:static; display:grid; grid-template-columns:repeat(3,1fr); gap:14px;} }
@media (max-width:640px){ .colonna-foto{grid-template-columns:1fr;} }

/* le certificazioni non devono mai essere trattate come foto di contenuto */
.certs img.cert-sq{height:58px !important; width:auto !important; max-width:none;}
.certs img.cert-wide{height:34px !important; width:auto !important; max-width:none;}
@media (max-width:560px){
  .certs img.cert-sq{height:46px !important;}
  .certs img.cert-wide{height:27px !important;}
}

/* barra in alto più compatta ora che è senza recapiti */
.topbar .wrap{padding-top:7px; padding-bottom:7px;}
@media (max-width:560px){ .topbar .wrap{justify-content:space-between; gap:10px;} }

/* logo nel piè di pagina: raddoppiato */
footer .flogo{height:80px;}
@media (max-width:560px){ footer .flogo{height:62px;} }

/* ===== loghi ingranditi (barra e piè di pagina) ===== */
body > header .nav{padding-top:9px; padding-bottom:9px;}
body > header .nav .logo img{height:88px;}
@media (max-width:1200px){ body > header .nav .logo img{height:64px;} }
@media (max-width:1050px){ body > header .nav .logo img{height:60px;} }
@media (max-width:560px){ body > header .nav .logo img{height:50px;} }
html{scroll-padding-top:126px;}
@media (max-width:1200px){ html{scroll-padding-top:102px;} }
@media (max-width:560px){ html{scroll-padding-top:88px;} }

footer .flogo{height:90px;}
@media (max-width:560px){ footer .flogo{height:72px;} }

/* ===== galleria cantieri: frecce, punti cliccabili, scorrimento automatico ===== */
.cant-ph .fr{position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:38px; height:38px; padding:0; border:0; border-radius:50%; cursor:pointer;
  background:rgba(21,21,21,.55); color:#fff; display:grid; place-items:center;
  opacity:0; transition:opacity .25s, background .2s, color .2s;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);}
.cant-ph .fr svg{width:19px; height:19px; fill:none; stroke:currentColor;
  stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;}
.cant-ph .fr.pv{left:9px;} .cant-ph .fr.nx{right:9px;}
.cant-ph:hover .fr, .cant-ph:focus-within .fr{opacity:1;}
.cant-ph .fr:hover{background:var(--lime); color:var(--ink);}
.cant-ph .fr:focus-visible{opacity:1;}
.punti span{pointer-events:auto; cursor:pointer; position:relative;}
.punti span::after{content:""; position:absolute; inset:-8px;}
@media (hover:none){ .cant-ph .fr{display:none;} }
@media (prefers-reduced-motion:reduce){ .cant-ph .fr{opacity:1;} }

/* ===== barra: il logo non deve mai comprimersi ===== */
/* senza questo la barra, quando lo spazio manca, schiaccia l'immagine
   e il logo perde le proporzioni (su Android era largo 46px invece di 137) */
.nav .logo, .nav .logo img, .nav .btn-q, .nav .burger{flex:0 0 auto;}
.nav .logo img{max-width:none;}

@media (max-width:560px){
  body > header .nav{padding-left:18px; padding-right:18px; gap:10px;}
  body > header .nav .logo img{height:40px;}
  body > header .nav .btn-q{font-size:13px; padding:10px 13px;}
}
@media (max-width:390px){
  body > header .nav{padding-left:14px; padding-right:14px; gap:8px;}
  body > header .nav .logo img{height:36px;}
  body > header .nav .btn-q{font-size:12.5px; padding:9px 11px;}
}

/* ===== menu aperto: la pagina sotto resta ferma =====
   niente overflow:hidden sull'elemento radice: annullerebbe l'aggancio
   della barra in alto. Lo scorrimento lo ferma lo script, evento per evento. */
body.menu-aperto{overscroll-behavior:none;}