/* =====================================================================
   Smarthink — grafica del sito (v1.7)
   Sistema unico per tutte le pagine: colori, testi, bottoni, sezioni,
   card, metodo T.H.I.N.K., case study, articoli, moduli, menu e footer.
   ===================================================================== */

/* i caratteri (Poppins e il carattere di riserva) dalla 2.22 sono in assets/css/caratteri.css */

/* ---------- colori e misure ---------- */
:root{
  --teal:#0F7586; --teal-d:#0B5563; --ink:#10333B; --ink-2:#3E5D64; --mute:#5A7378;
  --gold:#F7B801; --gold-d:#E0A700; --gold-hi:#FFC93D;
  --bord:#820933; --pink:#F9E4EA;
  --mint:#D3F3EE; --mint-soft:#F0FAF8; --line:#DCEAE8; --dark:#0B1113;
  --maxw:1180px; --r:20px; --lh:50px;
  --ff:'Poppins','Poppins Fallback','Poppins Fallback R',system-ui,sans-serif;
  --sh:0 1px 2px rgba(16,51,59,.04); --sh-lg:0 22px 50px rgba(16,51,59,.14);
  /* palco (sistema 2.1): la notte petrolio delle aperture, del metodo, degli inviti e del footer */
  --night:#051B1F; --night-2:#082C32; --wall:#0E3F45; --cyan:#62D8F7; --ice:#E8FBFF; --on-stage:#CFE7E4; --stage-mute:#93B9BC;
  --stage-line:rgba(211,243,238,.16); --veil:rgba(5,27,31,.78);
  --stage:radial-gradient(110% 85% at 80% 0%,#0E3F45 0%,#082C32 48%,#051B1F 100%) #051B1F;
  --hh:75px;
}
@media(max-width:980px){:root{--hh:65px}}

/* ---------- base ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--ff);color:var(--ink-2);background:#fff;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:24px}
h1,h2,h3,h4{color:var(--ink);line-height:1.12;letter-spacing:-.02em;text-wrap:balance}
h1{font-size:clamp(34px,1.5rem + 3.2vw,62px);font-weight:800;line-height:1.05;letter-spacing:-.03em}
h2{font-size:clamp(28px,3.2vw,42px);font-weight:800}
h3{font-size:19px;font-weight:700;line-height:1.25}
h4{font-size:16px;font-weight:700}
p,li{text-wrap:pretty}
.lead{font-size:18px;line-height:1.6;max-width:680px;margin-top:16px}
h2+.lead{margin-top:14px}
.small{font-size:14px}.muted{color:var(--mute)}
strong{color:var(--ink);font-weight:600}
/* la frase che conta e' sottolineata dalla linea oro (la stessa linea delle particelle) */
.hl{background:linear-gradient(var(--gold),var(--gold)) 0 94%/100% .075em no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone}
::selection{background:var(--gold);color:var(--ink)}
section{padding-block:96px}
section[id]{scroll-margin-top:96px}
.sec-mint{background:var(--mint-soft)}
.sec-dark{background:var(--stage);color:var(--on-stage)}
.sec-dark h2,.sec-dark h3,.sec-dark strong{color:#fff}
.sec-dark .lead{color:#C9E4E0}
.center{text-align:center}.center .lead{margin-inline:auto}

/* occhiello sopra i titoli */
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:600;letter-spacing:0;color:var(--teal);margin-bottom:14px}
.eyebrow::before{content:"";width:24px;height:2px;border-radius:2px;background:var(--gold)}
.eyebrow.gold,.sec-dark .eyebrow{color:var(--gold-hi)}

/* bottoni */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:15px 26px;border-radius:999px;font-family:var(--ff);font-weight:600;font-size:15px;line-height:1.2;border:1.5px solid transparent;cursor:pointer;text-align:center;transition:transform .2s,box-shadow .2s,background .2s,color .2s,border-color .2s}
.btn-p{background:var(--gold);color:var(--ink);box-shadow:0 8px 22px rgba(247,184,1,.28)}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(247,184,1,.4)}
.btn-g{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-g:hover{background:var(--ink);color:#fff}
.btn-w,.sec-dark .btn-g{border-color:rgba(255,255,255,.7);color:#fff;background:transparent}
.btn-w:hover,.sec-dark .btn-g:hover{background:#fff;color:var(--dark)}
.btn:active{transform:translateY(1px)}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:30px}
.link{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--teal);transition:color .2s}
.link:hover{color:var(--ink)}
.btn-row .link{padding:14px 8px}
.sec-dark .link{color:var(--gold-hi)}.sec-dark .link:hover{color:#fff}

/* intestazione di sezione con azione a destra */
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.head>div:first-child{flex:1 1 520px;max-width:800px}
.head .lead{margin-top:12px}

/* ---------- foto con cornice e segnaposto ---------- */
.ph{position:relative;overflow:hidden;border-radius:24px;background:linear-gradient(135deg,var(--teal-d),var(--teal))}
.ph img{width:100%;height:100%;object-fit:cover}
.ph.noimg img{display:none}
.ph::after{content:"";position:absolute;inset:0;background:url(../img/marchio.png) no-repeat center/26%;opacity:0;pointer-events:none}
.ph.noimg::after,.ph.empty::after{opacity:.12}
.ph .todo{position:absolute;left:14px;top:14px;z-index:3}
.ph.v2{background:linear-gradient(135deg,#6b0729,#9a1439)}
.ph.v3{background:linear-gradient(135deg,#10333B,#1d4f59)}
.ph.v4{background:linear-gradient(135deg,#C99500,#F7B801)}

/* ---------- apertura delle pagine ---------- */
.hero{position:relative;padding-block:64px 72px;background:radial-gradient(900px 420px at 85% 8%,rgba(15,117,134,.08),transparent 70%),linear-gradient(180deg,var(--mint-soft),#fff)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;align-items:center}
.hero .lead{font-size:20px;line-height:1.5;margin-top:22px;max-width:560px}
.hero .lead strong{font-weight:700}
.hero .btn-row{margin-top:32px}
.hero.compact{padding-block:64px 56px}
.hero.compact .wrap{max-width:900px}
.page-home .hero{padding-block:56px 52px}
.page-home .hero-grid{grid-template-columns:1.2fr .8fr;gap:48px}
.hero h1{animation:up .6s .05s ease both}
.hero .lead{animation:up .6s .12s ease both}
.hero .btn-row{animation:up .6s .2s ease both}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* composizione foto della home */
.hvis{position:relative;height:520px}
.hvis .p1{position:absolute;right:0;top:0;width:78%;height:88%;border-radius:28px 28px 28px 120px;box-shadow:0 30px 60px rgba(16,51,59,.18)}
.hvis .p1 img{object-position:50% 35%}
.hvis .p2{position:absolute;left:0;bottom:0;width:50%;height:36%;border-radius:22px;border:6px solid #fff;box-shadow:0 20px 50px rgba(16,51,59,.2)}
.fcard{position:absolute;z-index:4;background:#fff;border-radius:18px;padding:16px 18px 14px;box-shadow:0 18px 40px rgba(16,51,59,.16);font-size:13px;color:var(--ink-2)}
.hvis .fcard{left:0;top:11%;width:232px}
.fcard .ct{display:flex;justify-content:space-between;align-items:center;gap:10px}
.fcard .ct b{color:var(--ink);font-size:13.5px}
.fcard .live{width:8px;height:8px;border-radius:50%;background:#2BB673;box-shadow:0 0 0 4px rgba(43,182,115,.16)}
.fcard .n{display:block;font-size:30px;font-weight:800;color:var(--teal);line-height:1.15;margin-top:6px}
.fcard .bars{display:flex;align-items:flex-end;gap:5px;height:40px;margin:12px 0 8px}
.fcard .bars i{flex:1;background:var(--mint);border-radius:4px 4px 0 0}
.fcard .bars i:last-child{background:var(--gold)}
.fcard small{display:block;color:var(--mute);font-size:11.5px}
.fcard .gl{list-style:none;margin-top:8px}
.fcard .gl li{position:relative;padding:5px 0 5px 24px;font-size:13.5px}
.fcard .gl li::before{content:"\2713";position:absolute;left:2px;color:var(--teal);font-weight:700}
.fcard .k{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:700}

/* apertura con una foto e una scheda */
.hphoto{position:relative;min-height:440px}
.hphoto .ph{position:absolute;right:0;top:0;bottom:0;width:86%;border-radius:28px 28px 28px 110px;box-shadow:0 30px 60px rgba(16,51,59,.16)}
.hphoto.v .ph{width:72%}
.hphoto .fcard{left:0;bottom:10%;width:min(290px,70%)}
.hchip{position:absolute;z-index:4;right:6%;top:8%;background:var(--gold);color:var(--ink);font-weight:700;font-size:13.5px;border-radius:999px;padding:10px 18px;box-shadow:0 14px 30px rgba(247,184,1,.35)}

/* apertura con schede (pagine senza foto) */
.hpanel{position:relative;display:grid;gap:14px}
.hpanel .fcard{position:relative;width:auto}
.hpanel .fcard:nth-child(2){margin-left:10%}
.hpanel .fcard:nth-child(3){margin-left:4%}
.hpanel .fcard p{margin-top:4px;font-size:13.5px}
.hpanel .hchip{position:relative;right:auto;top:auto;justify-self:end;margin-top:4px}
.tiles{display:flex;gap:8px;margin-top:10px}
.tiles span{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--mint);font-weight:800;font-size:18px;color:var(--teal-d)}
.tiles span.on{background:var(--gold);color:var(--ink)}

/* ---------- fascia clienti: numeri + loghi ---------- */
.trust-band{padding-block:44px 56px;border-bottom:1px solid var(--line)}
.tgrid{display:grid;grid-template-columns:.9fr 1.5fr;gap:40px;align-items:center;margin-bottom:30px}
.trust-band h2{font-size:clamp(24px,2.5vw,32px)}
.nums{display:grid;grid-template-columns:repeat(3,auto) auto;gap:30px;justify-content:end;align-items:start}
.nums b{display:block;font-size:32px;font-weight:800;color:var(--ink);line-height:1;letter-spacing:-.02em}
.nums span{display:block;margin-top:6px;font-size:12.5px;line-height:1.35;color:var(--mute);max-width:150px}
.nums .meta{display:flex;align-items:center;gap:10px;padding-left:26px;border-left:1px solid var(--line);align-self:center}
.nums .meta img{height:48px;width:auto;border-radius:6px}
.nums .meta span{margin:0;font-weight:600;color:var(--ink);max-width:90px}
.mq2{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mq2>div{display:flex;gap:64px;align-items:center;width:max-content;padding-block:14px;animation:mq 70s linear infinite}
.mq2.rev>div{animation-direction:reverse;animation-duration:80s}
@media (hover:hover) and (pointer:fine){.mq2:hover>div{animation-play-state:paused}} /* solo con il mouse: sul telefono un tocco non ferma la fila */
.mq2 img{height:calc(var(--lh) * var(--k,1));width:auto;opacity:.9}
@keyframes mq{to{transform:translateX(-50%)}}
.logos-only{padding-block:40px 48px;border-block:1px solid var(--line)}
.logos-only .lbl{text-align:center;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--mute);margin-bottom:10px}

/* ---------- card e griglie ---------- */
.grid-2,.grid-3,.grid-4{display:grid;gap:20px;margin-top:42px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 26px;box-shadow:var(--sh);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,51,59,.1)}
.card h3+p,.card .k+h3{margin-top:10px}
.card p{font-size:15px}
.card p+p{margin-top:10px}
.card .more,.card .link{margin-top:14px;font-size:14px}
.sec-dark .card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);box-shadow:none}
.sec-dark .card p{color:#C9E4E0}
.k{display:inline-block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:700}
.sec-dark .k{color:var(--gold-hi)}
.ico{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--mint);margin-bottom:18px}
.ico svg{width:24px;height:24px;fill:none;stroke:var(--teal-d);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* problemi (dalla 2.7): stessa icona pulita della Home, niente riquadri rosa */
.ico.warn{background:#fff;border:1px solid var(--line);box-shadow:0 6px 16px rgba(16,51,59,.06)}.ico.warn svg{stroke:var(--ink);stroke-width:1.7}
.sec-dark .ico{background:rgba(255,255,255,.12)}.sec-dark .ico svg{stroke:var(--gold-hi)}
.num{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--ink);color:#fff;font-weight:800;font-size:18px;margin-bottom:18px}
.give{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:14px;color:var(--ink)}
.give b{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:4px}
.close{margin-top:36px;font-size:19px;font-weight:600;color:var(--ink)}
.close a{color:var(--teal);white-space:nowrap;margin-left:8px}
.note{margin-top:22px;font-size:15px;color:var(--ink-2)}
.note a{color:var(--teal);font-weight:600}

/* liste con spunta e con croce */
.check,.cross{list-style:none;margin-top:26px;max-width:780px}
.check li,.cross li{position:relative;padding:13px 0 13px 36px;border-top:1px solid var(--line);font-size:16px}
.check li:last-child,.cross li:last-child{border-bottom:1px solid var(--line)}
.check li::before,.cross li::before{position:absolute;left:0;top:13px;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:12px;font-weight:700}
.check li::before{content:"\2713";background:var(--mint);color:var(--teal-d)}
.cross li::before{content:"\2715";background:var(--pink);color:var(--bord)}
.card .check{margin-top:14px}.card .check li{font-size:14.5px;padding:9px 0 9px 32px}.card .check li::before{top:9px}

/* ---------- metodo T.H.I.N.K. (sezione scura) ---------- */
.think-sec{position:relative;background:var(--ink);color:#C9E4E0;overflow:hidden}
.think-sec .tbg{position:absolute;inset:0;border-radius:0;background:none}
.think-sec .tbg img{opacity:.2}
.think-sec .tbg::after{opacity:0}
.think-sec .tbg::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(16,51,59,.55) 0,var(--ink) 58%)}
.think-sec .wrap{position:relative;z-index:2}
.think-sec h2,.think-sec h3{color:#fff}
.thead{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:end;margin-bottom:46px}
.thead p{font-size:17px}
.t5{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.t5 li{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);padding:24px 20px 20px;display:flex;flex-direction:column;transition:background .2s,transform .2s}
.t5 li:hover{background:rgba(255,255,255,.1);transform:translateY(-3px)}
.t5 .L{font-size:60px;font-weight:800;color:var(--gold);line-height:1}
.t5 .en{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#8FC1BA;margin-top:10px}
.t5 h3{margin-top:12px;font-size:21px}
.t5 p{font-size:14px;margin-top:8px;flex:1}
.t5 .get{margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.16);font-size:13.5px;color:#fff;line-height:1.45}
.t5 .get b{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}

/* fasi del metodo di lavoro (riquadro bianco) */
.path{margin-top:40px;background:#fff;border-radius:22px;padding:30px 32px 24px;color:var(--ink-2);box-shadow:var(--sh)}
.sec-mint .path,section:not(.think-sec) .path{border:1px solid var(--line)}
.ptitle{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);margin-bottom:22px}
.pline{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;position:relative}
.pline::before{content:"";position:absolute;left:8px;right:8px;top:7px;height:2px;background:linear-gradient(90deg,var(--teal),var(--gold))}
.pline>div{position:relative;padding-top:30px}
.pline>div::before{content:"";position:absolute;left:0;top:0;width:16px;height:16px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 5px #fff}
.pline>div:last-child::before{background:var(--gold)}
.pline span{display:block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.pline b{display:block;color:var(--ink);font-size:16px;line-height:1.35;margin-top:4px;font-weight:700}
.pline p{font-size:14px;margin-top:6px}
.pfoot{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.pfoot p{font-size:15.5px;color:var(--ink);font-weight:500}

/* metodo da vicino (pagina Agenzia) */
.tk{display:grid;gap:14px;margin-top:40px}
.tk-row{display:grid;grid-template-columns:72px 1fr 250px;gap:24px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh);transition:transform .2s,box-shadow .2s}
.tk-row:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,51,59,.1)}
.tk-l{display:grid;place-items:center;width:60px;height:60px;border-radius:16px;background:var(--ink);color:var(--gold);font-weight:800;font-size:28px}
.tk-row .en{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--bord);font-weight:700;margin-bottom:4px}
.tk-row h3{margin-bottom:6px}
.tk-row p{font-size:15px}
.tk-give{background:var(--mint-soft);border-radius:14px;padding:14px 16px;font-size:13.5px;color:var(--ink);line-height:1.5}
.tk-give b{display:block;font-size:10px;letter-spacing:.14em;color:var(--teal);margin-bottom:6px;text-transform:uppercase}

/* linea del tempo verticale */
.timeline{margin-top:40px;max-width:900px}
.timeline>div{display:grid;grid-template-columns:150px 1fr;gap:26px;padding:24px 0;border-top:1px solid var(--line)}
.timeline>div:last-child{border-bottom:1px solid var(--line)}
.timeline .when{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--bord);padding-top:4px}
.timeline .when::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);margin-right:9px;vertical-align:1px}
.timeline h3{margin-bottom:6px}
.timeline p{font-size:15.5px;max-width:640px}
.sec-dark .timeline>div{border-color:rgba(255,255,255,.14)}
.sec-dark .timeline .when{color:var(--gold-hi)}

/* ---------- case study ---------- */
.cs-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:20px}
.cs-card{position:relative;border-radius:22px;overflow:hidden;min-height:270px;padding:28px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .2s}
.cs-card:hover{transform:translateY(-3px)}
.cs-card.big{grid-row:span 2;min-height:560px;padding:36px}
.cs-card>.ph{position:absolute;inset:0;border-radius:0}
.cs-card>.ph::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(11,17,19,.9) 0,rgba(11,17,19,.35) 55%,rgba(11,17,19,.05) 100%)}
.cs-card>*:not(.ph){position:relative;z-index:2}
.kk{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mint);margin-bottom:10px}
.cs-card .n{font-size:54px;font-weight:800;color:var(--gold);line-height:1;letter-spacing:-.02em}
.cs-card.big .n{font-size:84px}
.cs-card .nl{margin-top:10px;font-size:17px;font-weight:600;line-height:1.35;color:#fff;max-width:440px}
.cs-card.big .nl{font-size:21px}
.cs-card .link{margin-top:14px;color:var(--gold-hi);font-size:14px}
.cs-card .link:hover{color:#fff}
.qslot{display:flex;gap:18px;align-items:center;margin-top:20px;padding:22px 26px;border:1.5px dashed #E6B7C6;border-radius:var(--r);background:#fff}
.qslot .av{flex:0 0 56px;height:56px;border-radius:50%;background:var(--mint)}
.qslot p{color:var(--ink);font-weight:500;font-style:italic}
.qslot small{display:block;margin-top:4px;color:var(--mute)}

/* case study raccontati (pagina Case study) */
.cs-item{display:grid;grid-template-columns:300px 1fr;background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--sh);margin-top:24px;scroll-margin-top:100px}
.cs-item .cs-vis{position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:30px 28px;color:#fff;min-height:280px;border-radius:0}
.cs-item .cs-vis::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(11,17,19,.55),transparent 70%)}
.cs-item .cs-vis>*{position:relative;z-index:2}
.cs-item .cs-vis>img{position:absolute;inset:0;z-index:0}
.cs-item .cs-vis:has(>img)::before{background:linear-gradient(0deg,rgba(11,17,19,.86) 0,rgba(11,17,19,.42) 55%,rgba(11,17,19,.08) 100%)}
.cs-item .n{font-size:58px;font-weight:800;color:var(--gold);line-height:1;letter-spacing:-.02em}
.cs-item .nl{margin-top:8px;font-size:15.5px;font-weight:600;line-height:1.4}
.cs-body{padding:32px 34px 28px}
.cs-body h3{font-size:23px;margin-top:10px}
.tags{display:flex;gap:8px;flex-wrap:wrap}
.tag:not(body){font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;border-radius:999px;padding:5px 13px;color:var(--teal-d);background:var(--mint)}
.cs-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.cs-steps>div{background:var(--mint-soft);border-radius:16px;padding:18px}
.cs-steps b{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--teal);margin-bottom:8px}
.cs-steps p{font-size:14.5px;line-height:1.6}
.cs-quote{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line);font-style:italic;color:var(--ink-2);font-size:15px}

/* ---------- chi siamo, foto e citazioni ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split.rev>:first-child{order:2}
.split .ph{height:480px;border-radius:24px 24px 24px 90px}
.split .ph.tall{height:560px}
.lead2{margin-top:18px;font-size:17px}
.pledge{margin-top:26px;padding:22px 24px;border-left:4px solid var(--gold);background:#fff;border-radius:0 16px 16px 0;box-shadow:var(--sh)}
.sec-mint .pledge{background:#fff}
.pledge b{display:block;font-size:22px;font-weight:800;line-height:1.2;color:var(--ink)}
.pledge small{display:block;margin-top:8px;color:var(--mute);font-size:14px}
.people .card .ph{height:220px;border-radius:16px;margin:-8px -6px 20px}
.ph.mono{display:grid;place-items:center}
.ph.mono>span[aria-hidden]{position:relative;font:800 96px/1 var(--ff);color:#fff;letter-spacing:-.02em;padding-bottom:16px}
.ph.mono>span[aria-hidden]::after{content:"";position:absolute;left:50%;bottom:0;width:44px;height:6px;margin-left:-22px;border-radius:3px;background:var(--gold)}
.ph.mono::after{opacity:0}
.ph.mono>img{position:absolute;inset:0}
.patto{background:var(--stage);color:#fff;padding-block:80px;position:relative;overflow:hidden}
.patto::before{content:"\201C";position:absolute;left:2%;top:-70px;font-size:340px;font-weight:700;color:rgba(255,255,255,.08);font-family:Georgia,serif;pointer-events:none}
.patto blockquote{font-size:clamp(26px,3.4vw,42px);font-weight:800;line-height:1.18;max-width:840px;letter-spacing:-.02em;color:#fff}
.patto p{margin-top:18px;font-size:17px;color:var(--on-stage);max-width:720px}
.patto .firma{margin-top:22px;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--gold-hi)}

/* ---------- servizi ---------- */
.dcard{background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.dcard:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,51,59,.1)}
.dcard .ph{height:160px;border-radius:0}
.dcard .ph::after{display:none}
.dcard .b{padding:20px 20px 22px;display:flex;flex-direction:column;flex:1}
.dcard h3{margin-top:6px}
.dcard p{font-size:14.5px;margin-top:8px;flex:1}
.dcard .link{margin-top:14px;font-size:14px}
.viz{position:absolute;inset:0;display:grid;place-items:center;z-index:2}
.viz svg{width:56%;height:auto}
.v1{background:linear-gradient(135deg,#0B5563,#0F7586)}.v2{background:linear-gradient(135deg,#6b0729,#9a1439)}.v3{background:linear-gradient(135deg,#10333B,#1d4f59)}.v4{background:linear-gradient(135deg,#C99500,#F7B801)}
.dept-nav{position:sticky;top:74px;z-index:60;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.admin-bar .dept-nav{top:106px}
.dn-row{display:flex;gap:8px;padding:10px 0;overflow-x:auto;scrollbar-width:none}
.dn-row a{white-space:nowrap;font-size:13.5px;font-weight:600;color:var(--ink);background:var(--mint-soft);border:1px solid var(--line);border-radius:999px;padding:8px 16px;transition:background .2s,color .2s}
.dn-row a:hover{background:var(--mint)}
.dn-row a.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.dept-head{display:flex;gap:22px;align-items:flex-start}
.dept-head .dnum{font-weight:800;font-size:54px;line-height:.9;color:var(--gold);padding-top:4px}
.dept-head .lead{margin-top:10px}

/* settori: pacchetti */
.pack{padding:0;overflow:hidden;display:flex;flex-direction:column}
.pack-visual{position:relative;min-height:150px;display:flex;flex-direction:column;justify-content:flex-end;gap:2px;padding:20px 22px;color:#fff}
.pv-food{background:linear-gradient(150deg,#F7B801 0%,#D96A12 55%,#9C1C46 100%)}
.pv-med{background:linear-gradient(150deg,#2FB1C7,#0B5563)}
.pv-ind{background:linear-gradient(150deg,#3A5560,#101C20)}
.pv-status{position:absolute;top:14px;left:16px;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:rgba(255,255,255,.24);border-radius:999px;padding:5px 12px}
.pv-name{font-weight:800;font-size:24px;line-height:1.12}
.pv-sub{font-size:12.5px;opacity:.92}
.pack-body{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.pack-body p{flex:1}
.pack-body .btn{align-self:flex-start;margin-top:18px}

/* numeri (landing) */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px;box-shadow:var(--sh)}
.kpi .n{font-size:clamp(28px,2.8vw,38px);font-weight:800;color:var(--ink);letter-spacing:-.02em;line-height:1}
.kpi .l{font-size:13.5px;color:var(--mute);margin-top:10px;line-height:1.5}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.chips span{font-size:13px;font-weight:600;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 15px}
.sec-mint .chips span{background:#fff}

/* ---------- articoli (Risorse, home, archivi) ---------- */
.post-grid .wp-block-post-template{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;list-style:none;margin:0;padding:0}
.post-grid .wp-block-post-template>li{display:flex;margin:0}
.post-grid .wp-block-post-template>li[hidden]{display:none}
.post-card{flex:1;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:transform .2s,box-shadow .2s}
.post-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,51,59,.1)}
.post-card>*{padding-inline:22px}
.post-card .wp-block-post-featured-image{padding:0;margin:0 0 18px;aspect-ratio:1200/630;background:linear-gradient(135deg,var(--teal-d),var(--teal));overflow:hidden}
.post-card .wp-block-post-featured-image a{display:block;height:100%}
.post-card .wp-block-post-featured-image img{width:100%;height:100%;object-fit:contain}
.post-grid.tall .post-card .wp-block-post-featured-image{aspect-ratio:4/5}
.post-grid.square .post-card .wp-block-post-featured-image{aspect-ratio:1/1}
.post-card .wp-block-post-terms{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.post-card .wp-block-post-terms a{color:inherit}
.post-card .wp-block-post-title{font-size:17.5px;line-height:1.3;margin-top:8px}
.post-card .wp-block-post-title a:hover{color:var(--teal)}
.post-card .wp-block-post-excerpt{font-size:14.5px;margin-top:8px}
.post-card .wp-block-post-excerpt__more-text{display:none}
.post-card .wp-block-post-date{margin-top:auto;padding-top:14px;padding-bottom:20px;font-size:12.5px;color:var(--mute)}
.cat-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.cat-btn{font:inherit;font-size:13.5px;font-weight:600;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 14px;cursor:pointer;transition:all .18s}
.cat-btn:hover{border-color:var(--teal);color:var(--teal)}
.cat-btn.on{background:var(--ink);border-color:var(--ink);color:#fff}
.cat-count{font-size:13px;color:var(--mute);margin:8px 0 22px;min-height:18px}
.ig-strip{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:center}
.ig-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--sh);max-width:340px;justify-self:center}
.ig-head{display:flex;align-items:center;gap:10px;font-size:14px;margin-bottom:12px}
.ig-avatar{width:32px;height:32px;border-radius:50%;background:var(--ink);display:grid;place-items:center;overflow:hidden}
.ig-avatar img{width:14px;height:auto}
.ig-body{background:linear-gradient(135deg,var(--teal),var(--teal-d));color:#fff;border-radius:12px;padding:28px 20px;font-weight:700;font-size:17px;line-height:1.35;min-height:150px;display:flex;align-items:center}
.ig-foot{margin-top:12px;color:var(--mute);letter-spacing:.3em;font-size:16px}

/* ---------- domande frequenti ---------- */
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}
.faq-list{max-width:860px}
details{border-top:1px solid var(--line);padding:18px 0}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{font-weight:600;color:var(--ink);font-size:16.5px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";flex-shrink:0;color:var(--gold-d);font-size:24px;font-weight:500;line-height:1}
details[open] summary::after{content:"\2013"}
details p{margin-top:10px;font-size:15.5px;max-width:760px}
.faq-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.faq-nav a{font-size:13px;font-weight:600;color:var(--ink);padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;transition:background .2s,border-color .2s}
.faq-nav a:hover{border-color:var(--teal);color:var(--teal)}
.riassunto{border-left:4px solid var(--gold);padding-left:24px}
.riassunto .lead{max-width:860px;margin-top:0}

/* ---------- chiusura con invito ---------- */
.cta-sec{padding-top:24px}
.cta-box{position:relative;display:grid;grid-template-columns:1.1fr .9fr;border-radius:28px;overflow:hidden;background:var(--stage);box-shadow:0 30px 60px rgba(5,27,31,.22)}
.cta-box .t{position:relative;z-index:1;padding:56px 56px 96px;color:var(--on-stage)}
.cta-box h2{color:#fff}
.cta-box .t>p{margin-top:16px}
.cta-box .btn-row{margin-top:28px}
.cta-box .risk{margin-top:18px;font-size:14px;color:#9FD3CB}
.cta-box .ph{min-height:420px;border-radius:0}
.cta-box.solo{grid-template-columns:1fr}
.cta-box.solo .t{max-width:820px}

/* ---------- moduli ---------- */
form{display:grid;gap:16px;max-width:760px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px}
input,select,textarea{width:100%;font-family:var(--ff);font-size:15px;padding:13px 16px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--teal);outline-offset:1px;border-color:var(--teal)}
.chk{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--ink-2);font-weight:400;cursor:pointer}
.chk input{width:auto;margin-top:4px}
.form-msg{display:none;background:var(--mint);color:var(--teal-d);border-left:3px solid var(--teal);padding:14px 16px;border-radius:10px;font-size:15px}
.form-msg.err{background:var(--pink);color:var(--bord);border-left-color:var(--bord)}
.hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:34px;box-shadow:var(--sh-lg)}
.form-card form{max-width:none}
.form-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:start;margin-top:40px}
.aside-list{list-style:none;display:grid;gap:14px}
.aside-list li{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 20px;font-size:14.5px;box-shadow:var(--sh)}
.aside-list b{display:block;color:var(--ink);font-size:14.5px;margin-bottom:2px}
.aside-list a{color:var(--teal);font-weight:600}

/* landing AI & Automation */
.lp-check{list-style:none;margin-top:22px}
.lp-check li{position:relative;padding:8px 0 8px 32px;font-size:16px;color:var(--ink)}
.lp-check li::before{content:"\2713";position:absolute;left:0;top:9px;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--gold);color:var(--ink);font-size:12px;font-weight:700}
.compare{display:grid;gap:14px}
.compare .fcard{position:relative;width:auto}
.compare .fcard:first-child{margin-right:12%}
.compare .fcard:nth-child(2){margin-left:12%;border:2px solid var(--gold)}
.compare .fcard ul{list-style:none;margin-top:8px}
.compare .fcard li{position:relative;padding:5px 0 5px 24px;font-size:13.5px}
.compare .fcard:first-child li::before{content:"\2715";position:absolute;left:2px;color:var(--bord);font-weight:700}
.compare .fcard:nth-child(2) li::before{content:"\2713";position:absolute;left:2px;color:var(--teal);font-weight:700}
.compare .hchip{position:relative;right:auto;top:auto;justify-self:start;margin-left:4%}
.norm{border-left:4px solid var(--gold)}
.quote-line{margin-top:26px;font-style:italic;font-size:15.5px;max-width:680px}
.quote-line span{font-style:normal;font-size:12.5px;color:var(--mute)}

/* ---------- articolo ---------- */
.post-head{position:relative;padding-block:calc(var(--hh) + 56px) 64px;background:var(--stage);color:var(--on-stage)}
.post-head .wrap{max-width:860px}
.post-head .wp-block-post-terms{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.post-head .wp-block-post-terms a{color:inherit}
.post-head .wp-block-post-title{font-size:clamp(30px,3.8vw,46px);font-weight:800;margin-top:12px}
.post-head .wp-block-post-date{margin-top:14px;font-size:14px;color:var(--mute)}
.post-wrap{max-width:860px;margin:0 auto;padding:0 24px 80px}
.post-wrap .wp-block-post-featured-image{margin:0 0 36px}
.post-wrap .wp-block-post-featured-image img{width:100%;height:auto;border-radius:20px;box-shadow:var(--sh-lg)}
.post-body{max-width:720px;margin:0 auto;font-size:17px;line-height:1.75}
.post-body>*+*{margin-top:18px}
.post-body h2{margin-top:44px;font-size:clamp(23px,2.6vw,30px)}
.post-body h3{margin-top:32px;font-size:20px}
.post-body h4{margin-top:24px}
.post-body ul,.post-body ol{padding-left:22px}
.post-body li+li{margin-top:8px}
.post-body a{color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.post-body .wp-block-quote{padding:14px 22px;border-left:4px solid var(--gold);background:var(--mint-soft);border-radius:0 12px 12px 0;font-weight:500}
.post-body .wp-block-image img{border-radius:14px;height:auto}
.post-body .wp-block-table{overflow-x:auto}
.post-body table{width:100%;border-collapse:collapse;font-size:15px}
.post-body th,.post-body td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.post-body th{background:var(--mint-soft);font-weight:600}
.post-body .wp-block-details{border-top:1px solid var(--line);padding:16px 0}
.post-body .wp-block-details summary{font-size:16.5px}
.post-body .wp-block-details p{margin-top:10px;font-size:16px}
.post-fonte{margin-top:28px;font-size:14px;color:var(--mute);border-top:1px solid var(--line);padding-top:16px}
.post-cta{max-width:860px;margin:56px auto 0;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;background:var(--ink);color:#C9E4E0;border-radius:24px;padding:34px 36px}
.post-cta h2{color:#fff;font-size:clamp(22px,2.4vw,28px)}
.post-cta p{margin-top:8px;font-size:15px}
.post-list{padding-block:56px 88px}
.archive-head{position:relative;padding-block:calc(var(--hh) + 56px) 72px;background:var(--stage);color:var(--on-stage)}
.archive-head h1{font-size:clamp(30px,3.8vw,46px)}
.archive-head .wp-block-term-description{margin-top:12px;max-width:680px;font-size:17px}
.wp-block-query-pagination{display:flex;gap:12px;justify-content:center;margin-top:40px;font-weight:600}
.wp-block-query-pagination a{color:var(--teal)}

/* pagine semplici (privacy, cookie, pagine create a mano) */
.entry-title{max-width:820px;margin:0 auto;padding:72px 24px 8px}
.entry .wp-block-post-content>*:not(.page){max-width:820px;margin-inline:auto;padding-inline:24px}
.entry .wp-block-post-content>*:not(.page)+*:not(.page){margin-top:18px}
.entry .wp-block-post-content>*:not(.page):first-child{margin-top:24px}
.entry .wp-block-post-content>*:not(.page):last-child{margin-bottom:80px}
.entry .wp-block-post-content>h2,.entry .wp-block-post-content>:not(.page) h2{font-size:clamp(22px,2.4vw,28px);margin-top:32px}
/* informative di iubenda (Privacy Policy, Cookie Policy): il testo prende la tipografia del sito */
.legal-lead{font-size:clamp(17px,1.6vw,19px);line-height:1.6;color:var(--ink-2)}
.iub-doc{font-size:16px;line-height:1.7;color:var(--ink-2)}
.iub-doc h1,.iub-doc h2{margin:40px 0 12px;font-size:clamp(22px,2.4vw,28px);line-height:1.2;color:var(--ink)}
.iub-doc h3,.iub-doc h4{margin:28px 0 8px;font-size:18px;line-height:1.3;color:var(--ink)}
.iub-doc p,.iub-doc ul,.iub-doc ol{margin:0 0 14px}
.iub-doc ul,.iub-doc ol{padding-left:22px}
.iub-doc li{margin-bottom:6px}
.iub-doc a{color:var(--teal-d);text-decoration:underline;text-underline-offset:2px}
.iub-doc table{width:100%;margin:16px 0;border-collapse:collapse;font-size:14.5px}
.iub-doc th,.iub-doc td{padding:10px 12px;border:1px solid var(--line);text-align:left;vertical-align:top}
.iub-doc > a.iubenda-embed{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font-weight:600;text-decoration:none}
.legal-pref{margin-top:28px}
.hdr{position:sticky;top:0;z-index:100}
.admin-bar .hdr{top:32px}
@media(max-width:782px){.admin-bar .hdr{top:46px}}

/* ---------- menu ---------- */
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--gold);color:var(--ink);font-weight:600;padding:12px 18px;border-radius:0 0 12px 0}
.skip:focus{left:0}
.site-header{position:relative;background:rgba(255,255,255,.93);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);transition:box-shadow .25s}
.site-header.scrolled{box-shadow:0 8px 28px rgba(16,51,59,.08)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;height:74px;max-width:var(--maxw);margin:0 auto;padding-inline:24px}
.logo img{height:40px;width:auto}
.menu{display:flex;align-items:center;gap:4px;list-style:none}
.menu>li{position:relative}
.menu a.navlink{display:block;font-size:14.5px;font-weight:500;color:var(--ink);padding:10px 12px;border-radius:999px;transition:background .2s,color .2s}
.menu a.navlink:hover{background:var(--mint-soft);color:var(--teal-d)}
.menu a.navlink.on{color:var(--teal);font-weight:600}
.navwrap{display:flex;align-items:center}
.caret{background:none;border:0;cursor:pointer;font-size:11px;color:var(--ink);padding:8px 6px;border-radius:999px;line-height:1}
.caret:hover{background:var(--mint-soft)}
.mega{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);display:none;grid-template-columns:repeat(3,max-content) 236px;justify-content:space-between;gap:22px;width:800px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--sh-lg);padding:24px}
.mega::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.has-mega:hover .mega,.has-mega:focus-within .mega,.has-mega.open .mega{display:grid}
.mega .col a{display:block;font-size:13.5px;color:var(--ink-2);padding:4px 0}
.mega .col a:hover{color:var(--teal)}
.mega .mm-h{font-weight:700;font-size:14.5px;color:var(--ink)}
.mega .mm-d{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);font-weight:700;margin:2px 0 10px}
.cta-head{margin-left:10px}
.cta-head .btn{padding:11px 20px;font-size:14px;box-shadow:none}
.burger{display:none;background:none;border:0;font-size:26px;cursor:pointer;color:var(--ink);line-height:1}
.m-cta{display:none}
.top-btn{position:fixed;right:18px;bottom:22px;z-index:95;width:46px;height:46px;border-radius:50%;border:0;background:var(--ink);color:#fff;font-size:19px;cursor:pointer;box-shadow:var(--sh-lg);opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .25s,transform .25s}
.top-btn.show{opacity:1;pointer-events:auto;transform:none}

/* ---------- footer ---------- */
.site-footer{position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(211,243,238,.25),var(--cyan) 45%,var(--gold)) top/100% 2px no-repeat,var(--night);color:#B6C6C8;padding:64px 0 30px;font-size:14.5px}
.site-footer .fmark{position:absolute;right:-24px;bottom:-140px;width:190px;opacity:.05;pointer-events:none}
.site-footer .wrap{position:relative}
.fcta{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-bottom:44px;margin-bottom:44px;border-bottom:1px solid rgba(255,255,255,.1)}
.fcta>div{display:flex;align-items:center;justify-content:space-between;gap:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:22px 24px;min-width:0}
.fcta h3{color:#fff;font-size:18px}
.fcta .btn{white-space:nowrap;box-shadow:none}
.fgrid{display:grid;grid-template-columns:1.4fr .9fr 1fr 1.3fr;gap:40px}
.fgrid>*{min-width:0}
.fbrand img{width:200px;height:auto;margin-bottom:14px}
.fbrand p{font-size:14px;line-height:1.7}
.claim{font-weight:600;color:var(--gold-hi);font-size:14px;letter-spacing:.08em;margin-bottom:10px}
.site-footer .fh{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-hi);margin-bottom:14px;font-weight:600}
.site-footer .col a{display:block;padding:3px 0}
.site-footer a:hover{color:#fff}
.soc{display:flex;gap:10px;margin-top:20px}
.soc a{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.18);transition:background .2s,border-color .2s}
.soc svg{width:17px;height:17px;fill:#B6C6C8}
.soc a:hover{background:var(--gold);border-color:var(--gold)}.soc a:hover svg{fill:var(--ink)}
.news p{font-size:14px}
.news form{display:flex;gap:8px;margin-top:14px;max-width:none}
.news input{flex:1;min-width:0;padding:12px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;font-size:14px}
.news input::placeholder{color:#8FA5A9}
.news .btn{padding:12px 20px;font-size:14px;box-shadow:none}
.news .form-msg{flex-basis:100%;font-size:13px;padding:10px 12px}
.news form:has(.form-msg[style*="block"]){flex-wrap:wrap}
.meta2{display:flex;align-items:center;gap:10px;margin-top:22px;font-size:13px}
.meta2 img{height:40px;width:auto;border-radius:6px;background:#fff;padding:3px}
.legal{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);font-size:13px;color:#7F9397}
.legal a{display:inline}

/* ---------- lavoro in corso: visibile solo a chi e' collegato ---------- */
.todo{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.05em;background:var(--pink);color:var(--bord);padding:2px 9px;border-radius:999px;vertical-align:middle;white-space:nowrap;font-style:normal}
body:not(.logged-in) .todo{display:none!important}
.bozza{position:relative;outline:2px dashed var(--bord);outline-offset:6px;border-radius:6px}
.bozza::before{content:"BOZZA \2014 non visibile ai visitatori";position:absolute;top:-16px;left:8px;background:var(--bord);color:#fff;font-size:10px;letter-spacing:.08em;padding:2px 8px;border-radius:4px;z-index:5}

/* ---------- comparsa discreta ---------- */
/* (dalla 2.1 le sezioni non "compaiono" piu' una per una: l'unico movimento e' l'entrata del titolo) */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* ---------- adattamenti WordPress ---------- */
body{margin:0}
.wp-site-blocks{padding:0}
.wp-site-blocks>*{margin-block-start:0!important;margin-block-end:0!important}
.wp-block-group.page>*{margin-block-start:0!important}
.wp-block-post-content>.page{margin:0}

/* ---------- schermi medi ---------- */
@media(max-width:1100px){
  .t5{grid-template-columns:repeat(3,1fr)}
  .fgrid{grid-template-columns:1fr 1fr}
  .menu a.navlink{padding:10px 9px;font-size:14px}
}
@media(max-width:1000px){
  .grid-4,.kpis{grid-template-columns:repeat(2,1fr)}
  .tgrid{grid-template-columns:1fr;gap:22px}
  .nums{justify-content:start}
  .tk-row{grid-template-columns:60px 1fr}
  .tk-give{grid-column:2}
  .cs-item{grid-template-columns:240px 1fr}
  .cs-steps{grid-template-columns:1fr}
}
@media(max-width:900px){
  .hero-grid,.page-home .hero-grid,.split,.faq-grid,.form-grid,.ig-strip,.thead{grid-template-columns:1fr}
  .hero-grid{gap:32px}
  .split{gap:36px}
  .split.rev>:first-child{order:0}
  .split .ph,.split .ph.tall{height:340px}
  .grid-3,.cs-grid{grid-template-columns:1fr}
  .grid-2{grid-template-columns:1fr}
  .t5{grid-template-columns:repeat(2,1fr)}
  .thead{gap:16px}
  .pline{grid-template-columns:1fr 1fr;row-gap:26px}
  .pline::before{display:none}
  .cs-card.big{grid-row:auto;min-height:420px}
  .cta-box{grid-template-columns:1fr}
  .cta-box .t{padding:36px 26px}
  .cta-box .ph{min-height:280px}
  .fcta{grid-template-columns:1fr}
  .cs-item{grid-template-columns:1fr}
  .cs-item .cs-vis{min-height:200px}
  .post-grid .wp-block-post-template{grid-template-columns:1fr 1fr}
  .post-cta{grid-template-columns:1fr}
  .menu a.navlink{padding:10px 8px;font-size:13.5px}
}
@media(max-width:980px){
  .nav{height:66px}
  .menu{display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--sh-lg);padding:14px 16px 20px;max-height:calc(100vh - 66px);overflow:auto}
  .menu.open{display:flex}
  .menu a.navlink{font-size:16px;padding:12px 14px}
  .navwrap{justify-content:space-between}
  .caret{font-size:14px;padding:12px 14px}
  .mega{position:static;transform:none;width:auto;display:none;box-shadow:none;border:0;padding:4px 0 10px 14px;grid-template-columns:1fr;gap:12px}
  .has-mega:hover .mega{display:none}
  .has-mega.open .mega{display:grid}
  .burger{display:block}
  .cta-head{margin:10px 0 0}
  .cta-head .btn{width:100%}
  .dept-nav{top:66px}
}
@media(max-width:700px){
  :root{--lh:36px}
  section{padding-block:72px}
  .hero,.page-home .hero{padding-block:40px 52px}
  .hero .lead{font-size:18px}
  .hero .eyebrow{font-size:11px;letter-spacing:.12em}
  .hvis{height:300px}
  .hvis .p1{width:100%;height:100%;border-radius:22px 22px 22px 70px}
  .hvis .p2{display:none}
  .hvis{height:auto}
  .hvis .p1{position:relative;height:300px}
  .hvis .fcard{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:230px;margin:-34px 12px 0 auto}
  .hphoto{min-height:300px}
  .hphoto .ph,.hphoto.v .ph{width:100%;border-radius:22px 22px 22px 70px}
  .hphoto .fcard{left:12px;bottom:12px}
  .hchip{top:12px;right:12px;font-size:12.5px;padding:8px 14px}
  .hpanel .fcard:nth-child(n){margin-left:0}
  .compare .fcard:nth-child(n){margin:0}
  .btn-row{gap:6px}
  .nums{grid-template-columns:1fr 1fr;gap:22px 18px}
  .nums .meta{padding-left:0;border-left:0}
  .mq2>div{gap:40px}
  .close{font-size:17px}
  .cs-card.big .n{font-size:64px}
  .grid-4,.kpis,.f2{grid-template-columns:1fr}
  .post-grid .wp-block-post-template{grid-template-columns:1fr}
  .pfoot{flex-direction:column;align-items:flex-start}
  .qslot{padding:18px}
  .fcta>div{flex-direction:column;align-items:flex-start}
  .fgrid{grid-template-columns:minmax(0,1fr);gap:30px}
  .fcta{grid-template-columns:minmax(0,1fr)}
  .site-footer .fmark{display:none}
  .links{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
  .links .fh{grid-column:1/-1}
  .legal{flex-direction:column}
  .timeline>div{grid-template-columns:1fr;gap:6px}
  .dept-head{gap:14px}
  .dept-head .dnum{font-size:38px}
  .form-card{padding:24px 20px}
  .cs-body{padding:24px 22px}
  .post-cta{padding:28px 24px}
  .m-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:90;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .3s ease}
  .m-cta.show{transform:none}
  .mega .mm-d{display:none}
  .m-cta .btn{display:flex;width:100%}
  body{padding-bottom:76px}
  .top-btn{bottom:90px;right:14px}
}
@media(max-width:560px){
  .t5{grid-template-columns:1fr;gap:10px}
  .t5 li{position:relative;padding:20px 18px 18px 78px}
  .t5 .L{position:absolute;left:20px;top:18px;font-size:44px}
  .t5 .en{margin-top:2px}
  .t5 h3{margin-top:4px}
  .t5 .get{margin-top:12px;padding-top:10px}
  .pline{grid-template-columns:1fr;row-gap:18px}
  .pline::before{display:block;left:7px;right:auto;top:10px;bottom:10px;width:2px;height:auto;background:linear-gradient(180deg,var(--teal),var(--gold))}
  .pline>div{padding:0 0 0 32px}
  .pline>div::before{top:3px}
  .path{padding:24px 22px}
  .tk-row{grid-template-columns:1fr;gap:12px;padding:22px}
  .tk-give{grid-column:auto}
  .card{padding:24px 22px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}

/* ================================================================== */
/* v1.9 — fascia dei numeri, visual dei reparti, settori e landing     */
/* ================================================================== */

/* Fascia dei numeri: pannello scuro che aggancia l'apertura */
.page-home .hero{padding-bottom:112px}
.trust-band{padding-block:0 50px}
.proof{position:relative;z-index:3;margin-top:-76px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2fr);gap:40px;align-items:center;padding:30px 38px;border-radius:26px;color:#fff;background:radial-gradient(520px 220px at 0% 0%,rgba(15,117,134,.6),transparent 70%),linear-gradient(115deg,#10333B 0%,#0B4C58 100%);box-shadow:0 30px 70px rgba(16,51,59,.28)}
.proof h2{font-size:clamp(20px,1.9vw,25px);line-height:1.24;color:#fff;letter-spacing:-.01em}
.proof h2 span{color:var(--gold)}
.proof .nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.15fr);gap:24px;justify-content:stretch;align-items:center}
.proof .nums b{color:#fff;font-size:clamp(28px,2.6vw,38px)}
.proof .nums b i{font-style:normal;color:var(--gold)}
.proof .nums span{color:#BFE6E0;max-width:170px}
.proof .nums .meta{border-left:1px solid rgba(255,255,255,.18);padding-left:24px}
.proof .nums .meta img{height:48px;background:#fff;border-radius:9px;padding:4px 7px}
.proof .nums .meta span{color:#fff;max-width:110px}
.brands-lbl{display:flex;align-items:center;justify-content:center;gap:18px;margin:44px auto 4px;padding-inline:24px;font-size:14px;font-weight:600;color:var(--mute)}
.brands-lbl::before,.brands-lbl::after{content:"";height:1px;background:var(--line);flex:0 1 200px}

/* Visual dei quattro reparti: piccole schermate al posto delle icone */
.dcard .ph:has(.ui){height:184px}
.dcard .ph .ui{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:14px 18px}
.ui .uc{width:100%;max-width:236px;background:#fff;border-radius:14px;padding:11px 13px 9px;box-shadow:0 14px 30px rgba(0,0,0,.2)}
.uc-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:11px;color:var(--ink)}
.uc-h b{font-weight:700}
.uc-h em{font-style:normal;color:#0A8F5B;font-weight:700;font-size:10px;white-space:nowrap}
.ui-growth svg{display:block;width:100%;height:auto;margin:7px 0 5px}
.uc-f{display:flex;gap:11px;font-size:9.5px;color:var(--mute);white-space:nowrap}
.uc-f i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:4px;vertical-align:-1px}
.uc-f .g{background:var(--gold)}.uc-f .m{background:var(--teal)}.uc-f .s{background:var(--bord)}
.ui-studio{gap:9px}
.msg{position:relative;width:100%;max-width:236px;border-radius:12px;padding:8px 12px;font-size:11.5px;line-height:1.35;font-weight:600}
.msg span{display:block;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;margin-bottom:2px}
.msg.old{background:rgba(255,255,255,.12);color:rgba(255,255,255,.72)}
.msg.old span{color:rgba(255,255,255,.55)}
.msg.old s{text-decoration-color:rgba(255,255,255,.6)}
.msg.new{background:#fff;color:var(--ink);transform:translateX(12px);box-shadow:0 12px 26px rgba(0,0,0,.22)}
.msg.new span{color:var(--bord)}
.msg.new b{position:absolute;right:-9px;top:-9px;width:22px;height:22px;border-radius:50%;background:var(--gold);color:var(--ink);display:grid;place-items:center;font-size:12px}
.brw{width:100%;max-width:240px;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 14px 30px rgba(0,0,0,.28)}
.brw .bar{display:flex;align-items:center;gap:4px;background:#EAF3F2;padding:6px 8px}
.brw .bar i{width:6px;height:6px;border-radius:50%;background:#C3D6D3}
.brw .bar span{margin-left:6px;font-size:9.5px;color:var(--mute);background:#fff;border-radius:6px;padding:2px 8px;flex:1;white-space:nowrap;overflow:hidden}
.brw ul{list-style:none;padding:5px 10px 7px}
.brw li{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;padding:4px 0;border-bottom:1px solid #EEF4F3}
.brw li:last-child{border-bottom:0}
.brw li b{font-weight:600;color:var(--ink);white-space:nowrap}
.brw li b::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#1AA37A;margin-right:6px}
.brw li em{font-style:normal;color:var(--teal);font-weight:700;font-size:9.5px;white-space:nowrap}
.ui-ai{align-items:stretch!important;padding-inline:24px!important}
.ui-ai .st{position:relative;display:flex;align-items:center;gap:9px;background:#fff;border-radius:11px;padding:6px 10px;font-size:11.5px;font-weight:700;color:var(--ink);box-shadow:0 8px 18px rgba(0,0,0,.14)}
.ui-ai .st+.st{margin-top:11px}
.ui-ai .st+.st::before{content:"";position:absolute;left:21px;top:-12px;height:12px;border-left:2px dashed rgba(16,51,59,.5)}
.ui-ai .st i{flex:none;width:23px;height:23px;border-radius:7px;background:var(--ink);color:var(--gold);display:grid;place-items:center}
.ui-ai .st i svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ui-ai .st:last-child i{background:#1AA37A;color:#fff}

/* Settori: problemi per settore con foto */
.sec-card{padding:0;overflow:hidden;display:flex;flex-direction:column;color:inherit;transition:transform .2s,box-shadow .2s}
.sec-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,51,59,.12)}
.sec-card .sc-img{height:190px;border-radius:0}
.sec-card .sc-img::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(11,17,19,.62),transparent 60%)}
.sec-card .sc-k{position:absolute;left:18px;bottom:14px;z-index:2;color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.sec-card .sc-b{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.sec-card .sc-b .check{flex:1}
.sec-card .link{margin-top:18px}
.pack-body .rg-link{margin-top:10px;font-size:13px}
.pack-body .rg-link a{color:var(--teal);font-weight:600}

/* Menu: sottomenu corto (Settori) */
.mega.mini{width:300px;grid-template-columns:1fr;gap:4px}
.mega.mini .col a.mm-h{padding-top:6px}

/* Landing di settore */
.crumbs{font-size:13px;color:var(--mute);margin-bottom:14px}
.crumbs a{color:var(--teal);font-weight:600}
.crumbs span{margin:0 6px;color:var(--line)}
.hphoto .fcard .n{font-size:34px}
.hphoto .fcard p{font-size:13.5px;margin-top:4px}
/* "Il costo di aspettare": una nota sotto i problemi, come "Quanto costa" in Home (dalla 2.7 non e' piu' una fascia scura) */
.loss-n{margin-top:34px;padding-top:20px;border-top:1px solid var(--line);max-width:900px;font-size:16.5px;font-weight:500;line-height:1.55;color:var(--ink)}
.loss-n b{font-weight:700;color:var(--bord)}
.vs{margin-top:30px;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:#fff;box-shadow:var(--sh)}
.vs-h,.vs-r{display:grid;grid-template-columns:1fr 1fr}
.vs-h span{padding:16px 24px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
.vs-h span:first-child{color:var(--mute);background:#F6F9F9}
.vs-h span:last-child{color:var(--ink);background:#FFF6D9}
.vs-r p{position:relative;padding:16px 24px 16px 50px;font-size:15px;line-height:1.5;border-top:1px solid var(--line)}
.vs-r p:first-child{color:var(--mute);background:#FBFCFC}
.vs-r p:last-child{color:var(--ink);font-weight:600;background:#FFFCF2}
.vs-r p::before{position:absolute;left:22px;top:16px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;font-size:10.5px;font-weight:700}
.vs-r p:first-child::before{content:"\2715";color:#6F8A87;background:#E7F0EE}
.vs-r p:last-child::before{content:"\2713";color:var(--ink);background:var(--gold)}
.g5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:34px}
.g5 .card{padding:24px 20px}
.g5 .L{display:block;font-size:40px;font-weight:800;color:var(--gold);line-height:1}
.g5 .en{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);font-weight:600;margin-top:10px}
.g5 h3{margin-top:6px;font-size:19px}
.g5 p{font-size:14px;margin-top:8px}
.lp-proof{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;margin-top:34px;align-items:stretch}
.case-box{border-radius:var(--r);background:var(--ink);color:#DDEFEC;padding:30px 32px;display:flex;flex-direction:column}
.case-box .k{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--mint)}
.case-box .n{font-size:clamp(44px,4.6vw,60px);font-weight:800;color:var(--gold);line-height:1;margin-top:14px;letter-spacing:-.02em}
.case-box .nl{font-size:17px;font-weight:600;color:#fff;margin-top:8px;line-height:1.4}
.case-box p{font-size:14.5px;margin-top:14px;flex:1}
.case-box .link{color:var(--gold);margin-top:18px}
.clients-box{border-radius:var(--r);background:#fff;border:1px solid var(--line);padding:28px 30px;box-shadow:var(--sh)}
.clients-box .lbl{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.clients-box p{font-size:14.5px;margin-top:10px}
.logo-row{display:flex;flex-wrap:wrap;gap:22px 34px;align-items:center;margin-top:22px}
.logo-row img{height:calc(34px * var(--k,1));width:auto;opacity:.9}
.rg-box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:center;border-radius:24px;padding:34px 38px;color:#fff;background:linear-gradient(150deg,#F7B801 0%,#D96A12 55%,#9C1C46 100%);box-shadow:0 26px 60px rgba(156,28,70,.22)}
.rg-box .pv-status{position:static;display:inline-block}
.rg-box h2{color:#fff;margin-top:12px}
.rg-box p{color:#fff;opacity:.95;margin-top:10px;max-width:640px}
.steps4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:30px}
.steps4 .card{padding:22px 20px}
.steps4 .when{display:inline-block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--ink);background:var(--mint);border-radius:999px;padding:4px 10px}
.steps4 h3{margin-top:12px;font-size:18px}
.steps4 p{font-size:14px;margin-top:8px}

@media(max-width:1100px){
  .proof{grid-template-columns:1fr;gap:22px}
  .g5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .steps4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .lp-proof,.rg-box{grid-template-columns:1fr}
  .g5{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .page-home .hero{padding-bottom:84px}
  .proof{margin-top:-52px;padding:26px 22px;border-radius:22px}
  .proof .nums{grid-template-columns:1fr 1fr;gap:18px}
  .proof .nums .meta{grid-column:1/-1;border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.18);padding-top:16px}
  .brands-lbl{margin-top:34px}
  .vs-h{display:none}
  .vs-r{grid-template-columns:1fr}
  .vs-r p:last-child{border-top:0}
  .vs-r+.vs-r p:first-child{border-top:6px solid #F0FAF8}
  .g5,.steps4{grid-template-columns:1fr}
  .rg-box{padding:28px 24px}
}
.brands-lbl span{white-space:nowrap}
@media(max-width:700px){.brands-lbl::before,.brands-lbl::after{flex:1 1 24px}}
.cs-more{margin-top:18px}
.crumbs span{color:var(--mute)}
.clients-box{display:flex;flex-direction:column;justify-content:center}
.logo-row img{height:calc(40px * var(--k,1))}
.page-settore .cta-sec{padding-top:88px}
@media(max-width:700px){
  .g5 .card{display:grid;grid-template-columns:42px minmax(0,1fr);column-gap:12px;padding:18px 18px 20px}
  .g5 .L{grid-row:1 / span 4;font-size:34px}
  .g5 .en{margin-top:2px}
}

/* ================================================================== */
/* v1.9.1 — pagina Agenzia: bussola, metodo, storia, persone, rete     */
/* ================================================================== */

/* La bussola: quattro regole in forma compatta, dentro "Perche' esistiamo" */
.bmini{margin-top:28px;padding:20px 22px 8px;background:var(--mint-soft);border:1px solid var(--line);border-radius:18px}
.bm-h{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--mute)}
.bm-h svg{flex:none;width:24px;height:24px;fill:none;stroke:var(--teal);stroke-width:1.8}
.bm-h svg path{fill:var(--ink);stroke:none}
.bm-h svg path.ago{fill:var(--gold)}
.bm-h b{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.bm-h span{color:var(--mute)}
.bmini ul{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 22px;margin-top:10px}
.bmini li{display:flex;gap:12px;align-items:flex-start;padding:10px 0 12px;font-size:14px;line-height:1.45}
.bmini li b{display:block;color:var(--ink);font-size:15px;font-weight:700;margin-bottom:2px}
.bmini .pt{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--gold);font-weight:800;font-size:13px}
.bmini li:first-child .pt{background:var(--gold);color:var(--ink)}

/* Il metodo T.H.I.N.K.: cinque tappe su una linea */
.tk2{list-style:none;display:grid;gap:18px;margin-top:40px}
.tk2 li{position:relative;margin-left:96px;display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:28px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px 22px 24px 28px;box-shadow:var(--sh);transition:transform .2s,box-shadow .2s}
.tk2 li:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,51,59,.1)}
.tk2 li:not(:last-child)::before{content:"";position:absolute;left:-62px;top:52px;width:3px;height:calc(100% + 18px);border-radius:2px;background:var(--teal)}
.tk2 li:nth-last-child(2)::before{background:linear-gradient(180deg,var(--teal),var(--gold))}
.tk2 .tk-l{position:absolute;left:-96px;top:17px;z-index:1;width:70px;height:70px;border-radius:50%;font-size:30px;box-shadow:0 0 0 6px #fff}
.sec-mint .tk2 .tk-l{box-shadow:0 0 0 6px var(--mint-soft)}
.tk2 li:last-child .tk-l{background:var(--gold);color:var(--ink)}
.tk2 .en{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--bord);font-weight:700;margin-bottom:6px}
.tk2 h3{font-size:20px;margin-bottom:8px}
.tk2 p{font-size:15px}
.tk2 .tk-give{border-left:3px solid var(--gold);border-radius:4px 14px 14px 4px;padding:16px 18px}
.tk2+.path{margin-top:34px}

/* La storia: dal 2012 a oggi */
.storia{list-style:none;position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px;margin-top:44px}
.storia::before{content:"";position:absolute;left:0;right:0;top:66px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--teal) 0,var(--teal) 70%,var(--gold))}
.storia li{position:relative}
.storia .yr{display:block;font-size:44px;line-height:1;font-weight:800;letter-spacing:-.03em;color:var(--ink);height:44px}
.storia .dot{position:relative;z-index:1;display:block;width:20px;height:20px;margin:14px 0 18px;border-radius:50%;background:#fff;border:4px solid var(--teal);box-shadow:0 0 0 5px #fff}
.sec-mint .storia .dot{box-shadow:0 0 0 5px var(--mint-soft)}
.storia li:last-child .yr{color:var(--teal)}
.storia li:last-child .dot{background:var(--gold);border-color:var(--gold)}
.storia .tag{display:block;padding:0;border-radius:0;background:none;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.storia .tag .todo{margin-top:6px;letter-spacing:.04em}
.storia h3{font-size:17px;margin-top:8px}
.storia p{font-size:14.5px;margin-top:8px}

/* Crediamo nelle persone */
.umani{position:relative;overflow:hidden;text-align:center;padding-block:92px;color:#C9E4E0;background:radial-gradient(620px 300px at 90% 0%,rgba(15,117,134,.6),transparent 70%),radial-gradient(520px 260px at 0% 100%,rgba(247,184,1,.12),transparent 70%),linear-gradient(120deg,#10333B,#0B3F49)}
.umani .wrap{max-width:920px}
.umani .eyebrow{justify-content:center}
.umani .eyebrow::after{content:"";width:26px;height:3px;border-radius:2px;background:var(--gold)}
.umani blockquote{margin-top:6px;font-size:clamp(25px,3.1vw,40px);font-weight:800;line-height:1.2;letter-spacing:-.02em;color:#fff;text-wrap:balance}
.umani .cite{margin-top:18px;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--gold-hi)}
.umani .lead2{max-width:720px;margin:28px auto 0;color:#C9E4E0}

/* Le persone: ognuno con il suo marchio, come la S di Smarthink */
.team{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:42px}
.tm{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--sh);transition:transform .2s,box-shadow .2s}
.tm:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.tm .ph{height:176px;border-radius:0}
.tm .ph img{object-position:50% 22%}
.tm .ph.mono{place-items:start center}
.tm .ph.mono::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 76%,rgba(255,255,255,.09) 0 5deg,transparent 5deg 15deg);pointer-events:none}
/* il marchio come nel logo: la barra scende dal bordo e la lettera la "rompe" in basso */
.tm .ph.mono>span[aria-hidden]{display:block;box-sizing:border-box;width:74px;height:142px;padding:78px 0 0;overflow:hidden;text-align:center;background:#fff;color:var(--teal);font-size:82px;line-height:1;letter-spacing:0;box-shadow:0 16px 28px rgba(0,0,0,.18)}
.tm .ph.mono.larga>span[aria-hidden]{font-size:70px;padding-top:88px}
.tm .ph.mono>span[aria-hidden]::after{display:none}
.tm .ph.v2>span[aria-hidden]{color:#820933}
.tm .ph.v3>span[aria-hidden]{color:var(--ink)}
.tm .ph.v4>span[aria-hidden]{color:#C99500}
.ph.v5{background:radial-gradient(circle at 75% 15%,rgba(15,117,134,.85),transparent 62%),linear-gradient(135deg,#0B1113,#123239)}
.tm .ph.v5>span[aria-hidden]{color:#0B1113}
.tm-b{flex:1;padding:18px 20px 20px}
.tm h3{font-size:20px}
.tm .role{display:block;margin-top:5px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.tm p{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line);font-size:14px;line-height:1.5}
.tm p b{color:var(--ink);font-weight:600}

/* La rete di professionisti */
.rete .ph{height:440px}
.rete .ph img{object-position:8% 50%}

/* Certificazioni e strumenti */
.cert{display:grid;grid-template-columns:300px minmax(0,1fr);gap:48px;align-items:center;padding:36px 44px;background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--sh)}
.cert-badge{display:grid;place-items:center;padding:26px;border-radius:20px;background:var(--mint-soft)}
.cert-badge img{width:100%;max-width:230px;height:auto;border-radius:12px}
.cert-t h2{font-size:clamp(26px,2.6vw,34px)}
.cert-t p{margin-top:12px;font-size:16.5px;max-width:640px}
.tools{margin-top:30px;text-align:center}
.tools>b{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--mute)}
.tools ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:14px}
.tools li{padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:14px;font-weight:600;color:var(--ink)}
.tools p{margin-top:14px;font-size:14.5px;color:var(--mute)}

@media(max-width:1100px){
  .team{grid-template-columns:repeat(3,minmax(0,1fr))}
  .storia{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:34px}
  .storia::before{display:none}
}
@media(max-width:900px){
  .tk2 li{grid-template-columns:1fr;gap:16px}
  .cert{grid-template-columns:1fr;gap:24px;padding:28px 26px}
  .cert-badge{justify-self:start;padding:18px 22px}
  .cert-badge img{max-width:190px}
  .rete .ph{height:300px}
}
@media(max-width:700px){
  .storia{grid-template-columns:1fr;gap:0}
  .storia::before{display:block;left:9px;right:auto;top:12px;bottom:18px;width:3px;height:auto;background:linear-gradient(180deg,var(--teal) 0,var(--teal) 70%,var(--gold))}
  .storia li{padding:0 0 26px 42px}
  .storia li:last-child{padding-bottom:0}
  .storia .yr{font-size:30px;height:auto}
  .storia .dot{position:absolute;left:0;top:6px;margin:0}
  .tk2 li{margin-left:58px;padding:20px 18px}
  .tk2 .tk-l{left:-58px;top:16px;width:46px;height:46px;font-size:21px;box-shadow:0 0 0 5px #fff}
  .tk2 li:not(:last-child)::before{left:-36.5px;top:40px}
  .team{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .tm .ph{height:136px}
  .tm .ph.mono>span[aria-hidden]{width:56px;height:104px;font-size:64px;padding-top:55px}
  .tm .ph.mono.larga>span[aria-hidden]{font-size:54px;padding-top:63px}
  .tm-b{padding:14px 14px 16px}
  .tm h3{font-size:17px}
  .tm .role{font-size:10px;letter-spacing:.08em}
  .tm p{font-size:13px}
  .umani{padding-block:72px}
}
@media(max-width:560px){
  .bmini ul{grid-template-columns:1fr}
  .bm-h{flex-wrap:wrap;row-gap:0}
  .bm-h span{flex-basis:100%;padding-left:34px;font-size:13px}
  .rete .ph{height:240px}
  .tk2{gap:14px}
  .tk2 li{margin-left:0;grid-template-columns:44px minmax(0,1fr);column-gap:14px;row-gap:14px;align-items:start}
  .tk2 li:not(:last-child)::before{display:none}
  .tk2 .tk-l,.sec-mint .tk2 .tk-l{position:static;width:44px;height:44px;font-size:20px;box-shadow:none}
  .tk2 .tk-c{display:contents}
  .tk2 .en{grid-column:2;align-self:center;margin:0}
  .tk2 h3,.tk2 .tk-c p,.tk2 .tk-give{grid-column:1 / -1}
  .tk2 h3{margin:0}
  .tk2 .tk-c p{margin-top:-6px}
}

/* ================================================================== */
/* v1.9.2 — Home: case study con il risultato in primo piano          */
/* ================================================================== */
.csr{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px 28px 24px;box-shadow:var(--sh);color:var(--ink-2);transition:transform .2s,box-shadow .2s}
.csr:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,51,59,.1)}
.csr .kk{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--bord)}
.csr>.n{display:block;margin-top:10px;font-size:54px;font-weight:800;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.csr .nl{margin-top:8px;font-size:16px;line-height:1.45;color:var(--ink-2)}
.csr .link{margin-top:auto;padding-top:18px;font-size:14px;font-weight:600;color:var(--teal)}
.csr:hover .link{color:var(--teal-d)}
.csr.big{grid-row:span 2;padding:32px 34px 28px;background:linear-gradient(180deg,var(--mint-soft) 0,#fff 62%)}
.csr-t{margin-top:22px;font-size:21px;font-weight:700;line-height:1.3;color:var(--ink);max-width:460px}
.csr-t .n{display:inline;margin:0;font-size:1em;color:var(--teal)}
.csr.big .nl{font-size:16.5px}
/* 1 euro contro 6 euro: due colonne in proporzione */
.csr-chart{display:flex;align-items:flex-end;justify-content:center;gap:34px;height:250px;margin:22px 0 44px;padding:0 10px;border-bottom:2px solid var(--line)}
.csr-chart .col{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:118px;height:100%;text-align:center}
.csr-chart .col b{font-size:22px;font-weight:800;color:var(--ink);margin-bottom:8px}
.csr-chart .col i{display:block;width:100%;border-radius:12px 12px 0 0;background:var(--teal)}
.csr-chart{position:relative}
.csr-chart .inv i{height:15px}
.csr-chart .ven i{height:180px;background:linear-gradient(180deg,var(--gold-hi),var(--gold))}
.csr-chart .ven b{font-size:30px}
.csr-chart .roas{position:absolute;left:0;top:0;font-size:11px;letter-spacing:.1em;font-weight:700;color:var(--teal-d);background:var(--mint);border-radius:999px;padding:5px 11px}
.csr-chart .col small{position:absolute;left:-12px;right:-12px;top:100%;margin-top:9px;font-size:12.5px;line-height:1.3;color:var(--mute)}
/* prima e dopo */
.csr-bars{margin-top:18px;display:grid;gap:8px}
.csr-bars>div{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:10px}
.csr-bars small{font-size:12px;font-weight:600;color:var(--mute)}
.csr-bars i{display:block;height:12px;border-radius:6px;background:var(--mint);width:74%}
.csr-bars .on i{width:100%;background:linear-gradient(90deg,var(--gold),var(--gold-hi))}
.csr-bars .on small{color:var(--ink)}
/* cosa va in automatico */
.csr-auto{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}
.csr-auto small{width:100%;font-size:12px;font-weight:600;color:var(--mute)}
.csr-auto span{display:inline-flex;align-items:center;gap:6px;padding:5px 12px 5px 9px;border-radius:999px;background:var(--mint-soft);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink)}
.csr-auto span::before{content:"\2713";display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--teal);color:#fff;font-size:10px}
@media(max-width:900px){
  .csr.big{grid-row:auto}
  .csr-chart{height:210px}
  .csr-chart .ven i{height:150px}
  .csr-chart .inv i{height:13px}
}
@media(max-width:700px){
  .csr{padding:22px 22px 20px}
  .csr.big{padding:24px 22px 22px}
  .csr>.n{font-size:46px}
  .csr-t{font-size:19px}
  .csr-chart{gap:22px}
  .csr-chart .col{width:96px}
}

/* ================================================================== */
/* v1.10 — grafica per il telefono                                     */
/* intestazione e menu, barra "prenota", testi, bottoni, card          */
/* compatte, gruppi di card che scorrono di lato, moduli, footer       */
/* ================================================================== */
.m-extra{display:none}
.mprog{display:none}
.hero-grid>*,.split>*,.faq-grid>*,.form-grid>*{min-width:0}
a,button,summary{-webkit-tap-highlight-color:rgba(15,117,134,.12)}
@media(hover:none){
  .btn:active{transform:scale(.98)}
  .card:active,.dcard:active,.csr:active,.post-card:active,.tm:active,a.sec-card:active{transform:scale(.99)}
}

/* ---- intestazione e menu (tablet e telefono) ---- */
@media(max-width:980px){
  .nav{height:64px;padding-inline:20px}
  .logo img{height:34px}
  .hdr{transition:transform .3s ease}
  html.hdr-off .hdr{transform:translateY(-100%)}
  html.hdr-off .admin-bar .hdr{transform:translateY(calc(-100% - 46px))}
  .dept-nav{top:64px;transition:top .3s ease}
  html.hdr-off .dept-nav{top:0}
  html.menu-open{overflow:hidden}

  .burger{display:block;position:relative;flex:none;width:44px;height:44px;padding:0;border-radius:12px;background:var(--mint-soft);border:1px solid var(--line);font-size:0;color:transparent}
  .burger::before,.burger::after,.burger span{content:"";position:absolute;left:12px;width:18px;height:2px;border-radius:2px;background:var(--ink);transition:transform .25s ease,top .25s ease,opacity .2s}
  .burger::before{top:14px}
  .burger span{top:20px}
  .burger::after{top:26px}
  .burger[aria-expanded="true"]{background:#fff}
  .burger[aria-expanded="true"]::before{top:20px;transform:rotate(45deg)}
  .burger[aria-expanded="true"]::after{top:20px;transform:rotate(-45deg)}
  .burger[aria-expanded="true"] span{opacity:0}

  .menu{display:flex;position:absolute;top:100%;left:0;right:0;height:calc(100vh - 64px);height:calc(100dvh - 64px);max-height:none;flex-direction:column;align-items:stretch;gap:0;padding:6px 20px calc(18px + env(safe-area-inset-bottom));background:#fff;border:0;box-shadow:none;overflow-y:auto;overscroll-behavior:contain;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s}
  .menu.open{visibility:visible;opacity:1;transform:none;transition:opacity .22s ease,transform .22s ease}
  .admin-bar .menu{height:calc(100dvh - 110px)}
  .menu>li{border-bottom:1px solid var(--line)}
  .menu a.navlink{font-size:19px;font-weight:600;letter-spacing:-.01em;padding:15px 2px;border-radius:0}
  .menu a.navlink:hover{background:none}
  .menu a.navlink.on{color:var(--teal)}
  .navwrap{display:flex;align-items:center;justify-content:space-between}
  .caret{position:relative;flex:none;width:40px;height:40px;padding:0;border-radius:50%;background:var(--mint-soft);border:0;font-size:0;color:transparent}
  .caret::before{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translate(-50%,-70%) rotate(45deg);transition:transform .2s}
  .has-mega.open .caret{background:var(--mint)}
  .has-mega.open .caret::before{transform:translate(-50%,-25%) rotate(-135deg)}
  .mega{grid-template-columns:1fr 1fr;gap:16px 18px;padding:2px 0 18px}
  .mega.mini{grid-template-columns:1fr}
  .mega .col{display:flex;flex-direction:column;gap:2px}
  .mega .col a{font-size:14.5px;color:var(--ink-2);padding:5px 0}
  .mega .col a.mm-h{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--teal);padding:0 0 4px}
  .mega.mini .col a.mm-h{font-size:16px;letter-spacing:0;text-transform:none;color:var(--ink);padding:8px 0 0}
  .mega:not(.mini) .mm-d{display:none}
  .mega.mini .mm-d{display:block;font-size:13px;color:var(--mute)}
  input,select,textarea{font-size:16px}
  .news input{font-size:16px}
  .m-extra{display:flex;gap:10px;padding:20px 0 0;border-bottom:0!important}
  .m-extra a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:14px;background:var(--mint-soft);border:1px solid var(--line);font-size:15px;font-weight:600;color:var(--ink)}
  .m-extra svg{width:18px;height:18px;fill:none;stroke:var(--teal);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
  .cta-head{margin:0;margin-top:auto;padding-top:12px;border-bottom:0!important}
  .cta-head .btn{width:100%;min-height:54px;font-size:16px}
}

/* ---- telefono ---- */
@media(max-width:700px){
  /* testi e spazi */
  .wrap{padding-inline:20px}
  section{padding-block:60px}
  h1{font-size:clamp(31px,8.8vw,36px);line-height:1.08}
  h2{font-size:clamp(25px,7.2vw,29px);line-height:1.14}
  h3{font-size:18px}
  .lead,.hero .lead{font-size:17px;line-height:1.55}
  .lead2{font-size:16px}
  .eyebrow{font-size:11.5px;margin-bottom:12px}
  .head{margin-bottom:24px;gap:14px}
  .head .btn{padding:11px 18px;font-size:14px}
  .grid-2,.grid-3,.grid-4{margin-top:28px;gap:14px}
  .t5 .en,.t5 .get b,.tk2 .en,.tk-give b,.g5 .en,.steps4 .when{font-size:11px}

  /* apertura delle pagine */
  .hero,.page-home .hero{padding-top:30px}
  .hero .lead{margin-top:16px}
  .hphoto{min-height:280px}
  .split .ph,.split .ph.tall{height:290px}

  /* bottoni: quelli principali prendono tutta la larghezza */
  .btn{min-height:48px}
  .hero .btn-row,.cta-box .btn-row,.rg-box .btn-row,.post-cta .btn-row{flex-direction:column;align-items:stretch;gap:4px}
  .hero .btn-row .btn,.cta-box .btn-row .btn,.rg-box .btn-row .btn,.post-cta .btn-row .btn{width:100%;min-height:54px;font-size:16px}
  .hero .btn-row .link,.cta-box .btn-row .link{justify-content:center}
  .cta-box .t{padding:32px 22px 30px}
  .cta-box .ph{min-height:210px}

  /* card compatte: icona o numero a sinistra, testo a destra */
  .card{padding:20px 18px 20px;border-radius:18px}
  .card:has(>.ico:first-child),.card:has(>.num:first-child){display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:14px;align-items:start}
  .card>.ico:first-child,.card>.num:first-child{grid-row:1 / span 8;width:40px;height:40px;margin:0;border-radius:12px}
  .card>.ico:first-child svg{width:21px;height:21px}
  .card:has(>.ico:first-child)>:not(.ico),.card:has(>.num:first-child)>:not(.num){grid-column:2}
  .card:has(>.ico:first-child) h3,.card:has(>.num:first-child) h3{margin-top:0;font-size:17px}
  .card:has(>.ico:first-child) p,.card:has(>.num:first-child) p{margin-top:6px}

  /* gruppi di card che scorrono di lato */
  :is(.tk2,.steps4,.cs-res,.page-home .grid-4,.page-home .post-grid .wp-block-post-template,.page-settori .grid-3,.page-reparti .grid-2,.page-automazioni .grid-3){display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:20px;margin-inline:-20px;padding:4px 20px 14px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  :is(.tk2,.steps4,.cs-res,.page-home .grid-4,.page-home .post-grid .wp-block-post-template,.page-settori .grid-3,.page-reparti .grid-2,.page-automazioni .grid-3)::-webkit-scrollbar{display:none}
  :is(.tk2,.steps4,.cs-res,.page-home .grid-4,.page-home .post-grid .wp-block-post-template,.page-settori .grid-3,.page-reparti .grid-2,.page-automazioni .grid-3)>*{flex:0 0 84%;max-width:340px;min-width:0;scroll-snap-align:start}
  .mprog{display:block;position:relative;height:4px;width:72px;margin:10px auto 0;border-radius:4px;background:var(--line);overflow:hidden}
  .mprog[hidden]{display:none}
  .mprog i{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:var(--teal);transition:transform .08s linear}
  .think-sec .mprog,.sec-dark .mprog{background:rgba(255,255,255,.18)}
  .think-sec .mprog i,.sec-dark .mprog i{background:var(--gold)}
  /* dentro i caroselli le card di servizio restano con l'icona sopra */
  .page-reparti .grid-2>.card{display:block}
  .page-reparti .grid-2>.card>.ico:first-child{margin-bottom:14px}
  /* (dalla 2.5 i cinque passi del metodo, in Home e nelle landing, restano uno sotto l'altro:
     sono brevi e si leggono in fila, senza scorrere di lato) */
  /* metodo nella pagina Agenzia: card in fila */
  .tk2 li{margin-left:0;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px;row-gap:12px;align-items:start;padding:20px 18px}
  .tk2 li:not(:last-child)::before{display:none}
  .tk2 .tk-l,.sec-mint .tk2 .tk-l{position:static;width:44px;height:44px;font-size:20px;box-shadow:none}
  .tk2 .tk-c{display:contents}
  .tk2 .en{grid-column:2;align-self:center;margin:0}
  .tk2 h3,.tk2 .tk-c p,.tk2 .tk-give{grid-column:1 / -1}
  .tk2 h3{margin:0}
  .tk2 .tk-c p{margin-top:-4px}
  .tk2 li:hover{transform:none}
  /* case study in Home */
  .csr{padding:22px 20px 20px}
  .csr.big{padding:22px 20px 20px}
  .csr-chart{height:190px;margin:16px 0 40px}
  .csr-chart .ven i{height:130px}
  .csr-chart .inv i{height:11px}
  .csr-t{font-size:18px;margin-top:0}
  /* articoli in Home */
  .page-home .post-grid .wp-block-post-template{max-width:none}
  .page-home .post-card .wp-block-post-featured-image{margin-bottom:14px}
  .page-home .post-card>*{padding-inline:18px}
  /* persone: due righe che scorrono di lato */
  .team{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-template-rows:repeat(2,auto);grid-auto-columns:44%;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:20px;margin:28px -20px 0;padding:4px 20px 14px;scrollbar-width:none}
  .team::-webkit-scrollbar{display:none}
  .team>.tm{scroll-snap-align:start}

  /* elenco articoli (Risorse e archivi): immagine a sinistra, titolo a destra */
  .page-risorse .post-grid .wp-block-post-template,.wp-block-query.post-grid .wp-block-post-template{gap:12px}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card{display:grid;grid-template-columns:104px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:14px;padding:12px;border-radius:18px;align-items:start}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card>*{padding-inline:0}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card .wp-block-post-featured-image{grid-row:1 / span 4;grid-column:1;margin:0;aspect-ratio:1/1!important;border-radius:12px}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card>:not(.wp-block-post-featured-image){grid-column:2}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card .wp-block-post-terms{font-size:10.5px;padding-top:2px}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card .wp-block-post-title{font-size:15.5px;line-height:1.3;margin-top:4px}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card .wp-block-post-excerpt{display:none}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card .wp-block-post-date{padding:6px 0 0;font-size:12px}
  /* filtri a una riga che scorre */
  .cat-bar,.faq-nav{flex-wrap:nowrap;overflow-x:auto;margin-inline:-20px;padding:2px 20px 6px;scrollbar-width:none}
  .cat-bar::-webkit-scrollbar,.faq-nav::-webkit-scrollbar{display:none}
  .cat-btn,.faq-nav a{flex:none;min-height:40px;display:inline-flex;align-items:center}

  /* domande frequenti */
  details{padding:0}
  summary{padding:16px 0;min-height:58px;font-size:16px;line-height:1.35}
  summary::after{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--mint-soft);font-size:20px;color:var(--teal)}
  details[open]{padding-bottom:16px}
  details p{margin-top:0;font-size:15.5px}

  /* moduli: testo a 16px (niente zoom automatico su iPhone), campi alti */
  input,select,textarea{font-size:16px;min-height:50px}
  textarea{min-height:120px}
  input[type=checkbox],input[type=radio]{width:22px;height:22px;min-height:0;flex:none}
  .form-card{padding:22px 18px;border-radius:20px}
  .form-card .btn[type=submit],.form-card button[type=submit]{width:100%;min-height:54px;font-size:16px}
  .news input{font-size:16px;min-height:48px}
  .news .btn{min-height:48px}

  /* barra "prenota" che galleggia in basso, con il tasto per chiamare */
  .m-cta{display:flex;align-items:center;gap:8px;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));padding:8px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.94);box-shadow:0 14px 34px rgba(16,51,59,.18);transform:translateY(calc(100% + 30px))}
  .m-cta .btn{flex:1;width:auto;min-height:50px;font-size:15.5px;padding-inline:14px}
  .m-tel{flex:none;display:grid;place-items:center;width:50px;height:50px;border-radius:16px;background:var(--ink);color:#fff}
  .m-tel svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
  html.menu-open .m-cta{transform:translateY(calc(100% + 30px))}
  body{padding-bottom:0}
  .top-btn{display:none}

  /* footer */
  .site-footer{padding:44px 0 26px}
  .fcta{gap:12px;padding-bottom:28px;margin-bottom:30px}
  .fcta>div{padding:20px;gap:14px}
  .fcta .btn{width:100%}
  .fgrid{gap:28px}
  .site-footer .col a{padding:7px 0}
  .links a{padding:8px 0}
  .legal{margin-top:30px;gap:8px}
}

/* ================================================================== */
/* v1.11 — case study, testimonianze, prenotazione in due passaggi     */
/* ================================================================== */

/* Case study: la stessa lingua della Home (risultato in primo piano) */
.csl{display:grid;gap:22px;margin-top:40px}
.csx{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.35fr);background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--sh);scroll-margin-top:100px}
.csx-vis{position:relative;display:flex;flex-direction:column;padding:30px 32px 28px;background:linear-gradient(180deg,var(--mint-soft) 0,#fff 100%);border-right:1px solid var(--line)}
.csx-vis .kk{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--bord)}
.csx-vis .n{display:block;margin-top:12px;font-size:clamp(46px,4.6vw,64px);font-weight:800;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.csx-vis .nl{margin-top:8px;font-size:17px;font-weight:600;line-height:1.4;color:var(--ink)}
.csx-vis .csr-chart{height:200px;margin:26px 0 44px}
.csx-vis .csr-chart .ven i{height:140px}
.csx-vis .csr-chart .inv i{height:12px}
.csx-vis .csr-bars{margin-top:26px}
.csx-vis .csr-auto{margin-top:18px}
.csx-vis{justify-content:center}
.csx-vis>.todo{align-self:flex-start;margin-top:18px;padding-top:0}
.csr-kpi{margin-top:18px;font-size:15px;color:var(--ink-2)}
.csr-kpi b{font-size:26px;font-weight:800;color:var(--teal);margin-right:4px}
/* tre mesi di agenda piena */
.csr-cal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:26px}
.csr-cal>div{display:grid;grid-template-columns:repeat(2,1fr);gap:5px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#fff}
.csr-cal small{grid-column:1/-1;font-size:11px;font-weight:600;color:var(--mute)}
.csr-cal i{height:14px;border-radius:4px;background:var(--teal)}
.csr-cal>div:last-child i{background:var(--gold)}
.csx-body{padding:30px 34px 28px}
.csx-body h3{margin-top:14px;font-size:23px}
.csx-steps{list-style:none;counter-reset:passo;margin-top:18px;display:grid;gap:14px}
.csx-steps li{position:relative;counter-increment:passo;padding-left:44px}
.csx-steps li::before{content:counter(passo);position:absolute;left:0;top:0;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--gold);font-size:13px;font-weight:800}
.csx-steps li:not(:last-child)::after{content:"";position:absolute;left:13px;top:32px;bottom:-12px;width:2px;background:var(--line)}
.csx-steps li:last-child::before{background:var(--gold);color:var(--ink)}
.csx-steps b{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:700;margin-top:5px}
.csx-steps p{margin-top:6px;font-size:15px}
.csx .cs-more{margin-top:20px}

/* Testimonianze */
.testi-wrap{margin-top:44px}
.testi-wrap>h2,.testi-wrap>h3{margin-top:0}
.testi-wrap>h3{font-size:clamp(22px,2.2vw,28px)}

/* Contatti: prenotazione in due passaggi */
.hero-call .hero-grid{align-items:start;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
@media(max-width:900px){
  .hero-call .hero-grid{grid-template-columns:1fr;gap:0}
  /* sul telefono il modulo sale subito dopo il titolo; rassicurazioni e contatti dopo */
  .hero-call .hero-grid>div:first-child{display:contents}
  .hero-call .call-card{order:1;margin-top:26px}
  .hero-call .call-list{order:2;margin-top:30px}
  .hero-call .call-alt{order:3}
}
.call-list{margin-top:24px;max-width:520px}
.call-alt{margin-top:22px;font-size:15px;line-height:1.7}
.call-alt a{color:var(--teal);font-weight:600}
.call-card{scroll-margin-top:90px}
.passi-top{display:flex;align-items:center;gap:14px}
.passi-top[hidden],.passo[hidden],.passo-fine[hidden],.form-err[hidden]{display:none}
.passi-n{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--teal);white-space:nowrap}
.passi-n b{color:var(--ink)}
.passi-bar{flex:1;height:6px;border-radius:6px;background:var(--mint);overflow:hidden}
.passi-bar i{display:block;height:100%;width:50%;border-radius:6px;background:linear-gradient(90deg,var(--teal),var(--gold));transition:width .35s ease}
.passo{display:block;border:0;padding:0;margin:0;min-width:0}
.passo>*+*{margin-top:16px}
.passo legend{float:left;width:100%;padding:0;margin-bottom:4px;font-size:21px;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.passo legend+*{clear:both}
.passo legend:focus,.passo-fine h3:focus{outline:none}
.passo .btn{width:100%;min-height:52px;font-size:16px}
.passi-nota{font-size:13px;color:var(--mute);text-align:center}
.passi-azioni{display:grid;gap:4px}
.passi-salta{background:none;border:0;font:inherit;font-size:14.5px;font-weight:600;color:var(--teal);cursor:pointer;padding:12px}
.passo-fine{text-align:center;padding:14px 4px 6px}
.passo-fine .ok-ico{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 14px;border-radius:50%;background:var(--mint);color:var(--teal);font-size:26px;font-weight:800}
.passo-fine h3{font-size:22px}
.passo-fine p{margin:10px auto 20px;max-width:400px;font-size:15.5px}
.form-err{background:var(--pink);color:var(--bord);border-left:3px solid var(--bord);padding:12px 14px;border-radius:10px;font-size:14.5px}

/* Articoli: il servizio collegato nel box finale */
.post-serv{margin-top:14px!important;padding-top:14px;border-top:1px solid rgba(255,255,255,.14);font-size:14.5px!important;color:#C9E4E0}
.post-serv a{color:var(--gold-hi);font-weight:600;white-space:nowrap}
.post-body a{color:var(--teal);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

@media(max-width:900px){
  .csx{grid-template-columns:1fr}
  .csx-vis{border-right:0;border-bottom:1px solid var(--line)}
}
@media(max-width:700px){
  .csl{gap:16px;margin-top:28px}
  .csx{border-radius:20px}
  .csx-vis{padding:22px 20px 20px}
  .csx-vis .n{font-size:44px}
  .csx-vis .csr-chart{height:170px;margin:18px 0 40px}
  .csx-vis .csr-chart .ven i{height:118px}
  .csx-vis .csr-chart .inv i{height:10px}
  .csx-body{padding:22px 20px 22px}
  .csx-body h3{font-size:20px}
  .csx-steps li{padding-left:40px}
  .testi-wrap{margin-top:34px}
  .call-card{margin-top:4px}
  .passo legend{font-size:19px}
}

/* ================================================================== */
/* v1.12 — Home: "Ti riconosci?", case study, fascia dei numeri        */
/* ================================================================== */

/* Ti riconosci? Il problema, e quanto costa */
.bridge{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:26px;padding:22px 26px;border-radius:20px;background:var(--ink);color:#C9E4E0;box-shadow:0 18px 40px rgba(16,51,59,.16)}
.bridge p{font-size:15.5px;max-width:720px}
.bridge b{display:block;margin-bottom:2px;font-size:20px;color:#fff;letter-spacing:-.01em}
.bridge .btn{flex:none}

/* Case study in Home: tre card uguali, il risultato in alto */
.cs3{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.cs3 .csr{padding:0;overflow:hidden}
.csr-top{position:relative;padding:24px 24px 22px;background:linear-gradient(180deg,var(--mint-soft) 0,#fff 100%);border-bottom:1px solid var(--line)}
.csr-top .roas,.csx-vis .roas{position:relative;top:-.35em;display:inline-block;margin-left:12px;vertical-align:middle;font-size:10.5px;line-height:1.4;letter-spacing:.1em;font-weight:700;color:var(--teal-d);background:var(--mint);border-radius:999px;padding:5px 11px}
.csr-top .n{display:block;margin-top:14px;font-size:clamp(44px,3.9vw,54px);font-weight:800;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.csr-top .nl{margin-top:8px;min-height:2.9em;font-size:15px;line-height:1.45;color:var(--ink-2)}
.rbars{display:grid;gap:10px;margin-top:18px}
.rbars>div{display:grid;grid-template-columns:84px minmax(0,1fr) 48px;align-items:center;gap:10px}
.rbars span{font-size:12px;font-weight:600;color:var(--mute);white-space:nowrap}
.rbars i{position:relative;display:block;height:12px;border-radius:6px;background:var(--mint);overflow:hidden}
.rbars i::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--v,50%);border-radius:6px;background:var(--teal)}
.rbars .on i::before{background:linear-gradient(90deg,var(--gold),var(--gold-hi))}
.rbars .on span{color:var(--ink)}
.rbars b{font-size:13.5px;font-weight:800;color:var(--ink);text-align:right;white-space:nowrap}
.csr-b{display:flex;flex-direction:column;flex:1;padding:18px 24px 22px}
.csr-b p{font-size:15px;line-height:1.5;color:var(--ink-2)}
.csr-b .link{margin-top:auto;padding-top:14px}
.csx-vis .rbars{margin-top:24px}
.csx-vis .rbars>div{grid-template-columns:96px minmax(0,1fr) 54px}

/* Fascia dei numeri: numeri allineati in alto */
.proof .nums{align-items:start}
.proof .nums .meta{align-self:center}

@media(max-width:900px){
  .cs3{grid-template-columns:1fr}
}
@media(max-width:700px){
  /* Ti riconosci? */
  .bridge{flex-direction:column;align-items:stretch;gap:16px;padding:22px 20px}
  .bridge b{font-size:18px}
  .bridge p{font-size:15px}
  .bridge .btn{width:100%;min-height:52px}
  /* case study: nel carosello le card restano uguali */
  .cs3>.csr{flex:0 0 86%}
  .csr-top{padding:20px 18px 18px}
  .csr-top .n{font-size:44px}
  .rbars>div{grid-template-columns:74px minmax(0,1fr) 44px;gap:8px}
  .csr-b{padding:16px 18px 18px}
  .csr-b p{font-size:14.5px}
  /* fascia dei numeri: un numero per riga, etichetta accanto */
  .proof{padding:24px 22px 20px}
  .proof h2{font-size:21px;line-height:1.28}
  .proof .nums{display:block;margin-top:2px}
  .proof .nums>div{display:grid;grid-template-columns:118px minmax(0,1fr);align-items:center;gap:14px;padding:14px 0;border-top:1px solid rgba(255,255,255,.14)}
  .proof .nums>div:last-child{padding-bottom:2px}
  .proof .nums b{font-size:31px}
  .proof .nums span{margin:0;max-width:none;font-size:14px;line-height:1.4}
  .proof .nums .meta{grid-column:auto;border-left:0;padding-left:0;padding-top:14px}
  .proof .nums .meta img{height:44px;justify-self:start}
  .proof .nums .meta span{max-width:none;font-size:14px}
}

/* ================================================================== */
/* v1.13 — testimonianze illustrate ("Ti riconosci?" dalla 2.6 sta in home2.css) */
/* ================================================================== */

/* Testimonianze: il logo del cliente (o una sua foto approvata), le sue parole */
.testi-wrap{margin-top:44px}
.page-home .testi-wrap{padding:40px 40px 44px;border-radius:28px;background:var(--mint-soft)}
.testi-wrap>h2,.testi-wrap>h3{margin-top:0}
.testi-wrap>h3{font-size:clamp(22px,2.2vw,30px)}
.testi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:26px}
.testi:has(>.tq:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.testi:has(>.tq:only-child){grid-template-columns:1fr}
.tq{position:relative;display:flex;flex-direction:column;margin:0;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:var(--sh);transition:transform .2s,box-shadow .2s}
.tq:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,51,59,.1)}
.tq-vis{position:relative;flex:none;aspect-ratio:16/10;max-height:260px;overflow:hidden;background:linear-gradient(135deg,var(--mint-soft),var(--mint))}
.tq-vis>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.tq:hover .tq-vis>img{transform:scale(1.04)}
.tq-vis:has(>img)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;z-index:1;background:linear-gradient(0deg,rgba(11,17,19,.34),rgba(11,17,19,0));pointer-events:none}
/* di base (nessuna foto scelta, o foto che non si carica): il logo del cliente con settore e citta' */
.tq-vis:not(:has(>img)){display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;aspect-ratio:auto;height:176px;max-height:none;border-bottom:1px solid var(--line);background:radial-gradient(130px 80px at 50% 44%,#fff 0,rgba(255,255,255,0) 100%),linear-gradient(160deg,#F6FCFB 0%,#E2F4F0 100%)}
.tq-vis:not(:has(>img)) .tq-badge{position:relative;left:auto;bottom:auto;transform:none;height:auto;min-width:0;padding:0;border-radius:0;background:none;box-shadow:none}
.tq-vis:not(:has(>img)) .tq-badge img{height:calc(50px * var(--k,1));max-width:180px}
.tq:hover .tq-vis:not(:has(>img)) .tq-badge{transform:translateY(-2px);transition:transform .25s}
.tq-sett{position:relative;z-index:2;padding:0 14px;text-align:center;font-size:10.5px;line-height:1.35;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.tq-sett::before{content:"";display:block;width:22px;height:2px;margin:0 auto 9px;border-radius:2px;background:var(--gold)}
.tq-sett small{display:block;margin-top:3px;font-size:11.5px;letter-spacing:.02em;text-transform:none;font-weight:500;color:var(--mute)}
.tq-vis:has(>img) .tq-sett{display:none}
.tq-badge{position:absolute;left:18px;bottom:14px;z-index:2;display:flex;align-items:center;justify-content:center;min-width:70px;height:50px;margin:0;padding:0 12px;border-radius:12px;background:#fff;box-shadow:0 10px 24px rgba(16,51,59,.16)}
.tq-badge img{width:auto;height:calc(28px * var(--k,1));max-width:112px;object-fit:contain;opacity:1}
.tq-b{display:flex;flex-direction:column;flex:1;padding:22px 22px 20px}
.tq blockquote{flex:1;font-size:15.5px;line-height:1.55;font-weight:500;color:var(--ink)}
.tq blockquote::before{content:"\201C";display:block;height:24px;margin-bottom:6px;font:700 56px/1 Georgia,serif;color:var(--gold)}
.tq figcaption{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px;line-height:1.35;color:var(--mute)}
.tq figcaption b{display:block;font-size:15px;color:var(--ink)}
.tq-b>.todo{align-self:flex-start;margin-top:12px;white-space:normal}
/* una sola testimonianza (landing): immagine a sinistra */
.testi:has(>.tq:only-child) .tq{flex-direction:row}
.testi:has(>.tq:only-child) .tq-vis{flex:0 0 40%;aspect-ratio:auto;max-height:none;min-height:260px;height:auto}
.testi:has(>.tq:only-child) .tq-vis:not(:has(>img)){border-bottom:0;border-right:1px solid var(--line)}
.testi:has(>.tq:only-child) .tq-vis:not(:has(>img)) .tq-badge img{height:calc(58px * var(--k,1));max-width:220px}
.testi:has(>.tq:only-child) .tq-b{justify-content:center;padding:34px 36px 30px}
.testi:has(>.tq:only-child) blockquote{flex:none;font-size:19px}
.testi:has(>.tq:nth-child(2):last-child) .tq-vis{max-height:280px}

@media(max-width:1100px){
  .testi{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .page-home .testi-wrap{margin-inline:-20px;padding:30px 20px 26px;border-radius:0}
  .testi-wrap{margin-top:34px}
  .testi{display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:20px;margin:20px -20px 0;padding:4px 20px 14px;scrollbar-width:none}
  .testi::-webkit-scrollbar{display:none}
  .testi>.tq{flex:0 0 84%;max-width:330px;scroll-snap-align:start}
  .testi>.tq:only-child{flex-basis:100%;max-width:none}
  .testi:has(>.tq:only-child) .tq{flex-direction:column}
  .testi:has(>.tq:only-child) .tq-vis{flex:none;aspect-ratio:16/10;min-height:0}
  .testi:has(>.tq:only-child) .tq-vis:not(:has(>img)){aspect-ratio:auto;height:150px;border-right:0;border-bottom:1px solid var(--line)}
  .tq-vis:not(:has(>img)){height:146px}
  .testi:has(>.tq:only-child) .tq-b{padding:20px 20px 20px}
  .testi:has(>.tq:only-child) blockquote{font-size:16px}
  .tq-b{padding:18px 20px 18px}
  .tq blockquote{font-size:15px}
}


/* ================================================================== */
/* v1.16 — Settori: tre percorsi attivi                                */
/* ================================================================== */

/* apertura: si sceglie subito il proprio settore */
.sel{display:grid;gap:12px}
.sel-h{display:flex;align-items:center;gap:12px;margin-bottom:2px;font-size:13px;font-weight:600;color:var(--mute)}
.sel-h span{padding:6px 12px;border-radius:999px;background:var(--gold);color:var(--ink);font-size:12px;font-weight:700;letter-spacing:.02em}
.sel-i{position:relative;display:block;padding:16px 54px 16px 20px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);transition:transform .2s,box-shadow .2s,border-color .2s}
.sel-i:hover{transform:translateX(4px);border-color:#9FD3CB;box-shadow:0 16px 34px rgba(16,51,59,.12)}
.sel-i::after{content:"\2192";position:absolute;right:18px;top:50%;display:grid;place-items:center;width:30px;height:30px;margin-top:-15px;border-radius:50%;background:var(--mint-soft);color:var(--teal);font-weight:700;transition:background .2s,color .2s}
.sel-i:hover::after{background:var(--teal);color:#fff}
.sel-k{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--bord)}
.sel-i b{display:block;margin-top:4px;font-size:17px;line-height:1.3;color:var(--ink)}
.sel-s,.sec-card .sc-st{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:#0A7A4E}
.sel-s{margin-top:8px}
.sel-s::before,.sec-card .sc-st::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#1AA37A;box-shadow:0 0 0 4px rgba(26,163,122,.16)}

/* card dei percorsi: problema, cosa facciamo, prova */
.secs{align-items:stretch}
.sec-card .sc-st{position:absolute;left:14px;top:14px;z-index:2;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.94);font-size:11.5px;font-weight:700}
.sec-card .sc-st::before{box-shadow:none}
.sec-card .sc-b h3{font-size:20px}
.secs .sec-card .sc-b h3{min-height:2.5em}
.sc-loss{margin-top:12px;padding:11px 13px;border-radius:12px;background:#FCEFF3;color:var(--bord);font-size:14px!important;line-height:1.45}
.sc-loss b{display:block;margin-bottom:2px;color:var(--bord);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase}
.sc-l{margin-top:16px!important;font-size:10.5px!important;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.sec-card .sc-b .check{flex:none;margin-top:4px}
.sc-proof{display:flex;align-items:center;gap:12px;margin-top:16px;padding-top:14px;border-top:1px dashed var(--line)}
.sc-proof .n{flex:none;font-size:28px;font-weight:800;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.sc-proof span:last-child{font-size:13.5px;line-height:1.4;color:var(--ink-2)}
.sc-logos{margin-top:14px;gap:12px 20px}
.sc-logos img{height:calc(26px * var(--k,1))}
.sec-card .link{margin-top:auto;padding-top:18px}

/* riquadro "percorso attivo" nelle landing di sanita' e industria */
.rg-box.med{background:linear-gradient(150deg,#2FB1C7 0%,#0F7586 55%,#0B4450 100%);box-shadow:0 26px 60px rgba(11,85,99,.25)}
.rg-box.ind{background:linear-gradient(150deg,#3A5560 0%,#1d3a42 55%,#101C20 100%);box-shadow:0 26px 60px rgba(16,28,32,.25)}
.rg-box .todo{white-space:normal}

@media(max-width:900px){
  .sel{margin-top:6px}
}
@media(max-width:700px){
  .sel-i{padding:14px 50px 14px 16px;border-radius:16px}
  .sel-i b{font-size:16px}
  .sec-card .sc-b h3{font-size:18px}
  .secs .sec-card .sc-b h3{min-height:0}
  .sc-proof .n{font-size:24px}
}

/* ================================================================== */
/* v1.17 — Settori: un capitolo per settore, Retrogusto in primo piano */
/* ================================================================== */

/* apertura: Retrogusto e' la prima scelta, con i colori del percorso */
.sel-d{display:block;margin-top:3px;font-size:14px;line-height:1.45;color:var(--ink-2)}
.sel-i.sel-rg{padding-block:20px;border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#F7B801,#D96A12 55%,#9C1C46) border-box;box-shadow:0 18px 40px rgba(156,28,70,.14)}
.sel-i.sel-rg:hover{border-color:transparent;box-shadow:0 22px 46px rgba(156,28,70,.2)}
.sel-rg .sel-k{color:#B4461A}
.sel-rg b{display:inline-block;font-size:23px;letter-spacing:-.01em;background:linear-gradient(90deg,#C4520F,#9C1C46);-webkit-background-clip:text;background-clip:text;color:transparent}
.sel-rg::after{background:linear-gradient(135deg,#D96A12,#9C1C46);color:#fff}
.sel-i.sel-rg:hover::after{background:linear-gradient(135deg,#C4520F,#7E1438)}
.hero .lead b{color:var(--ink);font-weight:600}

/* capitoli: marchio del percorso, promessa, prova, cosa facciamo */
.sx.rg-sec{background:radial-gradient(760px 420px at 94% 4%,rgba(247,184,1,.13),transparent 70%),linear-gradient(180deg,#FFF8EC 0%,#FFFCF7 55%,#fff 100%)}
.sx-brand{display:inline-grid;grid-template-columns:50px auto auto;grid-template-areas:"ico name st" "ico sub st";column-gap:14px;align-items:center;margin-bottom:24px;padding:10px 18px 10px 10px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.sx-brand::before{content:"";grid-area:ico;width:50px;height:50px;border-radius:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 3.5h5v6h6v5h-6v6h-5v-6h-6v-5h6z'/%3E%3C/svg%3E") center/26px no-repeat,linear-gradient(145deg,#2FB1C7 0%,#0F7586 55%,#0B4450 100%)}
.sx-brand.rg::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V7'/%3E%3Cpath d='M12 7c-1.3-1.5-1.3-3.5 0-5 1.3 1.5 1.3 3.5 0 5z'/%3E%3Cpath d='M12 11c-2 0-3.4-1.4-3.6-3.4 2 .2 3.4 1.6 3.6 3.4zM12 11c2 0 3.4-1.4 3.6-3.4-2 .2-3.4 1.6-3.6 3.4z'/%3E%3Cpath d='M12 15c-2 0-3.4-1.4-3.6-3.4 2 .2 3.4 1.6 3.6 3.4zM12 15c2 0 3.4-1.4 3.6-3.4-2 .2-3.4 1.6-3.6 3.4z'/%3E%3Cpath d='M12 19c-2 0-3.4-1.4-3.6-3.4 2 .2 3.4 1.6 3.6 3.4zM12 19c2 0 3.4-1.4 3.6-3.4-2 .2-3.4 1.6-3.6 3.4z'/%3E%3C/svg%3E") center/28px no-repeat,linear-gradient(145deg,#F7B801 0%,#D96A12 55%,#9C1C46 100%)}
.sx-brand.ind::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 20V14l5-3v3l5-3v3l5-3V4h3v16z'/%3E%3Cpath d='M6.5 17h2M11 17h2M15.5 17h2'/%3E%3C/svg%3E") center/26px no-repeat,linear-gradient(145deg,#3A5560 0%,#1d3a42 55%,#101C20 100%)}
.sx-brand b{grid-area:name;align-self:end;justify-self:start;font-size:19px;line-height:1.2;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.sx-brand em{grid-area:sub;align-self:start;font-style:normal;font-size:13.5px;line-height:1.35;color:var(--mute)}
.sx-brand.rg b{font-size:24px;background:linear-gradient(90deg,#C4520F,#9C1C46);-webkit-background-clip:text;background-clip:text;color:transparent}
.sx-brand.rg{border-color:#F1E3CF}
.sx-st{grid-area:st;align-self:stretch;display:flex;align-items:center;gap:7px;margin-left:4px;padding-left:16px;border-left:1px solid var(--line);font-size:12px;font-weight:700;color:#0A7A4E;white-space:nowrap}
.sx-st::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#1AA37A;box-shadow:0 0 0 4px rgba(26,163,122,.16)}
.sx h2{font-size:clamp(30px,3.3vw,44px)}
.sx .lead2{font-size:17.5px;max-width:560px}
.sx .lead2 b{color:var(--ink);font-weight:600}

/* chi lavora gia' con noi in quel settore */
.sx-cl{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}
.sx-cl>span{flex:none;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--mute)}
.sx-cl .logo-row{margin-top:0;gap:12px 26px}
.sx-cl .logo-row img{height:calc(28px * var(--k,1))}
.rg-sec .sx-cl{border-top-color:#F1E3CF}

/* pulsanti: Retrogusto ha i suoi colori */
.sx .btn-row{margin-top:26px;column-gap:8px}
.sx .btn-row .link{padding-inline:8px 0}
.btn-rg{background:linear-gradient(135deg,#C4520F 0%,#A8322E 52%,#9C1C46 100%);color:#fff;box-shadow:0 10px 26px rgba(156,28,70,.26)}
.btn-rg:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(156,28,70,.36);color:#fff}
.rg-sec .btn-row .link{color:#A83A1C}
.rg-sec .btn-row .link:hover{color:#9C1C46}

/* foto con il risultato; nei capitoli alternati la foto passa a sinistra */
.sx .sx-img{min-height:470px}
.sx .sx-img .ph{height:auto;border-radius:28px 28px 28px 110px}
.sx .split.rev .sx-img .ph{right:auto;left:0;border-radius:28px 28px 110px 28px}
.sx .split.rev .sx-img .fcard{left:auto;right:0}
.sx-img .fcard p{margin-top:4px;font-size:13.5px;line-height:1.45;color:var(--ink-2)}
.rg-sec .fcard .n{display:inline-block;background:linear-gradient(90deg,#C4520F,#9C1C46);-webkit-background-clip:text;background-clip:text;color:transparent}
.sx-chip.rg{background:linear-gradient(135deg,#C4520F,#9C1C46);color:#fff;box-shadow:0 14px 30px rgba(156,28,70,.32)}

/* le quattro cose che facciamo in ogni settore */
.sx-feat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:64px}
.sx-feat>div{position:relative;padding:24px 22px 22px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.sx-feat>div::before{content:"";display:block;width:34px;height:4px;margin-bottom:16px;border-radius:2px;background:var(--teal)}
.rg-sec .sx-feat>div{border-color:#F1E3CF}
.rg-sec .sx-feat>div::before{background:linear-gradient(90deg,#F7B801,#D96A12,#9C1C46)}
#industria .sx-feat>div::before{background:var(--gold)}
.sec-mint .sx-feat>div{border-color:transparent}
.sx-feat b{display:block;font-size:17px;line-height:1.3;color:var(--ink)}
.sx-feat p{margin-top:8px;font-size:14.5px;line-height:1.55}

/* riquadri dei percorsi nelle landing: stessi colori, testo sempre leggibile */
.rg-box{background:radial-gradient(460px 240px at 100% 0%,rgba(247,184,1,.30),transparent 70%),linear-gradient(150deg,#C4520F 0%,#A8322E 55%,#8E1A40 100%)}
.rg-box.med{background:radial-gradient(460px 240px at 100% 0%,rgba(47,177,199,.45),transparent 70%),linear-gradient(150deg,#0F7F92 0%,#0B5F6E 55%,#0B4450 100%)}

@media(max-width:1100px){
  .sx-feat{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* tablet e telefono: marchio, promessa, prova, cosa facciamo, clienti, pulsanti */
@media(max-width:900px){
  .sx .wrap{display:flex;flex-direction:column}
  .sx .sx-top,.sx .sx-t{display:contents}
  .sx-brand{order:1;align-self:flex-start}
  .sx h2{order:2}
  .sx .lead2{order:3;max-width:none}
  .sx .sx-img{order:4;margin-top:30px;min-height:380px}
  .sx-feat{order:5;margin-top:40px}
  .sx-cl{order:6}
  .sx .btn-row{order:7}
}
@media(max-width:700px){
  .sel-rg b{font-size:21px}
  .sx .sx-img{min-height:300px}
  .sx .sx-img .ph,.sx .split.rev .sx-img .ph{left:0;right:0;width:100%;border-radius:22px 22px 22px 70px}
  .sx .split.rev .sx-img .fcard{left:12px;right:auto}
  .sx-brand{grid-template-columns:44px auto;grid-template-areas:"ico name" "ico sub" "st st";padding:10px 16px 10px 10px}
  .sx-brand::before{width:44px;height:44px;border-radius:12px;background-size:23px,cover}
  .sx-brand.rg::before{background-size:25px,cover}
  .sx-brand b{font-size:17px}
  .sx-brand.rg b{font-size:22px}
  .sx-brand em{font-size:13px}
  .sx-st{margin:10px 0 0;padding:9px 0 0;border-left:0;border-top:1px dashed var(--line)}
  .sx-feat{grid-template-columns:1fr;gap:10px;margin-top:30px}
  .sx-feat>div{padding:15px 16px 16px 20px;border-radius:14px;box-shadow:none}
  .sx-feat>div::before{position:absolute;left:0;top:16px;bottom:16px;width:4px;height:auto;margin:0;border-radius:0 3px 3px 0}
  .rg-sec .sx-feat>div::before{background:linear-gradient(180deg,#F7B801,#D96A12,#9C1C46)}
  .sx-feat b{font-size:16px}
  .sx-feat p{margin-top:4px;font-size:14px}
  .sx-cl{gap:10px 18px}
  .sx-cl>span{flex-basis:100%}
  .sx-cl .logo-row{gap:10px 22px}
  .sx-cl .logo-row img{height:calc(24px * var(--k,1))}
  .sx .btn-row{flex-direction:column;align-items:stretch;gap:4px}
  .sx .btn-row .btn{width:100%;min-height:54px;font-size:16px}
  .sx .btn-row .link{justify-content:center}
}

/* v1.17.1 — Settori: i clienti scritti per nome */
.hero-cl{margin-top:22px;max-width:540px;font-size:14.5px;line-height:1.55;color:var(--mute)}
.hero-cl b{color:var(--ink);font-weight:600}
.sx-cl{flex-direction:column;align-items:flex-start;gap:14px}
.sx-cl p{font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.sx-cl p b{color:var(--ink);font-weight:600}
.sx-cl .logo-row img.alto{height:calc(36px * var(--k,1))}
@media(max-width:700px){
  .hero-cl{margin-top:16px;font-size:14px}
  .sx-cl p{font-size:14px}
  .sx-cl .logo-row img.alto{height:calc(31px * var(--k,1))}
}

/* v1.17.2 — newsletter del footer con il consenso privacy */
.news form{flex-wrap:wrap}
.news .chk{flex-basis:100%;order:3;gap:9px;margin-top:4px;font-size:12.5px;line-height:1.45;color:#9FB3B6}
.news .chk input{flex:none;width:16px;height:16px;min-height:0;margin-top:1px;padding:0;border-radius:4px;accent-color:var(--gold)}
.news .chk a{color:#D7E6E4;text-decoration:underline}
.news .form-msg{order:4}

/* ================================================================== */
/* v1.18 — immagini degli articoli                                     */
/* ================================================================== */

/* immagini degli articoli: riquadro 4:5 (il formato dei post Instagram); se l'immagine ha
   un'altra forma, i lati si riempiono con la stessa immagine sfocata al posto delle bande */
.post-card .wp-block-post-featured-image,.post-grid.square .post-card .wp-block-post-featured-image,.post-grid.tall .post-card .wp-block-post-featured-image{position:relative;isolation:isolate;aspect-ratio:4/5;background:var(--teal-d)}
.wp-block-post-featured-image[style*="--bg"]::before{content:"";position:absolute;inset:-40px;z-index:0;background:var(--bg) center/cover no-repeat;filter:blur(28px) saturate(1.15) brightness(.92);opacity:.9}
.post-card .wp-block-post-featured-image img{filter:drop-shadow(0 10px 22px rgba(0,0,0,.22))}
.post-card .wp-block-post-featured-image a{position:relative;z-index:1}
.post-grid .post-card>.wp-block-post-featured-image{padding:0}
/* WordPress mette object-fit:cover nello stile dell'immagine: qui serve vederla intera */
.post-card .wp-block-post-featured-image img{position:relative;z-index:1;object-fit:contain!important;transition:transform .5s ease}
.post-card:hover .wp-block-post-featured-image img{transform:scale(1.03)}
/* articolo: sottotitolo sotto il titolo e immagine in un riquadro largo, non piu' a tutta altezza */
.post-head .post-lead{margin-top:16px;max-width:760px;font-size:clamp(17px,1.5vw,19px);line-height:1.6;color:var(--ink-2)}
.post-head .post-lead .wp-block-post-excerpt__more-text{display:none}
.post-wrap .wp-block-post-featured-image{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:16/10;margin:0 0 40px;border-radius:22px;background:var(--teal-d);box-shadow:var(--sh-lg)}
.post-wrap .wp-block-post-featured-image img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain!important;border-radius:0;box-shadow:none;filter:drop-shadow(0 14px 30px rgba(0,0,0,.28))}

@media(max-width:700px){
  .post-wrap .wp-block-post-featured-image{aspect-ratio:4/5;margin-bottom:28px;border-radius:18px}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card{grid-template-columns:92px minmax(0,1fr)}
  :is(.page-risorse,.wp-block-query.post-grid) .post-card .wp-block-post-featured-image{aspect-ratio:4/5!important}
}

/* ================================================================== */
/* v1.19 — case study: lo stesso pannello dei risultati in Home e nella */
/* pagina Case study                                                    */
/* ================================================================== */

/* pannello scuro: settore, numero, frase e il dato disegnato in proporzione */
.res{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:28px 28px 26px;color:#fff;background:radial-gradient(380px 240px at 100% 0%,rgba(247,184,1,.18),transparent 70%),linear-gradient(155deg,#15505C 0%,#10333B 55%,#0B1F24 100%)}
.res .kk{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--gold-hi)}
.res-n{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin-top:12px}
.res .res-n .n{display:block;margin:0;font-size:clamp(46px,4.2vw,58px);font-weight:800;line-height:1;letter-spacing:-.03em;color:var(--gold)}
.res .res-n .roas{position:static;top:auto;display:inline-block;margin:0;padding:6px 12px;border-radius:999px;border:1.5px solid rgba(247,184,1,.55);background:none;color:var(--gold-hi);font-size:12px;line-height:1.2;font-weight:700;letter-spacing:.04em;vertical-align:baseline}
.res .nl{margin:10px 0 22px;max-width:340px;font-size:15.5px;line-height:1.45;font-weight:600;color:#fff}
.res-data{--c:16px;display:grid;gap:12px;margin-top:auto;padding:14px 16px 16px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
/* in ogni riga: etichetta e valore sopra, il disegno sotto a tutta larghezza */
.res-data .r{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"l b" "v v";align-items:center;column-gap:12px;row-gap:7px}
.res-data .l{grid-area:l;font-size:12px;line-height:1.2;font-weight:600;color:rgba(255,255,255,.72)}
.res-data b{grid-area:b;justify-self:end;font-size:13.5px;line-height:1.2;color:#fff;white-space:nowrap}
.res-data .u,.res-data .bar,.res-data .mesi{grid-area:v}
.res-data .on b{color:var(--gold-hi)}
/* quadratini: ognuno vale un euro, un'ora, una settimana */
.res-data .u{display:flex;flex-wrap:wrap;gap:4px}
.res-data .u.h20{max-width:calc(var(--c) * 10 + 36px)}
.res-data .u.m3{gap:10px}
.res-data .u.m3 em{display:flex;gap:4px}
.res-data i{display:block;flex:none;width:var(--c);height:var(--c);border-radius:4px;background:#7FD1C4}
.res-data .on i{background:linear-gradient(180deg,var(--gold-hi),var(--gold))}
/* barre: la traccia e' il punto di partenza, il pieno e' il risultato */
.res-data .bar{position:relative;display:block;height:12px;border-radius:999px;background:rgba(255,255,255,.12)}
.res-data .bar i{position:absolute;left:0;top:0;bottom:0;width:var(--v);height:auto;border-radius:inherit}
.res-data .mesi{display:flex;gap:10px;font-size:10.5px;color:rgba(255,255,255,.6)}
.res-data .mesi span{width:calc(var(--c) * 4 + 12px);text-align:center}
.res-data .r.leg{margin-top:-8px;row-gap:0}

/* Home: tre case study della stessa misura (pannelli e testi allineati tra le card) */
.csc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto;column-gap:20px;row-gap:0}
.csc{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0;overflow:hidden;border-radius:22px;background:#fff;box-shadow:0 14px 34px rgba(16,51,59,.1);transition:transform .25s,box-shadow .25s}
.csc:hover{transform:translateY(-3px);box-shadow:0 22px 46px rgba(16,51,59,.16)}
.csc .res-data{min-height:140px;align-content:center}
.csc-b{display:flex;flex-direction:column;padding:22px 26px 24px;border:1px solid var(--line);border-top:0;border-radius:0 0 22px 22px}
.csc-b h3{font-size:18px;line-height:1.3}
.csc-b p{margin-top:8px;font-size:14.5px;line-height:1.55}
.csc-b .link{margin-top:auto;padding-top:16px;font-size:14.5px}

/* pagina Case study: stesso pannello a sinistra, il racconto a destra */
.csx{border:0;box-shadow:0 14px 34px rgba(16,51,59,.1)}
.csx-vis.res{justify-content:center;padding:34px 34px 30px;border-right:0}
.csx-vis.res .res-n .n{font-size:clamp(50px,4.8vw,66px)}
.csx-vis.res .nl{font-size:17px;margin-bottom:24px}
.csx-vis.res .res-data{--c:19px;margin-top:0}
.csx-vis.res>.todo{margin-top:16px}
.csx-body{border:1px solid var(--line);border-left:0;border-radius:0 24px 24px 0}

@media(max-width:900px){
  .csc-grid{grid-template-columns:1fr;grid-template-rows:none;row-gap:16px}
  .csc{grid-row:auto;grid-template-rows:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .csc-b{justify-content:center;border-top:1px solid var(--line);border-left:0;border-radius:0 22px 22px 0}
  .csc-b .link{margin-top:0;padding-top:16px}
  .csx-vis.res{border-bottom:0}
  .csx-body{border-left:1px solid var(--line);border-top:0;border-radius:0 0 24px 24px}
}
@media(max-width:700px){
  .csc{display:flex;flex-direction:column;border-radius:20px}
  .csc .res{min-height:300px;padding:22px 20px 20px}
  .csc .res-data{min-height:124px}
  .csx-vis.res .res-data{--c:15px}
  .res .res-n .n{font-size:44px}
  .res .res-n .roas{font-size:11px;padding:5px 10px}
  .res .nl{font-size:15px;margin-bottom:18px}
  .res-data{--c:14px;padding:12px 12px 14px;gap:10px}
  .res-data .l{font-size:11.5px}
  .res-data b{font-size:12.5px}
  .res-data .u{gap:3px}
  .res-data .u.h20{max-width:calc(var(--c) * 10 + 27px)}
  .res-data .mesi span{width:calc(var(--c) * 4 + 9px)}
  .res-data .u.m3 em{gap:3px}
  .res-data i{border-radius:3px}
  .csc-b{padding:18px 20px 20px;border-top:0;border-left:1px solid var(--line);border-radius:0 0 20px 20px;justify-content:flex-start}
  .csc-b .link{margin-top:auto}
  .csc-b h3{font-size:17px}
  .csx-vis.res{padding:24px 20px 22px}
  .csx-vis.res .res-n .n{font-size:46px}
  .csx-body{border-radius:0 0 20px 20px}
}

/* v1.21 — tag in fondo agli articoli */
.post-tags{max-width:720px;margin:34px auto 0;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:0}
.post-tags .wp-block-post-terms__prefix{margin-right:4px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--mute)}
.post-tags a{display:inline-flex;align-items:center;padding:6px 13px;border-radius:999px;background:var(--mint-soft);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--teal-d);transition:background .2s,border-color .2s}
.post-tags a::before{content:"#";margin-right:2px;color:var(--gold-d)}
.post-tags a:hover{background:var(--mint);border-color:#9FD3CB}
.post-tags .wp-block-post-terms__separator{display:none}

/* v1.21 — avatar disegnati del team (al posto delle iniziali) */
.tm .ph img.avatar{object-fit:contain;object-position:50% 100%;transform-origin:50% 100%;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.tm:hover .ph img.avatar{transform:scale(1.04)}
@media (prefers-reduced-motion:reduce){.tm .ph img.avatar{transition:none}.tm:hover .ph img.avatar{transform:none}}

/* v1.22 — valori ("Prima i valori, poi le competenze") e card "Potresti essere tu" */
.valori .wrap{max-width:1180px}
.valori h2{margin-top:10px;color:#fff;font-size:clamp(28px,3.4vw,44px);letter-spacing:-.02em;text-wrap:balance}
.valori .lead2{max-width:760px}
.val{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:44px 0 0;padding:0;text-align:left}
.val li{position:relative;display:flex;flex-direction:column;padding:22px 22px 24px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);transition:transform .2s,background .2s,border-color .2s}
.val li:hover{transform:translateY(-3px);background:rgba(255,255,255,.09);border-color:rgba(247,184,1,.45)}
.val .n{font-size:13px;font-weight:800;letter-spacing:.12em;color:var(--gold)}
.val h3{margin-top:10px;font-size:20px;color:#fff;letter-spacing:-.01em}
.val p{margin-top:8px;font-size:14.5px;line-height:1.55;color:#C9E4E0}
.val li.motto{justify-content:space-between;background:var(--gold);border-color:var(--gold);color:var(--ink)}
.val li.motto:hover{background:#FFC929;border-color:#FFC929}
.val li.motto p{margin:0;font-size:18px;line-height:1.35;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.val li.motto span{margin-top:16px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#5C4500}
.umani.valori .mprog{background:rgba(255,255,255,.18)}
.umani.valori .mprog i{background:var(--gold)}
@media (max-width:1100px){.val{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){
  .val{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:20px;margin:30px -20px 0;padding:4px 20px 14px;scrollbar-width:none}
  .val::-webkit-scrollbar{display:none}
  .val li{scroll-snap-align:start;padding:20px}
  .val li.motto p{font-size:17px}
}
.tm-join{color:inherit;text-decoration:none;border:2px dashed #9FD3CB;background:#F7FCFB;box-shadow:none}
.tm-join .ph{opacity:.92}
.tm-join h3{color:var(--teal-d)}
.tm-join p span{color:var(--teal);font-weight:700}
.tm-join:hover{border-color:var(--teal)}
.tm-join:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.vnote{margin-top:22px;max-width:620px;font-size:15.5px;line-height:1.6}
.vnote .link{white-space:nowrap}
/* v1.22.1 — missione, frase di Roosevelt accanto al titolo del team */
.missione h2{font-size:clamp(27px,2.9vw,38px);line-height:1.15;text-wrap:balance}
.people-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:end}
.people-head .lead{margin-top:14px}
.pq{position:relative;margin:0;padding:30px 28px 24px;border-radius:20px;background:var(--mint-soft);border:1px solid var(--line)}
.pq::before{content:"“";position:absolute;top:-6px;left:22px;font:800 64px/1 var(--ff);color:var(--gold)}
.pq blockquote{margin:0;font-size:18.5px;line-height:1.45;font-weight:700;color:var(--ink);letter-spacing:-.005em}
.pq figcaption{margin-top:14px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--teal)}
@media (max-width:900px){.people-head{grid-template-columns:1fr;gap:26px}.pq{max-width:620px}}
@media (max-width:700px){.pq{padding:26px 20px 20px}.pq blockquote{font-size:17px}}

/* v1.23 — rifiniture pagina Agenzia */
.missione .split{align-items:start}
.missione .split>.ph.tall{position:sticky;top:110px;height:min(600px,calc(100vh - 150px));min-height:420px}
.scelta{margin-top:22px;padding:16px 20px;border-left:4px solid var(--gold);border-radius:0 14px 14px 0;background:#FFF8E1;font-size:16.5px;line-height:1.6;color:var(--ink)}
.scelta b{display:block;margin-bottom:2px;font-size:19px;letter-spacing:-.01em}
.pq{padding:34px 30px 26px}
.pq::before{content:"\201C";top:2px;left:24px;font:700 76px/1 Georgia,"Times New Roman",serif;color:var(--gold)}
.pq blockquote{position:relative;padding-top:18px}
.pq figcaption{display:flex;align-items:center;gap:10px}
.pq figcaption::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--gold)}
.patto::before{left:auto;right:3%;top:-60px;font-size:380px;color:rgba(255,255,255,.07)}
@media (max-width:900px){.missione .split>.ph.tall{position:static;height:340px;min-height:0}}
@media (max-width:700px){.missione .split>.ph.tall{height:290px}.scelta{font-size:15.5px}.scelta b{font-size:17.5px}.patto::before{font-size:240px;top:-40px}}

/* v1.23 — foto nei case study: dietro il pannello dei risultati, sfumata nel suo colore.
   Si cambia in Aspetto > Foto del sito (riquadri "Home e Case study · foto del caso ..."). */
.res-ph{position:absolute;inset:0;z-index:0;pointer-events:none;background:#10333B}
.res-ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:saturate(.92)}
.res-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,31,36,.18) 0%,rgba(11,31,36,.45) 22%,rgba(14,42,49,.86) 44%,rgba(16,51,59,.97) 62%,#10333B 100%)}
.res-ph .todo{position:absolute;right:14px;top:14px;z-index:2}
.res:has(.res-ph)>*:not(.res-ph){position:relative;z-index:1}
.csc .res:has(.res-ph){padding-top:128px}
.csx-vis.res:has(.res-ph){justify-content:flex-end;padding-top:190px}
.csx-vis.res .res-ph::after{background:linear-gradient(180deg,rgba(11,31,36,.12) 0%,rgba(11,31,36,.4) 24%,rgba(14,42,49,.84) 46%,rgba(16,51,59,.97) 64%,#10333B 100%)}
.res:has(.res-ph) .kk{text-shadow:0 1px 8px rgba(0,0,0,.35)}
.csc:hover .res-ph img{transform:scale(1.04)}
.res-ph img{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
@media (max-width:900px){.csx-vis.res:has(.res-ph){padding-top:150px}}
@media (max-width:700px){.csc .res:has(.res-ph){padding-top:112px}.csx-vis.res:has(.res-ph){padding-top:130px}}
@media (prefers-reduced-motion:reduce){.res-ph img{transition:none}.csc:hover .res-ph img{transform:none}}
.csx:has(.res-ph) .csx-body{display:flex;flex-direction:column;justify-content:center}
.csx-vis.res:has(.res-ph){padding-top:170px}

/* ================================================================== */
/* v1.24 — revisione grafica di tutto il sito                          */
/* ================================================================== */

/* il riquadro "Vuoi far crescere / Vuoi collaborare" del footer compare solo
   nelle pagine che non hanno gia' un invito finale (niente doppioni in fondo) */
body:has(.cta-sec) .site-footer .fcta,body:has(.post-cta) .site-footer .fcta{display:none}

/* Home: il link al metodo sta nell'intestazione della fascia T.H.I.N.K. */
.think-sec .thead .link{display:block;width:max-content;margin-top:12px;color:var(--gold-hi)}

/* Agenzia: dopo i cinque passi, un solo link (il percorso completo e' in Servizi) */
.tk-more{margin-top:24px;text-align:right}

/* Servizi: ogni reparto ha il suo disegno (lo stesso della Home) accanto al titolo */
.dept-head:has(.dept-vis){display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,380px);gap:0 28px;align-items:center}
.dept-vis{height:190px;border-radius:22px;box-shadow:0 16px 34px rgba(16,51,59,.14)}
.dept-vis::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 115%,rgba(255,255,255,.07) 0 6deg,transparent 6deg 16deg);pointer-events:none}
.dept-vis .ui{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:14px 18px}
.dept-head+.grid-2{margin-top:34px}

/* Automazioni: il percorso di una richiesta, oggi e con le automazioni */
.costo .split{align-items:center}
.flow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px 24px;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--sh-lg);padding:26px 26px 22px}
.flow-row.new{border-left:1px dashed var(--line);padding-left:24px}
.flow-k{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--mute)}
.flow-row.new .flow-k{color:var(--teal)}
.flow ol{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:14px}
.flow li{position:relative;display:flex;align-items:center;min-height:40px;font-size:13.5px;line-height:1.3;font-weight:600;color:#53656A;background:#F4F7F7;border:1px solid #E1E9E8;border-radius:12px;padding:8px 12px}
.flow li+li::before{content:"";position:absolute;left:20px;top:-15px;height:14px;border-left:2px dashed #BCCDCA}
.flow-row.new li{color:var(--ink);background:#E9F6F4;border-color:#BFE3DD}
.flow-row.new li+li::before{border-left:2px solid var(--teal)}
.flow li.ko{color:var(--bord);background:#fff;border:1px dashed rgba(130,9,51,.4)}
.flow li.ok{color:var(--ink);background:var(--gold);border-color:var(--gold);box-shadow:0 8px 18px rgba(247,184,1,.35)}
.flow-foot{grid-column:1/-1;margin:4px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:14.5px;color:var(--ink)}
.flow-foot b{color:var(--teal-d)}

/* Automazioni: il metodo A.C.T. con le stesse card del metodo T.H.I.N.K. */
.sec-dark .t5{margin-top:36px}
.t5.t3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Risorse: in apertura l'ultimo articolo */
.ris-hero .hero-grid{align-items:center}
/* nessun articolo in evidenza: il riquadro sparisce e l'apertura torna a una colonna */
.feat:not(:has(.feat-card)){display:none}
.ris-hero .hero-grid:not(:has(.feat-card)){grid-template-columns:1fr}
.feat-k{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.feat-k::before{content:"";width:22px;height:3px;border-radius:2px;background:var(--gold)}
.feat .wp-block-query,.feat .wp-block-post-template{margin:0;padding:0;list-style:none}
.feat-card{display:grid;grid-template-columns:156px minmax(0,1fr);gap:22px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:14px;box-shadow:var(--sh-lg);transition:transform .25s,box-shadow .25s}
.feat-card:hover{transform:translateY(-3px);box-shadow:0 24px 50px rgba(16,51,59,.16)}
.feat-card>.wp-block-post-featured-image{position:relative;isolation:isolate;margin:0;aspect-ratio:4/5;border-radius:14px;overflow:hidden;background:var(--teal-d)}
.feat-card>.wp-block-post-featured-image a,.feat-card>.wp-block-post-featured-image img{position:relative;z-index:1;display:block;width:100%;height:100%}
/* come nelle card degli articoli: immagine intera, i lati vuoti si riempiono con la stessa immagine sfocata */
.feat-card>.wp-block-post-featured-image img{object-fit:contain!important;filter:drop-shadow(0 8px 18px rgba(0,0,0,.22))}
.feat-b{min-width:0;padding-right:8px}
.feat-b .wp-block-post-terms{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700}
.feat-b .wp-block-post-terms a{color:var(--teal)}
.feat-b .wp-block-post-title{margin-top:6px;font-size:20px;line-height:1.25;letter-spacing:-.01em}
.feat-b .wp-block-post-title a{color:var(--ink);text-decoration:none}
.feat-b .wp-block-post-excerpt{margin-top:8px;font-size:14px;line-height:1.5}
.feat-b .wp-block-post-excerpt__more-text{display:none}
.feat-b .wp-block-post-date{margin-top:10px;font-size:12px;color:var(--mute)}
.more-row{display:flex;justify-content:center;margin-top:34px}
.more-row[hidden]{display:none}

/* Landing di settore: i loghi dei clienti in riquadri, il box non resta vuoto */
.clients-box .logo-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:12px;margin-top:22px}
.clients-box .logo-row img,.clients-box .logo-row img.alto{width:100%;height:76px;object-fit:contain;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:#fff;opacity:1}

@media (max-width:1100px){
  .t5.t3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dept-head:has(.dept-vis){grid-template-columns:auto minmax(0,1fr);align-items:start}
  .dept-vis{grid-column:1/-1;margin-top:22px;height:176px;max-width:520px}
}
@media (max-width:900px){
  .flow{max-width:560px}
}
@media (max-width:700px){
  .t5.t3{grid-template-columns:1fr}
  .dept-vis{display:none}
  .feat-card{grid-template-columns:112px minmax(0,1fr);gap:16px;padding:12px}
  .feat-b .wp-block-post-title{font-size:17px}
  .feat-b .wp-block-post-excerpt{display:none}
  .clients-box .logo-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .flow{grid-template-columns:1fr;padding:22px 18px 18px}
  .flow-row.new{border-left:0;padding-left:0;border-top:1px dashed var(--line);padding-top:16px}
}

/* ================================================================== */
/* v1.24.2 — menu Servizi: ogni voce porta alla sua card              */
/* ================================================================== */
/* la card si ferma sotto intestazione e barra dei reparti, e all'arrivo si illumina un momento */
.page-reparti .card[id]{scroll-margin-top:150px}
.page-reparti .card:target{border-color:var(--gold);animation:card-qui 2.6s ease-out .2s both}
@keyframes card-qui{0%,40%{box-shadow:0 0 0 4px rgba(247,184,1,.5),var(--sh-lg)}100%{box-shadow:0 0 0 1px rgba(247,184,1,.6),var(--sh)}}
@media (prefers-reduced-motion:reduce){.page-reparti .card:target{animation:none;box-shadow:0 0 0 3px rgba(247,184,1,.5),var(--sh)}}
@media (max-width:980px){.page-reparti .card[id]{scroll-margin-top:130px}}
/* sul telefono le card di ogni reparto scorrono di lato: il browser allinea la fila di card e non la
   card, quindi lo spazio per intestazione e barra dei reparti si da' alla pagina (scroll-padding) */
@media (max-width:700px){
  html:has(.page-reparti){scroll-padding-top:140px}
  .page-reparti section[id],.page-reparti .card[id]{scroll-margin-top:0}
}


/* ================================================================== */
/* v1.25 — AI e automazioni: una pagina sola, banner nel menu e in Servizi */
/* ================================================================== */
/* banner nel menu Servizi (al posto della quarta colonna) */
.mm-banner{display:flex;flex-direction:column;gap:6px;padding:18px 18px 16px;border-radius:16px;background:linear-gradient(160deg,var(--teal) 0%,var(--teal-d) 55%,var(--ink) 100%);color:#fff;text-decoration:none;box-shadow:0 14px 30px rgba(16,51,59,.22);transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}
.mm-banner::after{content:"";position:absolute;right:-40px;top:-40px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(247,184,1,.35),rgba(247,184,1,0) 70%)}
.mm-banner:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(16,51,59,.3)}
.mm-banner .mb-k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--gold-hi)}
.mm-banner b{font-size:17px;line-height:1.2;color:#fff}
.mm-banner .mb-d{font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.82)}
.mm-banner .mb-l{display:grid;gap:3px;margin-top:4px}
.mm-banner .mb-l i{position:relative;padding-left:17px;font-style:normal;font-size:12px;font-weight:600;color:#fff}
.mm-banner .mb-l i::before{content:"\2713";position:absolute;left:0;top:0;color:var(--gold-hi);font-weight:800}
.mm-banner .mb-go{margin-top:auto;padding-top:10px;font-size:13px;font-weight:700;color:var(--gold-hi)}

/* reparto 04 in Servizi: banner verso la pagina dedicata */
.ai-banner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 44px;align-items:center;margin-top:36px;padding:36px 40px;border-radius:24px;background:linear-gradient(140deg,var(--teal) 0%,var(--teal-d) 50%,var(--ink) 100%);color:#fff;text-decoration:none;box-shadow:var(--sh-lg);position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s}
.ai-banner::after{content:"";position:absolute;right:-90px;bottom:-110px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(247,184,1,.22),rgba(247,184,1,0) 70%);pointer-events:none}
.ai-banner:hover{transform:translateY(-3px);box-shadow:0 28px 60px rgba(16,51,59,.24)}
.ai-banner .ab-k{display:inline-block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--gold-hi)}
.ai-banner h3{margin-top:10px;font-size:clamp(22px,2.2vw,28px);line-height:1.2;color:#fff}
.ai-banner p{margin-top:12px;color:rgba(255,255,255,.84);font-size:15.5px;line-height:1.6}
.ai-banner .ab-go{display:inline-flex;margin-top:20px;padding:12px 22px;border-radius:999px;background:var(--gold);color:var(--ink);font-weight:700;font-size:15px}
.ai-banner:hover .ab-go{background:var(--gold-hi)}
.ai-banner .ab-l{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px;position:relative;z-index:1}
.ai-banner .ab-l li{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:16px 16px 16px 44px;position:relative;font-size:13.5px;line-height:1.45;color:rgba(255,255,255,.8)}
.ai-banner .ab-l li::before{content:"\2713";position:absolute;left:16px;top:15px;width:18px;height:18px;border-radius:50%;background:var(--gold);color:var(--ink);font-size:11px;font-weight:800;display:grid;place-items:center}
.ai-banner .ab-l b{display:block;color:#fff;font-size:14.5px;margin-bottom:3px}

/* pagina AI e automazioni */
.kpis.k3{grid-template-columns:repeat(3,1fr)}
.sec-dark .act-note{margin-top:30px;color:rgba(255,255,255,.82);font-size:15.5px}
.sec-dark .act-note .link{margin-left:6px;font-weight:700}
.usi-k{margin-top:34px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.acad-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:52px;align-items:center;margin-bottom:40px}
.acad-top .hphoto{min-height:400px}
.acad-norm{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 36px;align-items:center;margin-top:28px}
.acad-norm h3{font-size:18px}
.acad-norm p{margin-top:8px}
.acad-cta{display:flex;flex-direction:column;align-items:flex-start;gap:12px}

@media (max-width:980px){
  .mega{grid-template-columns:1fr 1fr}
  .mm-banner{grid-column:1/-1;margin-top:4px}
  /* telefono: Tech occupa tutta la riga con le voci su due colonne, cosi' non resta un buco accanto */
  .mega:not(.mini) .col:nth-of-type(3){grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:18px}
  .mega:not(.mini) .col:nth-of-type(3) .mm-h{grid-column:1/-1}
  .ai-banner{grid-template-columns:1fr;padding:30px 28px}
  .acad-top{grid-template-columns:1fr;gap:28px}
  .acad-norm{grid-template-columns:1fr}
  .kpis.k3{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:700px){
  .ai-banner{padding:24px 20px;border-radius:20px}
  .ai-banner .ab-l{grid-template-columns:1fr;gap:10px}
  .ai-banner .ab-l li{padding:13px 14px 13px 42px}
  .ai-banner .ab-go{width:100%;justify-content:center}
  .kpis.k3{grid-template-columns:1fr;gap:10px}
  .kpis.k3 .kpi{display:flex;align-items:center;gap:14px;padding:16px 18px}
  .kpis.k3 .kpi .n{flex:0 0 auto;min-width:86px}
  .kpis.k3 .kpi .l{margin-top:0}
  .acad-top .hphoto{min-height:300px}
}
.faq-grid .tk-more{text-align:left;margin-top:16px}

/* ================================================================== */
/* v1.26 — ultimo passaggio grafico                                    */
/* ================================================================== */
/* Contatti e Lavora con noi sono gia' la pagina della call e della candidatura: la fascia
   del footer che rimanda li' non serve */
body:has(.page-contatti) .site-footer .fcta,body:has(.page-lavora) .site-footer .fcta{display:none}
/* articolo: il testo parte dallo stesso bordo sinistro di titolo e immagine */
.post-body{margin-left:0}


/* =====================================================================
   SISTEMA 2.1 — PALCO E PAGINA
   Ogni pagina si apre sul PALCO (notte petrolio, la linea di puntini che
   passa dal rumore all'ordine e sale in oro) e continua sulla PAGINA
   (bianco e menta chiara). Il palco torna nei momenti decisivi: metodo,
   patto di chiarezza, valori, invito finale e footer.
   ===================================================================== */

/* --- il palco come classe a se' (Home: apertura e capitolo del metodo) --- */
.stage{position:relative;background:var(--stage);color:var(--on-stage)}

/* --- l'apertura di ogni pagina e' un palco --- */
.hero{padding-block:calc(var(--hh) + 64px) clamp(140px,15vw,230px);background:var(--stage);color:var(--on-stage);overflow:hidden}
.wp-block-group.page > .hero,main > .hero{margin-top:calc(-1 * var(--hh))!important}
.hero > .wrap{position:relative;z-index:1}
/* la linea: puntini sparsi a sinistra che si mettono in fila e salgono in oro */
.hero::after,.h2-hero::after,.stage-line::after,.archive-head::after,.post-head::after,.cta-box .t::after{content:"";position:absolute;left:0;right:0;bottom:0;height:clamp(110px,15vw,240px);background:url(../img/linea.svg?v=2) right bottom/auto 100% no-repeat;pointer-events:none;opacity:.92}
.post-head::after,.archive-head::after{height:clamp(80px,9vw,150px);opacity:.7}
.cta-box .t::after{height:auto;aspect-ratio:1600/300;background-size:100% auto;opacity:.75;z-index:-1}
.page-home .hero{padding-block:calc(var(--hh) + 56px) clamp(140px,15vw,230px)}

/* --- testi e componenti sul palco --- */
:is(.stage,.hero,.sec-dark,.patto,.post-head,.archive-head) :is(h1,h2,h3,h4){color:#fff}
:is(.stage,.hero,.sec-dark,.patto,.post-head,.archive-head) strong{color:#fff}
:is(.stage,.hero,.sec-dark,.patto,.post-head,.archive-head) .eyebrow{color:var(--cyan)}
:is(.stage,.hero,.sec-dark,.patto) .lead{color:var(--on-stage)}
:is(.stage,.hero,.sec-dark,.patto,.post-head,.archive-head) .link{color:var(--gold-hi)}
:is(.stage,.hero,.sec-dark,.patto,.post-head,.archive-head) .link:hover{color:#fff}
:is(.stage,.hero,.sec-dark,.patto) .btn-g,.hero .btn-w{border-color:rgba(232,251,255,.55);color:#fff;background:transparent}
:is(.stage,.hero,.sec-dark,.patto) .btn-g:hover,.hero .btn-w:hover{background:#fff;color:var(--ink);border-color:#fff}
.hero .lead :is(strong,b){color:#fff}
.hero .fcard{background:var(--veil);border:1px solid var(--stage-line);color:var(--on-stage);box-shadow:0 24px 50px rgba(0,0,0,.32);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.hero .fcard .k{color:var(--cyan)}
.hero .fcard b,.hero .fcard .ct b,.hero .fcard p b{color:#fff}
.hero .fcard .n{color:var(--gold-hi)}
.hero .fcard small{color:var(--stage-mute)}
.hero .fcard .gl li::before{color:var(--cyan)}
.hero .fcard .bars i{background:rgba(211,243,238,.22)}
.hero .tiles span{background:rgba(232,251,255,.08);color:var(--ice)}
.hero .tiles span.on{background:var(--gold);color:var(--ink)}
.hero .hphoto .ph{box-shadow:0 30px 70px rgba(0,0,0,.42)}
.hero .hchip{box-shadow:0 14px 30px rgba(0,0,0,.3)}
.hero .todo{background:#FCEFF3}
.hero :is(.lp-check li,.call-list li,.hero-cl,.call-alt){color:var(--on-stage)}
.hero .hero-cl b{color:#fff}
.hero .lead a{color:var(--gold-hi);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.hero .call-alt a{color:var(--gold-hi)}
.hero .check li{border-color:var(--stage-line)}
.hero .check li::before{background:rgba(98,216,247,.16);color:var(--cyan)}
.hero .crumbs{color:var(--stage-mute)}
.hero .crumbs a{color:var(--cyan)}
.hero .crumbs span{color:var(--stage-mute)}
/* file di bottoncini sotto l'apertura (sezioni della pagina, argomenti delle domande) */
.hero :is(.dn-row a,.faq-nav a){background:rgba(232,251,255,.06);border-color:var(--stage-line);color:var(--ice)}
.hero :is(.dn-row a,.faq-nav a):hover{background:rgba(232,251,255,.14);border-color:rgba(232,251,255,.4);color:#fff}
/* aperture di articoli e archivi: anche loro sotto l'intestazione */
main > .post-head,main > .archive-head{margin-top:calc(-1 * var(--hh))!important}
.post-head > .wrap,.archive-head > .wrap{position:relative;z-index:1}
.post-head .wp-block-post-terms,.post-head .wp-block-post-terms a{color:var(--cyan)}
.post-head .wp-block-post-date,.post-head .post-lead{color:var(--on-stage)}
.archive-head .wp-block-term-description{color:var(--on-stage)}
/* isole chiare dentro il palco (modulo, articolo in evidenza, scelta del settore): restano bianche */
.hero :is(.form-card,.feat,.sel-i){color:var(--ink-2)}
.hero :is(.form-card,.feat,.sel-i) :is(h2,h3,h4,strong,b,legend){color:var(--ink)}
.hero :is(.form-card,.feat,.sel-i) .eyebrow{color:var(--teal)}
.hero :is(.form-card,.feat,.sel-i) .link{color:var(--teal)}
.hero .form-card{box-shadow:0 30px 70px rgba(0,0,0,.4);border-color:transparent}

/* pagine semplici (privacy, cookie...): il titolo diventa la fascia del palco */
.entry > .entry-title{position:relative;max-width:none;margin:calc(-1 * var(--hh)) 0 0;padding:calc(var(--hh) + 64px) max(24px,calc((100% - 820px) / 2)) clamp(96px,10vw,150px);background:var(--stage);color:#fff;overflow:hidden}
.entry > .entry-title::after{content:"";position:absolute;left:0;right:0;bottom:0;height:clamp(70px,8vw,130px);background:url(../img/linea.svg?v=2) right bottom/auto 100% no-repeat;opacity:.7;pointer-events:none}

/* --- intestazione: trasparente sul palco, chiara sulla pagina --- */
html.hdr-dark:not(.menu-open) .site-header{background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
html.hdr-dark:not(.menu-open) .site-header.scrolled{background:rgba(5,27,31,.84);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom-color:rgba(211,243,238,.08)}
html.hdr-dark:not(.menu-open) .site-header .logo img{filter:brightness(0) invert(1)}
html.hdr-dark:not(.menu-open) .menu a.navlink{color:#fff}
html.hdr-dark:not(.menu-open) .menu a.navlink.on{color:var(--gold-hi)}
html.hdr-dark:not(.menu-open) .menu a.navlink:hover{background:rgba(255,255,255,.1);color:#fff}
html.hdr-dark:not(.menu-open) .caret{color:#fff}
html.hdr-dark:not(.menu-open) .caret:hover{background:rgba(255,255,255,.1)}
@media(max-width:980px){
  html.hdr-dark:not(.menu-open) .burger{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
  html.hdr-dark:not(.menu-open) .burger::before,html.hdr-dark:not(.menu-open) .burger::after,html.hdr-dark:not(.menu-open) .burger span{background:#fff}
}
/* barra "Prenota" sul telefono: sempre del palco, uguale su ogni pagina */
.m-cta{background:rgba(5,27,31,.92)!important;border-color:rgba(211,243,238,.14)!important;box-shadow:0 14px 34px rgba(5,27,31,.28)!important}
.m-cta .m-tel{color:#fff!important;border-color:rgba(211,243,238,.2)!important;background:rgba(232,251,255,.06)!important}

/* --- percorsi di settore: card del palco, con la linea nel colore del settore --- */
.rg-box,.rg-box.med,.rg-box.ind{position:relative;overflow:hidden;background:var(--stage);box-shadow:0 26px 60px rgba(5,27,31,.22)}
.rg-box::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#F7B801,#D96A12,#9C1C46)}
.rg-box.med::before{background:linear-gradient(90deg,var(--cyan),var(--teal))}
.rg-box.ind::before{background:linear-gradient(90deg,var(--stage-mute),#3A5560)}
.rg-box p{color:var(--on-stage);opacity:1}
.sx.rg-sec{background:#fff}
/* banner di AI e automazioni (menu e Servizi): stessa notte del palco */
.mm-banner,.ai-banner{background:var(--stage)}
.ai-banner:hover{transform:none}

/* --- card della pagina: piatte, bordo sottile, niente salti al passaggio del mouse --- */
.card:hover{transform:none;box-shadow:var(--sh)}

@media(max-width:900px){
  .hero{padding-block:calc(var(--hh) + 36px) 120px}
  .page-home .hero{padding-block:calc(var(--hh) + 36px) 120px}
  .hero::after,.h2-hero::after,.stage-line::after{height:auto;aspect-ratio:1600/300;background-size:100% auto}

  .post-head{padding-block:calc(var(--hh) + 32px) 56px}
  .archive-head{padding-block:calc(var(--hh) + 32px) 60px}
  .cta-box .t{padding-bottom:80px}
}


/* =====================================================================
   UPGRADE 2.2 — RIFINITURA
   Piu' aria e titoli piu' grandi sulla pagina, card piatte senza "salti",
   riquadri illustrati sulla notte del palco, etichette nei colori del
   sistema, menu del telefono sul palco, footer che chiude con il claim,
   aperture con il campo di puntini ordinati e la linea che si disegna.
   ===================================================================== */

/* --- tipografia e ritmo (computer) --- */
@media(min-width:901px){
  section{padding-block:112px}
  h2{font-size:clamp(30px,1.1rem + 2.3vw,50px);letter-spacing:-.03em;line-height:1.08}
  .lead{font-size:19px;line-height:1.6}
  .head{margin-bottom:48px}
}

/* --- card: niente salti al passaggio del mouse; le card che sono link cambiano solo il bordo --- */
:is(.card,.tk-row,.cs-card,.dcard,.post-card,.sec-card,.tk2 li,.tm,.csr,.tq,.csc,.feat-card,.val li):hover{transform:none}
:is(.dcard,.post-card,.sec-card,.csr,.csc,.feat-card,a.card):hover{box-shadow:none;border-color:rgba(15,117,134,.45)}
:is(.card,.tk-row,.tk2 li,.tm,.tq):hover{box-shadow:none}
.mm-banner:hover,.ai-banner:hover{transform:none}

/* --- riquadri illustrati (servizi in Home e in Servizi): tutti sulla notte del palco --- */
.dcard .ph,.dept-vis,.dept-vis.v1,.dept-vis.v2,.dept-vis.v3,.dept-vis.v4{background:var(--stage)}
.dept-vis::before{background:repeating-conic-gradient(from 0deg at 50% 115%,rgba(211,243,238,.045) 0 6deg,transparent 6deg 16deg)}
.dept-vis{box-shadow:0 16px 34px rgba(5,27,31,.18)}
.msg.new span{color:var(--teal)}
.uc-f .s{background:var(--cyan)}
/* ritratti del team: il fondo bordeaux diventa teal profondo */
.tm .ph.v2{background:linear-gradient(135deg,#0B5563,#0F7586)}
.tm .ph.v2>span[aria-hidden]{color:var(--teal-d)}

/* --- etichette: il bordeaux resta solo per i problemi ("quanto costa", errori, bozze) --- */
:is(.tk-row .en,.timeline .when,.tk2 .en,.csr .kk,.sel-k){color:var(--teal)}
.csx-vis .kk{color:var(--gold-hi)}

/* --- il patto di chiarezza in Home: una frase, non una scheda --- */
.pledge{box-shadow:none;background:none!important;border-left:0;border-top:2px solid var(--gold);border-radius:0;padding:18px 0 0;max-width:520px}

/* --- aperture: campo di puntini ordinati in alto a destra e linea che si disegna all'arrivo --- */
.hero::before,.post-head::before,.archive-head::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(211,243,238,.2) 1px,transparent 1.5px);background-size:24px 24px;-webkit-mask-image:radial-gradient(55% 75% at 92% 12%,#000 0%,transparent 72%);mask-image:radial-gradient(55% 75% at 92% 12%,#000 0%,transparent 72%);pointer-events:none}
.hero::after,.h2-hero::after,.post-head::after,.archive-head::after,.entry > .entry-title::after{-webkit-mask-image:linear-gradient(90deg,#000 45%,transparent 55%);mask-image:linear-gradient(90deg,#000 45%,transparent 55%);-webkit-mask-size:230% 100%;mask-size:230% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:0 0;mask-position:0 0;animation:sm-linea 1.8s .2s cubic-bezier(.55,0,.2,1) both}
@keyframes sm-linea{from{-webkit-mask-position:100% 0;mask-position:100% 0}to{-webkit-mask-position:0 0;mask-position:0 0}}

/* --- footer: chiude con il claim, sulla linea --- */
.site-footer{padding-top:72px}
.fsign{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:24px 40px;flex-wrap:wrap;padding:0 0 56px;margin-bottom:48px;border-bottom:1px solid rgba(255,255,255,.1)}
.fsign::after{content:"";position:absolute;right:-40px;bottom:-1px;width:min(760px,62%);height:170px;background:url(../img/linea.svg?v=2) right bottom/auto 100% no-repeat;opacity:.55;pointer-events:none}
.fclaim{position:relative;z-index:1;margin:0;font-size:clamp(44px,1.6rem + 5.2vw,104px);font-weight:800;line-height:.95;letter-spacing:-.045em;color:#fff}
.fclaim i{font-style:normal;color:var(--gold)}
.fsign-t{position:relative;z-index:1;max-width:36ch;margin:0 0 10px;font-size:16px;line-height:1.5;color:var(--on-stage)}
.site-footer .fmark,.site-footer .fbrand .claim{display:none}
.fcta>div{background:rgba(232,251,255,.04);border-color:var(--stage-line)}
@media(max-width:700px){
  .site-footer{padding-top:52px}
  .fsign{padding-bottom:40px;margin-bottom:36px}
  .fsign::after{right:-20px;width:90%;height:110px;opacity:.45}
}

/* --- menu del telefono: sul palco, come l'intestazione --- */
@media(max-width:980px){
  html.menu-open .site-header{background:var(--night)!important;border-bottom-color:rgba(211,243,238,.1)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
  html.menu-open .site-header .logo img{filter:brightness(0) invert(1)}
  html.menu-open .burger{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
  html.menu-open .burger::before,html.menu-open .burger::after,html.menu-open .burger span{background:#fff}
  .menu{background:var(--night);border-color:rgba(211,243,238,.1)}
  .menu::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:url(../img/linea.svg?v=2) right bottom/auto 100% no-repeat;opacity:.35;pointer-events:none}
  .menu>li{border-bottom-color:rgba(211,243,238,.1)}
  .menu a.navlink{color:#fff}
  .menu a.navlink.on{color:var(--gold-hi)}
  .caret{background:rgba(232,251,255,.08)}
  .caret::before{border-color:#fff}
  .has-mega.open .caret{background:rgba(232,251,255,.16)}
  .mega{background:transparent}
  .mega .col a{color:var(--on-stage)}
  .mega .col a.mm-h{color:var(--cyan)}
  .mega.mini .col a.mm-h{color:#fff}
  .mega.mini .mm-d{color:var(--stage-mute)}
  .m-extra a{background:rgba(232,251,255,.06);border-color:rgba(211,243,238,.14);color:#fff}
  .m-extra svg{stroke:var(--cyan)}
  .cta-head{position:relative;z-index:1}
}

/* --- elenchi di voci con icona (Servizi, problemi delle landing, risultati di AI e automazioni):
       un elenco aperto con l'icona a sinistra e un filo sopra, non scatole. Le card restano per
       cio' che si clicca o ha un'immagine. Sul telefono restano card (scorrono di lato). --- */
@media(min-width:701px){
  :is(.grid-2,.grid-3):has(> .card > .ico:first-child){gap:0 56px;margin-top:40px}
  :is(.grid-2,.grid-3) > .card:has(> .ico:first-child){display:grid;grid-template-columns:46px minmax(0,1fr);column-gap:20px;align-content:start;background:none;border:0;border-top:1px solid var(--line);border-radius:0;padding:28px 0 32px;box-shadow:none}
  :is(.grid-2,.grid-3) > .card:has(> .ico:first-child) > .ico{grid-row:1 / span 6;margin:2px 0 0}
  :is(.grid-2,.grid-3) > .card:has(> .ico:first-child) > :not(.ico){grid-column:2}
  :is(.grid-2,.grid-3) > .card:has(> .ico:first-child) h3{margin-top:0}
  .grid-3:has(> .card > .ico:first-child){gap:0 40px}
  .page-reparti .grid-2 .card:target{animation:none;box-shadow:none;border-top:2px solid var(--gold);background:linear-gradient(180deg,rgba(247,184,1,.09),rgba(247,184,1,0) 85%)}
}

/* problemi delle landing anche sul telefono come elenco aperto (come "Ti riconosci?" in Home), non scatole */
@media(max-width:700px){
  .grid-2:has(> .card > .ico.warn){gap:0}
  .grid-2 > .card:has(> .ico.warn){display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:16px;align-content:start;background:none;border:0;border-top:1px solid var(--line);border-radius:0;padding:22px 0 24px;box-shadow:none}
  .grid-2 > .card:has(> .ico.warn) > .ico{grid-row:1 / span 6;width:44px;height:44px;margin:2px 0 0;border-radius:13px}
  .grid-2 > .card:has(> .ico.warn) > :not(.ico){grid-column:2}
  .grid-2 > .card:has(> .ico.warn) h3{margin-top:0}
  .loss-n{margin-top:22px;font-size:15.5px}
}

/* --- numeri in fila (AI e automazioni): come i numeri della Home, una riga aperta sotto il filo che sale in oro --- */
@media(min-width:701px){
  .kpis{gap:0;border-top:2px solid transparent;border-image:linear-gradient(90deg,var(--line),var(--teal) 55%,var(--gold)) 1}
  .kpi{background:none;border:0;border-radius:0;box-shadow:none;padding:24px 24px 4px 0}
  .kpi + .kpi{padding-left:24px;border-left:1px solid var(--line)}
}

/* ================================================================== */
/* Revisione neuromarketing (2.10): pagine piu' corte, ogni concetto in  */
/* un posto solo, la prova vicino alla decisione                         */
/* ================================================================== */
/* Agenzia: la certificazione Meta in fondo alla storia (era una sezione a se') */
.cert.cert-mini{margin-top:56px;grid-template-columns:190px minmax(0,1fr);gap:32px;padding:22px 30px}
.cert-mini .cert-badge{padding:14px 16px}
.cert-mini .cert-badge img{max-width:150px}
.cert-mini p{margin:0;max-width:680px;font-size:16px;line-height:1.6;color:var(--ink-2)}
.cert-mini p b{color:var(--ink)}
@media(max-width:900px){.cert.cert-mini{grid-template-columns:1fr;gap:16px;padding:22px 22px 24px;margin-top:40px}.cert-mini .cert-badge{justify-self:start}}
/* landing Medicina: le regole della pubblicita' sanitaria come nota sotto il confronto */
.nota-n{margin-top:30px;padding-top:18px;border-top:1px solid var(--line);max-width:900px;font-size:15.5px;line-height:1.6;color:var(--ink-2)}
.nota-n b{font-weight:700;color:var(--teal-d)}
/* AI e automazioni: i numeri sotto il confronto "Oggi / Con le automazioni" */
.costo .kpis{margin-top:56px}
@media(max-width:700px){.costo .kpis{margin-top:36px}}
/* Contatti: una testimonianza accanto al modulo */
.call-quote{margin:30px 0 0;max-width:520px;padding:18px 20px 18px 22px;border-left:3px solid var(--gold);border-radius:4px 16px 16px 4px;background:rgba(232,251,255,.06)}
.call-quote blockquote{margin:0;font-size:15.5px;line-height:1.6;color:#fff}
.call-quote figcaption{margin-top:10px;font-size:13.5px;color:var(--stage-mute)}
.call-quote figcaption b{font-weight:600;color:var(--on-stage)}
@media(max-width:900px){.hero-call .call-quote{order:3;margin-top:24px}.hero-call .call-alt{order:4}}

/* 2.13: citazione di Roosevelt in una fascia sua, sotto i valori (Agenzia) */
.people-head.solo{grid-template-columns:1fr}
.people-head.solo .lead{max-width:780px}
.quote-band{padding-block:88px;background:#fff;text-align:center}
.quote-band .pq{max-width:900px;margin:0 auto;padding:0;background:none;border:0;border-radius:0}
.quote-band .pq::before{position:static;display:block;content:"\201C";font:700 104px/.78 Georgia,"Times New Roman",serif;color:var(--gold);margin:0 0 8px}
.quote-band .pq blockquote{padding-top:0;font-size:clamp(25px,3.1vw,40px);line-height:1.22;font-weight:800;letter-spacing:-.02em;text-wrap:balance}
.quote-band .pq figcaption{justify-content:center;margin-top:24px;font-size:12px}
.quote-band .pq figcaption::after{content:"";width:22px;height:2px;border-radius:2px;background:var(--gold)}
@media (max-width:700px){.quote-band{padding-block:64px}.quote-band .pq::before{font-size:84px}.quote-band .pq blockquote{font-size:23px}}

/* 2.13: etichette di settore anche su due righe: nelle testimonianze affiancate loghi ed etichette partono alla stessa altezza */
.testi:not(:has(>.tq:only-child)) .tq-vis:not(:has(>img)){justify-content:flex-start;padding-top:29px}
.testi:not(:has(>.tq:only-child)) .tq-vis:not(:has(>img)) .tq-badge{min-height:64px}
@media(max-width:700px){.testi:not(:has(>.tq:only-child)) .tq-vis:not(:has(>img)){padding-top:15px}}

/* 2.14: firma degli articoli */
.post-head .post-by{display:flex;align-items:center;gap:12px;margin-top:16px;font-size:14.5px;line-height:1.4;color:var(--on-stage)}
.post-head .post-by img{flex:none;width:42px;height:42px;border-radius:50%;object-fit:cover;background:var(--mint);box-shadow:0 0 0 2px rgba(255,255,255,.18)}
.post-head .post-by a{color:#fff;font-weight:600;text-decoration:underline;text-decoration-color:rgba(247,184,1,.7);text-underline-offset:3px}
.post-head .wp-block-post-date+.wp-block-html,.post-head .wp-block-post-date+.post-by{margin-top:0}

/* 2.14: tabelle di confronto negli articoli: da telefono ogni riga diventa una scheda */
@media (max-width:700px){
  .post-body .tab-card{overflow:visible}
  .post-body .tab-card table,.post-body .tab-card tbody,.post-body .tab-card tr,.post-body .tab-card td{display:block;width:auto}
  .post-body .tab-card thead{display:none}
  .post-body .tab-card tr{margin:0 0 12px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--sh)}
  .post-body .tab-card td{border:0;padding:5px 0;font-size:15.5px;line-height:1.55}
  .post-body .tab-card td:first-child{padding-top:0;font-weight:700;font-size:17px;color:var(--ink)}
  .post-body .tab-card td+td::before{content:attr(data-label);display:block;margin-bottom:1px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--teal)}
}

/* =====================================================================
   2.16 — Risorse: l'articolo in evidenza resta con la sua immagine, in una scheda scura
   e trasparente sul palco (niente riquadro bianco): immagine, categoria, titolo e "Leggi l'articolo".
   ===================================================================== */
.ris-hero .feat-card{grid-template-columns:150px minmax(0,1fr);gap:24px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:14px;box-shadow:0 30px 60px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ris-hero .feat-card:hover{border-color:rgba(247,184,1,.5);box-shadow:0 34px 66px rgba(0,0,0,.36)}
.ris-hero .feat-card>.wp-block-post-featured-image{border-radius:16px;--mr:16px}
.ris-hero .feat-b .wp-block-post-terms,.ris-hero .feat-b .wp-block-post-terms a{color:var(--cyan)}
.ris-hero .feat-b .wp-block-post-title{font-size:21px;line-height:1.25}
.ris-hero .feat-b .wp-block-post-title a{color:#fff}
.ris-hero .feat-b .wp-block-post-title a:hover{color:var(--gold-hi)}
.ris-hero .feat-b .wp-block-read-more{display:inline-block;margin-top:14px;font-size:14.5px;font-weight:600;color:var(--gold-hi);text-decoration:none}
.ris-hero .feat-card:hover .wp-block-read-more .arr{translate:5px 0}
@media(max-width:700px){
  .ris-hero .feat-card{grid-template-columns:104px minmax(0,1fr);gap:16px;padding:12px;border-radius:20px}
  .ris-hero .feat-b .wp-block-post-title{font-size:17px}
  .ris-hero .feat-b .wp-block-read-more{margin-top:8px;font-size:14px}
}
.ris-hero .feat-k{color:var(--cyan)}

/* =====================================================================
   2.17 — Siti web, SEO e GEO
   - i numeri in apertura della pagina hanno la fonte sotto, in piccolo;
   - il report di visibilita' e' un'illustrazione (numeri di esempio): il riquadro scuro con le
     domande in cui un assistente AI ti cita, poi le righe con le barre che si riempiono.
   ===================================================================== */
.kpi .l small{display:block;margin-top:6px;font-size:12px;line-height:1.4;color:var(--mute);opacity:.85}
.vrep{background:#fff;border:1px solid var(--line);border-radius:24px;padding:26px 28px 26px;box-shadow:0 30px 60px -30px rgba(16,51,59,.35)}
.vrep-h{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:15px}
.vrep-h b{font-weight:700;color:var(--ink)}
.vrep-h span{padding:3px 10px;border-radius:999px;background:var(--mint-soft);font-size:12px;font-weight:600;color:var(--teal-d)}
.vrep-top{display:flex;align-items:center;gap:16px;margin-top:18px;padding:16px 20px;border-radius:16px;background:var(--stage);color:#fff}
.vrep-top .n{flex:none;font-size:30px;line-height:1.1;font-weight:800;letter-spacing:-.02em;color:var(--gold-hi);font-variant-numeric:tabular-nums}
.vrep-top .l{font-size:14px;line-height:1.4;color:rgba(255,255,255,.86)}
.vrep-r{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:15px}
.vrep-r li{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;row-gap:7px;align-items:baseline;font-size:14px;line-height:1.35;color:var(--ink-2)}
.vrep-r .n{font-size:15px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.vrep-r i{grid-column:1/-1;position:relative;display:block;height:8px;border-radius:8px;background:#EAF2F1;overflow:hidden}
.vrep-r i::after{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--w,.5) * 100%);border-radius:inherit;background:linear-gradient(90deg,var(--teal),var(--gold));transform-origin:0 50%}
.vrep-r li:nth-child(2){--k:1}
.vrep-r li:nth-child(3){--k:2}
.vrep-r li:nth-child(4){--k:3}
@media(max-width:700px){
  .vrep{padding:20px 18px 20px;border-radius:20px}
  .vrep-top{gap:12px;padding:14px 16px}
  .vrep-top .n{font-size:26px}
  .vrep-top .l{font-size:13.5px}
}
/* bottone dei percorsi dedicati: spazio tra testo e freccia (la freccia e' un elemento a se' dalla 2.16) */
.ai-banner .ab-go{gap:8px}
/* Risorse: dalla 2.17 le categorie sono sette, i filtri restano su una riga da computer */
@media(min-width:701px){
  .cat-bar{gap:6px}
  .cat-btn{font-size:13px;padding:9px 11px}
}

/* =====================================================================
   2.18 — Un colore per ogni reparto
   Growth verde, Studio corallo, Tech azzurro, AI e automazioni viola. Il colore dice di quale
   reparto stai leggendo: numero ed etichetta in Servizi, alone delle illustrazioni, percorsi
   dedicati, pallini del menu, aperture e icone delle landing. L'oro resta per bottoni, numeri
   chiave e lettere del metodo. Su fondo chiaro la tinta profonda (contrasto AA sul bianco),
   sul palco quella viva.
   ===================================================================== */
:root{--dep-growth:#3DDC97;--dep-growth-d:#0B7A55;--dep-studio:#FF8D6B;--dep-studio-d:#B8432A;--dep-tech:#5CC8FF;--dep-tech-d:#0A6A96;--dep-ai:#B49CFF;--dep-ai-d:#6A4FD6}
.dep-growth{--dep:var(--dep-growth);--dep-d:var(--dep-growth-d);--dep-rgb:61,220,151}
.dep-studio{--dep:var(--dep-studio);--dep-d:var(--dep-studio-d);--dep-rgb:255,141,107}
.dep-tech{--dep:var(--dep-tech);--dep-d:var(--dep-tech-d);--dep-rgb:92,200,255}
.dep-ai{--dep:var(--dep-ai);--dep-d:var(--dep-ai-d);--dep-rgb:180,156,255}

/* Servizi: numero, etichetta e illustrazione del reparto */
.dept-head .dnum{color:var(--dep-d,var(--gold))}
.dept-head .eyebrow{color:var(--dep-d,var(--teal))}
.dept-head .eyebrow::before{background:var(--dep,var(--gold))}
.dept-head .dept-vis{background:radial-gradient(80% 100% at 90% 0%,rgba(var(--dep-rgb,98,216,247),.30),rgba(var(--dep-rgb,98,216,247),0) 72%),var(--stage);box-shadow:0 16px 34px rgba(5,27,31,.18),inset 0 0 0 1px rgba(var(--dep-rgb,98,216,247),.2)}
/* un solo accento per illustrazione */
.dep-growth .ui-growth path[pathLength],.dep-growth .ui-growth circle{stroke:var(--dep)}
.dep-growth .ui-growth stop{stop-color:var(--dep)}
.dep-studio .msg.new span{color:var(--dep-d)}
.dep-studio .msg.new b{background:var(--dep)}
.dep-tech .brw li em{color:var(--dep-d)}
.dep-ai .ui-ai .st:not(:last-child) i{color:var(--dep)}

/* percorsi dedicati: filo, alone, etichetta e spunte nel colore del reparto; il bottone resta oro */
.ai-banner::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--dep,var(--gold)) 0%,rgba(var(--dep-rgb,247,184,1),0) 80%);pointer-events:none}
.ai-banner::after{background:radial-gradient(circle,rgba(var(--dep-rgb,247,184,1),.26),rgba(var(--dep-rgb,247,184,1),0) 70%)}
.ai-banner .ab-k{color:var(--dep,var(--gold-hi))}
.ai-banner .ab-k::before{content:"";display:inline-block;width:8px;height:8px;margin-right:10px;border-radius:50%;background:currentColor;vertical-align:1px;box-shadow:0 0 0 4px rgba(var(--dep-rgb,247,184,1),.2)}
.ai-banner .ab-l li::before{background:var(--dep,var(--gold));color:var(--night)}
.page-reparti .ab-l li[id]{scroll-margin-top:170px}
.page-reparti .ab-l li:target{border-color:var(--dep,var(--gold));background:rgba(var(--dep-rgb,247,184,1),.16)}

/* barra dei reparti in Servizi: un pallino per reparto */
.dn-row a:is(.dep-growth,.dep-studio,.dep-tech,.dep-ai)::before{content:"";display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--dep);vertical-align:1px}

/* Home: le card dei quattro reparti */
.dcard:is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .ph{background:radial-gradient(80% 100% at 90% 0%,rgba(var(--dep-rgb),.30),rgba(var(--dep-rgb),0) 72%),var(--stage)}
.dcard:is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .b .k{color:var(--dep-d)}
.dcard:is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .b .k::before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:var(--dep);vertical-align:1px}
.dcard:is(.dep-growth,.dep-studio,.dep-tech,.dep-ai):hover{border-color:rgba(var(--dep-rgb),.7)}

/* menu Servizi (2.18.1): quattro voci semplici, una per servizio, con l'icona nel colore del reparto e una riga
   che dice a cosa serve; in fondo il link a tutti i servizi. Sul telefono le voci stanno una sotto l'altra */
.mega.mega-serv{grid-template-columns:1fr 1fr;width:760px;gap:4px;padding:12px}
.mega-serv .ms{display:flex;align-items:flex-start;gap:14px;padding:14px 14px 15px;border-radius:14px;color:var(--ink);text-decoration:none;transition:background .2s}
.mega-serv .ms:hover,.mega-serv .ms:focus-visible{background:var(--mint-soft)}
.mega-serv .ms-i{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(var(--dep-rgb),.16);color:var(--dep-d)}
.mega-serv .ms-i svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.mega-serv .ms-t{display:flex;flex-direction:column;gap:3px;min-width:0}
.mega-serv .ms-t b{font-size:15px;font-weight:700;line-height:1.25;color:var(--ink)}
.mega-serv .ms-t span{font-size:13px;line-height:1.4;color:var(--mute)}
.mega-serv .ms-all{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:6px;padding:12px;border-radius:12px;background:var(--mint-soft);font-size:14px;font-weight:700;color:var(--teal);text-decoration:none}
.mega-serv .ms-all:hover{background:var(--mint);color:var(--ink)}
@media (max-width:980px){
  .mega.mega-serv{width:auto;grid-template-columns:1fr;gap:2px;padding:0 0 16px}
  .mega-serv .ms{gap:14px;padding:11px 2px;border-radius:0}
  .mega-serv .ms:hover{background:none}
  .mega-serv .ms-i{width:38px;height:38px;background:rgba(var(--dep-rgb),.18);color:var(--dep)}
  .mega-serv .ms-t b{font-size:16px;color:#fff}
  .mega-serv .ms-t span{font-size:13.5px;color:var(--stage-mute)}
  .mega-serv .ms-all{justify-content:flex-start;margin-top:8px;padding:13px 16px;background:rgba(232,251,255,.06);border:1px solid rgba(211,243,238,.14);font-size:15px;color:var(--gold-hi)}
}

/* landing dei reparti: alone del reparto in apertura, etichette e icone nel suo colore */
:is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .hero{background:radial-gradient(46% 62% at 84% 26%,rgba(var(--dep-rgb),.15),rgba(var(--dep-rgb),0) 72%),var(--stage)}
:is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .hero .eyebrow{color:var(--dep)}
:is(.page-landing,.page-automazioni):is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .ico:not(.warn){background:rgba(var(--dep-rgb),.16)}
:is(.page-landing,.page-automazioni):is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .ico:not(.warn) svg{stroke:var(--dep-d)}
:is(.page-landing,.page-automazioni):is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .sec-dark .ico:not(.warn){background:rgba(var(--dep-rgb),.14)}
:is(.page-landing,.page-automazioni):is(.dep-growth,.dep-studio,.dep-tech,.dep-ai) .sec-dark .ico:not(.warn) svg{stroke:var(--dep)}

/* =====================================================================
   2.18 — Landing Google Ads e Meta Ads, Comunicazione e neuromarketing
   ===================================================================== */
/* sotto il bottone dell'apertura: la prova in una riga (certificazione e numeri) */
.lp-trust{display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px;margin-top:30px;font-size:13.5px;line-height:1.35;color:var(--stage-mute)}
.lp-trust img{width:78px;height:auto;padding:4px 6px;border-radius:9px;background:#fff}
.lp-trust span{position:relative}
.lp-trust span+span::before{content:"";position:absolute;left:-12px;top:50%;width:3px;height:3px;margin-top:-1.5px;border-radius:50%;background:var(--stage-mute)}
.lp-trust b{font-weight:700;color:#fff}
.lp-trust .ic{display:inline-flex;align-items:center;gap:8px}
.lp-trust .ic svg{width:18px;height:18px;fill:none;stroke:var(--dep,var(--cyan));stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:700px){.lp-trust{gap:10px 18px;margin-top:24px;font-size:13px}.lp-trust img{width:68px}}

/* il conto del costo massimo per cliente (esempio) */
.calc{background:#fff;border:1px solid var(--line);border-radius:24px;padding:26px 28px 24px;box-shadow:0 30px 60px -30px rgba(16,51,59,.35)}
.calc-h{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:15px}
.calc-h b{font-weight:700;color:var(--ink)}
.calc-h span{padding:3px 10px;border-radius:999px;background:var(--mint-soft);font-size:12px;font-weight:600;color:var(--teal-d);white-space:nowrap}
.calc-r{list-style:none;margin:16px 0 0;padding:0}
.calc-r li{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid var(--line);font-size:15px;color:var(--ink-2)}
.calc-r li b{flex:none;font-size:18px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.calc-r li.hi{margin-top:4px;padding:14px 16px;border:0;border-radius:14px;background:var(--stage);color:#fff;font-weight:600}
.calc-r li.hi b{font-size:24px;color:var(--gold-hi)}
.calc-bar{display:flex;gap:4px;margin-top:16px;height:30px;font-size:12px;font-weight:700}
.calc-bar i{flex:1;display:flex;align-items:center;justify-content:center;border-radius:8px;font-style:normal;transform-origin:0 50%}
.calc-bar .a{background:rgba(var(--dep-rgb,61,220,151),.22);color:var(--dep-d,var(--teal-d))}
.calc-bar .b{background:var(--gold);color:var(--ink)}
.calc-f{margin-top:14px;font-size:14px;line-height:1.55;color:var(--ink-2)}
@media(max-width:700px){
  .calc{padding:20px 18px;border-radius:20px}
  .calc-r li{font-size:14.5px}
  .calc-r li.hi{padding:12px 14px}
  .calc-r li.hi b{font-size:21px}
}
.split + .wrap > .vs{margin-top:56px}
@media(max-width:700px){.split + .wrap > .vs{margin-top:36px}}

/* una notizia che fa da prova (cliente nuovo), sotto i case study */
.lp-news{margin-top:22px;padding:16px 20px;border-radius:16px;background:#fff;border:1px solid var(--line);font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.lp-news b{color:var(--ink)}
.lp-news .link{margin-left:4px;font-weight:700}
.kpis + .lp-proof{margin-top:40px}

/* landing dei reparti: le voci di "Cosa facciamo" si fermano sotto intestazione e barra delle sezioni
   e, quando ci arrivi dal menu, si illuminano un momento nel colore del reparto */
.page-landing .card[id]{scroll-margin-top:150px}
@media (max-width:980px){.page-landing .card[id]{scroll-margin-top:130px}}
.page-landing .card[id]:target{border-color:var(--dep,var(--gold));border-top-color:var(--dep,var(--gold));background:linear-gradient(180deg,rgba(var(--dep-rgb,247,184,1),.13),rgba(var(--dep-rgb,247,184,1),0) 85%)}

/* Comunicazione e neuromarketing: i volti della squadra nell'apertura */
.lp-faces{display:inline-flex;flex:none}
.lp-faces img{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:50% 20%;background:rgba(var(--dep-rgb,98,216,247),.35);box-shadow:0 0 0 2px var(--night)}
.lp-faces img+img{margin-left:-9px}
.lp-faces + span::before{display:none}
/* un numero scritto con una parola in mezzo ("1 su 2"): la parola piu' piccola, e il numero non conta */
.kpi .n span{font-size:.55em;font-weight:700;letter-spacing:0;vertical-align:.18em}
/* come decide il cliente: quattro regole numerate, sotto i numeri */
.prin{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 28px;margin:56px 0 0;padding:0;counter-reset:prin}
.prin li{position:relative;counter-increment:prin;padding-top:18px}
.prin li::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;border-radius:2px;background:var(--dep,var(--gold));transform-origin:0 50%}
.prin li::before{content:counter(prin,decimal-leading-zero);display:block;font-size:13px;font-weight:800;letter-spacing:.08em;color:var(--dep-d,var(--teal))}
.prin h3{margin-top:8px;font-size:18px}
.prin p{margin-top:8px;font-size:15px;line-height:1.55}
@media(max-width:980px){.prin{grid-template-columns:1fr 1fr;gap:30px 24px}}
@media(max-width:560px){.prin{grid-template-columns:1fr;gap:24px;margin-top:40px}}
/* la squadra di un reparto: volti, nomi e ruoli in una fila */
.crew{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;margin:40px 0 0;padding:0}
.crew li{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.crew img{width:104px;height:104px;border-radius:50%;object-fit:cover;object-position:50% 20%;background:var(--stage);box-shadow:0 0 0 4px #fff,0 0 0 6px rgba(var(--dep-rgb,98,216,247),.55),0 18px 30px -16px rgba(16,51,59,.45)}
.crew b{margin-top:16px;font-size:16.5px;font-weight:700;color:var(--ink)}
.crew span{margin-top:2px;font-size:13.5px;line-height:1.35;color:var(--mute)}
.crew-more{margin-top:34px;text-align:center}
.crew-more .link{font-weight:700}
@media(max-width:900px){.crew{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 14px}}
@media(max-width:700px){.crew img{width:84px;height:84px}.crew b{margin-top:12px;font-size:15.5px}.crew span{font-size:13px}}
@media(max-width:560px){.calc-h{flex-direction:column-reverse;align-items:flex-start;gap:8px}}

/* =====================================================================
   2.18 — Landing senza distrazioni per chi arriva dalle campagne
   (html.lp-focus: lo decide lo script in testa alla pagina, solo sulle landing dei reparti e dei settori).
   In alto solo logo e bottone, niente briciole; in fondo niente menu del sito, newsletter e candidature.
   Restano recapiti, social, certificazione e note legali.
   ===================================================================== */
html.lp-focus .menu > li:not(.cta-head){display:none}
html.lp-focus .crumbs{display:none}
html.lp-focus .site-footer :is(.fcta,.col.links,.news > .fh,.news > p,.news > form){display:none}
html.lp-focus .fgrid{grid-template-columns:1.4fr 1fr 1fr}
html.lp-focus .news .meta2{margin-top:30px}
@media(max-width:980px){
  html.lp-focus .burger{display:none}
  html.lp-focus .menu{display:none!important}
  html.lp-focus .fgrid{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){html.lp-focus .fgrid{grid-template-columns:minmax(0,1fr)}html.lp-focus .news .meta2{margin-top:0}}
/* box del servizio in fondo agli articoli: dalla 2.18 alcuni nomi sono lunghi ("Scopri Comunicazione e neuromarketing"),
   sul telefono il link va a capo invece di uscire dallo schermo */
@media(max-width:480px){.post-serv a{white-space:normal}}

/* =====================================================================
   2.21 — Agenzia di marketing a Lecce: mappa del Salento nell'apertura,
   ufficio e indirizzo, clienti della provincia, reparti
   ===================================================================== */
.lmap{position:relative;justify-self:end;width:100%;max-width:400px;background:#fff;border-radius:22px;padding:16px 16px 12px;color:var(--ink-2);box-shadow:0 30px 60px -24px rgba(0,0,0,.55)}
.lmap-h{display:flex;flex-direction:column;gap:1px;padding:2px 4px 10px;border-bottom:1px solid var(--line)}
.lmap-h b{font-size:14.5px;font-weight:700;line-height:1.3;color:var(--ink)}
.lmap-h span{font-size:12.5px;line-height:1.3;color:var(--mute)}
.lmap .lm-svg{display:block;width:100%;height:auto;margin:6px 0 2px}
.lmap-f{display:flex;flex-wrap:wrap;gap:6px 18px;padding:10px 4px 2px;border-top:1px solid var(--line);font-size:12.5px;line-height:1.3;color:var(--mute)}
.lmap-f i{display:inline-block;width:10px;height:10px;margin-right:7px;border-radius:50%;vertical-align:-1px}
.lmap-f .o{background:var(--gold);box-shadow:0 0 0 1.5px var(--ink)}
.lmap-f .c{background:var(--ink)}
.lm-land{fill:none;stroke:#C3D9DB;stroke-width:4;stroke-linecap:round}
.lm-route{fill:none;stroke:var(--ink);stroke-opacity:.5;stroke-width:1.6;stroke-dasharray:3 4;stroke-linecap:round}
.lm-r{font-family:var(--ff);font-size:11.5px;font-style:italic;font-weight:500;fill:var(--mute)}
.lm-c{fill:var(--ink);stroke:#fff;stroke-width:2}
.lm-o{fill:var(--gold);stroke:var(--ink);stroke-width:2}
.lm-ring{fill:none;stroke:var(--gold);stroke-width:1.6;stroke-opacity:.8}
.lm-t{font-family:var(--ff);font-size:12px;font-weight:600;fill:var(--ink);paint-order:stroke;stroke:#fff;stroke-width:3.5px;stroke-linejoin:round}
.lm-tb{font-size:13px;font-weight:700}
.lm-ts{font-size:11.5px;font-weight:500;fill:var(--mute)}
@media(max-width:900px){.lmap{justify-self:start;max-width:420px}}
/* Contatti, dove siamo (dalla 2.21.5): la mappa al posto della foto; da computer sta a sinistra */
.lmap-dove{justify-self:center;box-shadow:0 24px 50px -28px rgba(16,51,59,.35);border:1px solid var(--line)}
@media(min-width:901px){.split>.lmap-dove{order:-1}}
@media(max-width:700px){.lmap{max-width:none;padding:14px 12px 10px}}

/* vicini, in pratica: foto dell'ufficio con l'indirizzo, quattro punti, i volti della squadra */
.lc-vic{align-items:start}
.lc-vic .lc-luogo .ph{height:auto;aspect-ratio:3/2}
.lc-addr{display:flex;flex-direction:column;gap:4px;margin-top:16px;padding:18px 20px;border-radius:16px;background:#fff;border:1px solid var(--line);font-size:14.5px;line-height:1.5}
.lc-addr b{font-size:15.5px;color:var(--ink)}
.lc-addr .link{align-self:flex-start;margin-top:6px}
.lc-pro{list-style:none;display:grid;gap:20px;margin-top:28px}
.lc-pro li{position:relative;padding-left:30px;font-size:15.5px;line-height:1.55}
.lc-pro li::before{content:"";position:absolute;left:3px;top:.5em;width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(247,184,1,.22)}
.lc-pro b{display:block;margin-bottom:3px;font-size:17px;line-height:1.35;color:var(--ink)}
.lc-team{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;margin-top:30px}
.lc-team .lp-faces img{box-shadow:0 0 0 2px var(--mint-soft)}
.lc-addr a[href^="tel"]{white-space:nowrap}
/* da computer la foto con l'indirizzo sta a sinistra; nella pagina (e sul telefono) viene dopo titolo e quattro punti */
@media(min-width:901px){.lc-vic>.lc-luogo{order:-1}}

/* clienti della provincia: logo, nome, settore e paese */
.lc-cl{list-style:none;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:14px;margin-top:36px}
.lc-cl li{display:flex;flex-direction:column;min-width:0;padding:18px 16px 16px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.lc-cl .logo-row{display:flex;align-items:center;height:52px;margin:0 0 12px;gap:0}
.lc-cl .logo-row img{height:calc(36px * var(--k,1));max-height:48px;width:auto;max-width:100%;object-fit:contain;opacity:1}
.lc-cl .logo-row img.alto{height:calc(46px * var(--k,1))}
.lc-cl b{font-size:14.5px;line-height:1.3;color:var(--ink)}
.lc-cl li>span:not(.logo-row){margin-top:4px;font-size:13px;line-height:1.4;color:var(--mute)}
.lc-cl li>span.lc-pz{display:flex;align-items:center;gap:5px;margin-top:auto;padding-top:8px;font-weight:600;color:var(--teal-d)}
.lc-cl .lc-pz::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px rgba(15,117,134,.18)}
@media(max-width:1100px){.lc-cl{grid-template-columns:repeat(4,minmax(0,1fr))}}
.lc-more{margin-top:26px}
@media(max-width:700px){.lc-cl{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:26px}.lc-cl li{padding:14px 12px}.lc-cl .logo-row{height:44px;margin-bottom:10px}}

/* i quattro reparti, ognuno nel suo colore */
.lc-serv .card{display:flex;flex-direction:column;border-top:3px solid var(--dep-d,var(--teal));color:var(--ink-2)}
.lc-serv .k{display:inline-flex;align-items:center;gap:9px;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dep-d,var(--teal))}
.lc-serv .k::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--dep,var(--teal));box-shadow:0 0 0 4px rgba(var(--dep-rgb,98,216,247),.22)}
.lc-serv h3{margin-top:12px;font-size:18px;line-height:1.3}
.lc-serv p{flex:1}

/* ------------------------------------------------------------------ */
/* Siti web, SEO e GEO (dalla 2.24): il sito in abbonamento al centro  */
/* del marketing (.hub) e le regole su cosa resta tuo (.own)            */
/* ------------------------------------------------------------------ */
.hub-wrap{margin-top:56px;padding:34px 34px 32px;border-radius:28px;background:var(--mint-soft);border:1px solid var(--line)}
.hub-t{max-width:700px}
.hub-t h3{font-size:clamp(20px,1rem + .8vw,26px)}
.hub-t p{margin-top:8px;color:var(--ink-2)}
.hub{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,240px) minmax(0,1fr);align-items:stretch;column-gap:52px;margin-top:30px}
.hub-col{display:flex;flex-direction:column;justify-content:center}
.hub-k{display:block;margin-bottom:10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--mute)}
.hub-col ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.hub-col li{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:12px;align-items:center;padding:11px 14px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 24px -18px rgba(16,51,59,.35)}
.hub-col li b{display:block;font-size:14.5px;line-height:1.25;color:var(--ink)}
.hub-col li > span:not(.hub-i){display:block;grid-column:2;font-size:12.5px;line-height:1.35;color:var(--mute)}
.hub-i{grid-row:span 2;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:rgba(var(--dep-rgb),.16);color:var(--dep-d)}
.hub-out .hub-i{background:#FFF3CF;color:#8A6200}
.hub-i svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* i fili verso il sito: tratteggiati in entrata, pieni (oro) in uscita */
.hub-in li::after,.hub-out li::before{content:"";position:absolute;top:50%;width:52px;height:0}
.hub-in li::after{left:100%;border-top:2px dashed rgba(var(--dep-rgb),.95)}
.hub-out li::before{right:100%;border-top:2px solid var(--gold)}
.hub-c{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;padding:20px 18px 18px;border-radius:22px;background:var(--stage);color:#fff;box-shadow:0 30px 60px -28px rgba(5,27,31,.65)}
.hub-brw{display:flex;gap:5px;margin-bottom:12px}
.hub-brw i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.28)}
.hub-c b{display:block;font-size:18px;font-weight:800;letter-spacing:-.01em}
.hub-c ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:7px}
.hub-c li{position:relative;isolation:isolate;display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:11px;background:rgba(255,255,255,.08);font-size:13px;font-weight:600;color:var(--on-stage)}
.hub-c li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--gold-hi);box-shadow:0 0 0 4px rgba(255,201,61,.18)}
@media(max-width:900px){
  .hub-wrap{margin-top:40px;padding:26px 20px 24px}
  .hub{grid-template-columns:minmax(0,1fr);row-gap:34px}
  .hub-c{width:100%;max-width:340px;justify-self:center}
  .hub-in li::after,.hub-out li::before{display:none}
  .hub-c::before,.hub-c::after{content:"";position:absolute;left:50%;height:34px}
  .hub-c::before{bottom:100%;border-left:2px dashed rgba(var(--dep-rgb),.95)}
  .hub-c::after{top:100%;border-left:2px solid var(--gold)}
}
@media(max-width:700px){.hub-wrap{border-radius:22px}}
.own{background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px 26px 10px;box-shadow:0 30px 60px -30px rgba(16,51,59,.35)}
.own-h{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:15px}
.own-h b{font-weight:700;color:var(--ink)}
.own-h span{padding:3px 10px;border-radius:999px;background:var(--mint-soft);font-size:12px;font-weight:600;color:var(--teal-d);white-space:nowrap}
.own ul{list-style:none;margin:14px 0 0;padding:0}
.own li{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px;align-items:start;padding:16px 0;border-top:1px solid var(--line)}
.own-i{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--mint);color:var(--teal)}
.own-i svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.own li b{display:block;font-size:15.5px;line-height:1.3;color:var(--ink)}
.own li p{margin:4px 0 0;font-size:14px;line-height:1.5;color:var(--ink-2)}
/* 2.25: la regola che toglie il dubbio ("se smetti, il sito resta tuo") e' quella che si nota per prima */
.own li:last-child .own-i{background:var(--gold);color:var(--ink);box-shadow:0 8px 18px rgba(247,184,1,.3)}
@media(max-width:700px){.own{padding:20px 18px 6px}.own-h{flex-wrap:wrap}}
/* 2.25: lo schema sta su fondo menta, quindi diventa una scheda bianca */
.sec-mint .hub-wrap{background:#fff;box-shadow:0 30px 60px -40px rgba(16,51,59,.3)}
/* 2.25: i dati viaggiano lungo i fili (motion.css non c'entra: girano solo mentre lo schema e' sullo
   schermo, classe live da motion.js). Prima arrivano i clienti, il sito si accende, poi partono i dati.
   Si muovono solo trasparenza, posizione e scala: le fa la scheda grafica, il processore resta libero. */
.hub-in li::before,.hub-out li::after{content:"";position:absolute;top:50%;z-index:2;width:8px;height:8px;margin-top:-3px;border-radius:50%;opacity:0;pointer-events:none}
.hub-in li::before{left:100%;background:var(--dep-d);box-shadow:0 0 0 3px rgba(var(--dep-rgb),.3)}
.hub-out li::after{left:-52px;background:var(--gold-d);box-shadow:0 0 0 3px rgba(247,184,1,.3)}
.hub li:nth-child(2){--hk:1}
.hub li:nth-child(3){--hk:2}
html.m-motion .hub.live .hub-in li::before{animation:hub-in 4.8s cubic-bezier(.45,0,.2,1) calc(var(--hk,0) * .14s) infinite}
html.m-motion .hub.live .hub-out li::after{animation:hub-out 4.8s cubic-bezier(.45,0,.2,1) calc(var(--hk,0) * .14s) infinite}
.hub-c li::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:rgba(255,201,61,.22);opacity:0;pointer-events:none}
html.m-motion .hub.live .hub-c li::after{animation:hub-lit 4.8s ease calc(var(--hk,0) * .18s) infinite}
html.m-motion .hub.live .hub-c li::before{animation:hub-dot 4.8s ease calc(var(--hk,0) * .18s) infinite}
@keyframes hub-in{0%{opacity:0;translate:0 0}5%{opacity:1}22%{opacity:1;translate:44px 0}26%,100%{opacity:0;translate:44px 0}}
@keyframes hub-out{0%,40%{opacity:0;translate:0 0}45%{opacity:1}62%{opacity:1;translate:44px 0}66%,100%{opacity:0;translate:44px 0}}
@keyframes hub-lit{0%,24%,54%,100%{opacity:0}30%,46%{opacity:1}}
@keyframes hub-dot{0%,24%,54%,100%{scale:1}30%{scale:1.5}42%{scale:1}}
@media(max-width:900px){.hub-in li::before,.hub-out li::after{display:none}}

/* ------------------------------------------------------------------ */
/* Siti web (2.25): tre siti su misura nella stessa finestra (.mk)      */
/* Tre aziende inventate (un frantoio, uno studio dentistico, un'officina */
/* meccanica), ognuna con colori, caratteri e movimento suoi. Si danno  */
/* il cambio ogni 4,5 secondi solo mentre la finestra e' sullo schermo  */
/* (classe live, da motion.js); senza animazioni resta il primo sito,  */
/* fermo e completo. Dentro la finestra le misure sono in em: si        */
/* rimpicciolisce tutta insieme, come una foto.                         */
/* ------------------------------------------------------------------ */
.mk{position:relative;width:100%;max-width:560px;margin-inline:auto;container-type:inline-size}
.mk-win{position:relative;overflow:hidden;font-size:clamp(8px,1vw,14px);line-height:1.3;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 40px 80px -36px rgba(16,51,59,.5),0 2px 6px rgba(16,51,59,.06)}
@supports (width:1cqi){.mk-win{font-size:calc(100cqi / 40)}}
.mk-bar{position:relative;z-index:3;display:flex;align-items:center;gap:.45em;height:2.5em;padding:0 1em;background:#EAF3F2}
.mk-bar i{flex:none;width:.62em;height:.62em;border-radius:50%;background:#C3D6D3}
.mk-url{margin-left:.7em;flex:0 1 16em;font-size:.78em;line-height:1.9;color:var(--mute);background:#fff;border-radius:.6em;padding:0 .9em;white-space:nowrap;overflow:hidden}
/* la riga sotto la barra si carica quando cambia il sito, come una pagina che si apre */
.mk-bar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--teal),var(--gold));transform-origin:0 50%;scale:0 1}
.mk-st{position:relative;aspect-ratio:16/10.4;overflow:hidden}
.mk-s{position:absolute;inset:0;display:flex;flex-direction:column;padding-bottom:1.3em}
.mk-s2,.mk-s3{opacity:0}
.mk-nav{display:flex;align-items:center;gap:1em;padding:1em 1.5em .6em}
.mk-nav b{display:flex;align-items:center;gap:.45em;margin-right:auto;font-size:.98em;font-weight:800;letter-spacing:-.01em}
.mk-nav b::before{content:"";flex:none;width:1.1em;height:1.1em}
.mk-nav span{flex:none;width:2.4em;height:.4em;border-radius:1em;background:currentColor;opacity:.2}
.mk-nav em{flex:none;margin-left:.4em;font-style:normal;font-size:.7em;font-weight:700;line-height:1;padding:.75em 1.2em}
.mk-h{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1.3em;align-items:center;padding:0 1.5em}
.mk-tx small{display:block;font-size:.64em;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.mk-tx strong{display:block;margin-top:.5em;font-size:1.75em;line-height:1.1;letter-spacing:-.02em;font-weight:700;color:inherit}
.mk-tx strong i{display:block;font-style:normal}
.mk-tx em{display:inline-block;margin-top:1.15em;font-style:normal;font-size:.72em;font-weight:700;line-height:1;padding:.9em 1.4em;white-space:nowrap}
.mk-vis{position:relative;height:100%;max-height:13.5em;overflow:hidden}
.mk-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8em;padding:1.1em 1.5em 0}
.mk-cards span{height:3.4em;padding:.85em .9em}
.mk-cards span::before{content:"";display:block;width:62%;height:.42em;border-radius:1em;background:currentColor;opacity:.22;box-shadow:0 .85em 0 currentColor}
/* 1. frantoio: carta, oliva e terracotta, titolo con le grazie */
.mk-s1{background:#F7F1E6;color:#3B2F22}
.mk-s1 .mk-nav b{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-weight:700;font-size:1.08em}
.mk-s1 .mk-nav b::before{border-radius:0 100% 0 100%;background:#6B8E3D;rotate:-20deg}
.mk-s1 .mk-nav em{background:#C9653A;color:#fff;border-radius:.2em}
.mk-s1 small{color:#6B8E3D}
.mk-s1 strong{font-family:Georgia,"Times New Roman",serif;letter-spacing:-.01em}
.mk-s1 strong i+i{font-style:italic;color:#C9653A}
.mk-s1 .mk-tx em{background:#6B8E3D;color:#fff;border-radius:.2em;letter-spacing:.04em}
.mk-v1{border-radius:2.6em .5em 2.6em .5em;background:radial-gradient(circle at 74% 22%,#FBE3A6 0,rgba(251,227,166,0) 42%),linear-gradient(165deg,#EADFC6,#D8C7A2)}
.mk-v1 .bt{position:absolute;left:50%;bottom:1.2em;width:3.1em;height:7.6em;margin-left:-1.55em;border-radius:.9em .9em .45em .45em;background:linear-gradient(90deg,#55621B,#A59D36 38%,#CDBB4E 52%,#6A7524)}
.mk-v1 .bt::before{content:"";position:absolute;left:50%;top:-1.8em;width:1.1em;height:2.05em;margin-left:-.55em;border-radius:.25em .25em 0 0;background:linear-gradient(90deg,#55621B,#A59D36);box-shadow:0 -.5em 0 -.06em #3B2F22}
.mk-v1 .bt::after{content:"";position:absolute;left:.34em;right:.34em;top:2.7em;height:2.6em;border-radius:.2em;background:#F7F1E6;border-top:.32em solid #C9653A}
.mk-v1 .o1,.mk-v1 .o2,.mk-v1 .o3{position:absolute;width:1.45em;height:1.95em;border-radius:50%;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.5),rgba(255,255,255,0) 32%) #6B8E3D}
.mk-v1 .o1{left:15%;bottom:1.2em;rotate:-22deg}
.mk-v1 .o2{left:25%;bottom:3.5em;width:1.2em;height:1.6em;rotate:14deg;background-color:#3F3A26}
.mk-v1 .o3{right:14%;bottom:1.7em;rotate:20deg;background-color:#8FA548}
.mk-s1 .mk-cards span{background:#EFE4CF;border-radius:.25em}
/* 2. studio dentistico: bianco e blu, angoli tondi, si prenota con un clic */
.mk-s2{background:#F4F8FF;color:#13233F}
.mk-s2 .mk-nav b::before{border-radius:50%;border:.3em solid #19B39E}
.mk-s2 .mk-nav em{background:#2E6BE6;color:#fff;border-radius:99em}
.mk-s2 small{color:#14907F}
.mk-s2 strong{font-weight:600}
.mk-s2 strong i+i{color:#2E6BE6}
.mk-s2 .mk-tx em{background:#2E6BE6;color:#fff;border-radius:99em;box-shadow:0 .6em 1.2em -.5em rgba(46,107,230,.6)}
.mk-v2{display:grid;place-items:center;overflow:visible;border-radius:1.4em;background:linear-gradient(160deg,#E2ECFF,#F9FBFF)}
.mk-cal{position:relative;width:80%;padding:.9em .9em 1em;border-radius:1em;background:#fff;box-shadow:0 1.2em 2.2em -1.1em rgba(19,35,63,.4)}
.mk-cal b{display:block;font-size:.66em;font-weight:700;color:#13233F}
.mk-cal ul{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.35em;margin-top:.65em}
.mk-cal li{position:relative;height:1.45em;border-radius:.4em;background:#E8EFFD}
.mk-cal li.on::after{content:"";position:absolute;inset:0;border-radius:inherit;background:#2E6BE6}
.mk-ok{position:absolute;left:50%;bottom:-1.3em;translate:-50% 0;display:flex;align-items:center;gap:.45em;font-size:.64em;font-weight:700;line-height:1;white-space:nowrap;color:#fff;background:#14907F;border-radius:99em;padding:.65em 1.05em .65em .7em;box-shadow:0 .8em 1.6em -.6em rgba(20,144,127,.7)}
.mk-ok::before{content:"\2713";display:grid;place-items:center;width:1.45em;height:1.45em;border-radius:50%;background:#fff;color:#14907F;font-size:.9em}
/* il puntatore che sceglie il giorno (si vede solo in movimento) */
.mk-cal::after{content:"";position:absolute;z-index:2;left:calc(1.1em + (100% - 2.85em) * .375);top:4.75em;width:1.35em;height:1.35em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M3 2l12.5 8.2-5.6 1.1 3 5.6-2.4 1.3-3-5.7L3.4 16.6z' fill='%2313233F' stroke='%23fff' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 0 0/contain no-repeat;transform-origin:15% 10%;opacity:0}
.mk-s2 .mk-cards span{background:#fff;border-radius:.8em;box-shadow:0 .5em 1em -.7em rgba(19,35,63,.35)}
/* 3. officina meccanica: notte, ambra e azzurro, righe da disegno tecnico */
.mk-s3{background:#0E1A2B;color:#fff}
.mk-s3 .mk-nav b{font-size:.86em;letter-spacing:.08em;text-transform:uppercase}
.mk-s3 .mk-nav b::before{background:#F2B33D;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.mk-s3 .mk-nav em{color:#F2B33D;border:1px solid #F2B33D;border-radius:.25em}
.mk-s3 small{color:#4FA3FF}
.mk-s3 strong{font-size:1.55em;letter-spacing:-.015em}
.mk-s3 strong i+i{color:#F2B33D}
.mk-s3 .mk-tx em{background:#F2B33D;color:#0E1A2B;border-radius:.25em}
.mk-v3{border-radius:.5em;border:1px solid rgba(79,163,255,.28);background:linear-gradient(rgba(79,163,255,.13) 1px,transparent 1px) 0 0/1.25em 1.25em,linear-gradient(90deg,rgba(79,163,255,.13) 1px,transparent 1px) 0 0/1.25em 1.25em,#12243B}
.mk-v3 .bars{position:absolute;left:1.2em;bottom:1.2em;display:flex;align-items:flex-end;gap:.5em;height:6.2em}
.mk-v3 .bars i{width:1.15em;border-radius:.2em .2em 0 0;background:#4FA3FF;transform-origin:50% 100%}
.mk-v3 .bars i:nth-child(1){height:34%}
.mk-v3 .bars i:nth-child(2){height:52%;--mkb:.1s}
.mk-v3 .bars i:nth-child(3){height:74%;--mkb:.2s}
.mk-v3 .bars i:nth-child(4){height:100%;--mkb:.3s;background:#F2B33D}
.mk-v3 .gear{position:absolute;right:.9em;top:.9em;width:5.4em;height:5.4em;color:#F2B33D}
.mk-v3 .gear svg{display:block;width:100%;height:100%}
.mk-s3 .mk-cards span{background:#15283F;border:1px solid rgba(79,163,255,.22);border-radius:.25em}
/* sotto la finestra: quale dei tre siti si sta guardando; sopra, l'etichetta */
.mk-dots{display:flex;justify-content:center;gap:8px;margin-top:18px}
.mk-dots i{position:relative;width:8px;height:8px;border-radius:50%;background:#A9C2BF}
.mk-dots i::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--teal);opacity:0}
.mk-dots i:first-child::after{opacity:1}
.mk-chip{position:absolute;z-index:4;top:-15px;right:18px;background:var(--gold);color:var(--ink);font-weight:700;font-size:13.5px;line-height:1.2;border-radius:999px;padding:9px 16px;box-shadow:0 12px 26px rgba(247,184,1,.35);white-space:nowrap}
@media(max-width:700px){.mk-chip{top:-13px;right:10px;font-size:11.5px;padding:7px 12px}}
/* finestra stretta (telefono): caratteri un po' piu' grandi, schermata piu' alta, un pezzo di menu in meno */
@container (max-width:480px){
  .mk-win{font-size:calc(100cqi / 33)}
  .mk-st{aspect-ratio:16/12.4}
  .mk-url{flex-basis:8.5em}
  .mk-nav{gap:.8em;padding:.9em 1.2em .5em}
  .mk-nav span:nth-of-type(3){display:none}
  .mk-h{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:1em;padding:0 1.2em}
  .mk-tx strong{font-size:1.5em}
  .mk-s3 strong{font-size:1.36em}
  .mk-cards{gap:.6em;padding:1em 1.2em 0}
}
/* il giro: 13,5 secondi, 4,5 per sito. Ogni sito si apre (la riga si carica, il fondo cambia),
   i pezzi salgono in ordine di lettura, poi escono verso l'alto e lasciano il posto al successivo.
   Solo trasparenza, posizione, scala e rotazione di elementi HTML (non dei disegni SVG) e niente
   cambi di colore: cosi' tutto gira sulla scheda grafica e il processore del telefono resta libero */
.mk-s1{--mko:0s}
.mk-s2{--mko:-9s}
.mk-s3{--mko:-4.5s}
.mk-nav{--mks:0s}
.mk-tx small{--mks:.08s}
.mk-tx strong i{--mks:.16s}
.mk-tx strong i+i{--mks:.24s}
.mk-tx em{--mks:.34s}
.mk-cards span{--mks:.44s}
.mk-cards span+span{--mks:.52s}
.mk-cards span+span+span{--mks:.6s}
html.m-motion .mk.live .mk-s{animation:mk-show 13.5s linear var(--mko) infinite}
html.m-motion .mk.live .mk-s :is(.mk-nav,small,strong i,.mk-tx em,.mk-cards span){animation:mk-in 13.5s linear calc(var(--mko) + var(--mks)) infinite backwards}
html.m-motion .mk.live .mk-vis{animation:mk-pop 13.5s linear calc(var(--mko) + .22s) infinite backwards}
html.m-motion .mk.live .mk-bar::after{animation:mk-load 4.5s linear infinite}
html.m-motion .mk.live .mk-dots i::after{animation:mk-dot 13.5s linear infinite}
html.m-motion .mk.live .mk-dots i:nth-child(2)::after{animation-delay:-9s}
html.m-motion .mk.live .mk-dots i:nth-child(3)::after{animation-delay:-4.5s}
html.m-motion .mk.live .mk-v1 .bt{animation:mk-rise 13.5s linear calc(var(--mko) + .3s) infinite backwards}
html.m-motion .mk.live .mk-v1 :is(.o1,.o2,.o3){animation:mk-float 3s ease-in-out infinite alternate}
html.m-motion .mk.live .mk-v1 .o2{animation-delay:-1s}
html.m-motion .mk.live .mk-v1 .o3{animation-delay:-2s}
html.m-motion .mk.live .mk-cal li.on{animation:mk-press 13.5s linear var(--mko) infinite}
html.m-motion .mk.live .mk-cal li.on::after{animation:mk-fill 13.5s linear var(--mko) infinite}
html.m-motion .mk.live .mk-cal::after{animation:mk-cur 13.5s linear var(--mko) infinite}
html.m-motion .mk.live .mk-ok{animation:mk-ok 13.5s linear var(--mko) infinite}
html.m-motion .mk.live .mk-v3 .bars i{animation:mk-bar 13.5s linear calc(var(--mko) + .45s + var(--mkb,0s)) infinite backwards}
html.m-motion .mk.live .mk-v3 .gear{animation:mk-spin 9s linear infinite}
@keyframes mk-show{0%{opacity:1;scale:1}29.6%{opacity:1;scale:1;animation-timing-function:cubic-bezier(.55,0,.75,.3)}33.3%{opacity:0;scale:.985}96.3%{opacity:0;scale:1.03;animation-timing-function:cubic-bezier(.22,1,.36,1)}100%{opacity:1;scale:1}}
@keyframes mk-in{0%{opacity:0;translate:0 .9em;animation-timing-function:cubic-bezier(.22,1,.36,1)}5.5%{opacity:1;translate:0 0}27.4%{opacity:1;translate:0 0;animation-timing-function:cubic-bezier(.55,0,.75,.3)}29.6%,100%{opacity:0;translate:0 -.5em}}
@keyframes mk-pop{0%{opacity:0;scale:.92;animation-timing-function:cubic-bezier(.22,1,.36,1)}6.5%{opacity:1;scale:1}27.4%{opacity:1;scale:1;animation-timing-function:cubic-bezier(.55,0,.75,.3)}29.6%,100%{opacity:0;scale:.97}}
@keyframes mk-load{0%{scale:1 1;opacity:1}8%{scale:1 1;opacity:0}80%{scale:0 1;opacity:0}82%{scale:0 1;opacity:1;animation-timing-function:cubic-bezier(.45,0,.2,1)}100%{scale:1 1;opacity:1}}
@keyframes mk-dot{0%,29.6%{opacity:1;scale:1.3}33.3%,96.3%{opacity:0;scale:1}100%{opacity:1;scale:1.3}}
@keyframes mk-rise{0%{translate:0 1.6em;animation-timing-function:cubic-bezier(.22,1,.36,1)}7%,100%{translate:0 0}}
@keyframes mk-float{from{translate:0 .18em}to{translate:0 -.3em}}
@keyframes mk-press{0%,11.5%{scale:1}12.6%{scale:.8}14%{scale:1.1}15.6%,100%{scale:1}}
@keyframes mk-fill{0%,12.6%{opacity:0}14%,100%{opacity:1}}
@keyframes mk-cur{0%,5%{opacity:0;translate:2.8em 2.4em;scale:1}6.5%{opacity:1;translate:2.4em 2em;animation-timing-function:cubic-bezier(.45,0,.2,1)}11%{translate:0 0;scale:1}12%{scale:.8}13.2%{scale:1}20%{opacity:1;translate:0 0}23%,100%{opacity:0;translate:.6em .5em}}
@keyframes mk-ok{0%,14.5%{opacity:0;scale:.6;animation-timing-function:cubic-bezier(.34,1.56,.64,1)}18%,100%{opacity:1;scale:1}}
@keyframes mk-bar{0%{scale:1 0;animation-timing-function:cubic-bezier(.22,1,.36,1)}6%,100%{scale:1 1}}
@keyframes mk-spin{to{rotate:360deg}}