/* ==================================================================
   ZONAR Cyber Security — stile della pagina
   Ricavato dal foglio di stile del sito vetrina: OGNI selettore, anche
   dentro le media query, e' prefissato con #zcs. Cosi' questa pagina
   non tocca una sola regola del resto della piattaforma, e Metronic
   non tocca lei.
   I caratteri sono quelli gia' caricati da zonar.it (Outfit e Inter):
   nessun woff2 aggiuntivo, nessuna richiesta in piu'.
   ================================================================== */

#zcs{--night:#050D1F;      
  --navy:#081C3F;       
  --navy-2:#0E2657;
  --lime:#BEFA03;       
  --lime-dark:#8DBA00;
  --paper:#F3F5F8;
  --white:#FFFFFF;
  --ink:#0B1530;
  --muted:#5A6479;
  --line:#D8DDE6;
  --line-dark:rgba(255,255,255,.14);
  --display:"Outfit","Segoe UI",Arial,sans-serif;
  --body:"Inter","Segoe UI",Roboto,Arial,sans-serif;
  --radius:14px;
  --header-h:72px;}
#zcs *,#zcs *::before,#zcs *::after{box-sizing:border-box}
#zcs{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 12px);-webkit-text-size-adjust:100%}
#zcs{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--body)}
#zcs img{max-width:100%;height:auto;display:block}
#zcs a{color:inherit}
#zcs button,#zcs input,#zcs select,#zcs textarea{font:inherit;color:inherit}
#zcs h1,#zcs h2,#zcs h3{font-family:var(--display);font-weight:600;line-height:1.08;margin:0;letter-spacing:-.025em}
#zcs h2{font-size:clamp(30px,4.2vw,50px);max-width:20ch}
#zcs h3{font-size:21px;letter-spacing:-.01em}
#zcs p{margin:0 0 1em}
#zcs :focus-visible{outline:3px solid var(--lime);outline-offset:3px;border-radius:4px}
#zcs .wrap{width:min(1180px,100% - 48px);margin-inline:auto}
#zcs .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#zcs .btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border-radius:999px;border:2px solid transparent;font-weight:600;font-size:16px;text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s}
#zcs .btn:active{transform:translateY(1px)}
#zcs .btn-lime{background:var(--lime);color:var(--navy)}
#zcs .btn-lime:hover{background:#D4FF4A}
#zcs .btn-ghost{border-color:rgba(255,255,255,.35);color:var(--white)}
#zcs .btn-ghost:hover{border-color:var(--white)}
#zcs .btn-outline{border-color:var(--navy);color:var(--navy)}
#zcs .btn-outline:hover{background:var(--navy);color:var(--white)}
#zcs .btn-dark{background:var(--navy);color:var(--white)}
#zcs .btn-dark:hover{background:var(--navy-2)}
#zcs .btn-full{width:100%}
@keyframes zcs-mapIn{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}
@keyframes zcs-ring{0%{transform:scale(1);opacity:.9}100%{transform:scale(14);opacity:0}}
@keyframes zcs-fadeIn{to{opacity:1}}
#zcs .section{padding:clamp(72px,10vw,128px) 0}
#zcs .section-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:end;margin-bottom:56px}
#zcs .section-head p{color:var(--muted);max-width:46ch;margin:0}
#zcs .section-head-light p{color:rgba(255,255,255,.68)}
#zcs .pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}
#zcs .pillar{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:32px 28px}
#zcs .pillar h3{font-size:28px;display:flex;align-items:center;gap:12px}
#zcs .pillar-mark{width:14px;height:14px;background:var(--lime);border:2px solid var(--navy);transform:rotate(45deg);flex:none}
#zcs .pillar-intro{color:var(--muted);margin:12px 0 22px}
#zcs .pillar dl{margin:0}
#zcs .pillar dt{font-weight:600;padding-top:16px;border-top:1px solid var(--line)}
#zcs .pillar dd{margin:4px 0 16px;color:var(--muted);font-size:15.5px}
#zcs .pillar-dark{background:var(--navy);border-color:var(--navy);color:var(--white);margin-top:32px}
#zcs .pillar-dark .pillar-mark{border-color:var(--white)}
#zcs .pillar-dark .pillar-intro,#zcs .pillar-dark dd{color:rgba(255,255,255,.7)}
#zcs .pillar-dark dt{border-color:var(--line-dark)}
#zcs .security{background:var(--navy);color:var(--white)}
#zcs .cycle{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;position:relative}
#zcs .cycle::before{content:"";position:absolute;left:24px;right:24px;top:24px;height:2px;background:linear-gradient(90deg,var(--lime),rgba(191,251,3,.25))}
#zcs .cycle li{position:relative}
#zcs .cycle-n{position:relative;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:var(--navy);border:2px solid var(--lime);color:var(--lime);font:700 20px/1 var(--display);margin-bottom:22px}
#zcs .cycle li:last-child .cycle-n{background:var(--lime);color:var(--navy)}
#zcs .cycle h3{margin-bottom:8px}
#zcs .cycle p{color:rgba(255,255,255,.7);font-size:15.5px}
#zcs .security-cta{margin-top:56px;padding-top:32px;border-top:1px solid var(--line-dark);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
#zcs .security-cta p{margin:0;font-size:19px;max-width:52ch}
#zcs .plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
#zcs .plan{position:relative;background:var(--white);border:1px solid var(--line);border-radius:20px;padding:36px 32px;display:flex;flex-direction:column}
#zcs .plan h3{font-size:24px}
#zcs .price{font:700 64px/1 var(--display);letter-spacing:-.04em;margin:18px 0 14px;color:var(--navy)}
#zcs .price .currency{font-size:32px;vertical-align:top;margin-right:2px;position:relative;top:6px}
#zcs .price .per{font:500 16px/1 var(--body);letter-spacing:0;color:var(--muted);margin-left:6px}
#zcs .plan-desc{color:var(--muted)}
#zcs .checks{list-style:none;padding:0;margin:8px 0 30px;flex:1}
#zcs .checks li{position:relative;padding:10px 0 10px 32px;border-top:1px solid var(--line)}
#zcs .checks li::before{content:"";position:absolute;left:4px;top:15px;width:12px;height:7px;border-left:2.5px solid var(--lime-dark);border-bottom:2.5px solid var(--lime-dark);transform:rotate(-45deg)}
#zcs .plan-featured{background:var(--night);border-color:var(--night);color:var(--white)}
#zcs .plan-featured .price{color:var(--lime)}
#zcs .plan-featured .price .per,#zcs .plan-featured .plan-desc{color:rgba(255,255,255,.65)}
#zcs .plan-featured .checks li{border-color:var(--line-dark)}
#zcs .plan-featured .checks li::before{border-color:var(--lime)}
#zcs .plan-flag{position:absolute;top:-14px;right:28px;background:var(--lime);color:var(--navy);font-size:14px;font-weight:600;padding:5px 14px;border-radius:999px;margin:0}
#zcs .compare-wrap{overflow-x:auto;margin-top:56px}
#zcs .compare{width:100%;min-width:560px;border-collapse:collapse;font-size:15.5px}
#zcs .compare caption{text-align:left;font:600 20px/1.2 var(--display);margin-bottom:14px}
#zcs .compare th,#zcs .compare td{padding:13px 12px;border-bottom:1px solid var(--line);text-align:left}
#zcs .compare thead th{font-weight:600;color:var(--muted);font-size:14px;border-bottom:2px solid var(--ink)}
#zcs .compare tbody th{font-weight:500}
#zcs .compare td{width:22%}
#zcs .compare .yes{color:var(--ink);font-weight:500}
#zcs .compare .no{color:#98A0B0}
#zcs .erp-band{margin-top:56px;background:var(--lime);color:var(--navy);border-radius:20px;padding:36px 40px;display:flex;align-items:center;justify-content:space-between;gap:32px}
#zcs .erp-band h3{font-size:clamp(22px,2.4vw,30px);max-width:26ch;margin-bottom:10px}
#zcs .erp-band p{margin:0;max-width:60ch;color:#243400}
#zcs .erp-band .btn{flex:none}
#zcs .territory{background:var(--white)}
#zcs .territory-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:center}
#zcs .territory-photo{margin:0;border-radius:20px;overflow:hidden;aspect-ratio:4/5}
#zcs .territory-photo img{width:100%;height:100%;object-fit:cover}
#zcs .territory-text p{color:var(--muted);margin-top:22px}
#zcs .towns-title{font-weight:600;color:var(--ink) !important;margin:28px 0 12px !important}
#zcs .towns{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
#zcs .towns li{font-size:14.5px;padding:6px 12px;border:1px solid var(--line);border-radius:999px}
#zcs .towns .home{background:var(--navy);border-color:var(--navy);color:var(--white);font-weight:600}
#zcs .about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,6vw,80px)}
#zcs .about-text p{color:var(--muted);margin-top:22px;max-width:52ch}
#zcs .about-text .btn{margin-top:10px}
#zcs .skill-group+.skill-group{margin-top:28px;padding-top:28px;border-top:1px solid var(--line)}
#zcs .skill-group h3{font-size:18px;margin-bottom:12px}
#zcs .skill-group ul{margin:0;padding-left:20px;color:var(--muted)}
#zcs .skill-group li{margin:4px 0}
#zcs .skill-group .tags{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
#zcs .skill-group .tags li{margin:0;background:var(--white);border:1px solid var(--line);color:var(--ink);font-size:14.5px;padding:6px 12px;border-radius:8px}
#zcs .contracts{background:var(--white)}
#zcs .contracts-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,72px);align-items:start}
#zcs .contracts-intro p{color:var(--muted);margin-top:22px}
#zcs .contracts-intro .note{font-size:15px;background:var(--paper);border-left:3px solid var(--lime-dark);padding:12px 16px;border-radius:0 8px 8px 0}
#zcs .contract-box{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:28px}
#zcs .tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:var(--white);border:1px solid var(--line);border-radius:999px;padding:5px;margin-bottom:20px}
#zcs .tabs button{border:0;background:none;border-radius:999px;padding:11px;cursor:pointer;font-weight:500}
#zcs .tabs button b{font-weight:600}
#zcs .tabs button[aria-selected="true"]{background:var(--navy);color:var(--white)}
#zcs .clause{border-bottom:1px solid var(--line)}
#zcs .clause button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;background:none;border:0;padding:15px 2px;text-align:left;cursor:pointer;font-weight:500}
#zcs .clause button::after{content:"+";font:500 22px/1 var(--display);color:var(--muted);transition:transform .2s}
#zcs .clause button[aria-expanded="true"]::after{transform:rotate(45deg)}
#zcs .clause p{margin:0 0 16px;color:var(--muted);font-size:15.5px}
#zcs .form h3{font-size:20px;margin:28px 0 16px}
#zcs .form label{display:block;font-size:14.5px;font-weight:500;margin-bottom:14px}
#zcs .form input:not([type="checkbox"]),#zcs .form select,#zcs .form textarea{display:block;width:100%;margin-top:6px;padding:13px 14px;border:1px solid var(--line);border-radius:10px;background:var(--white);font-size:16px}
#zcs .form textarea{resize:vertical}
#zcs .form input:focus,#zcs .form select:focus,#zcs .form textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(191,251,3,.55)}
#zcs .fields{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
#zcs .form .check{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--muted);margin:6px 0 20px}
#zcs .form .check input{margin-top:4px;width:18px;height:18px;accent-color:var(--navy);flex:none}
#zcs .form-hint{font-size:14px;color:var(--muted);margin:12px 0 0}
#zcs .form-msg{margin:12px 0 0;font-weight:500;min-height:1em}
#zcs .form-msg.ok{color:#2F6B00}
#zcs .form-msg.err{color:#B3261E}
#zcs .hp{position:absolute !important;left:-9999px !important}
#zcs .faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,72px)}
#zcs .faq details{border-bottom:1px solid var(--line)}
#zcs .faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;position:relative;font:600 19px/1.3 var(--display)}
#zcs .faq summary::-webkit-details-marker{display:none}
#zcs .faq summary::after{content:"+";position:absolute;right:4px;top:18px;font-size:26px;font-weight:500;color:var(--muted);transition:transform .2s}
#zcs .faq details[open] summary::after{transform:rotate(45deg)}
#zcs .faq details p{color:var(--muted);margin:0 0 20px;max-width:62ch}
#zcs .contact{background:var(--night);color:var(--white)}
#zcs .contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:start}
#zcs .contact-text p{color:rgba(255,255,255,.7);margin-top:22px;max-width:44ch}
#zcs .contact address{font-style:normal;line-height:1.8;color:rgba(255,255,255,.75);margin-top:32px;padding-top:24px;border-top:1px solid var(--line-dark)}
#zcs .contact address strong{color:var(--white)}
#zcs .contact address a{color:var(--lime)}
#zcs .form-dark{background:rgba(255,255,255,.04);border:1px solid var(--line-dark);border-radius:20px;padding:28px}
#zcs .form-dark label{color:rgba(255,255,255,.85)}
#zcs .form-dark input:not([type="checkbox"]),#zcs .form-dark select,#zcs .form-dark textarea{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2);color:var(--white)}
#zcs .form-dark select option{color:var(--ink)}
#zcs .form-dark input:focus,#zcs .form-dark select:focus,#zcs .form-dark textarea:focus{border-color:var(--lime);box-shadow:0 0 0 3px rgba(191,251,3,.3)}
#zcs .form-dark .check{color:rgba(255,255,255,.7)}
#zcs .form-dark .check a{color:var(--lime)}
#zcs .form-dark .check input{accent-color:var(--lime)}
#zcs .form-dark .form-msg.ok{color:var(--lime)}
#zcs .form-dark .form-msg.err{color:#FF8A80}
#zcs .extra{margin-top:72px;padding-top:40px;border-top:2px solid var(--ink)}
#zcs .extra-title{font-size:clamp(22px,2.4vw,30px);margin-bottom:28px;max-width:30ch}
#zcs .extra-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 40px}
#zcs .extra-list li{padding:18px 0;border-bottom:1px solid var(--line)}
#zcs .extra-list strong{display:block;font:600 18px/1.3 var(--display);margin-bottom:4px}
#zcs .extra-list span{color:var(--muted);font-size:15.5px}
#zcs .prevention{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;margin-top:72px}
#zcs .prevention-lead{font:600 clamp(26px,3vw,38px)/1.12 var(--display);letter-spacing:-.025em;color:var(--lime);margin:0}
#zcs .prevention-text p{color:rgba(255,255,255,.72)}
#zcs .sectors{background:var(--white)}
#zcs .sector-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
#zcs .sector-list li{padding:30px 28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
#zcs .sector-list h3{margin-bottom:10px}
#zcs .sector-list p{color:var(--muted);margin:0;font-size:15.5px}
#zcs .support-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,6vw,80px);align-items:start}
#zcs .support-intro p{color:var(--muted);margin:22px 0 28px;max-width:46ch}
#zcs .steps{list-style:none;margin:0;padding:0;counter-reset:st}
#zcs .steps li{counter-increment:st;position:relative;padding:0 0 30px 64px}
#zcs .steps li::before{content:counter(st);position:absolute;left:0;top:-4px;width:40px;height:40px;border-radius:50%;background:var(--white);border:2px solid var(--navy);display:grid;place-items:center;font:700 17px/1 var(--display);color:var(--navy)}
#zcs .steps li:not(:last-child)::after{content:"";position:absolute;left:19px;top:40px;bottom:0;width:2px;background:var(--line)}
#zcs .steps li:last-child::before{background:var(--lime)}
#zcs .steps h3{margin-bottom:6px}
#zcs .steps p{color:var(--muted);margin:0;font-size:15.5px}
@media (max-width:980px){
  #zcs .extra-list,#zcs .sector-list{grid-template-columns:1fr 1fr}
  #zcs .prevention,#zcs .support-grid{grid-template-columns:1fr}
}
@media (max-width:600px){
  #zcs .extra-list,#zcs .sector-list{grid-template-columns:1fr}
}
@media (max-width:980px){
  #zcs .section-head,#zcs .territory-grid,#zcs .about-grid,#zcs .contracts-grid,#zcs .faq-grid,#zcs .contact-grid{grid-template-columns:1fr}
  #zcs .section-head{gap:18px}
  #zcs .pillars{grid-template-columns:1fr}
  #zcs .pillar-dark{margin-top:0}
  #zcs .cycle{grid-template-columns:1fr 1fr;row-gap:40px}
  #zcs .cycle::before{display:none}
  #zcs .territory-photo{aspect-ratio:16/10}
  #zcs .erp-band{flex-direction:column;align-items:flex-start}
}
@media (max-width:760px){
  #zcs .plan-grid{grid-template-columns:1fr}
  #zcs .fields{grid-template-columns:1fr}
  #zcs .contract-box,#zcs .form-dark{padding:20px}
  #zcs .erp-band{padding:28px 24px}
}
@media (max-width:480px){
  #zcs .wrap{width:calc(100% - 32px)}
  #zcs .cycle{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  #zcs{scroll-behavior:auto}
  #zcs *,#zcs *::before,#zcs *::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}

/* ==================================================================
   Adattamenti per vivere dentro il layout della piattaforma
   ================================================================== */

/* Il sito nasceva a piena pagina; qui sta dentro kt-container-fixed,
   quindi .wrap non deve imporre una seconda larghezza massima. */
#zcs .wrap{width:100%;margin-inline:0;max-width:100%}
#zcs{background:transparent;scroll-padding-top:90px;font-size:16px}

/* Le sezioni diventano blocchi distinti, non fasce a tutta pagina */
#zcs .section{border-radius:18px;margin-bottom:22px;padding:34px 26px;background:var(--white);max-width:100%}
#zcs .section.security,
#zcs .section.contact{background:var(--navy);color:var(--white)}
#zcs .section.plans{background:var(--paper)}
#zcs .section-head{margin-bottom:30px}

/* Titoli: nel container servono piu' compatti che a piena pagina */
#zcs h2{font-size:clamp(23px,2.4vw,32px);max-width:24ch}
#zcs h3{font-size:19px}
#zcs .pillar h3{font-size:22px}

/* ---------- Apertura ----------
   Il fondo scuro non e' decorazione: i testi di apertura sono chiari
   e su bianco sparirebbero. */
#zcs .zcs-hero{background:var(--night);color:var(--white);padding:0;overflow:hidden}
#zcs .zcs-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  align-items:center;
}
#zcs .zcs-hero-grid > *{min-width:0}
#zcs .zcs-hero-text{padding:38px 32px}
#zcs .zcs-hero h2{color:var(--white);max-width:16ch;font-size:clamp(26px,3vw,40px)}
#zcs .zcs-hero .hero-kicker{
  color:var(--lime);
  font:600 12px/1.2 var(--display);
  letter-spacing:.14em;
  text-transform:uppercase;
  margin:0 0 14px;
}
#zcs .zcs-hero .hero-lead{color:rgba(255,255,255,.82);font-size:16px;max-width:46ch;margin:14px 0 22px}
#zcs .zcs-hero .hero-actions{display:flex;flex-wrap:wrap;gap:12px}
#zcs .zcs-hero .btn-outline{border-color:rgba(255,255,255,.45);color:var(--white)}
#zcs .zcs-hero .btn-outline:hover{background:rgba(255,255,255,.1);border-color:var(--white)}
#zcs .zcs-hero .hero-facts{
  list-style:none;
  margin:26px 0 0;
  padding:22px 0 0;
  border-top:1px solid rgba(255,255,255,.16);
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:18px;
}
#zcs .zcs-hero .hero-facts li{display:flex;flex-direction:column;gap:3px}
#zcs .zcs-hero .hero-facts strong{color:var(--lime);font:600 15px/1.2 var(--display)}
#zcs .zcs-hero .hero-facts span{color:rgba(255,255,255,.7);font-size:13px;line-height:1.45}
#zcs .zcs-hero-img{margin:0;height:100%;min-height:340px}
#zcs .zcs-hero-img img{width:100%;height:100%;object-fit:cover}

