/* ===== Font Satoshi + Clash Display (Fontshare) ===== */
@import url('https://api.fontshare.com/v2/css?f[]=satoshi@400,500,700&f[]=clash-display@500,600,700&display=swap');

:root{
  --slate:#56646e;--slate-d:#3d4852;--slate-l:#ffffff;
  --accent:#bd1622;--accent-d:#96111a;
  --dark:#1d1d1b;--gray:#6b6b66;--bg:#ffffff;--white:#fff;
  --paper:#ffffff;--line:#e8e6e1;
  --radius:22px;--shadow:0 10px 34px rgba(29,29,27,.07);
  --shadow-lg:0 24px 60px rgba(29,29,27,.12);
  --ring:0 0 0 1px var(--line);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Satoshi',system-ui,-apple-system,Arial,sans-serif;color:var(--dark);background:var(--bg);line-height:1.6}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(1160px,92%);margin:0 auto}
.btn{display:inline-flex;align-items:center;gap:8px;padding:15px 30px;border-radius:999px;font-weight:600;cursor:pointer;border:none;transition:.25s;font-size:.85rem;font-family:inherit;position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:.09em}
.btn-primary{background:var(--accent);color:#fff!important}
.btn-primary::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg);transition:left .55s ease;pointer-events:none}
.btn-primary:hover::after{left:130%}
.btn-primary:hover{color:#fff!important;background:var(--accent-d);transform:translateY(-2px)}
.btn-ghost{background:transparent;color:var(--dark)!important;border:1.5px solid var(--dark)}
.btn-ghost:hover{background:var(--dark);color:#fff!important}
.btn-dark{background:var(--dark);color:#fff!important}
.btn-dark:hover{background:#000;transform:translateY(-2px)}
section{padding:100px 0}
.eyebrow{color:var(--gray);font-weight:600;letter-spacing:.18em;text-transform:uppercase;font-size:.75rem;margin-bottom:16px}
h1,h2,h3{font-family:'Clash Display','Satoshi',system-ui,sans-serif;line-height:1.02;font-weight:600;letter-spacing:-.02em;text-wrap:balance}
.hl{color:var(--accent);position:relative;white-space:nowrap}
.hl::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.09em;background:currentColor;opacity:.45;border-radius:2px}
h2{font-size:clamp(2.2rem,4vw,3.2rem);margin-bottom:18px}
.lead{color:var(--gray);font-size:1.08rem;line-height:1.65}
.center{text-align:center}
.section-head{max-width:680px;margin:0 auto 60px}
/* Titolo lungo su 2 righe: contenitore più largo + font leggermente ridotto */
.section-head.wide{max-width:1100px}
.section-head.wide h2{font-size:clamp(1.7rem,2.9vw,2.55rem)}

/* ===== Logo ===== */
.logo{display:flex;align-items:center;gap:11px;font-weight:700;font-size:1.3rem;color:var(--dark);letter-spacing:-.5px}
.logo img{height:38px;width:auto;display:block}
.logo .mark{width:40px;height:40px;flex:none;display:block}
.logo b{font-weight:700}
.logo span{font-weight:500;color:var(--slate)}
footer .logo img{filter:brightness(0) invert(1)}

/* ===== Header ===== */
header{position:sticky;top:0;z-index:50;background:rgba(244,242,238,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);transition:box-shadow .3s}
header.scrolled{box-shadow:0 6px 24px rgba(29,29,27,.07)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 0}
.nav-links{display:flex;gap:32px;align-items:center}
.nav-links a{font-weight:600;color:var(--dark);position:relative;padding:4px 0;font-size:.83rem;text-transform:uppercase;letter-spacing:.08em}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--accent);transition:width .3s}
.nav-links a:hover,.nav-links a.active{color:var(--accent)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-links .btn::after{display:none}
.menu-btn{display:none;background:none;border:none;font-size:1.6rem;cursor:pointer;color:var(--dark)}

/* ===== Selettore lingua ===== */
.lang-switch{position:relative}
.lang-current{background:none;border:1px solid var(--line);border-radius:999px;padding:6px 12px;font:inherit;font-size:.78rem;font-weight:700;letter-spacing:.06em;color:var(--dark);cursor:pointer;text-transform:uppercase}
.lang-current:hover{border-color:var(--dark)}
.lang-menu{position:absolute;right:0;top:calc(100% + 10px);background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 34px rgba(29,29,27,.12);padding:6px;min-width:160px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.22s;z-index:60}
.lang-switch:hover .lang-menu,.lang-switch:focus-within .lang-menu{opacity:1;visibility:visible;transform:translateY(0)}
.lang-menu a{display:block;padding:9px 14px;border-radius:9px;font-size:.9rem;font-weight:600;color:var(--dark);text-transform:none;letter-spacing:0}
.lang-menu a::after{display:none}
.lang-menu a:hover{background:var(--paper)}
.lang-menu a.active{color:var(--accent)}
.foot-langs{display:flex;flex-direction:column;gap:8px}
.foot-langs a.active{color:#fff;font-weight:700}

/* ===== Hero (chiaro, tipografia gigante, pixel-art di fondo) ===== */
.hero{background:var(--paper);color:var(--dark);position:relative;overflow:hidden;padding:90px 0 110px}
.hero-mosaic{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:center;position:relative;z-index:2}
.hero h1{font-size:clamp(2.9rem,6vw,4.8rem);margin-bottom:24px;letter-spacing:-.04em}
.hero p{font-size:1.15rem;color:var(--gray);margin-bottom:34px;max-width:520px}
.hero .eyebrow{color:var(--accent)!important}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.hero-stats{display:flex;gap:40px;margin-top:52px}
.hero-stats b{display:block;font-size:2rem;letter-spacing:-.03em}
.hero-stats span{color:var(--gray);font-size:.85rem;text-transform:uppercase;letter-spacing:.06em}
.hero-art{border-radius:24px}
.hero-draw{width:100%;max-width:520px;height:auto;display:block;margin:0 auto}
.hd-rays{animation:hdSpin 26s linear infinite;transform-origin:62px 58px}
.hd-blades{animation:hdSpin 6s linear infinite;transform-origin:368px 120px}
.hd-blades2{animation:hdSpin 4.2s linear infinite reverse;transform-origin:428px 196px}
.hd-flow{animation:hdFlow 1.1s linear infinite}
.hd-flow2{animation:hdFlow 1.4s linear infinite}
.hd-bolt{animation:hdPulse 2.4s ease-in-out infinite}
.hd-wheel{animation:hdSpin 8s linear infinite;transform-origin:562px 348px}
.hd-gear{animation:hdSpin 5s linear infinite;transform-origin:495px 326px}
.hd-stream{animation:hdFlow .8s linear infinite}
.hd-water{animation:hdWater .7s linear infinite}
.hd-wave{animation:hdBob 3s ease-in-out infinite}
.hd-glint{animation:hdGlint 3.5s linear infinite}
.hd-cloud{animation:hdDrift 14s ease-in-out infinite}
.hd-cl2{animation-duration:19s;animation-delay:-6s}
.hd-birds{animation:hdBob 4s ease-in-out infinite}
.hd-flame{animation:hdFlame 1.2s ease-in-out infinite;transform-origin:473px 372px}
.hd-steam{opacity:0;animation:hdSteam 3s ease-out infinite}
.hd-s2{animation-delay:1s}
.hd-s3{animation-delay:2s}
.hd-c1{animation:hdCharge 2.1s ease-in-out infinite}
.hd-c2{animation:hdCharge 2.1s ease-in-out infinite .35s}
.hd-c3{animation:hdCharge 2.1s ease-in-out infinite .7s}
@keyframes hdSpin{to{transform:rotate(360deg)}}
@keyframes hdFlow{to{stroke-dashoffset:-22}}
@keyframes hdWater{to{stroke-dashoffset:-24}}
@keyframes hdGlint{to{stroke-dashoffset:-136}}
@keyframes hdPulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes hdSteam{0%{transform:translateY(0);opacity:0}25%{opacity:.8}100%{transform:translateY(-38px);opacity:0}}
@keyframes hdCharge{0%,100%{opacity:.15}50%{opacity:1}}
@keyframes hdDrift{0%,100%{transform:translateX(0)}50%{transform:translateX(26px)}}
@keyframes hdBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes hdFlame{0%,100%{transform:scale(1)}50%{transform:scale(1.25) translateY(-2px)}}

/* Page hero (interne): chiaro, coerente con la home */
.page-hero{background:var(--paper)!important;background-image:none!important;color:var(--dark);padding:90px 0 80px;text-align:center;position:relative;overflow:hidden}
.page-hero .container{position:relative;z-index:2}
.page-hero h1{font-size:clamp(2.6rem,5vw,4rem);margin-bottom:16px;letter-spacing:-.04em}
.page-hero p{color:var(--gray);max-width:620px;margin:0 auto;font-size:1.12rem}
.page-hero .eyebrow{color:var(--accent)!important}
.breadcrumb{opacity:.7;font-size:.9rem;margin-top:14px}
.breadcrumb a:hover{color:#fff}

/* Trust */
.trust{background:#fff;padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust .container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;align-items:center;color:var(--dark);font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.06em}
.trust .container>span{display:inline-flex;align-items:center;gap:9px}
.trust svg{stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none;width:21px;height:21px}

/* Cards */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
/* Business unit: 5 card su un'unica riga */
.grid-5{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.grid-5 .card{padding:28px 18px;text-align:center;display:flex;flex-direction:column;align-items:center}
.grid-5 .card .icon{margin-left:auto;margin-right:auto}
.grid-5 .card h3{font-size:1.05rem}
.grid-5 .card p{font-size:.82rem;letter-spacing:.04em}
.card{position:relative;overflow:hidden;isolation:isolate;background:#fff;border-radius:var(--radius);padding:36px 30px;box-shadow:none;border:1px solid var(--line);transition:.3s cubic-bezier(.2,.7,.2,1)}
.card:hover{transform:translateY(-5px);border-color:var(--dark);box-shadow:var(--shadow)}
/* Sfondo fotografico della card: compare al passaggio, ricolorato scuro dal filtro */
.card .card-bg{position:absolute;inset:0;z-index:-1;background-size:cover;background-position:center;opacity:var(--bg-o0,0);transition:opacity .4s cubic-bezier(.2,.7,.2,1)}
.card .card-bg::after{content:"";position:absolute;inset:0;background:var(--bg-flt,#1d1d1b);opacity:.58}
.card.has-bg:hover .card-bg{opacity:var(--bg-o1,1)}
.card.has-bg:hover{border-color:transparent}
.card.has-bg:hover h3,.card.has-bg:hover p{color:#fff}
.card.has-bg:hover .icon{color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4)}
.card.has-bg:hover .icon svg .a{stroke:#fff}
.card.has-bg:hover .icon svg .af{fill:#fff}
.card.has-bg:hover .icon-img img{filter:brightness(0) invert(1)}
/* Logo "colori originali": pastiglia chiara così i loghi con sfondo bianco restano leggibili */
.icon-img.keep{background:#fff;padding:8px;border-radius:14px}
.card.has-bg:hover .icon-img.keep{background:#fff;border-color:transparent;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.card.has-bg:hover .icon-img.keep img{filter:none}
/* ===== Sistema icone: stroke 2px arrotondato, duotone ardesia + accento rosso ===== */
.icon{width:58px;height:58px;border-radius:16px;background:var(--paper);border:1px solid var(--line);box-shadow:none;display:flex;align-items:center;justify-content:center;margin-bottom:20px;color:var(--dark)}
.icon svg{stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}
.icon svg .a{stroke:var(--accent)}
.icon svg .af{fill:var(--accent);stroke:none}
.icon-img{background:transparent;border:none;overflow:hidden}
.icon-img img{max-width:100%;max-height:100%;object-fit:contain;transition:filter .3s}
.icon-sm{width:46px;height:46px;border-radius:13px}
.icon-sm svg{width:22px;height:22px}
.card h3{font-size:1.2rem;margin-bottom:10px}
.card p{color:var(--gray);font-size:.97rem}

/* Steps */
.steps{background:#fff}
.step{background:#fff;border-radius:var(--radius);padding:32px 26px;position:relative;border:1px solid var(--line)}
.step .num{width:42px;height:42px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.step h3{font-size:1.1rem;margin-bottom:8px}
.step p{color:var(--gray);font-size:.93rem}

/* Split / lists */
.split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.check-list{list-style:none;margin-top:22px}
.check-list li{display:flex;gap:12px;margin-bottom:18px;color:var(--dark);font-weight:500}
.check-list svg{flex:none;margin-top:2px}
.check-list .li-txt{flex:1;min-width:0}
.check-list .li-head{display:block;font-weight:700;line-height:1.3;margin-bottom:4px}
.check-list .li-body{display:block;font-weight:400;color:var(--gray)}
.art-panel{border-radius:24px;min-height:360px;overflow:hidden;box-shadow:var(--shadow)}
.art-panel img{width:100%;height:100%;min-height:360px;object-fit:cover}

/* Blocco "Impianti e tecnologie" (split con rowArt): elenco a sinistra, striscia
   illustrata a destra divisa in pannelli, ognuno alla stessa altezza della sua voce */
.split-rows .sr-head{max-width:680px;margin-bottom:30px}
.sr-row{display:grid;grid-template-columns:1fr 340px;gap:0 56px;align-items:stretch}
.sr-row .check-list{margin-top:0}
.sr-row .check-list li{margin-bottom:0;padding:28px 0}
.sr-row+.sr-row .check-list li{border-top:1px solid var(--line)}
.sr-art{background:var(--paper);border:1px solid var(--line);border-top:none;display:flex;align-items:center;justify-content:center;padding:12px 20px;overflow:hidden}
.sr-row:first-of-type .sr-art{border-top:1px solid var(--line);border-radius:24px 24px 0 0}
.sr-row:last-of-type .sr-art{border-radius:0 0 24px 24px}
.sr-art svg{width:100%;max-width:300px;height:auto}

/* Blocchi brand (pagina Gruppo): titolo, sottotitolo e icone nel colore del brand */
.split-brand .eyebrow{color:var(--brand)}
.split-brand h2{color:var(--brand)}
.split-brand .lead{color:var(--brand2);font-weight:600}
.split-brand .check-list svg circle{fill:color-mix(in srgb,var(--brand) 13%,#fff)}
.split-brand .check-list svg path{stroke:var(--brand)}
.split-brand .check-list .li-head{color:var(--brand)}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.gallery figure{position:relative;border-radius:24px;overflow:hidden;height:220px;margin:0;box-shadow:var(--shadow)}
.gallery img{width:100%;height:100%;object-fit:cover;transition:.4s}
.gallery figure:hover img{transform:scale(1.08)}
.gallery figcaption{position:absolute;left:0;bottom:0;right:0;padding:14px;color:#fff;font-weight:600;background:linear-gradient(transparent,rgba(43,51,58,.85))}

/* Team */
.team-card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow),var(--ring);transition:.3s}
.team-card:hover{transform:translateY(-6px)}
.team-card img{width:100%;height:260px;object-fit:cover}
.team-card .body{padding:22px 24px}
.team-card h3{font-size:1.15rem;margin-bottom:2px}
.team-card .role{color:var(--accent);font-weight:600;font-size:.9rem;margin-bottom:8px}
.team-card p{color:var(--gray);font-size:.92rem}

/* Stats band */
.stats-band{background:var(--dark);color:#fff}
.stats-band .grid-4{gap:20px}
.stat{text-align:center}
.stat b{display:block;font-size:2.4rem;color:#fff}
.stat span{opacity:.75}

/* CTA band */
.cta-band{background:linear-gradient(135deg,var(--dark),var(--slate-d));color:#fff;border-radius:26px;padding:56px;display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;position:relative;overflow:hidden}
.cta-band:before{content:"";position:absolute;right:-80px;top:-80px;width:300px;height:300px;background:radial-gradient(circle,rgba(189,22,34,.35),transparent 70%);border-radius:50%}
.cta-band>*{position:relative}
.cta-band h2{margin-bottom:8px}
.cta-band p{opacity:.8}

/* Forms */
form{display:grid;gap:16px;background:#fff;padding:34px;border-radius:var(--radius);box-shadow:var(--shadow)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
input,select,textarea{padding:13px 15px;border:1px solid #d8dee2;border-radius:10px;font-size:1rem;font-family:inherit;background:#fbfcfd}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}
.contact-info li{list-style:none;display:flex;gap:14px;margin-bottom:22px;align-items:flex-start}
.contact-info .icon{margin:0;width:48px;height:48px}
.contact-info b{display:block}
.contact-info span{color:var(--gray)}

/* Footer */
footer{background:#20272d;color:#b9c2c9;padding:60px 0 26px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:36px;margin-bottom:40px}
footer .logo{color:#fff;margin-bottom:14px}
footer .logo span{color:#b9c2c9}
footer h4{color:#fff;margin-bottom:16px;font-size:1rem}
footer a{color:#b9c2c9;display:block;margin-bottom:9px;font-size:.95rem}
footer a:hover{color:#fff}
.foot-bottom{border-top:1px solid #333c43;padding-top:22px;text-align:center;font-size:.88rem;color:#8b969e}

/* ===== Animazioni al caricamento (scroll reveal, stile "costruzione") ===== */
.reveal{opacity:0;transform:translateY(34px) scale(.97);filter:blur(4px);transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1),filter .75s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none;filter:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}
.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}

/* ===== Titoli a parole (split-text reveal) ===== */
.split-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.split-w>span{display:inline-block;transform:translateY(115%);transition:transform .75s cubic-bezier(.2,.7,.2,1)}
.split-go .split-w>span,.section-head.in h2 .split-w>span{transform:none}

/* ===== Image trail (scia di immagini al passaggio del mouse) ===== */
.trail-zone{position:relative;overflow:hidden;padding:120px 0;cursor:crosshair}
.trail-zone .container{position:relative;z-index:2;pointer-events:none}
.trail-title{font-size:2.6rem}
.trail-img{position:absolute;z-index:1;width:190px;height:240px;object-fit:cover;border-radius:24px;transform:translate(-50%,-50%) scale(.3) rotate(var(--rot,0deg));opacity:0;pointer-events:none;box-shadow:0 18px 46px rgba(43,51,58,.28);transition:transform .45s cubic-bezier(.2,.9,.3,1.2),opacity .35s ease}
.trail-img.show{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(var(--rot,0deg))}
.trail-img.hide{opacity:0;transform:translate(-50%,-55%) scale(.85) rotate(var(--rot,0deg))}

/* ===== Form a step (stile incredibles.dev) ===== */
.step-form{background:#fff;border-radius:26px;padding:40px 38px;box-shadow:none;border:1px solid var(--line);display:grid;gap:0}
.sf-step{padding:22px 0}
.sf-step+.sf-step{border-top:1px solid var(--line)}
.sf-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.sf-index{font-size:.8rem;font-weight:600;color:var(--gray)}
.sf-line{flex:1;height:1px;background:var(--line)}
.sf-name{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--dark)}
.sf-fields{display:grid;gap:0}
.step-form input,.step-form select,.step-form textarea{border:none;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:16px 2px;font-size:1.25rem;font-weight:500;color:var(--dark);font-family:inherit;letter-spacing:-.01em}
.step-form input::placeholder,.step-form textarea::placeholder{color:#b5b2aa}
.step-form select:invalid{color:#b5b2aa}
.step-form input:focus,.step-form select:focus,.step-form textarea:focus{outline:none;border-bottom-color:var(--dark)}
.step-form .sf-fields> :last-child{border-bottom:none}
.step-form textarea{resize:vertical}
.step-form .btn{justify-self:start;margin-top:14px}
.step-form .btn:disabled{opacity:.6;cursor:progress;transform:none}
.sf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Hero entrance */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.hero .container>div>*{animation:fadeUp .8s both}
.hero .container>div>*:nth-child(2){animation-delay:.12s}
.hero .container>div>*:nth-child(3){animation-delay:.24s}
.hero .container>div>*:nth-child(4){animation-delay:.36s}
.hero-art{animation:fadeUp 1s .3s both}

/* ===== Transizione di pagina ===== */
/* Sipario statico mostrato dal primo paint quando si arriva da una navigazione
   interna (classe impostata dallo script inline nell'head): evita il flash.
   Lo mettiamo su <html> perché dipinge prima di <body>: nessun bianco. */
html.pt-incoming{background:linear-gradient(135deg,#bd1622,#96111a)}
html.pt-incoming body{animation:none !important;background:transparent}
html.pt-incoming::before{content:'';position:fixed;inset:0;background:linear-gradient(135deg,#bd1622,#96111a);z-index:9998}
#page-transition{position:fixed;inset:0;z-index:9999;pointer-events:none;display:flex;align-items:center;justify-content:center}
.pt-slats{position:absolute;inset:0;display:flex}
.pt-slats i{flex:1;background:linear-gradient(180deg,var(--accent),var(--accent-d));transform:scaleY(0)}
#page-transition.pt-cover .pt-slats i{transform:scaleY(1)}
#page-transition.pt-anim-in .pt-slats i{animation:ptIn .55s both cubic-bezier(.7,0,.3,1)}
#page-transition.pt-anim-in .pt-slats i:nth-child(2){animation-delay:.07s}
#page-transition.pt-anim-in .pt-slats i:nth-child(3){animation-delay:.14s}
#page-transition.pt-anim-in .pt-slats i:nth-child(4){animation-delay:.21s}
#page-transition.pt-anim-in .pt-slats i:nth-child(5){animation-delay:.28s}
#page-transition.pt-anim-out .pt-slats i{animation:ptOut .55s .12s both cubic-bezier(.7,0,.3,1)}
#page-transition.pt-anim-out .pt-slats i:nth-child(2){animation-delay:.19s}
#page-transition.pt-anim-out .pt-slats i:nth-child(3){animation-delay:.26s}
#page-transition.pt-anim-out .pt-slats i:nth-child(4){animation-delay:.33s}
#page-transition.pt-anim-out .pt-slats i:nth-child(5){animation-delay:.4s}
.pt-loader{opacity:0;transition:opacity .2s;position:relative;z-index:2}
.pt-loader svg{width:auto;height:96px;animation:ptPulse 1s ease-in-out infinite}
#page-transition.pt-anim-in .pt-loader{opacity:1;transition-delay:.45s}
#page-transition.pt-cover .pt-loader{opacity:1}
@keyframes ptPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.75}}
@keyframes ptIn{from{transform:scaleY(0);transform-origin:bottom}to{transform:scaleY(1);transform-origin:bottom}}
@keyframes ptOut{from{transform:scaleY(1);transform-origin:top}to{transform:scaleY(0);transform-origin:top}}
body{animation:pageFade .6s ease both}
@keyframes pageFade{from{opacity:0}to{opacity:1}}

@media(max-width:900px){
  .hero-grid,.split{grid-template-columns:1fr}
  .hero{padding:56px 0 70px}
  .hero-mosaic{opacity:.25}
  .hero p{font-size:1.05rem}
  .hero-stats{flex-wrap:wrap;gap:22px 34px;margin-top:36px}
  .hero-art{max-width:380px;margin:10px auto 0}
  .grid-2,.grid-3,.grid-4,.gallery{grid-template-columns:1fr 1fr}
  .grid-5{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;padding:20px 6%;gap:16px;box-shadow:0 12px 24px rgba(0,0,0,.08)}
  .nav-links.open{display:flex}
  .menu-btn{display:block}
  .hero h1{font-size:2.4rem;letter-spacing:-.02em}
  h2{font-size:1.8rem}
  .section-head.wide h2{font-size:1.5rem}
  /* Impianti e tecnologie: pannello sotto la voce corrispondente, stesso ordine */
  .sr-row{grid-template-columns:1fr;gap:0}
  .sr-art{border-radius:18px!important;border-top:1px solid var(--line);margin:4px 0 26px;min-height:140px;padding:10px 16px}
  .sr-art svg{max-width:250px}
  .sr-row .check-list li{padding:18px 0 14px}
  .sr-row+.sr-row .check-list li{border-top:none}
  .trail-img{width:130px;height:165px;border-radius:16px}
  .trail-title{font-size:2rem}
}
@media(max-width:560px){
  .grid-2,.grid-3,.grid-4,.grid-5,.gallery,.form-row,.foot-grid,.trust .container{grid-template-columns:1fr}
  .cta-band{padding:36px 26px}
  section{padding:64px 0}
}

/* ===== Area riservata (pulsante nell'header) ===== */
.nav-links a.nav-reserved{padding:10px 18px;font-size:.74rem;gap:7px;color:#fff}
.nav-links a.nav-reserved:hover{color:#fff}
/* Tra 901 e 1180px sei voci, pulsante e lingua devono stare in una riga accanto al logo */
@media(max-width:1180px) and (min-width:901px){.nav-links{gap:20px}}
@media(max-width:1060px) and (min-width:901px){.nav-links{gap:14px}.nav-links a{font-size:.74rem;letter-spacing:.05em}.nav-links a.nav-reserved{padding:9px 14px}}

/* ===== Link legali e "Gestisci cookie" nel footer ===== */
.foot-legal{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px;margin-bottom:12px}
footer .foot-legal a{display:inline;margin:0;font-size:.88rem;color:#b9c2c9}
footer .foot-legal a:hover{color:#fff}

/* ===== Documenti legali (blocco "legal", includes/legal/) =====
   Le tabelle hanno fino a tre colonne di testo lungo: su telefono scorrono in
   orizzontale nel loro riquadro invece di schiacciarsi. */
section.legal-section{padding:10px 0 90px}
.legal-document,.legal-notice{max-width:860px;margin-left:auto;margin-right:auto}
.legal-document{font-size:1.02rem;line-height:1.7;color:#313131}
.legal-document h2{font-size:clamp(1.6rem,3vw,2.1rem);margin:0 0 20px;color:var(--dark)}
.legal-document h3{font-size:1.25rem;margin:38px 0 12px;color:var(--dark);line-height:1.2}
.legal-document h4{font-family:'Satoshi',system-ui,sans-serif;font-size:1.05rem;margin:24px 0 8px}
.legal-document p{margin:0 0 14px}
.legal-document ul,.legal-document ol{margin:0 0 16px;padding-left:1.4rem}
.legal-document ul>li{list-style:disc;margin-bottom:6px}
.legal-document ol[type="a"]>li{list-style:lower-alpha;margin-bottom:12px}
.legal-document a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.legal-document .legal-table{overflow-x:auto;margin:22px 0 28px}
.legal-document table{min-width:36rem;width:100%;border-collapse:collapse}
.legal-document th,.legal-document td{padding:12px 16px 12px 0;text-align:left;vertical-align:top;font-size:.97rem;line-height:1.6}
.legal-document th{font-weight:700;border-bottom:2px solid #ddd}
.legal-document td{border-bottom:1px solid #eee}
.legal-notice{margin-bottom:30px;padding:14px 18px;border-left:4px solid var(--accent);background:rgba(0,0,0,.04);font-size:.97rem;line-height:1.6;color:#313131}
.legal-notice a{text-decoration:underline}

/* ===== Banner e preferenze cookie (assets/consent.js, ripreso dal sito Plank) =====
   Il banner sta sopra l'header (50) e sotto il sipario della navigazione (9998).
   Rifiuta e Accetta hanno lo stesso stile: nessuna scelta deve sembrare quella giusta. */
.cookie-banner{position:fixed;right:1rem;bottom:1rem;left:1rem;z-index:4000;max-width:46rem;margin:0 auto;padding:1.5rem 1.5rem 1.25rem;border-radius:1rem;background:#fff;box-shadow:0 .5rem 2.5rem rgba(0,0,0,.22);color:#313131;font-size:.9375rem;line-height:1.6}
.cookie-banner__title,.cookie-dialog__title,.cookie-category__title{margin:0;color:#111;font-family:'Satoshi',system-ui,sans-serif;font-weight:700;letter-spacing:0;line-height:1.3;text-transform:none}
.cookie-banner__title{margin-right:2.5rem;margin-bottom:.5rem;font-size:1.125rem}
.cookie-banner__text{margin:0 0 1rem}
.cookie-banner a,.cookie-dialog a{color:inherit;text-decoration:underline}
.cookie-banner__actions,.cookie-dialog__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.75rem}
.cookie-btn{min-height:2.75rem;padding:.625rem 1.5rem;border:2px solid var(--accent);border-radius:999px;background:var(--accent);color:#fff;font:inherit;font-weight:700;line-height:1.2;letter-spacing:0;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}
.cookie-btn:hover{border-color:var(--accent-d);background:var(--accent-d)}
.cookie-btn--secondary{border-color:#313131;background:transparent;color:#313131}
.cookie-btn--secondary:hover{border-color:#111;background:rgba(0,0,0,.06);color:#111}
.cookie-banner__close,.cookie-dialog__close{display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;padding:0;border:0;border-radius:50%;background:none;color:#313131;font-size:1.75rem;line-height:1;cursor:pointer}
.cookie-banner__close{position:absolute;top:.5rem;right:.5rem}
.cookie-banner__close:hover,.cookie-dialog__close:hover{background:rgba(0,0,0,.06)}
.cookie-dialog{width:calc(100% - 2rem);max-width:40rem;max-height:calc(100% - 2rem);margin:auto;padding:1.5rem;border:0;border-radius:1rem;background:#fff;box-shadow:0 .5rem 2.5rem rgba(0,0,0,.3);color:#313131;font-size:.9375rem;line-height:1.6;overflow-y:auto}
.cookie-dialog::backdrop{background:rgba(0,0,0,.55)}
.cookie-dialog__head,.cookie-category__head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.cookie-dialog__head{margin:-.5rem -.5rem .5rem 0}
.cookie-dialog__title{font-size:1.375rem}
.cookie-dialog__intro{margin:0 0 1rem}
.cookie-category{padding:1rem 0;border-top:1px solid #e6e6e6}
.cookie-category__head{margin-bottom:.5rem}
.cookie-category__title{font-size:1rem}
.cookie-category p{margin:0 0 .5rem}
.cookie-category p:last-child{margin-bottom:0}
.cookie-category__always{color:#1b6e36;font-size:.875rem;font-weight:700;white-space:nowrap}
.cookie-category__meta{color:#555;font-size:.875rem}
.cookie-dialog__actions{padding-top:1rem;border-top:1px solid #e6e6e6}
/* Interruttore: la checkbox resta, trasparente, sopra la traccia disegnata. */
.cookie-switch{position:relative;flex-shrink:0;width:3rem;height:1.75rem;margin:0}
.cookie-switch input{position:absolute;z-index:1;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.cookie-switch__track{position:absolute;inset:0;border-radius:999px;background:#767676;transition:background-color .2s}
.cookie-switch__track::after{content:"";position:absolute;top:.1875rem;left:.1875rem;width:1.375rem;height:1.375rem;border-radius:50%;background:#fff;transition:transform .2s}
.cookie-switch input:checked+.cookie-switch__track{background:var(--accent)}
.cookie-switch input:checked+.cookie-switch__track::after{transform:translateX(1.25rem)}
.cookie-switch input:focus-visible+.cookie-switch__track{outline:3px solid var(--accent);outline-offset:2px}
.cookie-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cookie-btn:focus-visible,.cookie-banner__close:focus-visible,.cookie-dialog__close:focus-visible,.cookie-fab:focus-visible{outline:3px solid var(--dark);outline-offset:2px}
/* Pulsante fisso per riaprire le preferenze, in basso a sinistra. */
.cookie-fab{position:fixed;bottom:1.5rem;left:1.5rem;z-index:3500;display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;padding:0;border:1px solid rgba(0,0,0,.08);border-radius:50%;background:#fff;box-shadow:0 .25rem 1rem rgba(0,0,0,.18);color:#313131;cursor:pointer;transition:color .2s,box-shadow .2s}
.cookie-fab:hover{color:var(--accent);box-shadow:0 .25rem 1.25rem rgba(0,0,0,.28)}
.cookie-fab svg{display:block}
/* "Gestisci cookie" nel footer: visibile solo se consent.js è attivo. */
.cookie-settings-link{display:none;padding:0;border:0;background:none;color:#b9c2c9;font:inherit;font-size:.88rem;cursor:pointer}
.cookie-settings-link:hover{color:#fff}
html.has-cookie-consent .cookie-settings-link{display:inline}
@media(max-width:575px){
  .cookie-fab{bottom:1rem;left:1rem;width:2.75rem;height:2.75rem}
  .cookie-banner{right:.5rem;bottom:.5rem;left:.5rem;padding:1.25rem 1rem 1rem;font-size:.875rem}
  /* Rifiuta e Accetta affiancati a metà larghezza, Personalizza sotto: nessuno dei due più grande dell'altro. */
  .cookie-btn{flex:1 1 calc(50% - .375rem);padding-right:.75rem;padding-left:.75rem}
  .cookie-btn--secondary{flex-basis:100%;order:1}
  .cookie-dialog{padding:1.25rem 1rem}
}
@media print{.cookie-banner,.cookie-fab{display:none}}