@font-face{font-family:"Barlow Condensed";font-weight:500;font-display:swap;src:url(../fonts/barlow-condensed-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:600;font-display:swap;src:url(../fonts/barlow-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(../fonts/barlow-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:400;font-style:italic;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2")}
:root{--ink:#14222a;--ink2:#1d2f39;--teal:#2b7a80;--teal-d:#1f6169;--mint:#7cc3c6;--panel:#eef2f3;--line:#d3dcdf;--text:#22313a;--muted:#55666f;--red:#c8372d;--white:#fff;
--wrap:1180px;--gut:clamp(18px,4vw,40px);--f-head:"Barlow Condensed","Arial Narrow",sans-serif;--f-body:"IBM Plex Sans",system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:400 1.0625rem/1.65 var(--f-body);color:var(--text);background:var(--white)}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--teal-d);text-underline-offset:3px}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--mint);outline-offset:3px;border-radius:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--white);color:var(--ink);padding:.7rem 1rem;z-index:100}
.skip:focus{left:8px;top:8px}
.wrap{width:100%;max-width:calc(var(--wrap) + 2*var(--gut));margin-inline:auto;padding-inline:var(--gut)}
h1,h2,h3{font-family:var(--f-head);font-weight:600;line-height:1.08;letter-spacing:.005em;color:var(--ink);margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2.3rem,5.2vw,4rem);font-weight:700}
h2{font-size:clamp(1.8rem,3.4vw,2.6rem)}
h3{font-size:1.4rem}
p{margin:0 0 1em;max-width:68ch}
.lead{font-size:clamp(1.1rem,1.6vw,1.3rem);line-height:1.55;color:var(--muted)}
.small{font-size:.9rem;color:var(--muted)}
.plain{list-style:none;padding:0;margin:0 0 1.2em}
.plain li{padding:.55em 0 .55em 1.3em;border-top:1px solid var(--line);position:relative;max-width:68ch}
.plain li::before{content:"";position:absolute;left:0;top:1.15em;width:.55em;height:2px;background:var(--teal)}
.plain li:last-child{border-bottom:1px solid var(--line)}
/* buttons */
.btn{display:inline-block;font:600 1rem/1 var(--f-body);padding:.95em 1.5em;border-radius:3px;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn-primary{background:var(--teal);color:#fff}
.btn-primary:hover{background:var(--teal-d);color:#fff}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{background:var(--mint);color:var(--ink)}
.btn-ghost{border-color:var(--teal);color:var(--teal-d);background:transparent}
.btn-ghost:hover{background:var(--teal);color:#fff}
.btn-ghost-dark{border-color:#4b5d66;color:#e8f0f2;background:transparent}
.btn-ghost-dark:hover{border-color:var(--mint);color:#fff}
/* header */
.site-header{background:var(--ink);position:sticky;top:0;z-index:50;border-bottom:1px solid #2a3d47}
.hdr{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:68px}
.brand img{height:50px;width:auto}
.nav ul{display:flex;align-items:center;gap:.2rem;list-style:none;margin:0;padding:0}
.nav{display:flex;align-items:center;gap:1.2rem}
.nav a:not(.btn){color:#d5e0e4;text-decoration:none;padding:.6rem .8rem;font-weight:500;font-size:.98rem;border-bottom:2px solid transparent}
.nav a:not(.btn):hover{color:#fff;border-bottom-color:var(--mint)}
.nav a[aria-current=page]:not(.btn){color:#fff;border-bottom-color:var(--mint)}
.nav-cta{margin-left:.6rem}
.nav .btn{padding:.7em 1.2em;font-size:.95rem}
.lang{display:flex;border:1px solid #3a4f5a;border-radius:3px;overflow:hidden}
.lang a{color:#b9c8ce;text-decoration:none;font:600 .8rem/1 var(--f-body);padding:.55rem .7rem}
.lang a[aria-current]{background:var(--mint);color:var(--ink)}
.nav-toggle{display:none;background:none;border:1px solid #3a4f5a;border-radius:3px;width:46px;height:42px;cursor:pointer;position:relative}
.nav-toggle i,.nav-toggle i::before,.nav-toggle i::after{position:absolute;left:11px;right:11px;height:2px;background:#e8f0f2;content:"";transition:transform .2s}
.nav-toggle i{top:19px}.nav-toggle i::before{left:0;right:0;top:-7px}.nav-toggle i::after{left:0;right:0;top:7px}
.nav-toggle[aria-expanded=true] i{background:transparent}
.nav-toggle[aria-expanded=true] i::before{transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded=true] i::after{transform:translateY(-7px) rotate(-45deg)}
@media(max-width:900px){
.nav-toggle{display:block}
.nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--ink);padding:1rem var(--gut) 1.5rem;border-bottom:1px solid #2a3d47;flex-direction:column;align-items:stretch}
.nav.open{display:flex}
.nav ul{flex-direction:column;align-items:stretch}
.nav a:not(.btn){display:block;padding:.9rem 0;border-bottom:1px solid #2a3d47}
.nav-cta{margin:.8rem 0 0}.nav .btn{display:block;text-align:center}
.lang{align-self:flex-start}}
/* hero */
.hero{background:var(--ink);color:#e8f0f2;position:relative;overflow:hidden;
background-image:radial-gradient(#ffffff1c 1px,transparent 1.4px);background-size:24px 24px}
.hero h1{color:#fff}
.hero .lead{color:#b9c8ce}
.hero-in{display:grid;grid-template-columns:1.05fr 1fr;gap:2rem;align-items:center;padding-block:clamp(2.5rem,6vw,5rem)}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
.hero-visual svg{width:100%;max-height:560px}
.hero-svg .drop{transform-box:fill-box;transform-origin:center;animation:drip 3.6s cubic-bezier(.5,0,.8,.4) .8s infinite both}
@keyframes drip{0%{transform:translateY(0) scale(.2);opacity:0}12%{transform:translateY(0) scale(1);opacity:1}70%{transform:translateY(34px) scale(1,1.25);opacity:1}82%,100%{transform:translateY(40px) scale(1.5,.4);opacity:0}}
@media(max-width:860px){.hero-in{grid-template-columns:1fr}.hero-visual{order:-1;max-width:420px}}
.titleblock{background:var(--ink2);border-top:1px solid #2f4450;color:#e8f0f2}
.tb{display:grid;grid-template-columns:repeat(4,1fr);margin:0 auto;padding-block:0}
.tb>div{padding:1.1rem 1.2rem;border-left:1px solid #2f4450}
.tb>div:first-child{border-left:0;padding-left:0}
.tb dt{font-size:.82rem;color:#8fa6af;margin:0 0 .2rem}
.tb dd{margin:0;font:600 1.35rem/1.2 var(--f-head);color:#fff}
@media(max-width:700px){.tb{grid-template-columns:1fr 1fr}.tb>div:nth-child(3){border-left:0;padding-left:0}.tb>div{border-top:1px solid #2f4450}.tb>div:nth-child(-n+2){border-top:0}}
/* sections */
.sec{padding-block:clamp(3rem,7vw,5.5rem)}
.sec-alt{background:var(--panel)}
.sec-head{margin-bottom:2.2rem;max-width:760px}
.sec-head p{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.card{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}
.card-media{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--panel);border-bottom:1px solid var(--line)}
.card-media img{width:100%;height:100%;object-fit:cover}
.card-media-iso{padding:1rem}.card-media-iso img{object-fit:contain}
.card-media-stack{padding:1rem;display:flex;align-items:center}
.card-body{padding:1.4rem 1.5rem 1.6rem;display:flex;flex-direction:column;flex:1}
.card-body h3 a{color:var(--ink);text-decoration:none}
.card-body h3 a:hover{color:var(--teal-d)}
.more{margin-top:auto;font-weight:600;color:var(--teal-d)}
@media(max-width:900px){.cards{grid-template-columns:1fr}.card-media{aspect-ratio:16/10}}
.stack{margin:0;width:100%}
.stack ol{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.stack li{display:grid;grid-template-columns:5.5rem 1fr;align-items:center;gap:.8rem;background:#fff;border:1px solid var(--line);border-left:4px solid var(--teal);padding:.55rem .8rem;line-height:1.3}
.stack li:nth-child(2){margin-left:10px}.stack li:nth-child(3){margin-left:20px}.stack li:nth-child(4){margin-left:30px}
.stack strong{font:600 1.15rem var(--f-head);color:var(--ink)}
.stack span{font-size:.88rem;color:var(--muted)}
.stack figcaption{font-size:.8rem;color:var(--muted);margin-top:.6rem}
.card-media-stack .stack figcaption{display:none}
.ph-visual .stack li{background:#ffffff10;border-color:#3a4f5a;border-left-color:var(--mint)}
.ph-visual .stack strong{color:#fff}.ph-visual .stack span,.ph-visual .stack figcaption{color:#b9c8ce}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:3px solid var(--ink)}
.steps li{padding:1.2rem 1.4rem 0 0}
.steps li+li{padding-left:1.4rem;border-left:1px solid var(--line)}
.step-n{font:700 2.4rem/1 var(--f-head);color:var(--teal)}
@media(max-width:900px){.steps{grid-template-columns:1fr 1fr}.steps li:nth-child(3){border-left:0;padding-left:0}.steps li{padding-bottom:1.4rem}}
@media(max-width:560px){.steps{grid-template-columns:1fr}.steps li+li{border-left:0;padding-left:0;border-top:1px solid var(--line)}}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem 3rem}
.facts-3{grid-template-columns:repeat(3,1fr)}.facts-4{grid-template-columns:repeat(4,1fr)}
.facts>div{border-top:2px solid var(--teal);padding-top:1rem}
.facts p{font-size:.98rem}
@media(max-width:900px){.facts,.facts-3,.facts-4{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.facts,.facts-3,.facts-4{grid-template-columns:1fr}}
.note{margin-top:2rem;padding:1rem 1.2rem;background:var(--panel);border-left:4px solid var(--teal)}
.note-inline{color:var(--muted);font-style:italic}
/* bands */
.band{padding-block:clamp(2.2rem,5vw,3.5rem);background:var(--teal-d);color:#fff}
.band h2,.band h3{color:#fff}
.band p{color:#e2f0f1}
.band-in{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.band-in h2{margin-bottom:.3em}.band-in p{margin:0}
.band-ul{background:var(--ink)}
.band-in-media{display:grid;grid-template-columns:minmax(220px,380px) 1fr;justify-content:start;gap:clamp(1.5rem,4vw,3rem)}
.band-media img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid #3a4f5a}
.band-in-media .btn{margin-top:1.2rem}
@media(max-width:700px){.band-in-media{grid-template-columns:1fr}}
.band-ul-lite{background:var(--ink)}
.band-cta{background:var(--teal-d)}
/* page head */
.page-head{background:var(--ink);color:#e8f0f2;padding-block:clamp(2rem,5vw,4rem);
background-image:radial-gradient(#ffffff1c 1px,transparent 1.4px);background-size:24px 24px}
.page-head h1{color:#fff;font-size:clamp(2.1rem,4.4vw,3.3rem)}
.page-head .lead{color:#b9c8ce}
.ph-in{display:block}
.ph-has-visual .ph-in{display:grid;grid-template-columns:1.2fr 1fr;gap:2.5rem;align-items:center}
.ph-visual img{width:100%;max-height:380px;object-fit:cover;border:1px solid #3a4f5a}
@media(max-width:860px){.ph-has-visual .ph-in{grid-template-columns:1fr}}
.crumbs{display:flex;gap:.6rem;font-size:.9rem;color:#8fa6af;margin-bottom:1.2rem}
.crumbs a{color:#b9c8ce}
/* galleries */
.gallery{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.gallery-4{margin-top:2.2rem}
.gallery li{aspect-ratio:4/3;overflow:hidden;background:var(--ink)}
.gallery a{display:block;height:100%;position:relative}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.gallery a:hover img{transform:scale(1.04)}
.gallery li:first-child:nth-last-child(n+5){grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
@media(max-width:900px){.gallery{grid-template-columns:repeat(2,1fr)}.gallery li:first-child:nth-last-child(n+5){grid-column:span 2;grid-row:auto;aspect-ratio:4/3}}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.split-wide{grid-template-columns:1.1fr 1fr}
.split-photo{grid-template-columns:1fr 1fr;align-items:center}
.split-note{background:var(--panel);padding:1.5rem;border-top:3px solid var(--teal)}
.sec-alt .split-note{background:#fff}
@media(max-width:860px){.split,.split-wide,.split-photo{grid-template-columns:1fr}}
.figure-iso,.figure-photo{margin:0}
.figure-iso svg{width:100%;max-height:520px;background:var(--panel);border:1px solid var(--line);padding:1rem}
.figure-photo img{width:100%;height:auto;border:1px solid var(--line)}
figcaption{font-size:.85rem;color:var(--muted);margin-top:.6rem}
.prose{max-width:760px}
.prose h2{font-size:1.7rem;margin-top:2em}
/* contact */
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}
.field{margin-bottom:1.2rem}
.field label{display:block;font-weight:500;margin-bottom:.35rem;font-size:.95rem}
.field input[type=text],.field input[type=email],.field textarea{width:100%;font:inherit;padding:.8rem .9rem;border:1px solid #9fb0b7;border-radius:3px;background:#fff;color:var(--text)}
.field input:focus,.field textarea:focus{outline:3px solid var(--mint);border-color:var(--teal)}
.field.is-bad input,.field.is-bad textarea{border-color:var(--red)}
.req{color:var(--red)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.check{display:flex;gap:.7rem;align-items:flex-start}
.check input{margin-top:.35rem;width:1.1rem;height:1.1rem;accent-color:var(--teal)}
.check label{font-weight:400;margin:0}
.form-status{margin:1rem 0 0;font-weight:500}
.form-status.is-ok{color:#1b6b3a}.form-status.is-err{color:var(--red)}
.contact-side address{font-style:normal;margin-bottom:1rem}
.map{margin-top:1.5rem;background:var(--panel);border:1px solid var(--line);padding:1.2rem;min-height:220px}
.map iframe{width:100%;height:320px;border:0;display:block}
.map .btn{margin-right:1rem}
/* footer */
.site-footer{background:var(--ink);color:#b9c8ce;padding-top:3rem;font-size:.95rem}
.site-footer a{color:#d5e0e4}
.ft{display:grid;grid-template-columns:1.2fr 1.2fr 1fr 1fr;gap:2rem;padding-bottom:2.2rem;border-bottom:1px solid #2f4450}
.ft h2{font:600 1.1rem var(--f-head);color:#fff;margin-bottom:.6rem}
.ft address{font-style:normal}.ft p{margin:0}
.ft ul{list-style:none;margin:0;padding:0}.ft li{padding:.15rem 0}
.ft-brand img{width:150px;filter:none;background:#fff;padding:8px 10px;border-radius:3px}
.ft-note{padding-block:1.2rem;font-size:.82rem;color:#8fa6af;margin:0;max-width:none}
@media(max-width:860px){.ft{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.ft{grid-template-columns:1fr}}
/* lightbox */
.lb{position:fixed;inset:0;background:#0a1318ee;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3.5rem 1rem 1rem}
.lb[hidden]{display:none}
.lb img{max-width:min(1200px,100%);max-height:80vh;width:auto;height:auto;object-fit:contain}
.lb-cap{color:#d5e0e4;margin:.8rem 0 0;font-size:.9rem;text-align:center}
.lb button{position:absolute;background:#ffffff18;color:#fff;border:1px solid #ffffff44;width:46px;height:46px;border-radius:3px;font-size:1.5rem;cursor:pointer}
.lb button:hover{background:#ffffff33}
.lb-x{top:.8rem;right:.8rem}.lb-p{left:.8rem;top:50%}.lb-n{right:.8rem;top:50%}
body.lb-open{overflow:hidden}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.hero-svg .drop{animation:none;opacity:1}}
.card-media{text-decoration:none;color:inherit}
.card-media-stack{aspect-ratio:auto}
.gallery li:first-child:nth-last-child(n+5){grid-column:auto;grid-row:auto;aspect-ratio:4/3}
.gallery li:first-child:nth-last-child(5){grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
@media(max-width:900px){.gallery li:first-child:nth-last-child(5){grid-column:span 2;grid-row:auto;aspect-ratio:4/3}}

/* animazione hero */
.hero-visual{cursor:pointer}
.ha .sheet{animation:ha-sheet 3.2s linear 0s both}
.ha .ide{animation:ha-ide 4.5s linear 7.9s both}
.ha .cv{transform-box:fill-box;transform-origin:right center;animation:ha-type .2s steps(14,end) var(--d) both}
.ha .ok{animation:ha-fade .3s ease 11.45s both}
@keyframes ha-type{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@keyframes ha-ide{0%{opacity:0;transform:translateY(14px)}7%{opacity:1;transform:none}90%{opacity:1}100%{opacity:0}}
.ha .sk{stroke-dasharray:1;animation:ha-draw .6s ease-in-out var(--d) both}
.ha .wire{stroke-dasharray:1;animation:ha-draw .7s ease-in-out var(--d) both}
.ha .lbl{animation:ha-fade .4s ease var(--d) both}
.ha .cab{animation:ha-fade .6s ease 2.7s both}
.ha .part{animation:ha-in .55s cubic-bezier(.2,.8,.2,1) var(--d) both}
.ha .door{transform-box:fill-box;transform-origin:left center;animation:ha-door 1s cubic-bezier(.6,0,.2,1) 12.4s both}
.ha .hmi-on{animation:ha-fade .5s ease 13.4s both}
.ha .needle{transform-box:fill-box;transform-origin:50% 100%;animation:ha-sweep 3.2s ease-in-out 13.7s infinite alternate both}
.ha .bar{transform-box:fill-box;transform-origin:50% 100%;animation:ha-bar 1.6s ease-in-out 13.7s infinite alternate both;animation-delay:calc(13.7s + var(--d))}
@keyframes ha-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes ha-fade{from{opacity:0}to{opacity:1}}
@keyframes ha-in{from{opacity:0;transform:translateY(-28px)}to{opacity:1;transform:none}}
@keyframes ha-door{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes ha-sweep{from{transform:rotate(-64deg)}to{transform:rotate(62deg)}}
@keyframes ha-bar{from{transform:scaleY(.25)}to{transform:scaleY(1)}}
@keyframes ha-sheet{0%{opacity:0;transform:translateY(10px)}8%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0;transform:scale(.97)}}
@media(prefers-reduced-motion:reduce){.ha *{animation:none!important}.ha .sheet,.ha .ide{display:none}.ha .needle{transform:rotate(24deg)}}