/* La tabella di confronto non si comprime sotto una certa misura:
   invece di allargare la pagina, scorre dentro il suo riquadro. */
#zcs .compare-wrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
#zcs .compare{min-width:520px}

/* ---------- Tema scuro della piattaforma ---------- */
html.dark #zcs .section{background:#16243c;color:#e8eefb}
html.dark #zcs .section.plans{background:#111d31}
html.dark #zcs .section-head p,
html.dark #zcs .pillar-intro,
html.dark #zcs dd,
html.dark #zcs .plan-desc{color:#9db0cb}
html.dark #zcs h2,
html.dark #zcs h3,
html.dark #zcs dt{color:#fff}
html.dark #zcs .pillar,
html.dark #zcs .plan{background:#1b2a45;border-color:rgba(126,166,222,.22)}
html.dark #zcs .compare th,
html.dark #zcs .compare td{border-color:rgba(126,166,222,.18);color:#d6e2f4}
html.dark #zcs .btn-outline{border-color:var(--lime);color:var(--lime)}
html.dark #zcs details,
html.dark #zcs .clause{border-color:rgba(126,166,222,.2)}
html.dark #zcs summary,
html.dark #zcs .clause button{color:#e8eefb}
html.dark #zcs .contract-box,
html.dark #zcs .faq-list{background:transparent}

