:root{
    /* ======= SOLO PALETTE: blu #1b77bd / #0b3a77 ======= */
    --blue-900:#0a2540; 
    --blue-800:#0b3a77; 
    --blue-700:#0b3a77; 
    --blue-500:#1b77bd; 
    --blue-300:#1b77bd; 
    --blue-100:#1b77bd;
    --accent:#1b77bd; 
    --bg:#ffffff; 
    --text:#0f172a; 
    --muted:#475569; 
    --shadow:0 10px 30px rgba(16,24,40,.08); 
    --radius:16px;
    --space-1:8px; 
    --space-2:12px; 
    --space-3:16px;
    --space-4:clamp(16px,1.8vw,24px);
    --space-5:clamp(20px,2.2vw,32px);
    --space-6:clamp(32px,3.5vw,48px);
    --space-7:clamp(48px,6vw,80px);
    --space-8:clamp(56px,8vw,96px);
  }
  *{ box-sizing:border-box } html{ scroll-behavior:smooth }
  body{ margin:0; font-family:'Roboto',system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,"Noto Sans",sans-serif; color:var(--text); background:var(--bg); line-height:1.55; }
  em,i{ font-style:italic } strong,b{ font-weight:700 } a{ color:inherit; text-decoration:none }
  .container{ width:min(1160px,92%); margin:0 auto }

  /* Header */
  .header{ position:sticky; top:0; background:rgba(255,255,255); backdrop-filter:saturate(140%) blur(10px); border-bottom:1px solid #e2e8f0; z-index:50 }
  .header .inner{ display:flex; align-items:center; justify-content:space-between; padding:10px 0; min-height:64px }
  .logo{ display:flex; align-items:center; gap:12px; color:var(--blue-900); letter-spacing:.1px; }
  .logo img{ display:block; height:55px; width:auto; max-width:500px }
  .logo .sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
  .nav ul{ list-style:none; display:flex; gap:24px; margin:0; padding:0; align-items:center }
  .nav li{ display:flex; align-items:center }
  .nav a{ color:#0f172a; opacity:.9; display:inline-flex; align-items:center }
  .btn{ display:inline-flex; align-items:center; gap:8px; padding:12px 16px; border-radius:12px; border:1px solid transparent; font-weight:700 }
  .btn.primary{ background:var(--accent); color:var(--blue-900) }
  .btn.ghost{ background:transparent; border-color:#cbd5e1; color:#0f172a }
  .menu-toggle{ display:none }

  @media (max-width:960px){
    .header .inner{ flex-wrap:wrap }
    .menu-toggle{ display:inline-flex; align-items:center; gap:8px; border:1px solid #cbd5e1; background:white; border-radius:12px; padding:8px 12px; order:2; }
    .logo{ order:1 }
    .logo img{ height:70px;}
    .nav{ order:3; width:100%; display:none; position:static; background:white; border-top:1px solid #e2e8f0; padding:12px 0; }
    .nav.open{ display:block } .nav ul{ flex-direction:column; gap:12px; align-items:flex-start } .nav a{ font-size:1.02rem; padding:6px 0 }
  }

  /* Hero */
  .hero{ background:linear-gradient(180deg,var(--blue-700),var(--blue-900)); color:white; padding:var(--space-8) 0 var(--space-6) }
  .hero .grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:var(--space-5); align-items:center }
  .hero h1{ font-size:clamp(2rem,3.2vw,3.1rem); line-height:1.1; margin:0 0 10px; letter-spacing:-.02em }
  .hero p{ font-size:clamp(1.02rem,1.2vw,1.18rem); opacity:.95; margin:0; max-width:60ch }
  .hero .actions{ display:flex; gap:12px; margin-top:18px; flex-wrap:wrap }
  .hero .illustration{ background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.06)); border:1px solid rgba(255,255,255,.2); border-radius:var(--radius); height:320px; display:grid; place-items:center }
  @media (max-width:960px){
      .hero .grid{ grid-template-columns:1fr }
      .hero .illustration{ display:none; } /* NASCOSTA SOLO DA MOBILE */
    }

  .badge{ display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.25); color:white; padding:8px 10px; border-radius:999px; font-size:.875rem }

  /* ===== Intro centrata + feature (SEZIONE RICOSTRUITA) ===== */
  .logo-cloud{ background:white; border-top:1px solid #e2e8f0; border-bottom:1px solid #e2e8f0; padding:calc(var(--space-7) + 10px) 0 }
  .kv-hero{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(20px,4vw,48px); align-items:start; margin-bottom:clamp(28px,4.5vw,44px); }
  .kv-title{ font-size:clamp(1.8rem,2.4vw,2.2rem); line-height:1.15; margin:0 0 10px; color:#0f172a; font-weight:900; letter-spacing:.01em }
  .kv-sub{ color:var(--muted); margin:0 0 16px; max-width:60ch; }
  .kv-accent{ color:var(--blue-700); }
  .kv-actions{ margin-top:10px; display:flex; gap:12px; flex-wrap:wrap }
  .kv-right{ display:flex; flex-direction:column; gap:18px }
  .kv-item{ display:grid; grid-template-columns:44px 1fr; gap:12px; align-items:start }
  .kv-ico{ width:44px; height:44px; border-radius:10px; display:grid; place-items:center; background:var(--blue-100); color:var(--blue-700); border:1px solid #1b77bd }
  .kv-item h3{ margin:2px 0 4px; font-size:1.03rem; color:#0f172a }
  .kv-item h3 .kv-accent{ font-weight:800 }
  .kv-item p{ margin:0; color:#334155 }
  @media (max-width:960px){ .kv-hero{ grid-template-columns:1fr } 
     
}
@media (max-width:960px){
      .hero .grid{ grid-template-columns:1fr }
      .hero .illustration{ display:none; } /* NASCOSTA SOLO DA MOBILE */
    }

  /* Titolo risultati */
  .results-title{
    margin:36px auto 12px;
    text-align:center;
    font-size:clamp(1.8rem,2.8vw,2.5rem);
    color:#0f172a;
    letter-spacing:.02em;
    font-weight:800;
    line-height:1.15;
  }

  /* ===== BLOCCO RISULTATI (stile band come screenshot) ===== */
  .kv-metrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
  .kv-metric{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:20px; text-align:center; box-shadow:0 6px 18px rgba(16,24,40,.06) }
  .kv-metric-value{ font-size:clamp(2rem,3.2vw,2.8rem); font-weight:900; color:#0f172a; line-height:1; margin:0 0 6px; letter-spacing:.01em; font-variant-numeric:tabular-nums }
  .kv-metric-title{ font-weight:800; color:var(--blue-700); margin:0 0 4px }
  .kv-metric-desc{ color:#334155; margin:0; font-size:.98rem }
  @media (max-width:1024px){ .kv-metrics{ grid-template-columns:repeat(2,1fr) } }
  @media (max-width:560px){ .kv-metrics{ grid-template-columns:1fr } }

  /* ====== (ORIGINALE) RISULTATI CON GRAFICO ====== */
  .pv-offscreen{
    position:absolute !important; width:1px !important; height:1px !important;
    overflow:hidden !important; clip:rect(0 0 0 0) !important; white-space:nowrap !important;
    border:0 !important; padding:0 !important; margin:-1px !important;
  }

  .pv-results{
    --pv-accent: 11,58,119;               /* nuovo accento */
    --pv-hex-0:#0b3a77; --pv-rgb-0:11,58,119;   
    --pv-hex-1:#1b77bd; --pv-rgb-1:27,119,189;  
    --pv-hex-2:#1b77bd; --pv-rgb-2:27,119,189; 
    --pv-hex-3:#0b3a77; --pv-rgb-3:11,58,119;  
    --pv-sec-h: clamp(380px, 36vw, 480px);
  }
  .pv-card{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; box-shadow:0 6px 18px rgba(16,24,40,.06); padding:22px; display:flex; flex-direction:column; gap:18px }
  .pv-card-unified{ background:
    radial-gradient(140% 120% at 60% -10%, rgba(11,58,119,.06), transparent 55%),
    linear-gradient(180deg,#fff 0%, #f5f8ff 100%); }

  .pv-head{ display:flex; flex-direction:column; gap:8px }
  .pv-metric-title{ margin:0; font-weight:900; font-size:clamp(1.9rem,3.2vw,2.45rem); line-height:1; color:#0f172a; font-variant-numeric:tabular-nums; transition:opacity .25s ease }
  .pv-metric-title.is-fading{ opacity:.35 }
  .pv-meter{ height:6px; background:#eef2f7; border-radius:999px; overflow:hidden; width:100%; box-shadow: inset 0 1px 2px rgba(15,23,42,.08) }
  .pv-meter>span{ display:block; height:100%; width:0%; border-radius:999px; transition:width .6s cubic-bezier(.22,1,.36,1), background .2s ease; background:linear-gradient(90deg,#0b3a77,#1b77bd); box-shadow:0 0 0 1px rgba(255,255,255,.6) inset, 0 6px 14px rgba(2,6,23,.08) }

  .pv-dots{ display:flex; justify-content:center; gap:10px; margin-top:2px }
  .pv-dot{ width:8px; height:8px; border-radius:999px; background:#cbd5e1; cursor:pointer; transition:transform .2s ease, background .2s ease, opacity .2s ease, box-shadow .2s ease }
  .pv-dots .pv-dot:nth-child(1).is-active{ background:var(--pv-hex-0); box-shadow:0 0 0 4px rgba(var(--pv-rgb-0),.18) }
  .pv-dots .pv-dot:nth-child(2).is-active{ background:var(--pv-hex-1); box-shadow:0 0 0 4px rgba(var(--pv-rgb-1),.18) }
  .pv-dots .pv-dot:nth-child(3).is-active{ background:var(--pv-hex-2); box-shadow:0 0 0 4px rgba(var(--pv-rgb-2),.18) }
  .pv-dots .pv-dot:nth-child(4).is-active{ background:var(--pv-hex-3); box-shadow:0 0 0 4px rgba(var(--pv-rgb-3),.18) }
  .pv-dot.is-active{ transform:scale(1.15); opacity:.95 }

  .pv-unigrid{
    display:grid;
    grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
    gap:22px;
    align-items:stretch;
  }
  .pv-chart-cell, .pv-captions-cell{
    height:var(--pv-sec-h);
    display:flex; flex-direction:column;
  }

  .pv-chart-wrap{
    position:relative;
    flex:1 1 auto;
    height:100%;
    display:grid; place-items:center;
    border:none; border-radius:14px; overflow:hidden;
    background:radial-gradient(120% 120% at 60% 20%, #f5f8ff 0%, #ffffff 60%);
    box-shadow:
      0 0 0 1px rgba(16,24,40,.04) inset,
      0 22px 40px rgba(var(--pv-accent), .10),
      0 10px 22px rgba(2,6,23,.06);
    margin:0 auto;
    width:100%;
  }
  .pv-chart-wrap::after{
    content:''; position:absolute; inset:0; pointer-events:none; border-radius:14px;
    background:
      radial-gradient(90% 55% at 40% 0%, rgba(var(--pv-accent), .16), transparent 60%),
      radial-gradient(60% 60% at 80% 20%, rgba(var(--pv-accent), .10), transparent 65%);
  }
  #pv-area-chart{ width:100%; height:100%; min-height:280px }

  .pv-captions-scroll{ flex:1 1 auto; padding-right:0; display:block; }
  .pv-captions-list{ display:flex; flex-direction:column; gap:12px; width:100%; }

  .pv-caption-item{
    position:relative;
    display:flex; gap:14px; align-items:flex-start;
    border-radius:14px; padding:14px 14px;
    background:linear-gradient(180deg,#ffffff 0%, #f5f8ff 100%);
    border:1px solid #e5e7eb;
    transition:transform .18s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease, opacity .2s ease, filter .2s ease;
    will-change:transform;
    isolation:isolate;
  }
  .pv-captions-list .pv-caption-item{ --pv-item-hex: var(--pv-hex-2); --pv-item-rgb: var(--pv-rgb-2); }
  .pv-captions-list .pv-caption-item:nth-child(1){ --pv-item-hex: var(--pv-hex-0); --pv-item-rgb: var(--pv-rgb-0); }
  .pv-captions-list .pv-caption-item:nth-child(2){ --pv-item-hex: var(--pv-hex-1); --pv-item-rgb: var(--pv-rgb-1); }
  .pv-captions-list .pv-caption-item:nth-child(3){ --pv-item-hex: var(--pv-hex-2); --pv-item-rgb: var(--pv-rgb-2); }
  .pv-captions-list .pv-caption-item:nth-child(4){ --pv-item-hex: var(--pv-hex-3); --pv-item-rgb: var(--pv-rgb-3); }

  .pv-caption-item::before{
    content:''; position:absolute; inset:0; border-radius:14px; pointer-events:none;
    padding:1px;
    background:linear-gradient(145deg, rgba(var(--pv-item-rgb), .28), rgba(var(--pv-item-rgb), .06));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    opacity:.6; transition:opacity .25s ease, filter .25s ease;
  }
  .pv-caption-item::after{
    content:''; position:absolute; inset:-10px; border-radius:18px; pointer-events:none;
    background:radial-gradient(70% 70% at 50% 50%, rgba(var(--pv-item-rgb),.16), transparent 70%);
    filter: blur(12px); opacity:0; transition:opacity .25s ease, filter .25s ease;
  }
  .pv-caption-item:hover{ transform:translateY(-1px); box-shadow:0 10px 20px rgba(2,6,23,.06); border-color:#dfe3ea }
  .pv-caption-item:hover::before{ opacity:.9 }
  .pv-caption-item.active{
    border-color: rgba(var(--pv-item-rgb), .42);
    background:linear-gradient(180deg, rgba(var(--pv-item-rgb), .06), #ffffff 60%);
    box-shadow:0 12px 24px rgba(16,24,40,.08), 0 0 0 2px rgba(var(--pv-item-rgb), .10) inset;
  }
  .pv-caption-item.active::before{ opacity:1; filter:saturate(1.05) }
  .pv-caption-item.active::after{ opacity:1 }

  .pv-caption-icon{
    width:44px; height:44px; flex:0 0 44px; border-radius:12px; display:grid; place-items:center;
    background:rgba(var(--pv-item-rgb), .10); border:1px solid rgba(var(--pv-item-rgb), .30);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.6);
    color: var(--pv-item-hex);
  }
  .pv-caption-icon svg{ width:22px; height:22px; }

  .pv-caption-body{ flex:1 1 auto; min-width:0 }
  .pv-caption-top{ display:grid; grid-template-columns:1fr auto; align-items:start; gap:6px 12px; margin-bottom:4px; }
  .pv-caption-title{ margin:0; font-size:1.04rem; font-weight:800; color:#0f172a; line-height:1.25 }
  .pv-caption-perc{ font-weight:900; color:var(--pv-item-hex); font-variant-numeric:tabular-nums; text-align:right; min-width:5ch; letter-spacing:.02em }
  .pv-caption-text{ margin:0; color:#334155; line-height:1.45 }
  .pv-caption-item.inactive{ opacity:.96 }

  /* Sezioni generiche */
  .section{ padding:calc(var(--space-7) + 10px) 0 }
  .kicker{ text-transform:uppercase; letter-spacing:.12em; font-size:.8rem; font-weight:700; color:var(--blue-500) }
  .title{ font-size:clamp(1.6rem,2.2vw,2.2rem); margin:8px 0 8px }
  .lead{ color:var(--muted); max-width:120ch; margin:0 } 

  /* Cards generiche */
  .cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:20px }
  .card{ background:white; border:1px solid #e2e8f0; border-radius:16px; padding:20px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:10px }
  .card .icon{ width:42px; height:42px; border-radius:10px; background:var(--blue-100); display:flex; align-items:center; justify-content:center; color:var(--blue-700) }
  .card ul{ margin:0 0 0 18px; color:#334155 }
  .card a.cta-link{ margin-top:auto }
  .card a.cta-link.btn{ display:flex; justify-content:center; width:100%; text-align:center }
  @media (max-width:1200px){ .cards{ grid-template-columns:repeat(2,1fr) } }
  @media (max-width:960px){ .cards{ grid-template-columns:1fr } }

  /* Come funziona */
  .split{ display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:center; margin-top:24px }
  .split .illustration{ height:300px; border-radius:16px; border:1px solid #e2e8f0; background:linear-gradient(180deg,var(--blue-100),#fff); display:grid; place-items:center; color:var(--blue-700) }
  .split h3{ margin:0 0 8px }
  @media (max-width:960px){ .split{ grid-template-columns:1fr } }

  .how-icon { width:100%; max-width:470px; aspect-ratio: 45 / 25; border-radius:14px; }
  .how-icon img{ width:100%; height:100%; object-fit:contain; display:block }

  /* CTA finale */
  .cta-band{ background:linear-gradient(180deg,var(--blue-700),var(--blue-900)); color:white; border-radius:16px; padding:22px; display:flex; align-items:center; justify-content:space-between; gap:16px }
  .cta-band h3{ margin:0 }
  @media (max-width:960px){ .cta-band{ flex-direction:column; align-items:flex-start } }

  /* Footer */
  .footer{ background:#0b3a77; color:#e6f0ff; padding:48px 0; margin-top:var(--space-7) }
  .footer a{ color:#e6f0ff }
  .footer .cols{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:24px }
  .footer .brand{ color:white; font-weight:800; font-size:1.1rem }
  @media (max-width:960px){ .footer .cols{ grid-template-columns:1fr 1fr } }

  /* ========= Soluzioni (2x2) ========= */
  .section.solutions-band{ background:linear-gradient(180deg,var(--blue-700),var(--blue-900)); color:white; padding:calc(var(--space-8) + 10px) 0; min-height:clamp(560px,72vh,900px); position:relative; overflow:hidden; scroll-margin-top:90px; }
  .section.solutions-band .kicker{ color:var(--blue-100) } .section.solutions-band .title{ color:#fff } .section.solutions-band .lead{ color:rgba(255,255,255,.92) }
  .solutions-3d{ display:flex; flex-direction:column; gap:16px }
  .cards-3d{ display:grid; grid-template-columns:repeat(2,minmax(280px,1fr)); gap:32px 28px; align-items:stretch; margin-top:22px; overflow:visible }
  @media (max-width:980px){ .cards-3d{ grid-template-columns:1fr; gap:22px } }

  .box{ --card-accent:var(--blue-500); position:relative; width:100%; min-height:360px; display:flex; justify-content:center; align-items:center; padding:8px; transition:transform .35s ease, filter .35s ease; will-change:transform; isolation:isolate }
  .box:hover{ transform:translateY(-3px) }
  .box::before,.box::after{ content:''; position:absolute; inset:8px 18% 8px 18%; border-radius:12px; transform:skewX(10deg); transition:.45s ease; z-index:0 }
  .box::after{ filter:blur(24px); opacity:.85 }
  .box:hover::before,.box:hover::after{ inset:8px 12% 8px 12%; transform:skewX(0) }
  .cards-3d .box:nth-child(1){ --card-accent:#1b77bd } 
  .cards-3d .box:nth-child(2){ --card-accent:#1b77bd }
  .cards-3d .box:nth-child(3){ --card-accent:#1b77bd }
  .cards-3d .box:nth-child(4){ --card-accent:#1b77bd }
  .cards-3d .box:nth-child(1)::before,.cards-3d .box:nth-child(1)::after{ background:linear-gradient(315deg,#1b77bd,#0b3a77) } 
  .cards-3d .box:nth-child(2)::before,.cards-3d .box:nth-child(2)::after{ background:linear-gradient(315deg,#0b3a77,#1b77bd) }
  .cards-3d .box:nth-child(3)::before,.cards-3d .box:nth-child(3)::after{ background:linear-gradient(315deg,#1b77bd,#0b3a77)  }
  .cards-3d .box:nth-child(4)::before,.cards-3d .box:nth-child(4)::after{ background:linear-gradient(315deg,#0b3a77,#1b77bd) }

  .box>span{ position:absolute; inset:0; z-index:1; pointer-events:none; display:block }
  .box>span::before,.box>span::after{ content:''; position:absolute; border-radius:12px; background:rgba(255,255,255,.12); backdrop-filter:blur(10px); box-shadow:0 5px 15px rgba(0,0,0,.08); opacity:0; transition:.45s ease; animation:solutions-float 2.2s ease-in-out infinite }
  .box>span::before{ top:8px; left:8px; width:0; height:0 } .box>span::after{ bottom:8px; right:8px; width:0; height:0; animation-delay:-1.1s }
  .box:hover>span::before,.box:hover>span::after{ width:88px; height:88px; opacity:1 }
  @keyframes solutions-float{ 0%,100%{ transform:translateY(6px) } 50%{ transform:translate(-6px) } }
  @media (prefers-reduced-motion:reduce){ .box,.box::before,.box::after,.box>span::before,.box>span::after{ transition:none; animation:none } }

  .content{ position:relative; z-index:2; padding:26px 28px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(10px); border-radius:14px; box-shadow:0 5px 15px rgba(0,0,0,.18); color:#fff; width:100%; transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease }
  .box:hover .content{ transform:translateY(-2px); box-shadow:0 12px 32px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.28); border-color:rgba(255,255,255,.32) }
  .content .icon{ width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.16); color:#fff; border:1px solid rgba(255,255,255,.24); margin-bottom:10px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.12) }
  .content h3{ font-size:1.5rem; margin:6px 0 8px; color:#fff } .content p{ margin:0 0 10px; color:rgba(255,255,255,.92) } .content ul{ margin:0 0 0 18px; color:rgba(255,255,255,.9) }
  .content a.btn.primary{ background:#fff; color:#111; border-color:transparent; margin-top:6px; transition:background .25s ease,color .25s ease,box-shadow .25s ease }
  .content a.btn.primary:hover{ background:var(--card-accent); color:#0f172a; box-shadow:0 1px 16px rgba(0,0,0,.22) }

  /* Biscotto */
  .cookie-fab{ position:fixed; bottom:max(16px,env(safe-area-inset-bottom)); left:max(16px,env(safe-area-inset-left)); right:auto; z-index:9999; display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:999px; border:1px solid rgba(15,23,42,.08); background:#fff; box-shadow:0 8px 24px rgba(2,6,23,.12); color:#0f172a; cursor:pointer; transition:transform .15s ease, box-shadow .2s ease, background .2s ease }
  .cookie-fab:hover{ transform:translateY(-1px); box-shadow:0 12px 28px rgba(2,6,23,.16) } .cookie-fab:active{ transform:translateY(0) }
  .cookie-fab:focus-visible{ outline:2px solid #1b77bd; outline-offset:3px }
  .cookie-fab .hint{ position:absolute; left:66px; bottom:50%; transform:translateY(50%); background:#0b3a77; color:#fff; padding:6px 10px; border-radius:10px; font-size:.8rem; white-space:nowrap; box-shadow:0 6px 20px rgba(0,0,0,.2); opacity:0; pointer-events:none; transition:opacity .2s ease }
  .cookie-fab:hover .hint{ opacity:.95 } @media (max-width:640px){.cookie-fab{ width:52px; height:52px; bottom:12px; left:12px } .cookie-fab .hint{ display:none } }

  /* Responsivit?? specifica risultati */
  @media (max-width:980px){
    .pv-results{ --pv-sec-h:auto; }
    .pv-unigrid{ grid-template-columns:1fr; gap:16px }
    .pv-chart-cell, .pv-captions-cell{ height:auto }
    #pv-area-chart{ min-height:260px }
  }
  
   /* ===== Cards piani ===== */
   .plans-wrap {
     padding: var(--space-5) 0;
     background:
       radial-gradient(1200px 400px at 10% 0%, rgba(11,58,119, 0.00), transparent 60%),
       radial-gradient(1200px 400px at 90% 100%, rgba(27,119,189, 0.00), transparent 60%);
   }
   .plans-head { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom: 6px; }
   .section-title { margin: 0; font-size: clamp(1.35rem, 2.6vw, 1.85rem); color: #0f172a; letter-spacing: -.01em; }
   .section-kicker { margin: 0; color: #475569; font-size: .98rem; }

   .grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px }
   .plan {
     grid-column: span 12;
     background: linear-gradient(180deg, rgba(255, 255, 255, .75), rgba(255, 255, 255, .55));
     border: 1px solid rgba(16, 24, 40, .12);
     border-radius: var(--radius);
     box-shadow: var(--shadow);
     padding: 22px; position: relative; display: flex; flex-direction: column; overflow: hidden;
     backdrop-filter: saturate(140%) blur(8px); transform: translateZ(0);
     transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
   }
   .plan:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(16,24,40,.12); border-color: rgba(11,58,119,.25); }
   .plan::before { content: ''; position: absolute; inset: -50% -50% auto auto; width: 200%; height: 200%;
     background: linear-gradient(45deg, transparent, rgba(255,255,255,.18), transparent); transform: rotate(45deg) translateX(-100%); pointer-events: none; }
   .plan:hover::before { animation: shine 1s forwards; }
   @keyframes shine { 0%{transform:rotate(45deg) translateX(-100%);}100%{transform:rotate(45deg) translateX(30%);} }
   .plan.popular::after { content: "Popolare"; position: absolute; top: 14px; right: -34px; transform: rotate(45deg);
     background: linear-gradient(135deg, var(--blue-700), var(--blue-500)); color:#fff; font-size:.75rem; font-weight:800; letter-spacing:.06em; padding:6px 48px; box-shadow:0 6px 16px rgba(11,58,119,.25); }
   .plan h3 { margin: 0 0 6px; color: #0f172a; font-size: 1.25rem }
   .subtitle { color: #475569; font-size: .95rem; margin-bottom: 10px }
   .price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; transition: transform .5s ease, opacity .5s ease; }
   .price .currency { font-weight: 800; color: var(--blue-700) }
   .price .amount { font-size: 2rem; font-weight: 900; color: #0f172a; line-height: 1 }
   .price .vat { color: #475569; font-size: .9rem }
   .price.animate { animation: priceChange .5s ease; }
   @keyframes priceChange { 0%{transform:translateY(-14px);opacity:0;}100%{transform:translateY(0);opacity:1;} }
   .plan.flip { animation: flipCard .6s ease; transform-style: preserve-3d; }
   @keyframes flipCard { 0%{transform:rotateY(0deg);}50%{transform:rotateY(90deg);}100%{transform:rotateY(0deg);} }
   .features { margin: 14px 0 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; color: #334155 }
   .check { width: 22px; height: 22px; border-radius: 6px; background: var(--blue-100); display: inline-flex; align-items: center; justify-content: center; flex: 0 0 22px; color: var(--blue-700) }
   .check svg { width: 14px; height: 14px; fill: currentColor }
   .features li { display: flex; align-items: flex-start; gap: 10px }
   .plan .note { margin-top: 8px; color: #475569; font-size: .85rem }
   .setup-badge { margin-top: 8px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 999px; background: rgba(27,119,189,.18); border: 1px solid rgba(27,119,189,.55); color: var(--blue-800); font-weight: 700; font-size: .9rem; width: fit-content; }
   .audience { margin-top: 12px; color: #475569; font-size: .95rem; }
   .plan .cta { margin-top: auto; display: flex; justify-content: center; padding-top: 16px; }
   .plan .cta a { display: inline-flex; align-items: center; gap: 8px; padding: 12px 16px; border-radius: 12px; background: linear-gradient(180deg, rgba(27,119,189,.65), rgba(27,119,189,.9)); color: var(--blue-900); font-weight: 800; border: 1px solid rgba(27,119,189,.55); transition: transform .25s ease, box-shadow .25s ease; }
   .plan .cta a:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(11,58,119,.2); }
   @media (min-width:740px) { .plan { grid-column: span 6 } }
   @media (min-width:992px) { .plan { grid-column: span 4 } .plan.full { grid-column: 1 / -1; } }

   /* ===== Differenziazione visiva PARTNER ===== */
   .plan.partners {
     background: linear-gradient(180deg, #0b3a77, #1b77bd);
     color: #e6f0ff;
     border: 1px solid rgba(255,255,255,.14);
   }
   .plan.partners .subtitle {
     color: var(--accent);
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: .08em;
     margin-bottom: 6px;
   }
   .plan.partners h3 { color: #ffffff; }
   .plan.partners .features { color: #e6f0ff; }
   .plan.partners .check { background: rgba(255,255,255,.16); color: #fff; }
   .plan.partners .partner-lead { color: #e6f0ff; }
   .partner-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-top: 10px; }
   .partner-actions small { color: #e6f0ff }

   /* CTA band */
   .cta-band { background: linear-gradient(180deg, var(--blue-700), var(--blue-900)); color: #fff; border-radius: 16px; padding: 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px }
   .cta-band h3 { margin: 0 }
   @media (max-width:960px) { .cta-band { flex-direction: column; align-items: flex-start } }
   
   /* ====== Contact form band ====== */
     .contact-band{
       background:
         radial-gradient(1100px 420px at 0% 0%, rgba(98,125,166,.06), transparent 60%),
         radial-gradient(1100px 420px at 100% 100%, rgba(140,162,201,.08), transparent 60%);
     }
     .contact-grid{
       display:grid;
       grid-template-columns:minmax(0,1.1fr) minmax(0,1.1fr);
       gap:clamp(24px,3vw,40px);
       align-items:stretch;
     }
     .contact-copy--full{
       grid-column:1/-1;
     }
     .contact-copy .title{
       margin-top:6px;
       margin-bottom:10px;
     }
     .contact-lead{
       margin-top:6px;
       margin-bottom:12px;
     }
     .contact-points{
       list-style:none;
       margin:16px 0 0;
       padding:0;
       display:flex;
       flex-direction:column;
       gap:8px;
       color:#334155;
       max-width:52ch;
       font-size:.96rem;
     }
     .contact-points li::before{
       content:"???";
       margin-right:6px;
       color:var(--blue-700);
       font-weight:900;
     }

     .contact-form-card{
       background:#ffffff;
       border-radius:var(--radius);
       border:1px solid #e2e8f0;
       box-shadow:var(--shadow);
       padding:20px 22px 18px;
       position:relative;
       overflow:hidden;
     }
     .contact-form-card--full{
       grid-column:1/-1;
     }
     
     
     
     .contact-form-card::before{
       content:'';
       position:absolute;
       inset:-50% -40% auto auto;
       background:radial-gradient(120% 80% at 100% 0%, rgba(98,125,166,.16), transparent 60%);
       opacity:.75;
       pointer-events:none;
     }
     .contact-form-header{
       position:relative;
       display:flex;
       align-items:flex-start;
       gap:12px;
       margin-bottom:14px;
       z-index:1;
     }
     .contact-form-header-icon{
       width:40px;
       height:40px;
       border-radius:999px;
       display:flex;
       align-items:center;
       justify-content:center;
       background:rgba(140,162,201,.18);
       color:var(--blue-700);
       border:1px solid rgba(140,162,201,.6);
     }
     .contact-form-title{
       margin:0;
       font-size:1.1rem;
       color:#0f172a;
       font-weight:800;
     }
     .contact-form-subtitle{
       margin:3px 0 0;
       font-size:.9rem;
       color:#475569;
     }

     .contact-form{
       position:relative;
       z-index:1;
       display:flex;
       flex-direction:column;
       gap:14px;
     }
          .contact-form--steps{
       gap:16px;
     }
     .contact-stepper{
       display:flex;
       align-items:center;
       gap:12px;
       font-size:.85rem;
       color:#475569;
     }
     .contact-stepper-bar{
       flex:1;
       height:6px;
       border-radius:999px;
       background:#e2e8f0;
       overflow:hidden;
     }
     .contact-stepper-bar span{
       display:block;
       height:100%;
       width:25%;
       background:linear-gradient(90deg, rgba(98,125,166,.9), rgba(27,119,189,.95));
       transition:width .2s ease;
     }
     .contact-step{
       display:none;
     }
     .contact-step.is-active{
       display:block;
     }
     .contact-question{
       margin:0 0 10px;
       font-weight:700;
       color:#0f172a;
     }
     .contact-options{
       display:grid;
       grid-template-columns:repeat(2,minmax(0,1fr));
       gap:10px;
     }
     .option-card{
       display:flex;
       align-items:center;
       gap:8px;
       padding:10px 12px;
       border-radius:12px;
       border:1px solid #cbd5e1;
       background:#fff;
       cursor:pointer;
       font-weight:600;
       color:#0f172a;
       transition:box-shadow .18s ease, border-color .18s ease, transform .18s ease;
     }
     .option-card input{
       margin:0;
     }
     .option-card.is-selected{
       border-color:var(--blue-500);
       box-shadow:0 0 0 2px rgba(98,125,166,.18);
       background:#f8fafc;
     }
     .contact-step-actions{
       margin-top:12px;
       display:flex;
       gap:10px;
       flex-wrap:wrap;
     }
     .contact-helper{
       margin:6px 0 0;
       font-size:.84rem;
       color:#64748b;
     }
     .contact-error{
       margin:6px 0 0;
       font-size:.84rem;
       color:#b45309;
     }
     .contact-error[hidden]{
       display:none;
     }.contact-form-grid{
       display:grid;
       grid-template-columns:repeat(2,minmax(0,1fr));
       gap:12px 18px;
     }
     .form-field{
       display:flex;
       flex-direction:column;
       gap:6px;
     }
     .form-field.field-full{
       grid-column:1/-1;
     }
     .field-label{
       display:inline-flex;
       align-items:center;
       gap:6px;
       font-size:.9rem;
       font-weight:600;
       color:#0f172a;
     }
     .field-label-icon{
       display:inline-flex;
       align-items:center;
       justify-content:center;
       width:18px;
       height:18px;
       border-radius:6px;
       background:rgba(140,162,201,.16);
       color:var(--blue-700);
       font-size:.72rem;
     }
     .contact-form input[type="text"],
     .contact-form input[type="email"],
     .contact-form input[type="tel"],
     .contact-form input[type="date"],
     .contact-form input[type="time"],
     .contact-form input[type="datetime-local"],
     .contact-form textarea{
       border-radius:10px;
       border:1px solid #cbd5e1;
       padding:9px 11px;
       font-size:.95rem;
       font-family:inherit;
       color:#0f172a;
       background:#ffffff;
       transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
     }
     .contact-form textarea{
       resize:vertical;
       min-height:120px;
     }
     .contact-form input::placeholder,
     .contact-form textarea::placeholder{
       color:#9ca3af;
     }
     .contact-form input:focus,
     .contact-form textarea:focus{
       outline:none;
       border-color:var(--blue-500);
       box-shadow:0 0 0 1px rgba(140,162,201,.5), 0 0 0 4px rgba(140,162,201,.22);
       background:#ffffff;
     }

     .contact-form-footer{
       margin-top:6px;
       display:flex;
       flex-direction:column;
       gap:10px;
     }
     .checkbox-field{
       display:flex;
       align-items:flex-start;
       gap:8px;
       font-size:.85rem;
       color:#475569;
     }
     .checkbox-field input[type="checkbox"]{
       margin-top:2px;
       width:16px;
       height:16px;
       border-radius:4px;
       border:1px solid #cbd5e1;
     }
     .checkbox-field a{
       text-decoration:underline;
     }
     .contact-form-footer .btn{
       align-self:flex-start;
     }
     .contact-form-note{
       margin:2px 0 0;
       font-size:.8rem;
       color:#64748b;
     }

     @media (max-width:960px){
       .contact-grid{
         grid-template-columns:1fr;
       }
     .contact-copy--full{
       grid-column:1/-1;
     }
     }
     @media (max-width:640px){
       .contact-options{
         grid-template-columns:1fr;
       }
       .contact-form-grid{
         grid-template-columns:1fr;
       }
       .contact-form-card{
         padding:18px 16px 16px;
       }
     
     
     
     }
     
               /* ===== Sezione integrazioni: "Fallo comunicare con..." ===== */
    .integrations-section{
      background:#f1f5f9;
    }
    .integrations-head{
      display:flex;
      flex-direction:column;
      gap:4px;
      margin-bottom:var(--space-4);
      text-align:left;
    }
    .integrations-grid{
      margin-top:var(--space-3);
    }
    .integration-card{
      display:flex;
      flex-direction:column;
      gap:12px;
    }
    .integration-media{
      border-radius:12px;
      background:linear-gradient(135deg,rgba(148,163,184,.16),rgba(148,163,184,.04));
      padding:10px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
    }
    .integration-media img{
      max-height:120px;
      width:auto;
      display:block;
    }
    .integration-tag{
      font-size:.8rem;
      text-transform:uppercase;
      letter-spacing:.08em;
      color:var(--blue-700);
      font-weight:700;
    }
    .integration-title{
      margin:2px 0 0;
      font-size:1.02rem;
      color:#0f172a;
    }
    .integration-desc{
      margin:0;
      color:#475569;
      font-size:.95rem;
    }
    .integration-link{
      margin-top:auto;
      font-size:.92rem;
      font-weight:700;
      display:inline-flex;
      align-items:center;
      gap:8px;
      color:var(--blue-700);
    }
    .integration-link svg{
      width:16px;
      height:16px;
    }
   









@media (max-width: 640px) {
  .f-certifications h4,
  .footer-certifications h4 {
    text-align: center;
    width: 100%;
  }
  .f-certifications .cert-logos,
  .footer-certifications {
    flex-direction: column;
    align-items: center;
  }
  .f-certifications .cert-logo-slot,
  .footer-certifications .cert-logo-slot {
    width: 200px;
    max-width: 100%;
    justify-content: center;
  }
  .f-certifications .cert-project,
  .footer-certifications .cert-project {
    margin-left: 0 !important;
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
  }
  .f-certifications .cert-project > div:last-child,
  .footer-certifications .cert-project > div:last-child {
    width: 100% !important;
    max-width: 220px;
    height: auto !important;
    padding: 6px;
  }
  .f-certifications .cert-project img,
  .footer-certifications .cert-project img {
    max-width: 100%;
    height: auto !important;
  }
}



@media (max-width: 640px) {
  .footer .cols{ grid-template-columns:1fr; }
  .footer .cols > div{ width:100%; }
}

@media (max-width: 960px) {
  .nav a.btn svg {
    margin-right: 8px;
  }
}