/*
Theme Name: Mercati & Soluzioni
Theme URI: https://www.mercatiesoluzioni.eu/
Author: Superest
Author URI: https://www.superest.it/
Description: Tema su misura per Mercati & Soluzioni: consulenza, gestione lavori condominiali, efficientamento energetico, fotovoltaico e assicurazioni. Pagine costruite con i blocchi nativi, sezioni pronte da inserire, modulo contatti integrato e recapiti modificabili dalla Personalizzazione.
Version: 1.10.0
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mercati-soluzioni
Tags: business, one-column, custom-logo, custom-menu, translation-ready, block-styles, block-patterns, editor-style
*/

/*
Carattere del sito ospitato qui dentro (Inter, licenza SIL Open Font 1.1):
senza, ogni visita passerebbe dai server di Google e l'indirizzo IP di chi
naviga finirebbe fuori dall'Unione Europea.
*/
@font-face{
  font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('assets/fonts/inter-latin-ext-400.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('assets/fonts/inter-latin-ext-500.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('assets/fonts/inter-latin-ext-600.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('assets/fonts/inter-latin-ext-700.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;
  src:url('assets/fonts/inter-latin-ext-800.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('assets/fonts/inter-latin-400.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('assets/fonts/inter-latin-500.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('assets/fonts/inter-latin-600.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('assets/fonts/inter-latin-700.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;
  src:url('assets/fonts/inter-latin-800.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}


/*
Mercati & Soluzioni
Foglio di stile principale. Palette da "Codici colori.pdf".
*/

:root{
  /* Colori brand */
  --blu-notte:#0A1128;
  --blu-scuro:#0F1B3D;
  --blu-primario:#2563EB;
  --blu-chiaro:#38BDF8;
  --viola:#8B5CF6;
  --magenta:#EC4899;
  --bianco:#FFFFFF;
  --grigio-chiaro:#A1A1AA;
  --grigio-scuro:#1F2937;

  /* Derivati */
  --card:rgba(15,27,61,.72);
  --card-solid:#0F1B3D;
  --bordo:rgba(148,163,184,.16);
  --bordo-hover:rgba(56,189,248,.45);
  --testo:#E8ECF6;
  --testo-soft:var(--grigio-chiaro);

  --grad:linear-gradient(90deg,#2563EB 0%,#8B5CF6 55%,#EC4899 100%);
  --grad-diag:linear-gradient(135deg,#2563EB 0%,#8B5CF6 55%,#EC4899 100%);
  --grad-testo:linear-gradient(90deg,#38BDF8 0%,#6D8CF7 45%,#8B5CF6 100%);

  --r-sm:10px; --r-md:14px; --r-lg:20px; --r-xl:28px;
  --wrap:1200px;
  --gutter:clamp(20px,5vw,48px);
  --sez:clamp(72px,9vw,124px);

  --t:.45s cubic-bezier(.22,.61,.36,1);
  --shadow:0 24px 60px -28px rgba(0,0,0,.85);
  --glow:0 0 0 1px rgba(56,189,248,.25),0 18px 50px -20px rgba(37,99,235,.55);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{
  margin:0;
  background:var(--blu-notte);
  color:var(--testo);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;line-height:1.13;letter-spacing:-.022em;font-weight:700;color:#fff}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
::selection{background:rgba(139,92,246,.4);color:#fff}

/*
Sfondo. Tre masse di luce sfocate che derivano lentamente, più un velo di
rumore: senza quello i gradienti larghi su fondo scuro mostrano le bande e
sembrano spezzarsi in linee nette.
*/
.sfondo{
  position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none;
  background:var(--blu-notte);
}
.sfondo span{
  position:absolute;display:block;will-change:transform;
  background-repeat:no-repeat;
}
/* Niente filter:blur: su Safari, con superfici così grandi, la sfocatura viene
   disegnata a riquadri e lascia intravedere le giunture. Gli stessi aloni si
   ottengono con gradienti radiali, che vengono resi in un pezzo solo. */
.sfondo span:nth-child(1){
  width:104vw;height:104vw;top:-44vw;right:-26vw;
  background-image:radial-gradient(closest-side circle,
    rgba(37,99,235,.40),rgba(37,99,235,.30) 32%,rgba(37,99,235,.17) 54%,
    rgba(37,99,235,.07) 72%,rgba(37,99,235,0) 88%);
  animation:deriva-a 52s ease-in-out infinite alternate;
}
.sfondo span:nth-child(2){
  width:88vw;height:88vw;top:6vh;left:-34vw;
  background-image:radial-gradient(closest-side circle,
    rgba(139,92,246,.26),rgba(139,92,246,.18) 34%,rgba(139,92,246,.09) 58%,
    rgba(139,92,246,.03) 76%,rgba(139,92,246,0) 90%);
  animation:deriva-b 64s ease-in-out infinite alternate;
}
.sfondo span:nth-child(3){
  width:96vw;height:96vw;bottom:-46vw;left:22vw;
  background-image:radial-gradient(closest-side circle,
    rgba(236,72,153,.20),rgba(236,72,153,.13) 34%,rgba(236,72,153,.06) 58%,
    rgba(236,72,153,.02) 76%,rgba(236,72,153,0) 90%);
  animation:deriva-c 58s ease-in-out infinite alternate;
}
.sfondo::after{
  content:'';position:absolute;inset:-40%;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='r'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23r)'/%3E%3C/svg%3E");
}
@keyframes deriva-a{to{transform:translate3d(-7vw,6vh,0) scale(1.12)}}
@keyframes deriva-b{to{transform:translate3d(9vw,-5vh,0) scale(1.18)}}
@keyframes deriva-c{to{transform:translate3d(-6vw,-7vh,0) scale(1.1)}}
@media (max-width:920px){
  .sfondo span{animation:none}
}

/* Layout */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.sez{padding-block:var(--sez);position:relative}
.sez--bordo{border-top:1px solid var(--bordo)}

/* Tipografia */
.kicker{
  display:inline-block;font-size:.75rem;font-weight:600;letter-spacing:.19em;
  text-transform:uppercase;color:var(--blu-chiaro);margin-bottom:16px;
}
.kicker--grad{
  background:var(--grad-testo);-webkit-background-clip:text;background-clip:text;color:transparent;
}
h1,.h1{font-size:clamp(2.35rem,5.4vw,4rem)}
h2,.h2{font-size:clamp(1.85rem,3.7vw,2.85rem)}
h3,.h3{font-size:clamp(1.12rem,1.7vw,1.35rem)}
.grad{
  background:var(--grad-testo);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.lead{font-size:clamp(1rem,1.25vw,1.1rem);color:var(--testo-soft);max-width:62ch}
.muted{color:var(--testo-soft)}
.sez-head{max-width:760px;margin-bottom:clamp(38px,4.4vw,60px)}
.sez-head--center{margin-inline:auto;text-align:center}
.sez-head p{margin-top:18px}

/* Bottoni */
.btn{
  --bg:var(--blu-primario);
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 26px;border-radius:999px;border:1px solid transparent;
  font-weight:600;font-size:.94rem;letter-spacing:.005em;cursor:pointer;
  transition:transform var(--t),box-shadow var(--t),background var(--t),border-color var(--t),color var(--t);
  position:relative;overflow:hidden;white-space:nowrap;
}
.btn svg{width:17px;height:17px;flex:none;transition:transform var(--t)}
.btn:hover{transform:translateY(-2px)}
.btn:hover svg{transform:translateX(4px)}
.btn--primario{background:var(--grad);background-size:180% 100%;color:#fff;box-shadow:0 14px 34px -14px rgba(37,99,235,.85)}
.btn--primario:hover{background-position:100% 0;box-shadow:0 20px 46px -14px rgba(139,92,246,.8)}
.btn--ghost{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.22);color:#fff}
.btn--ghost:hover{border-color:var(--blu-chiaro);background:rgba(56,189,248,.09)}
.btn--full{width:100%;justify-content:center}
.link-freccia{
  display:inline-flex;align-items:center;gap:8px;color:var(--blu-chiaro);
  font-weight:600;font-size:.9rem;transition:gap var(--t),color var(--t);
}
.link-freccia svg{width:15px;height:15px;transition:transform var(--t)}
.link-freccia:hover{color:#7dd3fc}
.link-freccia:hover svg{transform:translateX(5px)}

/* Header */
/* --testata: altezza della barra in alto, serve al pannello del menu.
   --barra: spazio occupato dalla barra di amministrazione di WordPress, che
   altrimenti coprirebbe logo e voci di menu a chi e' collegato al sito. */
:root{--testata:126px;--barra:0px}
body.admin-bar{--barra:32px}
@media screen and (max-width:782px){ body.admin-bar{--barra:46px} }
@media screen and (max-width:600px){ body.admin-bar{--barra:0px} }

.header{
  position:fixed;top:var(--barra);left:0;right:0;z-index:100;
  transition:background var(--t),border-color var(--t),backdrop-filter var(--t);
  border-bottom:1px solid transparent;
}
.header.is-scrolled{
  background:rgba(10,17,40,.82);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom-color:var(--bordo);
}
.header__in{display:flex;align-items:center;gap:32px;height:128px}
.brand{display:flex;align-items:center;flex:none}
.brand img{height:96px;width:auto}
.nav{margin-left:auto;display:flex;align-items:center;gap:34px}
.nav a{
  position:relative;font-size:1.05rem;font-weight:500;color:#CBD5E1;padding-block:8px;
  transition:color var(--t);
}
.nav a::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;
  background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform var(--t);
}
.nav a:hover{color:#fff}
.nav a:hover::after,.nav a.attivo::after{transform:scaleX(1)}
.nav a.attivo{color:#fff}
.header .btn{padding:14px 30px;font-size:1rem}
.burger{
  display:none;margin-left:auto;width:44px;height:44px;border-radius:12px;
  border:1px solid var(--bordo);background:rgba(255,255,255,.04);
  align-items:center;justify-content:center;cursor:pointer;
}
.burger span{display:block;width:19px;height:2px;background:#fff;border-radius:2px;position:relative;transition:var(--t)}
.burger span::before,.burger span::after{content:'';position:absolute;left:0;width:19px;height:2px;background:#fff;border-radius:2px;transition:var(--t)}
.burger span::before{top:-6px}
.burger span::after{top:6px}
body.menu-aperto .burger span{background:transparent}
body.menu-aperto .burger span::before{top:0;transform:rotate(45deg)}
body.menu-aperto .burger span::after{top:0;transform:rotate(-45deg)}

/* Hero */
.hero{position:relative;padding-top:202px;padding-bottom:clamp(56px,7vw,96px);overflow:hidden}
.hero__media{
  position:absolute;top:0;right:0;width:min(60%,940px);height:min(80vh,740px);
  clip-path:polygon(26% 0,100% 0,100% 100%,0 100%);
  -webkit-mask-image:linear-gradient(105deg,transparent 0,#000 23%,#000 100%);
  mask-image:linear-gradient(105deg,transparent 0,#000 23%,#000 100%);
}
/* La foto si dissolve verso il basso: senza questa sfumatura il suo bordo
   inferiore taglia netto e la pagina sembra spezzata a metà. */
.hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:center;
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 58%,rgba(0,0,0,.45) 84%,rgba(0,0,0,0) 100%);
  mask-image:linear-gradient(180deg,#000 0,#000 58%,rgba(0,0,0,.45) 84%,rgba(0,0,0,0) 100%);
}
.hero__media::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(100deg,var(--blu-notte) 2%,rgba(10,17,40,.55) 26%,rgba(10,17,40,0) 58%),
             linear-gradient(0deg,rgba(10,17,40,0) 0,rgba(10,17,40,.7) 14%,rgba(10,17,40,0) 48%);
}
.hero__linea{
  position:absolute;top:0;right:0;width:min(60%,940px);height:min(80vh,740px);
  background:linear-gradient(180deg,transparent,transparent);pointer-events:none;
}
.hero__linea::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 25.4%,rgba(56,189,248,.55) 25.8%,rgba(139,92,246,.35) 26.4%,transparent 27%);
  filter:blur(.6px);opacity:.85;
}
.hero__in{position:relative;z-index:2;max-width:640px}
.hero h1{margin-bottom:22px}
.hero .lead{max-width:46ch;margin-bottom:34px}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px}

/* Numeri */
.numeri{border-top:1px solid var(--bordo);border-bottom:1px solid var(--bordo);position:relative;z-index:2;background:rgba(10,17,40,.5)}
.numeri__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.numero{display:flex;gap:18px;padding:38px 30px;position:relative}
.numero + .numero::before{content:'';position:absolute;left:0;top:26%;bottom:26%;width:1px;background:var(--bordo)}
.numero__ico{flex:none;width:46px;height:46px;color:var(--blu-chiaro)}
.numero__ico svg{width:100%;height:100%;stroke-width:1.25}
.numero__val{font-size:1.55rem;font-weight:700;color:#fff;line-height:1.1}
.numero__lab{font-size:.68rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--blu-chiaro);margin:4px 0 8px}
.numero__txt{font-size:.83rem;color:var(--testo-soft);line-height:1.55}

/* Card generiche */
.card{
  position:relative;background:var(--card);border:1px solid var(--bordo);border-radius:var(--r-lg);
  padding:30px 26px;transition:transform var(--t),border-color var(--t),box-shadow var(--t),background var(--t);
  overflow:hidden;
}
.card::before{
  content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;opacity:0;
  background:var(--grad-diag);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  transition:opacity var(--t);pointer-events:none;
}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.card:hover::before{opacity:1}

/* Servizi home */
.servizi-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.servizio{display:flex;flex-direction:column;text-align:center;align-items:center}
.servizio__ico{
  width:56px;height:56px;margin-bottom:20px;color:var(--blu-chiaro);
  transition:transform var(--t),color var(--t);
}
.servizio:hover .servizio__ico{transform:translateY(-3px) scale(1.06);color:#7dd3fc}
.servizio__ico svg{width:100%;height:100%;stroke-width:1.3}
.servizio h3{font-size:.95rem;letter-spacing:.09em;text-transform:uppercase;margin-bottom:14px}
.servizio p{font-size:.86rem;color:var(--testo-soft);line-height:1.62;margin-bottom:22px;flex:1}
.servizio .link-freccia{font-size:.85rem}

/* Banner NEXDO */
.nexdo{
  position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:clamp(32px,4vw,58px);
  padding:clamp(40px,4.6vw,62px) clamp(36px,4.4vw,60px);
  border-radius:var(--r-xl);border:1px solid rgba(139,92,246,.35);
  background:
    radial-gradient(700px 220px at 88% 50%, rgba(236,72,153,.28), rgba(236,72,153,0) 70%),
    radial-gradient(600px 240px at 55% 120%, rgba(139,92,246,.3), rgba(139,92,246,0) 70%),
    linear-gradient(100deg,#0D1938 0%,#122051 48%,#1B1F55 100%);
  overflow:hidden;
}
.nexdo::after{
  content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:var(--grad);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:.55;pointer-events:none;
}
.nexdo img{height:clamp(66px,6vw,92px);width:auto;position:relative;z-index:1}
.nexdo__txt{position:relative;z-index:1}
.nexdo__txt strong{display:block;font-size:clamp(1.25rem,2vw,1.72rem);line-height:1.2;color:#fff;font-weight:700;margin-bottom:12px}
.nexdo__txt span{font-size:clamp(.94rem,1.15vw,1.06rem);color:#C4CBE0;line-height:1.62;display:block;max-width:52ch}
.nexdo .btn{position:relative;z-index:1;padding:16px 30px;font-size:1rem;white-space:nowrap}
.nexdo__badge{
  position:absolute;top:20px;right:26px;z-index:2;font-size:.63rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:#F9A8D4;
}

/* Progetti (card immagine) */
.progetti-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:40px}
.progetti-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.progetto{
  position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--bordo);
  background:var(--card-solid);transition:transform var(--t),border-color var(--t),box-shadow var(--t);
  display:flex;flex-direction:column;
}
.progetto:hover{transform:translateY(-6px);border-color:var(--bordo-hover);box-shadow:var(--shadow)}
.progetto__img{position:relative;aspect-ratio:16/10;overflow:hidden}
.progetto__img img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.22,.61,.36,1)}
.progetto:hover .progetto__img img{transform:scale(1.07)}
.progetto__img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,17,40,.15),rgba(15,27,61,.92))}
.tag{
  position:absolute;top:16px;left:16px;z-index:2;font-size:.64rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;padding:6px 12px;border-radius:999px;
  background:rgba(37,99,235,.92);
}
.progetto__body{padding:24px 24px 26px;display:flex;flex-direction:column;gap:12px;flex:1}
.progetto__body h3{font-size:1.15rem}
.progetto__body p{font-size:.87rem;color:var(--testo-soft);line-height:1.6;flex:1}

/* Form */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.campo{position:relative}
.campo--full{grid-column:1/-1}
.campo input,.campo select,.campo textarea{
  width:100%;padding:15px 18px;border-radius:var(--r-md);
  background:rgba(10,17,40,.6);border:1px solid var(--bordo);color:#fff;
  transition:border-color var(--t),box-shadow var(--t),background var(--t);font-size:.93rem;
}
.campo textarea{min-height:132px;resize:vertical}
.campo select{appearance:none;cursor:pointer;color:var(--testo-soft)}
.campo select.riempito{color:#fff}
.campo--select::after{
  content:'';position:absolute;right:20px;top:50%;width:9px;height:9px;pointer-events:none;
  border-right:2px solid var(--grigio-chiaro);border-bottom:2px solid var(--grigio-chiaro);
  transform:translateY(-70%) rotate(45deg);
}
.campo input::placeholder,.campo textarea::placeholder{color:var(--testo-soft);opacity:1}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:var(--blu-primario);background:rgba(10,17,40,.9);
  box-shadow:0 0 0 3px rgba(37,99,235,.2);
}
.privacy{display:flex;align-items:flex-start;gap:11px;font-size:.83rem;color:var(--testo-soft);grid-column:1/-1;margin-top:2px}
.privacy input{
  appearance:none;flex:none;width:18px;height:18px;margin-top:2px;border-radius:5px;
  border:1px solid rgba(148,163,184,.45);background:rgba(10,17,40,.6);cursor:pointer;
  transition:background var(--t),border-color var(--t);position:relative;
}
.privacy input:checked{background:var(--blu-primario);border-color:var(--blu-primario)}
.privacy input:checked::after{
  content:'';position:absolute;left:5.5px;top:2px;width:4px;height:8px;
  border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(42deg);
}
.privacy a{color:var(--blu-chiaro);text-decoration:underline;text-underline-offset:2px}
.form-esito{
  grid-column:1/-1;display:none;padding:13px 16px;border-radius:var(--r-md);font-size:.86rem;
  background:rgba(37,99,235,.14);border:1px solid rgba(56,189,248,.4);color:#BFDBFE;
}
.form-esito.visibile{display:block}

/* Footer */
.footer{border-top:1px solid var(--bordo);background:rgba(10,17,40,.7);padding-top:clamp(52px,6vw,74px)}
.footer__grid{display:grid;grid-template-columns:1.55fr 1fr 1fr 1.15fr;gap:44px}
.footer__brand img{height:66px;width:auto;max-width:none;margin-bottom:22px}
.footer__brand p{font-size:.86rem;color:var(--testo-soft);max-width:34ch;line-height:1.65}
.footer h4{font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--blu-chiaro);margin-bottom:20px}
.footer li{margin-bottom:11px}
.footer li a,.footer__contatti li{font-size:.87rem;color:var(--testo-soft);transition:color var(--t)}
.footer li a:hover{color:#fff}
.footer__contatti li{display:flex;gap:11px;align-items:flex-start;line-height:1.55}
.footer__contatti svg{width:16px;height:16px;flex:none;margin-top:3px;color:var(--blu-chiaro)}
.social{display:flex;gap:11px;margin-top:24px}
.social a{
  width:38px;height:38px;border-radius:11px;border:1px solid var(--bordo);
  display:grid;place-items:center;color:var(--testo-soft);
  transition:border-color var(--t),color var(--t),transform var(--t),background var(--t);
}
.social a:hover{color:#fff;border-color:var(--bordo-hover);transform:translateY(-2px);background:rgba(56,189,248,.08)}
.social svg{width:17px;height:17px}
.footer__piva{display:block;margin-top:6px;color:var(--testo-soft);opacity:.85;font-size:.84rem}
.footer__piva a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.footer__piva a:hover{color:#fff}
.footer__bottom{
  margin-top:clamp(42px,5vw,60px);border-top:1px solid var(--bordo);
  padding-block:22px;display:flex;flex-wrap:wrap;gap:14px 26px;
  justify-content:space-between;align-items:center;font-size:.78rem;color:var(--testo-soft);
}
.footer__bottom nav{display:flex;gap:24px}
.footer__bottom a:hover{color:#fff}

/* Page hero (pagine interne) */
.phero{position:relative;overflow:clip;padding-top:200px;padding-bottom:clamp(46px,5.5vw,72px)}
/* L'alone dietro al titolo. Il raggio va calcolato sul lato più vicino
   (closest-side): con il raggio predefinito il colore arriva ancora acceso sul
   bordo del riquadro e si vede la riga verticale dove l'alone finisce. */
.phero::after{
  content:'';position:absolute;right:-7%;top:-38%;width:min(64%,820px);aspect-ratio:1;
  background-image:radial-gradient(closest-side circle,
    rgba(37,99,235,.34) 0,
    rgba(70,95,238,.21) 32%,
    rgba(139,92,246,.11) 52%,
    rgba(139,92,246,.04) 70%,
    rgba(139,92,246,0) 86%);
  background-repeat:no-repeat;
  pointer-events:none;
}
.phero__in{position:relative;z-index:2;max-width:780px}
.phero h1{margin-bottom:20px}
.breadcrumb{display:flex;gap:9px;align-items:center;font-size:.78rem;color:var(--testo-soft);margin-bottom:22px}
.breadcrumb a:hover{color:var(--blu-chiaro)}
.breadcrumb span{opacity:.5}

/* Animazioni scroll */
.rivela{opacity:0;transform:translateY(26px);transition:opacity .75s cubic-bezier(.22,.61,.36,1),transform .75s cubic-bezier(.22,.61,.36,1)}
.rivela.dentro{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .rivela{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* Pagine interne */

/* Chi siamo */
.duecol{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:center}
.duecol--stretta{grid-template-columns:.95fr 1.05fr}
.duecol p + p{margin-top:16px}
.foto-cornice{position:relative;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--bordo)}
.foto-cornice img{width:100%;aspect-ratio:3/2;object-fit:cover}
.foto-cornice::after{content:'';position:absolute;inset:0;background:linear-gradient(160deg,rgba(37,99,235,.16),rgba(37,99,235,0) 55%,rgba(236,72,153,.14))}
.foto-cornice--glow::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:var(--grad-diag);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;z-index:2;opacity:.6;
}
.valori-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.valore__ico{width:44px;height:44px;color:var(--blu-chiaro);margin-bottom:18px}
.valore__ico svg{width:100%;height:100%;stroke-width:1.3}
.valore h3{font-size:1.05rem;margin-bottom:11px}
.valore p{font-size:.87rem;color:var(--testo-soft);line-height:1.62}

.timeline{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:14px}
.timeline::before{content:'';position:absolute;left:0;right:0;top:19px;height:1px;background:linear-gradient(90deg,rgba(37,99,235,.7),rgba(139,92,246,.7),rgba(236,72,153,.55))}
.step{position:relative;padding-top:56px}
.step::before{
  content:'';position:absolute;top:11px;left:0;width:17px;height:17px;border-radius:50%;
  background:var(--blu-notte);border:2px solid var(--blu-chiaro);box-shadow:0 0 0 5px rgba(56,189,248,.13);
}
.step__n{font-size:.7rem;font-weight:700;letter-spacing:.16em;color:var(--blu-chiaro);margin-bottom:9px}
.step h3{font-size:1rem;margin-bottom:9px}
.step p{font-size:.85rem;color:var(--testo-soft);line-height:1.6}

/* Servizi */
.intro-box{
  border:1px solid var(--bordo);border-radius:var(--r-xl);padding:clamp(30px,4vw,48px);
  background:radial-gradient(760px 320px at 50% -30%,rgba(37,99,235,.2),rgba(37,99,235,0) 70%),var(--card);
  text-align:center;
}
.intro-box p{font-size:clamp(1rem,1.35vw,1.14rem);line-height:1.75;color:#D6DCEC;max-width:78ch;margin-inline:auto}
.intro-box strong{color:#fff}

.srv{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4.5vw,60px);align-items:center;
  padding:clamp(26px,3.4vw,42px);border:1px solid var(--bordo);border-radius:var(--r-xl);
  background:var(--card);transition:border-color var(--t),box-shadow var(--t);
}
.srv:hover{border-color:var(--bordo-hover);box-shadow:var(--shadow)}
.srv + .srv{margin-top:26px}
.srv--invertito .srv__media{order:2}
.srv__media{position:relative;border-radius:var(--r-lg);overflow:hidden;background:#0A1128}
.srv__media img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .9s cubic-bezier(.22,.61,.36,1)}
.srv:hover .srv__media img{transform:scale(1.05)}
.srv__num{
  font-size:clamp(2.4rem,4vw,3.2rem);font-weight:800;line-height:1;
  background:var(--grad-testo);-webkit-background-clip:text;background-clip:text;color:transparent;
  margin-bottom:6px;display:block;
}
.srv h2{font-size:clamp(1.35rem,2.2vw,1.85rem);letter-spacing:.01em;margin-bottom:14px}
.srv-lista li{
  position:relative;padding-left:28px;font-size:.9rem;color:#D6DCEC;line-height:1.55;margin-bottom:12px;
}
.srv-lista li::before{
  content:'';position:absolute;left:0;top:8px;width:9px;height:9px;border-radius:2px;
  background:var(--grad-diag);transform:rotate(45deg);
}
.cta-strip{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;
  padding:clamp(26px,3.6vw,40px) clamp(28px,4vw,48px);border-radius:var(--r-xl);
  background:radial-gradient(600px 240px at 20% 0%,rgba(37,99,235,.34),rgba(37,99,235,0) 70%),
             radial-gradient(600px 260px at 90% 110%,rgba(236,72,153,.26),rgba(236,72,153,0) 70%),
             linear-gradient(100deg,#0D1938,#141F4F);
  border:1px solid rgba(139,92,246,.35);
}
.cta-strip h2{font-size:clamp(1.35rem,2.4vw,1.95rem);margin-bottom:10px}
.cta-strip p{color:#C4CBE0;font-size:.94rem;max-width:52ch}

/* Progetti (vuota) */
.vuoto{
  text-align:center;max-width:640px;margin-inline:auto;padding:clamp(46px,6vw,78px) clamp(26px,4vw,52px);
  border:1px solid var(--bordo);border-radius:var(--r-xl);
  background:radial-gradient(680px 320px at 50% -10%,rgba(37,99,235,.2),rgba(37,99,235,0) 70%),var(--card);
}
.vuoto__ico{
  width:78px;height:78px;margin:0 auto 26px;border-radius:22px;display:grid;place-items:center;
  background:linear-gradient(150deg,rgba(37,99,235,.24),rgba(139,92,246,.2));
  border:1px solid rgba(139,92,246,.4);color:var(--blu-chiaro);
}
.vuoto__ico svg{width:36px;height:36px;stroke-width:1.2}
.vuoto h2{font-size:clamp(1.5rem,2.6vw,2.05rem);margin-bottom:16px}
.vuoto p{color:var(--testo-soft);margin-bottom:30px}
.anteprima-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:clamp(44px,5vw,64px)}
.anteprima{
  border:1px dashed rgba(148,163,184,.28);border-radius:var(--r-lg);padding:26px 24px;
  background:rgba(15,27,61,.4);
}
.anteprima h3{font-size:1rem;margin-bottom:10px;color:#C9D3EA}
.anteprima p{font-size:.85rem;color:var(--testo-soft);line-height:1.6}
.anteprima__tag{
  display:inline-block;font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--blu-chiaro);border:1px solid rgba(56,189,248,.3);border-radius:999px;padding:4px 10px;margin-bottom:16px;
}

/* Contatti */
.contatti-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(30px,4vw,52px);align-items:start}
.info-card{
  display:flex;gap:16px;align-items:center;padding:20px 22px;border-radius:var(--r-md);
  border:1px solid var(--bordo);background:var(--card);margin-bottom:14px;
  transition:border-color var(--t),transform var(--t),background var(--t);
}
.info-card:hover{border-color:var(--bordo-hover);transform:translateX(4px)}
.info-card__ico{
  flex:none;width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:linear-gradient(145deg,rgba(37,99,235,.2),rgba(139,92,246,.16));
  border:1px solid rgba(139,92,246,.3);color:var(--blu-chiaro);
}
.info-card__ico svg{width:21px;height:21px;stroke-width:1.4}
.info-card strong{display:block;font-size:.95rem;color:#fff;font-weight:600;margin-bottom:3px}
.info-card span{font-size:.86rem;color:var(--testo-soft);line-height:1.5}
.form-card{
  border:1px solid rgba(139,92,246,.3);border-radius:var(--r-xl);padding:clamp(26px,3.4vw,40px);
  background:radial-gradient(600px 280px at 90% -10%,rgba(139,92,246,.16),rgba(139,92,246,0) 70%),var(--card);
  box-shadow:var(--shadow);
}
.form-card h2{font-size:1.5rem;margin-bottom:26px}
.mappa{
  position:relative;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--bordo);
  display:grid;grid-template-columns:.85fr 1.15fr;background:var(--card);min-height:320px;
}
.mappa__txt{padding:clamp(30px,4vw,46px);display:flex;flex-direction:column;justify-content:center;gap:16px}
.mappa__txt h2{font-size:clamp(1.3rem,2.2vw,1.75rem)}
.mappa iframe{width:100%;height:100%;min-height:320px;border:0;filter:grayscale(.35) invert(.92) hue-rotate(185deg) contrast(.92) brightness(.92)}

/* Breakpoint */
@media (max-width:1080px){
  .servizi-grid{grid-template-columns:repeat(3,1fr)}
  .footer__grid{grid-template-columns:1fr 1fr;gap:36px}
  .numeri__grid{grid-template-columns:repeat(2,1fr)}
  .numero:nth-child(3)::before{display:none}
  .numero:nth-child(3),.numero:nth-child(4){border-top:1px solid var(--bordo)}
  .timeline{grid-template-columns:repeat(2,1fr);gap:32px 24px}
  .timeline::before{display:none}
  .step{padding-top:48px}
}
@media (max-width:920px){
  :root{--testata:100px}
  .header__in{height:100px}
  .brand img,.brand .custom-logo{height:70px}
  .nav,.header .btn--primario{display:none}
  .burger{display:flex}
  .header.is-scrolled{background:rgba(10,17,40,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
  /* Con il menu aperto la testata NON deve avere backdrop-filter: un antenato
     sfocato diventa il riferimento degli elementi in posizione fissa, e il
     pannello del menu si schiacciava dentro l'altezza della barra. */
  body.menu-aperto .header,
  body.menu-aperto .header.is-scrolled{
    background:rgba(10,17,40,.98);backdrop-filter:none;-webkit-backdrop-filter:none;
  }
  body.menu-aperto{overflow:hidden}
  .nav.aperto{
    display:flex;position:fixed;left:0;right:0;top:calc(var(--barra) + var(--testata));bottom:0;
    flex-direction:column;align-items:stretch;
    gap:0;padding:26px var(--gutter) 40px;background:var(--blu-notte);
    overflow-y:auto;overscroll-behavior:contain;margin:0;
  }
  .nav.aperto a{font-size:1.15rem;font-weight:600;padding:18px 0;border-bottom:1px solid var(--bordo);color:#fff}
  .nav.aperto a::after{display:none}
  .nav.aperto .btn{display:inline-flex;margin-top:26px;justify-content:center}
  .hero{padding-top:126px}
  .hero .hero__media{
    position:relative;width:calc(100% + var(--gutter)*2);
    margin:0 calc(var(--gutter)*-1) 34px;height:280px;
    clip-path:none;-webkit-mask-image:none;mask-image:none;border-radius:0;
  }
  .hero__linea{display:none}
  .hero__in{max-width:none}
  .hero .wrap{display:flex;flex-direction:column-reverse}
  .servizi-grid{grid-template-columns:repeat(2,1fr)}
  .progetti-grid{grid-template-columns:1fr}
  .progetti-head{grid-template-columns:1fr;gap:18px;align-items:start}
  .duecol,.duecol--stretta{grid-template-columns:1fr}
  .valori-grid{grid-template-columns:1fr}
  .srv,.srv--rev{grid-template-columns:1fr}
  .srv--invertito .srv__media{order:0}
  .srv__media img{aspect-ratio:16/10}
  .contatti-layout{grid-template-columns:1fr}
  .mappa{grid-template-columns:1fr}
  .anteprima-grid{grid-template-columns:1fr}
  .nexdo{grid-template-columns:1fr;gap:24px;text-align:left;padding:34px 28px}
  /* l'etichetta va in colonna con il resto: sovrapposta rubava spazio al logo */
  .nexdo__badge{position:static;margin:0;font-size:.68rem}
  .nexdo .wp-block-image{display:block;text-align:left}
  .nexdo .btn{justify-self:start}
}
@media (max-width:620px){
  :root{--testata:88px}
  .header__in{height:88px}
  .brand img{height:58px}
  .servizi-grid{grid-template-columns:1fr}
  .numeri__grid{grid-template-columns:1fr}
  .numero + .numero::before{display:none}
  .numero + .numero{border-top:1px solid var(--bordo)}
  .numero{padding:28px 4px}
  .form-grid{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr;gap:34px}
  .footer__bottom{flex-direction:column;align-items:flex-start;gap:12px}
  .footer__bottom nav{gap:18px}
  .timeline{grid-template-columns:1fr}
  .hero__cta{flex-direction:column;align-items:stretch}
  .hero__cta .btn{justify-content:center}
  .cta-strip{flex-direction:column;align-items:flex-start}
}

/* Compatibilità con l'editor a blocchi */

/* I contenitori con layout a griglia devono ignorare l'eventuale wrapper interno. */
.servizi-grid > .wp-block-group__inner-container,
.progetti-grid > .wp-block-group__inner-container,
.valori-grid > .wp-block-group__inner-container,
.anteprima-grid > .wp-block-group__inner-container,
.numeri__grid > .wp-block-group__inner-container,
.timeline > .wp-block-group__inner-container,
.contatti-layout > .wp-block-group__inner-container,
.duecol > .wp-block-group__inner-container{display:contents}

/* Le immagini arrivano dentro un <figure> del blocco Immagine. */
.hero__media,.progetto__img,.srv__media,.foto-cornice,.nexdo figure{margin:0}
.hero__media.wp-block-image,.progetto__img .wp-block-image,
.srv__media.wp-block-image,.foto-cornice.wp-block-image{margin:0}
.progetto__img figure{margin:0;position:absolute;inset:0}
.progetto__img figure img{width:100%;height:100%;object-fit:cover}
.nexdo .wp-block-image{margin:0;position:relative;z-index:1}
.nexdo .wp-block-image img{height:clamp(66px,6vw,92px);width:auto}
.foto-cornice.wp-block-image img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:inherit}
.srv__media.wp-block-image img{width:100%;aspect-ratio:1;object-fit:cover}
.hero__media.wp-block-image img{width:100%;height:100%;object-fit:cover}
.card.servizio > .wp-block-group__inner-container{display:flex;flex-direction:column;align-items:center;flex:1}

/* Pulsanti generati dal blocco Pulsanti */
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:14px}
.wp-block-button__link{
  display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:999px;
  border:1px solid transparent;font-weight:600;font-size:.94rem;text-decoration:none;
  transition:transform var(--t),box-shadow var(--t),background var(--t),border-color var(--t),color var(--t);
}
.wp-block-button__link:hover{transform:translateY(-2px)}
.wp-block-button__link::after{
  content:'';width:17px;height:17px;flex:none;background:currentColor;
  -webkit-mask:var(--freccia) center/contain no-repeat;mask:var(--freccia) center/contain no-repeat;
  transition:transform var(--t);
}
.wp-block-button__link:hover::after{transform:translateX(4px)}
.is-style-ms-primario .wp-block-button__link{
  background:var(--grad);background-size:180% 100%;color:#fff;
  box-shadow:0 14px 34px -14px rgba(37,99,235,.85);
}
.is-style-ms-primario .wp-block-button__link:hover{background-position:100% 0;box-shadow:0 20px 46px -14px rgba(139,92,246,.8)}
.is-style-ms-trasparente .wp-block-button__link,
.is-style-ms-trasparente-freccia .wp-block-button__link{
  background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.22);color:#fff;
}
.is-style-ms-trasparente .wp-block-button__link:hover,
.is-style-ms-trasparente-freccia .wp-block-button__link:hover{border-color:var(--blu-chiaro);background:rgba(56,189,248,.09)}
.is-style-ms-trasparente .wp-block-button__link::after{display:none}
:root{--freccia:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")}

/* Riga con link e freccia, versione a blocchi del vecchio .link-freccia */
.riga-link{margin:0}
.riga-link a{
  display:inline-flex;align-items:center;gap:8px;color:var(--blu-chiaro);
  font-weight:600;font-size:.9rem;text-decoration:none;transition:color var(--t);
}
.riga-link a::after{
  content:'';width:15px;height:15px;background:currentColor;
  -webkit-mask:var(--freccia) center/contain no-repeat;mask:var(--freccia) center/contain no-repeat;
  transition:transform var(--t);
}
.riga-link a:hover{color:#7dd3fc}
.riga-link a:hover::after{transform:translateX(5px)}

/* Testi del banner NEXDO come paragrafi modificabili */
.nexdo__titolo{font-size:clamp(1.25rem,2vw,1.72rem);line-height:1.2;color:#fff;font-weight:700;margin-bottom:12px}
.nexdo__sotto{font-size:clamp(.94rem,1.15vw,1.06rem);color:#C4CBE0;line-height:1.62;max-width:52ch}
.nexdo__txt > .wp-block-group__inner-container{display:contents}

/* Valori numerici della fascia statistiche */
.numero__val{font-size:1.55rem;font-weight:700;color:#fff;line-height:1.1;margin:0}
.numero__lab{margin:4px 0 8px}
.numero__txt{margin:0}
.numero__testo{flex:1}

/* Blocco mappa */
.mappa > .wp-block-group__inner-container{display:contents}
.mappa__frame{min-height:320px;position:relative}
/* riquadro mostrato al posto della mappa finché non la si chiede */
.mappa__consenso{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:12px;text-align:center;padding:28px;
  background:radial-gradient(520px 240px at 50% 0%,rgba(37,99,235,.18),rgba(37,99,235,0) 70%),var(--card);
}
.mappa__consenso svg{width:34px;height:34px;color:var(--blu-chiaro)}
.mappa__titolo{font-weight:600;color:#fff;font-size:1.02rem}
.mappa__nota{font-size:.85rem;color:var(--testo-soft);line-height:1.6;max-width:46ch}
.mappa__consenso .btn{margin-top:4px}
.mappa__link{font-size:.83rem;color:var(--blu-chiaro);text-decoration:underline;text-underline-offset:3px}
.mappa__link:hover{color:#fff}
.mappa__frame iframe{width:100%;height:100%;min-height:320px;border:0;display:block;
  filter:grayscale(.35) invert(.92) hue-rotate(185deg) contrast(.92) brightness(.92)}

/* Utilità usate dai pattern */
.centro{text-align:center}
.centro .wp-block-buttons{justify-content:center}
.sez--stretta{padding-block:clamp(40px,5vw,64px)}
.srv--invertito .srv__media{order:2}
.wp-block-group.hero,.wp-block-group.numeri,.wp-block-group.sez,.wp-block-group.phero{max-width:none}

/* Aggiustamenti per il contenuto a blocchi */
.sez--senza-testa{padding-top:clamp(20px,2.6vw,36px)}
.h2-medio{font-size:clamp(1.4rem,2.4vw,1.9rem);margin-bottom:14px}
.recapiti{margin-top:28px}
.sez-head p{margin-top:0}
.sez-head p:not(.kicker){margin-top:18px}
.servizio .riga-link{flex:0 0 auto;margin-top:auto;font-size:.85rem}
.progetto__body .riga-link{flex:0 0 auto;font-size:.9rem}
.srv__testo > p{color:var(--testo-soft);margin-bottom:24px;max-width:60ch}
.srv__testo > .srv__num{margin-bottom:6px}
.srv__testo > h2{margin-bottom:14px}
.card.valore,.card.servizio{display:flex;flex-direction:column}
.card.valore{align-items:flex-start;text-align:left}

/* Integrazione WordPress */
.screen-reader-text{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}
.salta-al-contenuto:focus{
  position:fixed;top:14px;left:14px;z-index:200;width:auto;height:auto;clip:auto;clip-path:none;
  padding:12px 20px;border-radius:999px;background:var(--blu-primario);color:#fff;font-weight:600;
}
.brand .custom-logo-link{display:flex;align-items:center}
.brand .custom-logo{height:96px;width:auto;max-width:none}
.footer .menu{margin:0;padding:0;list-style:none}
.campo-trappola{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-esito--ko{background:rgba(236,72,153,.12);border-color:rgba(236,72,153,.45);color:#FBCFE8}

/* Pagine e articoli gestiti dall'editor */
.contenuto{max-width:820px}
.contenuto h2{font-size:clamp(1.4rem,2.4vw,1.9rem);margin:44px 0 16px}
.contenuto h3{margin:32px 0 12px}
.contenuto p,.contenuto li{color:var(--testo-soft);line-height:1.75}
.contenuto p{margin-bottom:18px}
.contenuto ul,.contenuto ol{margin:0 0 20px 22px;list-style:disc}
.contenuto ol{list-style:decimal}
.contenuto li{margin-bottom:9px}
.contenuto a{color:var(--blu-chiaro);text-decoration:underline;text-underline-offset:2px}
.contenuto img,.contenuto figure{border-radius:var(--r-lg);margin-block:26px}
.contenuto blockquote{
  margin:26px 0;padding:18px 24px;border-left:3px solid var(--blu-primario);
  background:rgba(15,27,61,.5);border-radius:0 var(--r-md) var(--r-md) 0;
}
.contenuto table{width:100%;border-collapse:collapse;margin-block:24px;font-size:.9rem}
.contenuto th,.contenuto td{border:1px solid var(--bordo);padding:11px 14px;text-align:left}
.alignwide,.alignfull{max-width:none}
.aligncenter{margin-inline:auto}
.wp-caption-text,.wp-element-caption{font-size:.8rem;color:var(--testo-soft);text-align:center;margin-top:10px}
.paginazione{display:flex;gap:10px;flex-wrap:wrap;margin-top:36px}
.paginazione .page-numbers{
  padding:9px 15px;border-radius:10px;border:1px solid var(--bordo);font-size:.88rem;
  color:var(--testo-soft);transition:border-color var(--t),color var(--t);
}
.paginazione .page-numbers:hover,.paginazione .current{color:#fff;border-color:var(--bordo-hover)}
.elenco-articoli{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.elenco-articoli article{padding:28px 26px}
.elenco-articoli h2{font-size:1.2rem;margin-bottom:10px}
.elenco-articoli time{font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--blu-chiaro)}
@media (max-width:920px){.elenco-articoli{grid-template-columns:1fr}}
.contatti-layout .lead{margin-top:20px}
.contatti-layout h2 + .lead{margin-top:16px}

/*
Con "disable-layout-styles" WordPress non stampa più i propri stili di layout:
qui ricostruiamo solo quello che serve davvero e rimettiamo in riga i pochi
elementi che il CSS dei blocchi tocca comunque.
*/
.wp-block-group.is-layout-flex{display:flex;flex-wrap:wrap;gap:14px}
.wp-block-columns{display:flex;flex-wrap:wrap;gap:clamp(20px,3vw,32px)}
.wp-block-column{flex:1 1 0;min-width:260px}
.wp-block-image,.wp-block-image figure{margin:0}
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:14px;margin:0}
.wp-block-list{margin:0;padding:0}
.contenuto .wp-block-list{margin:0 0 20px 22px;padding:0}
figure.wp-block-image>img{display:block}

/* Fascia numeri: icone tutte della stessa taglia ottica e allineate al valore */
.numero{align-items:flex-start}
.numero__ico{display:grid;place-items:center;width:46px;height:46px;flex:none}
.numero__ico svg{width:42px;height:42px}
.numero__lab{letter-spacing:.13em}

/* Card servizi: il titolo occupa sempre due righe, così i testi restano in riga */
.servizio h3{
  min-height:2.5em;display:flex;align-items:center;justify-content:center;
  line-height:1.25;margin-bottom:14px;
}

/* Pulsanti pieni senza aloni colorati che sbordano */
.btn--primario,
.is-style-ms-primario .wp-block-button__link{
  background:var(--grad);background-size:100% 100%;box-shadow:none;
  transition:transform var(--t),filter var(--t),box-shadow var(--t);
}
.btn--primario:hover,
.is-style-ms-primario .wp-block-button__link:hover{
  background-position:0 0;filter:brightness(1.09);box-shadow:none;
}
.btn:hover,.wp-block-button__link:hover{transform:translateY(-2px)}

/*
Quando un elemento cade su coordinate frazionarie il gradiente ripetuto lascia
una scheggia del colore finale sul bordo opposto: sui pulsanti pieni si vedeva
una lama magenta a sinistra. Nessuno sfondo del tema deve ripetersi. La regola
ha specificità nulla, così resta facile sovrascriverla dove serve.
*/
:where(body, body *, body *::before, body *::after){background-repeat:no-repeat}

/* La fascia numeri respira un po' di più in orizzontale: le etichette
   restano su una riga sola anche sugli schermi medi. */
.numero{padding:38px 24px}
.numero__lab{letter-spacing:.11em;font-size:.66rem}

/* Le fasce "strette" (banner NEXDO, intro servizi, mappa) seguono sempre una
   sezione che ha già il suo respiro sopra: qui basta lo spazio sotto. */
.sez--stretta{padding-top:0;padding-bottom:clamp(56px,7vw,96px)}

/* Il pieno dei pulsanti resta sul blu-viola, il magenta entra al passaggio del mouse. */
.btn--primario,
.is-style-ms-primario .wp-block-button__link{
  background-image:var(--grad);background-size:180% 100%;background-position:0 0;
}
.btn--primario:hover,
.is-style-ms-primario .wp-block-button__link:hover{
  background-position:100% 0;filter:none;
}

/* Una fascia stretta subito dopo una sezione: basta lo spazio di una sola delle due. */
.sez:has(+ .sez--stretta){padding-bottom:clamp(28px,3.5vw,48px)}

/* Sotto i 1200px la barra si stringe: il logo scende quel tanto che basta
   perché il menu resti su una riga sola. */
@media (max-width:1240px) and (min-width:921px){
  :root{--testata:112px}
  .header__in{height:112px}
  .brand img,.brand .custom-logo{height:82px}
  .nav{gap:26px}
  .nav a{font-size:.98rem}
  .header .btn{padding:12px 24px;font-size:.92rem}
}

/* ----------------------------- Schede servizi -----------------------------
   Cinque schede numerate: due larghe sulla prima riga, tre sulla seconda.
   La foto sta sotto al testo, non accanto: un velo in sfumatura la spegne a
   sinistra e la lascia respirare a destra.
-------------------------------------------------------------------------- */
.srv-griglia-schede{
  display:grid;grid-template-columns:repeat(6,1fr);
  gap:clamp(18px,2vw,26px);
}
.srv-griglia-schede > .srv-scheda:nth-child(-n+2){grid-column:span 3}
.srv-griglia-schede > .srv-scheda:nth-child(n+3){grid-column:span 2}

.srv-scheda{
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;
  border:1px solid var(--bordo);border-radius:var(--r-lg);
  background-color:var(--card-solid);
  padding:clamp(26px,2.5vw,38px);
  transition:transform var(--t),border-color var(--t),box-shadow var(--t);
}
.srv-scheda:hover{transform:translateY(-4px);border-color:var(--bordo-hover);box-shadow:var(--shadow)}

.srv-scheda__foto.wp-block-image{position:absolute;inset:0;margin:0;z-index:-2}
.srv-scheda__foto img{
  width:100%;height:100%;object-fit:cover;object-position:72% center;
  border-radius:0;
}
/* Il velo: forma estesa di "background", così la regola generale
   background-repeat:no-repeat non viene azzerata. */
.srv-scheda::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background-image:linear-gradient(104deg,
    rgba(10,17,40,.975) 0%,
    rgba(10,17,40,.955) 38%,
    rgba(10,17,40,.80) 66%,
    rgba(10,17,40,.46) 100%);
}

.srv-scheda__corpo{display:flex;flex-direction:column;flex:1;min-width:0}

.srv-scheda__testa{
  display:flex;align-items:center;gap:15px;
  margin-bottom:clamp(20px,2.2vw,30px);
}
.srv-scheda__num{
  margin:0;font-size:.82rem;font-weight:600;letter-spacing:.2em;
  color:rgba(232,236,246,.62);
}
.srv-scheda__ico.wp-block-image{margin:0;line-height:0}
.srv-scheda__ico img{width:34px;height:34px;object-fit:contain}

.srv-scheda h3{
  font-size:clamp(1.12rem,1.7vw,1.46rem);line-height:1.2;
  text-transform:uppercase;letter-spacing:.015em;
  margin-bottom:15px;max-width:17ch;
}
.srv-scheda__claim{
  color:#8ED8FB;font-weight:600;
  font-size:clamp(.92rem,1.1vw,1rem);line-height:1.42;
  margin-bottom:15px;max-width:32ch;
}
.srv-scheda__testo{
  color:#D2DAEC;font-size:.9rem;line-height:1.66;
  margin-bottom:18px;max-width:46ch;
}
.srv-scheda__chiavi{
  display:flex;flex-wrap:wrap;gap:7px;
  margin-bottom:22px;max-width:44ch;
}
/* Le voci sono etichette e non testo separato da barre: andando a capo una
   barra resterebbe appesa a fine riga, e la riga dopo comincerebbe storta. */
.srv-scheda__chiavi span{
  display:inline-block;padding:4px 11px;border-radius:999px;
  border:1px solid rgba(148,163,184,.22);
  background-color:rgba(10,17,40,.42);
  font-size:.745rem;line-height:1.35;color:#B9C7E2;
  white-space:nowrap;
}

.srv-scheda__oltre{margin-top:auto}
.srv-scheda__oltre summary{
  cursor:pointer;list-style:none;
  display:inline-flex;align-items:center;gap:10px;
  font-size:.72rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:#fff;
}
.srv-scheda__oltre summary::-webkit-details-marker{display:none}
.srv-scheda__oltre summary::after{
  content:"";width:9px;height:9px;
  border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);
  transition:transform var(--t);
}
.srv-scheda__oltre[open] summary::after{transform:rotate(225deg) translate(-1px,-1px)}
.srv-scheda__oltre summary:hover{color:#8ED8FB}

.srv-scheda__lista{
  margin:18px 0 0;padding:16px 0 0;list-style:none;
  border-top:1px solid var(--bordo);
}
.srv-scheda__lista li{
  position:relative;padding-left:18px;margin-bottom:9px;
  font-size:.84rem;line-height:1.6;color:#C4CBE0;
}
.srv-scheda__lista li::before{
  content:"";position:absolute;left:0;top:.62em;
  width:6px;height:6px;border-radius:50%;background-color:#38BDF8;
}
.srv-scheda__lista li:last-child{margin-bottom:0}
.srv-scheda__lista strong{color:#fff;font-weight:600}

@media (max-width:1080px){
  .srv-griglia-schede{grid-template-columns:repeat(2,1fr)}
  .srv-griglia-schede > .srv-scheda:nth-child(-n+2),
  .srv-griglia-schede > .srv-scheda:nth-child(n+3){grid-column:span 1}
  .srv-griglia-schede > .srv-scheda:last-child{grid-column:1/-1}
}
@media (max-width:760px){
  .srv-griglia-schede{grid-template-columns:1fr}
  .srv-griglia-schede > .srv-scheda:last-child{grid-column:auto}
  .srv-scheda__foto img{object-position:center}
  .srv-scheda::before{
    background-image:linear-gradient(170deg,
      rgba(10,17,40,.94) 0%,
      rgba(10,17,40,.90) 55%,
      rgba(10,17,40,.72) 100%);
  }
  .srv-scheda h3,.srv-scheda__claim,.srv-scheda__testo,.srv-scheda__chiavi{max-width:none}
}

/* Ripiego per le schede della vecchia pagina Servizi: se per qualsiasi motivo
   in database restasse il contenuto precedente, senza queste poche regole
   finirebbe a blocchi impilati senza forma. */
.srv-mosaico{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2vw,26px)}
.srv-box{
  border:1px solid var(--bordo);border-radius:var(--r-lg);
  background-color:var(--card-solid);padding:clamp(24px,2.4vw,34px);
}
.srv-box--larga{grid-column:1/-1}
.srv-box__ill{margin:0 0 20px}
.srv-box__ill img{width:150px;height:auto}
.srv-box__tag{
  font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;
  color:#8ED8FB;margin-bottom:10px;
}
.srv-box__som{color:#D2DAEC;font-size:.9rem;line-height:1.66}
.srv-box__lista{margin:18px 0 0;padding:16px 0 0;list-style:none;border-top:1px solid var(--bordo)}
.srv-box__lista li{position:relative;padding-left:18px;margin-bottom:9px;font-size:.84rem;line-height:1.6;color:#C4CBE0}
.srv-box__lista li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background-color:#38BDF8}
.srv-box__lista strong{color:#fff;font-weight:600}
@media (max-width:760px){.srv-mosaico{grid-template-columns:1fr}}

/* ---- Illustrazione nella testata di pagina ---- */
.phero--illustrata .phero__in{max-width:700px}
/* L'illustrazione è al neon su fondo scuro: con "screen" il fondo sparisce e
   restano solo le linee luminose, senza il rettangolo che si staccava. */
.phero__ill{
  position:absolute;right:0;top:0;bottom:0;width:min(48%,660px);margin:0;pointer-events:none;
  /* sfumatura sopra e sotto: sul contenitore, così si moltiplica con quella
     laterale dell'immagine senza bisogno di comporre due maschere */
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 15%,#000 76%,rgba(0,0,0,0) 100%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 15%,#000 76%,rgba(0,0,0,0) 100%);
}
/* Sfuma su tutti e quattro i lati: se resta un lato netto si vede il rettangolo
   dell'immagine staccarsi dal fondo, ed è la riga che si notava a metà pagina.
   Le due maschere si intersecano, così il bordo va a zero in ogni direzione. */
.phero__ill img{
  width:100%;height:100%;object-fit:cover;object-position:right center;opacity:.8;
  -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0,rgba(0,0,0,.2) 24%,rgba(0,0,0,.72) 50%,#000 74%);
  mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0,rgba(0,0,0,.2) 24%,rgba(0,0,0,.72) 50%,#000 74%);
}
/* La testata dei Contatti ha già lo skyline come sfondo: se il contenuto della
   pagina porta ancora la vecchia illustrazione, qui resta nascosta. */
.ms-pagina-contatti .phero__ill{display:none}


@media (max-width:1080px){
  .srv-griglia{gap:20px}
  .srv-lista--due{columns:1}
}
@media (max-width:920px){
  .phero--illustrata .phero__in{max-width:none}
  .phero__ill{position:relative;width:100%;height:190px;margin:0 0 20px}
}
@media (max-width:820px){
  .srv-griglia{grid-template-columns:1fr}
  .srv-card--eroe{flex-direction:column;align-items:stretch}
  .srv-card--eroe .srv-card__img{flex:none}
  .srv-card--eroe .srv-card__img img{aspect-ratio:16/10;padding:14px 0 0}
  .srv-card--eroe .srv-card__testo{padding:26px 28px 30px}
}

/* ---------------------------- Pagina NEXDO ---------------------------- */
.nx-hero{padding-bottom:clamp(40px,5vw,64px)}
.nx-hero__in{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(28px,3.4vw,48px);align-items:center}
.nx-hero__testo{max-width:560px}
.nx-logo.wp-block-image{margin:0 0 20px}
.nx-logo img{height:66px;width:auto}
.nx-hero__media{
  position:relative;
  /* quanto manca dal contenitore al bordo dello schermo */
  --sbordo:max(0px, calc((100vw - var(--wrap)) / 2));
  margin-right:calc(-1 * (var(--sbordo) + var(--gutter)));
  /* il render vive su un rettangolo quasi nero: il lato sinistro va
     sfumato, altrimenti contro lo sfondo della pagina si vede lo stacco */
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 11%);
  mask-image:linear-gradient(to right,transparent 0,#000 11%);
}
.nx-hero__media .wp-block-image{margin:0}
/* Il mockup è su fondo nero: con "screen" il nero sparisce e restano
   solo le luci, così l'immagine galleggia sullo sfondo invece di stare
   dentro un rettangolo. */
.nx-hero__media img{
  width:100%;height:auto;display:block;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 6%,#000 90%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 6%,#000 90%,transparent 100%);
}
/* Etichetta "work in progress": in linea sopra il titolo, non più appoggiata
   sopra la foto del portatile dove copriva lo schermo. */
.nx-badge{
  display:inline-block;margin-bottom:14px;padding:5px 13px;border-radius:999px;
  border:1px solid rgba(236,72,153,.42);background:rgba(236,72,153,.10);
  font-size:.63rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#F9A8D4;
}
.nx-hero .kicker{margin-bottom:14px}
.nx-hero h1{margin-bottom:20px}
.nx-hero .lead{margin-bottom:30px}

.nx-griglia{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.nx-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px 24px 32px}
.nx-card__ico.wp-block-image{margin:0 0 20px}
.nx-card__ico img{height:82px;width:auto;transition:transform var(--t)}
.nx-card:hover .nx-card__ico img{transform:translateY(-4px) scale(1.05)}
.nx-card h3{
  font-size:1rem;letter-spacing:.04em;margin-bottom:10px;line-height:1.3;
  min-height:2.6em;display:flex;align-items:center;justify-content:center;
}
.nx-card p{font-size:.86rem;color:var(--testo-soft);line-height:1.6}

.nx-intro{align-items:center;margin-bottom:clamp(38px,4.5vw,58px)}
.nx-intro .lead{max-width:52ch}

.nx-flusso{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.nx-passo{
  position:relative;padding:28px 24px 30px;border-radius:var(--r-lg);
  border:1px solid var(--bordo);background:var(--card);
  transition:transform var(--t),border-color var(--t);
}
.nx-passo:hover{transform:translateY(-5px);border-color:var(--bordo-hover)}
.nx-passo__ico.wp-block-image{margin:0 0 16px}
.nx-passo__ico img{height:64px;width:auto}
.nx-passo__n{
  font-size:.72rem;font-weight:700;letter-spacing:.18em;margin-bottom:8px;
  background:var(--grad-testo);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.nx-passo h3{font-size:1rem;margin-bottom:9px}
.nx-passo p{font-size:.85rem;color:var(--testo-soft);line-height:1.55}

.nx-lancio{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(26px,4vw,52px);align-items:center;
  padding:clamp(30px,4vw,46px) clamp(28px,4vw,52px);border-radius:var(--r-xl);
  border:1px solid rgba(139,92,246,.35);
  background:
    radial-gradient(620px 260px at 12% 0%,rgba(37,99,235,.32),rgba(37,99,235,0) 70%),
    radial-gradient(620px 280px at 88% 110%,rgba(236,72,153,.24),rgba(236,72,153,0) 70%),
    linear-gradient(100deg,#0D1938,#141F4F);
}
.nx-lancio__ico.wp-block-image{margin:0}
.nx-lancio__ico img{height:132px;width:auto}
.nx-lancio h2{font-size:clamp(1.35rem,2.4vw,1.95rem);margin-bottom:12px}
.nx-lancio p{color:#C4CBE0;font-size:.94rem;max-width:56ch;margin-bottom:24px}

@media (max-width:1080px){
  .nx-griglia,.nx-flusso{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:920px){
  .nx-hero__in{grid-template-columns:1fr;gap:30px}
  .nx-hero__testo{max-width:none}
  .nx-hero__media{
    margin-inline:calc(var(--gutter)*-1);
    -webkit-mask-image:none;mask-image:none;
  }
  .nx-lancio{grid-template-columns:1fr;text-align:left}
  .nx-lancio__ico img{height:104px}
}
@media (max-width:620px){
  .nx-griglia,.nx-flusso{grid-template-columns:1fr}
}

/*
La forma breve "background:" azzera anche la ripetizione: dove viene usata con
un gradiente va rimessa a mano, altrimenti sui bordi ricompare la scheggia di
colore descritta più sopra.
*/
.btn,.btn--primario,.btn--ghost,.header .btn,
.wp-block-button__link,
.is-style-ms-primario .wp-block-button__link,
.is-style-ms-trasparente .wp-block-button__link,
.is-style-ms-trasparente-freccia .wp-block-button__link,
.grad,.kicker--grad,.srv__num,.nx-passo__n,
.nexdo,.cta-strip,.nx-lancio,.tag,
.info-card__ico,.vuoto__ico,.timeline::before,.nav a::after{
  background-repeat:no-repeat;
}

/* nelle due colonne il titolo aveva il testo appiccicato sotto */
.duecol h2{margin-bottom:18px}
.duecol .kicker{margin-bottom:14px}

/*
La pagina Contatti ha uno sfondo suo: al posto delle luci in movimento
compare lo skyline, ancorato in alto e sfumato verso il fondo del sito.
*/
.ms-pagina-contatti .sfondo span{display:none}
.ms-pagina-contatti .sfondo{
  background-image:url('assets/img/sfondo-contatti.webp');
  background-position:top center;
  background-size:cover;
}
.ms-pagina-contatti .sfondo::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,
    rgba(10,17,40,.15) 0,
    rgba(10,17,40,.55) 38%,
    rgba(10,17,40,.88) 66%,
    var(--blu-notte) 88%);
}
@media (max-width:920px){
  .ms-pagina-contatti .sfondo{background-size:auto 62vh;background-position:top right}
}

/* ---- Ritocchi per il telefono -----------------------------------------
In coda al foglio perche' devono avere l'ultima parola sulle regole di
compatibilita' con i blocchi, che azzerano margini e ridefiniscono i corpi.
----------------------------------------------------------------------- */
@media (max-width:920px){
  /* la foto dell'hero va a tutta larghezza: senza questo margine negativo
     restava larga piu' dello schermo e sbordava a destra */
  .hero .hero__media.wp-block-image,
  .hero .hero__media{margin:0 calc(var(--gutter)*-1) 34px}
}
@media (max-width:620px){
  /* nessuna etichetta sotto i 12px: sul telefono diventano illeggibili */
  .numero__lab{font-size:.76rem;letter-spacing:.11em}
  .tag,.nexdo__badge,.nx-badge,.srv-tag{font-size:.72rem}
  .kicker{font-size:.78rem;letter-spacing:.15em}
  .footer__contatti li,.footer__piva{font-size:.82rem}
  .footer h4{font-size:.8rem;letter-spacing:.13em}
}

/* ---- Chi siamo: la foto grande, come nella home -------------------------
Il testo resta a sinistra, la foto passa a destra e prosegue oltre il bordo
del contenitore fino al margine dello schermo.
------------------------------------------------------------------------- */
.ms-pagina-chi-siamo .sez--senza-testa{overflow:clip}
.ms-pagina-chi-siamo .duecol--stretta{
  grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:clamp(34px,4.4vw,66px);
  align-items:center;
}
.ms-pagina-chi-siamo .duecol--stretta > .foto-cornice{ order:2 }
.ms-pagina-chi-siamo .duecol--stretta > :not(.foto-cornice){ order:1 }
.ms-pagina-chi-siamo .foto-cornice{
  /* quanto manca dal contenitore al bordo dello schermo */
  --sbordo:max(0px, calc((100vw - var(--wrap)) / 2));
  margin-right:calc(-1 * (var(--sbordo) + var(--gutter)));
  border-radius:var(--r-xl) 0 0 var(--r-xl);
  border-right:0;
}
.ms-pagina-chi-siamo .foto-cornice img,
.ms-pagina-chi-siamo .foto-cornice.wp-block-image img{
  width:100%;height:clamp(360px,44vw,560px);aspect-ratio:auto;object-fit:cover;
  border-radius:inherit;
}

@media (max-width:920px){
  .ms-pagina-chi-siamo .duecol--stretta{grid-template-columns:1fr}
  .ms-pagina-chi-siamo .duecol--stretta > .foto-cornice,
  .ms-pagina-chi-siamo .duecol--stretta > :not(.foto-cornice){ order:0 }
  .ms-pagina-chi-siamo .foto-cornice{
    margin-inline:calc(var(--gutter)*-1);
    border-radius:0;border-left:0;border-right:0;
  }
  .ms-pagina-chi-siamo .foto-cornice img,
  .ms-pagina-chi-siamo .foto-cornice.wp-block-image img{height:clamp(260px,52vw,380px)}
}

/* ---- Pagine di solo testo (privacy, cookie) ---------------------------- */
.testo-legale{max-width:74ch}
.testo-legale > p{color:var(--testo-soft);line-height:1.78;font-size:1rem}
.testo-legale > p + p{margin-top:16px}
.testo-legale h2{
  font-size:clamp(1.28rem,2.1vw,1.62rem);margin:clamp(38px,4vw,54px) 0 16px;
  padding-top:clamp(26px,3vw,36px);border-top:1px solid var(--bordo);
}
.testo-legale > h2:first-of-type{margin-top:34px}
.testo-legale h3{font-size:1.06rem;margin:30px 0 12px;color:#DCE7FA}
.testo-legale strong{color:#fff;font-weight:600}
.testo-legale em{color:#DCE7FA;font-style:normal;background:rgba(56,189,248,.10);
  padding:1px 6px;border-radius:5px;font-size:.94em}
.testo-legale a{color:var(--blu-chiaro);text-decoration:underline;text-underline-offset:3px}
.testo-legale a:hover{color:#fff}
.testo-legale ul{margin:14px 0 0}
.testo-legale li{
  position:relative;padding-left:22px;margin-bottom:11px;
  color:var(--testo-soft);line-height:1.72;
}
.testo-legale li::before{
  content:'';position:absolute;left:0;top:11px;width:7px;height:7px;border-radius:50%;
  background:var(--grad);
}
.testo-legale li:last-child{margin-bottom:0}