/* ---------- Schermi stretti ----------
   minmax(0,...) e non 1fr: con 1fr la colonna non scende sotto il
   min-content del contenuto e la pagina sborda in orizzontale. */
@media (max-width:860px){
  #zcs .zcs-hero-grid{grid-template-columns:minmax(0,1fr)}
  #zcs .zcs-hero-text{padding:26px 20px}
  #zcs .zcs-hero-img{min-height:200px;order:-1}
  #zcs .zcs-hero .hero-facts{grid-template-columns:minmax(0,1fr);gap:14px}
  #zcs .zcs-hero .hero-actions .btn{width:100%}
  #zcs .pillars,
  #zcs .plan-grid,
  #zcs .sector-list,
  #zcs .support-grid,
  #zcs .territory-grid,
  #zcs .about-grid,
  #zcs .contracts-grid,
  #zcs .contact-grid,
  #zcs .faq-grid,
  #zcs .section-head{grid-template-columns:minmax(0,1fr)}
  #zcs .cycle{grid-template-columns:minmax(0,1fr)}
  #zcs .erp-band{flex-direction:column;align-items:flex-start;gap:16px}
}

@media (max-width:640px){
  #zcs .section{padding:24px 18px;border-radius:14px}
  #zcs .steps,#zcs .cycle{padding-left:0}
}

