/* Stefano Zanola - versione lunga, responsive, no form */
:root{--primary:#1e5f96;--primary-dark:#123f68;--accent:#1473d1;--sky:#5bbadd;--pale:#f4faff;--pale-2:#eef7fd;--white:#fff;--ink:#122b4c;--text:#243a55;--muted:#66778a;--line:#d9eaf5;--shadow:0 22px 60px rgba(30,95,150,.12);--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:#fff;color:var(--text)}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}.container{width:min(1240px,calc(100% - 44px));margin-inline:auto}.skip-link{position:absolute;left:-999px;top:10px;background:#fff;color:#000;padding:10px;border-radius:8px;z-index:100}.skip-link:focus{left:10px}.site-header{position:fixed;inset:0 0 auto;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav-wrap{height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px}.brand img{width:52px;height:52px;object-fit:contain}.brand span,.footer-brand span{display:grid}.brand strong{font-size:22px;line-height:1;color:var(--ink);letter-spacing:-.04em}.brand small{font-size:12px;color:var(--sky);font-weight:900;letter-spacing:.12em;text-transform:uppercase}.main-nav{display:flex;align-items:center;gap:30px}.main-nav a{font-size:14px;font-weight:900;color:var(--ink)}.main-nav a:hover{color:var(--accent)}.header-mail{color:var(--accent);font-weight:900;font-size:14px}.menu-toggle{display:none;border:0;background:transparent;width:44px;height:44px;padding:9px}.menu-toggle span{display:block;height:2px;background:var(--primary);border-radius:999px;margin:6px 0}.section{padding:92px 0}.section-spacious{padding:132px 0 64px}.hero{background:linear-gradient(90deg,#fff 0%,#f8fcff 45%,#eaf7fe 100%);overflow:hidden}.hero-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:44px;align-items:center;min-height:460px}.kicker,.section-tag,.section-heading span{display:inline-flex;margin:0;color:var(--accent);font-weight:900;font-size:13px;letter-spacing:.14em;text-transform:uppercase}.hero h1{font-size:clamp(40px,4.9vw,66px);line-height:1.05;letter-spacing:-.058em;color:var(--ink);margin:16px 0 0;font-weight:900}.hero-subtitle{font-size:20px;color:var(--accent);margin:22px 0 0}.lead{font-size:18px;line-height:1.68;color:var(--text);margin:10px 0 0;max-width:520px}.hero-actions{display:flex;gap:34px;align-items:center;margin-top:30px}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;font-weight:900;min-height:46px;padding:0 20px}.btn-primary{background:#0b76e0;color:white;box-shadow:0 12px 26px rgba(20,115,209,.22)}.btn-primary:hover{background:#075fb7}.btn-link{color:var(--accent);padding-inline:0}.hero-visual{position:relative;height:420px;min-width:0}.visual-bg{position:absolute;inset:10px 0 10px 35px;background:radial-gradient(circle at 50% 40%,rgba(91,186,221,.22),transparent 55%);border-radius:40px}.cloud{position:absolute;border:3px solid rgba(20,115,209,.22);border-radius:50px}.cloud-one{width:94px;height:58px;left:142px;top:35px}.cloud-two{width:70px;height:42px;left:360px;top:72px}.shield-line{position:absolute;left:64px;top:115px;width:500px;height:150px;border-top:2px solid rgba(20,115,209,.18);border-left:2px solid rgba(20,115,209,.16);border-radius:22px}.workstation{position:absolute;left:95px;bottom:72px;width:500px;height:210px}.laptop{position:absolute;left:0;bottom:8px;width:210px}.screen{height:112px;border-radius:12px 12px 4px 4px;background:linear-gradient(135deg,#163f68,#1d8fd2);border:8px solid #17283b;display:grid;place-items:center;color:#fff;font-size:13px;font-weight:800}.keyboard{height:16px;background:#ced8e2;border-radius:0 0 16px 16px}.phone{position:absolute;left:190px;bottom:2px;width:56px;height:118px;background:#263347;border-radius:12px;box-shadow:inset 0 -16px 0 #121926}.monitor{position:absolute;left:230px;bottom:20px;width:250px}.monitor-screen{height:132px;background:#f8fcff;border:10px solid #273648;border-radius:10px;padding:20px;display:grid;gap:10px}.monitor-screen i{display:block;height:12px;border-radius:99px;background:linear-gradient(90deg,var(--accent),#b8ddf7)}.monitor-screen i:nth-child(2){width:75%}.monitor-screen i:nth-child(3){width:55%}.monitor-stand{width:92px;height:24px;background:#273648;margin:auto;border-radius:0 0 12px 12px}.rack{position:absolute;right:12px;top:42px;width:180px;height:292px;background:linear-gradient(90deg,#1c2733,#36414d);border-radius:10px;box-shadow:18px 18px 45px rgba(13,41,72,.22);padding:24px 18px;display:grid;gap:12px}.rack span{background:#111c29;border:1px solid #33465a;border-radius:5px;box-shadow:inset 0 0 0 1px rgba(20,115,209,.35)}.network-devices{position:absolute;right:116px;bottom:46px;display:flex;gap:16px}.router,.switch{width:170px;height:46px;background:#223143;border-radius:8px;border:1px solid #425266;display:flex;align-items:center;gap:8px;padding:13px}.router i,.switch i{width:12px;height:8px;border-radius:2px;background:#0b76e0}.switch{width:210px}.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:34px 0 0}.hero-stat{display:flex;align-items:center;gap:12px;border-right:1px solid var(--line);padding:0 24px}.hero-stat:last-child{border-right:0}.stat-icon{font-size:30px;color:var(--accent);line-height:1}.hero-stat strong{display:block;color:var(--accent);font-size:22px}.hero-stat small{display:block;color:var(--text);font-size:13px}.section-heading{text-align:center;max-width:820px;margin:0 auto 46px}.section-heading h2,.split-panel h2,.about-main h2,.contact-box h2{margin:12px 0 0;color:var(--ink);font-size:clamp(34px,4vw,52px);line-height:1.08;letter-spacing:-.05em}.section-heading p,.split-panel p,.contact-box p{font-size:18px;line-height:1.7;color:var(--muted);margin:18px 0 0}.services-section{background:#f3f8fd}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.service-card{background:rgba(255,255,255,.9);border:1px solid var(--line);border-radius:20px;padding:34px;min-height:210px;box-shadow:0 16px 40px rgba(30,95,150,.06);transition:.22s}.service-card:hover,.why-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.service-icon{display:block;color:var(--accent);font-size:34px;margin-bottom:18px}.service-card h3{margin:0;color:var(--ink);font-size:22px}.service-card p{color:var(--text);line-height:1.62;font-size:16px;margin:14px 0 0}.why-section{background:#fff}.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.why-card{border:1px solid var(--line);background:linear-gradient(180deg,#fff,#f7fbff);border-radius:22px;padding:28px;transition:.22s}.why-card b{display:grid;place-items:center;width:46px;height:46px;background:#e7f4fd;color:var(--accent);border-radius:16px;margin-bottom:20px}.why-card h3{margin:0;color:var(--ink);font-size:20px}.why-card p{color:var(--muted);line-height:1.65;margin:12px 0 0}.competenze-section{background:#f8fcff}.competence-grid{border-top:1px solid var(--line);border-left:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 16px 40px rgba(30,95,150,.05)}.competence-grid div{min-height:76px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:18px}.competence-grid span{color:var(--accent);font-weight:900;font-size:15px;min-width:28px}.competence-grid b{color:var(--ink);font-size:15px}.tech-section{background:#fff}.split-panel{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}.tech-cloud{display:flex;flex-wrap:wrap;gap:14px;padding:34px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(135deg,#f7fcff,#fff);box-shadow:var(--shadow)}.tech-cloud span{padding:13px 16px;border-radius:999px;background:#e8f5fd;color:var(--primary);font-weight:900;border:1px solid #cae8f7}.about-section{background:#f3f8fd}.about-panel{display:grid;grid-template-columns:1.25fr 1fr;gap:26px;align-items:center}.about-main{display:flex;align-items:center;gap:30px;background:#fff;border:1px solid var(--line);border-radius:26px;padding:36px;box-shadow:var(--shadow)}.about-mark{width:132px;height:132px;border-radius:50%;background:#f7fcff;display:grid;place-items:center;border:1px solid var(--line);flex:0 0 auto}.about-mark img{width:82px}.about-main p{margin:16px 0 0;color:var(--text);font-size:17px;line-height:1.7}.about-features{display:grid;gap:16px}.about-features article{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px}.about-features span{display:block;color:var(--accent);font-size:30px;margin-bottom:10px}.about-features h3{margin:0;color:var(--ink);font-size:18px}.about-features p{margin:8px 0 0;color:var(--muted);line-height:1.55}.method-section{background:#fff}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;position:relative}.timeline article{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:0 16px 40px rgba(30,95,150,.06)}.timeline b{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--accent);color:#fff;margin-bottom:20px}.timeline h3{margin:0;color:var(--ink);font-size:20px}.timeline p{color:var(--muted);line-height:1.65}.numbers-section{background:linear-gradient(135deg,#eaf7fe,#f7fcff)}.numbers-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.numbers-grid div{text-align:center;background:#fff;border:1px solid var(--line);border-radius:24px;padding:36px;box-shadow:0 16px 40px rgba(30,95,150,.06)}.numbers-grid strong{display:block;color:var(--accent);font-size:46px;letter-spacing:-.04em}.numbers-grid span{display:block;color:var(--muted);font-weight:800;margin-top:8px}.contact-section{background:#fff}.contact-box{display:grid;grid-template-columns:1fr auto;align-items:center;gap:40px;background:linear-gradient(135deg,var(--primary),#1473d1);border-radius:28px;padding:44px;color:#fff;box-shadow:var(--shadow)}.contact-box .section-tag,.contact-box h2,.contact-box p{color:#fff}.big-mail{display:inline-flex;background:#fff;color:var(--accent);font-weight:900;border-radius:12px;padding:16px 20px}.contact-actions{display:grid;gap:12px;text-align:right}.site-footer{background:#f8fcff;border-top:1px solid var(--line);padding:48px 0}.footer-grid{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:30px;align-items:start}.footer-brand{display:flex;align-items:center;gap:10px}.footer-brand img{width:48px}.footer-brand strong{font-size:22px;color:var(--ink);letter-spacing:-.04em}.footer-brand small{font-size:10px;color:var(--sky);font-weight:900;letter-spacing:.15em}.site-footer nav{display:flex;gap:22px;flex-wrap:wrap}.site-footer a{color:var(--accent);font-weight:900}.footer-contact{display:grid;gap:8px;text-align:right}.footer-contact span{color:var(--muted)}.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.12s}.policy-body{background:var(--pale)}.legal-card{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:34px;max-width:920px;margin:100px auto}.legal-card h1{margin:8px 0 18px;color:var(--ink);font-size:40px}.legal-card h2{color:var(--ink);margin-top:28px}.legal-card p,.legal-card li{line-height:1.7}.legal-card a{color:var(--accent);font-weight:900}.back-link{color:var(--accent);font-weight:900}@media (max-width:1100px){.header-mail{display:none}.main-nav{gap:22px}.hero-grid,.split-panel,.about-panel,.contact-box{grid-template-columns:1fr}.hero-visual{height:360px}.services-grid{grid-template-columns:repeat(2,1fr)}.why-grid,.timeline,.numbers-grid{grid-template-columns:repeat(2,1fr)}.hero-stats{grid-template-columns:repeat(2,1fr);row-gap:16px}.hero-stat:nth-child(2){border-right:0}.competence-grid{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:1fr}.footer-contact{text-align:left}}@media (max-width:760px){.container{width:min(100% - 28px,1240px)}.section,.section-spacious{padding:72px 0}.menu-toggle{display:block}.main-nav{display:none;position:absolute;top:82px;left:14px;right:14px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;padding:12px;flex-direction:column;align-items:stretch;gap:0}.main-nav.open{display:flex}.main-nav a{padding:14px;border-radius:10px}.hero h1{font-size:38px}.hero-actions{flex-direction:column;align-items:flex-start;gap:14px}.hero-visual{height:295px;transform:scale(.78);transform-origin:left top;width:125%;margin-bottom:-64px}.hero-stats,.services-grid,.why-grid,.competence-grid,.timeline,.numbers-grid{grid-template-columns:1fr}.hero-stat{border-right:0;border-bottom:1px solid var(--line);padding:12px 0}.about-main{display:block}.about-mark{margin-bottom:20px}.contact-actions{text-align:left}.site-footer nav{display:grid}.footer-grid{gap:24px}}


/* Fix layout feedback - versione piu ariosa */
html { scroll-padding-top: 96px; }
section[id] { scroll-margin-top: 96px; }
.brand, .footer-brand { cursor: pointer; }

/* Tolti i contatori nella hero: rimane solo la sezione Numeri in basso */
.hero { padding-bottom: 96px; }

/* Evita che una sezione anticipi quella dopo nello stesso viewport */
.services-section,
.why-section,
.competenze-section,
.tech-section,
.about-section,
.method-section,
.numbers-section,
.contact-section {
  padding-top: 118px;
  padding-bottom: 118px;
}

/* Piu respiro tra Perche scegliermi e Competenze */
.why-section { border-bottom: 1px solid var(--line); }
.why-grid { gap: 28px; }
.why-card { min-height: 250px; }

/* Competenze: separata bene da Tecnologie e senza tagli */
.competenze-section { padding-bottom: 132px; }
.competence-grid { margin-top: 22px; }
.competence-grid div { min-height: 88px; }

/* Tecnologie e ambienti: sezione dedicata, piu alta e distanziata */
.tech-section { background: linear-gradient(180deg,#fff 0%,#f7fcff 100%); }
.split-panel { align-items: stretch; }
.split-panel > div:first-child,
.tech-cloud { min-height: 340px; }
.split-panel > div:first-child {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.tech-cloud {
  align-content: center;
  align-items: center;
}

/* Chi sono: piu spazio sotto per non vedere subito Metodo di lavoro */
.about-section { padding-bottom: 150px; }
.about-panel { gap: 34px; }
.about-main { min-height: 330px; }
.about-features article { min-height: 104px; }

/* Metodo piu distanziato */
.method-section { border-top: 1px solid var(--line); }
.timeline article { min-height: 245px; }

/* Header mobile e layout responsive */
@media (max-width:1100px){
  .services-section,
  .why-section,
  .competenze-section,
  .tech-section,
  .about-section,
  .method-section,
  .numbers-section,
  .contact-section { padding-top: 92px; padding-bottom: 92px; }
  .about-section { padding-bottom: 110px; }
  .split-panel > div:first-child, .tech-cloud { min-height: auto; }
}
@media (max-width:760px){
  html { scroll-padding-top: 86px; }
  section[id] { scroll-margin-top: 86px; }
  .services-section,
  .why-section,
  .competenze-section,
  .tech-section,
  .about-section,
  .method-section,
  .numbers-section,
  .contact-section { padding-top: 76px; padding-bottom: 76px; }
  .hero { padding-bottom: 72px; }
  .why-card, .timeline article, .about-main { min-height: auto; }
}


/* Fix 2 - sezione servizi, metodo integrato, numeri puliti */

/* Il click su Servizi porta all'inizio vero della sezione, senza lasciare visibile la hero */
html { scroll-padding-top: 74px; }
section[id] { scroll-margin-top: 74px; }
.hero { min-height: calc(100vh - 74px); padding-bottom: 120px; }
.services-section { padding-top: 130px !important; }

/* Perche scegliermi piu su e con metodo incorporato */
.why-section { padding-top: 86px !important; padding-bottom: 112px !important; }
.why-method-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.why-method-grid .why-card { min-height: 230px; }

/* Rimuove eventuali spazi/stili rimasti del vecchio metodo */
.method-section { display: none !important; }

/* Contatori rifatti: barra elegante, non card grosse */
.numbers-strip { background: #f8fcff; border-block: 1px solid var(--line); padding: 34px 0; }
.numbers-line { display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; }
.numbers-line div { text-align: center; padding: 8px 24px; border-right: 1px solid var(--line); }
.numbers-line div:last-child { border-right: 0; }
.numbers-line strong { display: block; color: var(--accent); font-size: 34px; line-height: 1; letter-spacing: -0.04em; }
.numbers-line span { display: block; margin-top: 6px; color: var(--text); font-size: 14px; font-weight: 800; }

/* Contatti piu professionali */
.contact-box p { max-width: 620px; }

/* Più separazione fra Chi sono e contatori/contatti */
.about-section { padding-bottom: 118px !important; }

@media (max-width:1100px){
  .why-method-grid { grid-template-columns: repeat(2, 1fr); }
  .numbers-line { grid-template-columns: repeat(2, 1fr); row-gap: 18px; }
  .numbers-line div:nth-child(2) { border-right: 0; }
}
@media (max-width:760px){
  html { scroll-padding-top: 82px; }
  section[id] { scroll-margin-top: 82px; }
  .hero { min-height: auto; padding-bottom: 82px; }
  .services-section { padding-top: 92px !important; }
  .why-section { padding-top: 76px !important; }
  .why-method-grid, .numbers-line { grid-template-columns: 1fr; }
  .numbers-line div { border-right: 0; border-bottom: 1px solid var(--line); padding: 18px 0; }
  .numbers-line div:last-child { border-bottom: 0; }
}


/* Fix 3 - Servizi non tagliati nel viewport */

/* Obiettivo: quando clicchi Servizi, la sezione parte subito sotto header e mostra tutte le 6 card */
html { scroll-padding-top: 72px !important; }
section[id] { scroll-margin-top: 72px !important; }

/* Servizi piu compatti e senza vuoto enorme sopra */
.services-section {
  padding-top: 54px !important;
  padding-bottom: 72px !important;
  min-height: calc(100vh - 72px);
}

.services-section .section-heading {
  margin-bottom: 34px !important;
}

.services-section .section-heading h2 {
  font-size: clamp(32px, 3.6vw, 48px) !important;
  max-width: 820px;
  margin-inline: auto;
}

.services-section .section-heading p {
  margin-top: 14px !important;
  font-size: 17px !important;
  line-height: 1.55 !important;
}

.services-grid {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
}

.service-card {
  min-height: 176px !important;
  padding: 26px 28px !important;
}

.service-icon {
  font-size: 28px !important;
  margin-bottom: 14px !important;
}

.service-card h3 {
  font-size: 20px !important;
}

.service-card p {
  font-size: 15px !important;
  line-height: 1.55 !important;
  margin-top: 10px !important;
}

/* Sezione successiva resta ben separata ma non invade */
.why-section {
  padding-top: 84px !important;
}

@media (max-width:1100px){
  .services-section {
    padding-top: 58px !important;
    padding-bottom: 80px !important;
    min-height: auto;
  }
  .services-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .service-card {
    min-height: 170px !important;
  }
}

@media (max-width:760px){
  html { scroll-padding-top: 82px !important; }
  section[id] { scroll-margin-top: 82px !important; }
  .services-section {
    padding-top: 42px !important;
    padding-bottom: 64px !important;
  }
  .services-grid {
    grid-template-columns: 1fr !important;
  }
  .service-card {
    min-height: auto !important;
    padding: 24px !important;
  }
}


/* Fix 4 - rimossa scritta Microsoft 365 dalla hero */
.screen {
  position: relative;
  overflow: hidden;
}
.screen span { display: none !important; }
.screen::before {
  content: "";
  position: absolute;
  inset: 22px 26px auto 26px;
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  box-shadow:
    0 22px 0 rgba(255,255,255,.42),
    0 44px 0 rgba(255,255,255,.28);
}
.screen::after {
  content: "";
  position: absolute;
  right: 24px;
  bottom: 20px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 8px solid rgba(255,255,255,.35);
  border-top-color: rgba(255,255,255,.85);
}