/* In tema scuro il prezzo del piano base era navy su fondo scuro:
   leggibile quanto un testo nero su nero. */
html.dark #zcs .plan:not(.plan-featured) .price{color:#f2f7ff}
html.dark #zcs .plan:not(.plan-featured) .price .currency{color:var(--lime)}
html.dark #zcs .plan:not(.plan-featured) .price .per{color:#9db0cb}
html.dark #zcs .plan:not(.plan-featured) h3{color:#fff}

#zcs .zcs-azioni-contratto{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
#zcs .zcs-azioni-contratto .btn{flex:1 1 200px}

/* Avvisi del modulo: stanno accanto al form, non in cima alla pagina,
   altrimenti chi invia dalla sezione contatti non li vede mai. */
#zcs .zcs-avviso{
  border-radius:12px;
  padding:14px 16px;
  margin-bottom:6px;
  background:rgba(190,250,3,.12);
  border:1px solid rgba(190,250,3,.45);
  color:var(--white);
  font-size:14.5px;
  line-height:1.5;
}
#zcs .zcs-avviso strong{display:block;margin-bottom:6px}
#zcs .zcs-avviso ul{margin:0;padding-left:20px}
#zcs .zcs-avviso li{margin:3px 0}
#zcs .zcs-avviso--grave{
  background:rgba(255,120,110,.14);
  border-color:rgba(255,120,110,.5);
}