/* CyberZec v3 - /servizi/ (page-tpl-servizi.php). Base e componenti in cz-v3.css. */

/* ── breadcrumb (dentro l'hero) ── */
.czs-crumb{font-size:.8rem;color:var(--cz-muted);margin-bottom:clamp(40px,6vw,72px);letter-spacing:.02em}
.czs-crumb a{color:var(--cz-text);text-decoration:none;border-bottom:1px solid var(--cz-line)}
.czs-crumb a:hover{color:var(--cz-lime);border-color:var(--cz-lime)}
.czs-crumb span{margin:0 8px;color:var(--cz-lime)}

/* ── subhero scuro con canvas ── */
.czs-hero{background:radial-gradient(ellipse 55% 80% at 88% 20%,rgba(64,110,52,.32),transparent 70%),#172423;padding:clamp(36px,5vw,56px) 0 clamp(72px,9vw,112px);border-bottom:1px solid var(--cz-line)}
.czs-hero .cz-ambient-canvas{opacity:.35}
.czs-hero h1{font-size:clamp(2.7rem,6.6vw,7rem);max-width:1120px;letter-spacing:-.055em;line-height:1.02}
.czs-hero h1 br{display:none}
.czs-hero h1 .cz-accent,.czs-hero h1 em{margin-left:.18em}
.czs-hero .cz-lead{max-width:900px;color:#d3ddd8}
.czs-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}
.czs-chip{display:inline-flex;align-items:center;padding:9px 14px;border:1px solid var(--cz-line);border-radius:2px;font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--cz-text);background:rgba(8,14,16,.35)}
.czs-chip.is-lime{border-color:rgba(197,245,108,.45);color:var(--cz-lime)}

/* ── servizi: spec list + bento ── */
.czs-services-head{display:flex;flex-direction:column;margin-bottom:44px}
.czs-services-head h2{max-width:14ch}
.czs-spec{list-style:none;margin:0 0 clamp(40px,5vw,64px);padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--cz-line);border-left:1px solid var(--cz-line)}
.czs-spec li{display:flex;flex-direction:column;gap:6px;padding:22px 24px;border-right:1px solid var(--cz-line);border-bottom:1px solid var(--cz-line);counter-increment:czs-spec}
.czs-spec li::before{content:counter(czs-spec,decimal-leading-zero);font-family:var(--cz-display);font-size:.72rem;font-weight:800;color:var(--cz-lime);letter-spacing:.08em}
.czs-spec strong{font-family:var(--cz-display);font-size:1.12rem;letter-spacing:-.02em;color:var(--cz-white)}
.czs-spec span{font-size:.95rem;line-height:1.6;color:var(--cz-text)}
.czs-services .cz-wrap{counter-reset:czs-spec czs-card}

.czs-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.czs-card{position:relative;display:flex;flex-direction:column;min-height:330px;padding:clamp(26px,2.6vw,36px);background:#142022;border:1px solid var(--cz-line);border-radius:var(--cz-radius);color:var(--cz-white);text-decoration:none;overflow:hidden;counter-increment:czs-card;transition:border-color .25s,background .25s,transform .22s ease}
.czs-card:hover{border-color:rgba(197,245,108,.5);background:#192a28}
.czs-card h2{font-size:clamp(1.45rem,2.1vw,2rem);letter-spacing:-.035em;margin:0 0 16px;padding-right:56px}
.czs-card p{margin:0 0 24px;color:var(--cz-text);font-size:1rem;line-height:1.7}
.czs-tag{display:block;margin-bottom:22px;font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--cz-lime)}
.czs-tag::before{content:counter(czs-card,decimal-leading-zero) ' / '}
.czs-link{margin-top:auto;align-self:flex-start;font-size:.8rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--cz-lime);border-bottom:1px solid rgba(197,245,108,.4);padding-bottom:3px;transition:border-color .2s}
.czs-card:hover .czs-link{border-color:var(--cz-lime)}
.czs-icon{position:absolute!important;top:clamp(22px,2.4vw,30px);right:clamp(22px,2.4vw,30px);width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--cz-line);border-radius:50%;font-size:1.15rem;line-height:1;color:var(--cz-lime);filter:grayscale(.35)}

/* card principale AI: 2 colonne x 2 righe */
.czs-card--primary{grid-column:span 2;grid-row:span 2;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,56px);align-items:end;background:radial-gradient(circle at 92% 8%,rgba(98,160,70,.38),transparent 46%),linear-gradient(160deg,#1b2f2b,#0e1a1b 70%);border-color:rgba(197,245,108,.38)}
.czs-card--primary:hover{background:radial-gradient(circle at 92% 8%,rgba(98,160,70,.46),transparent 50%),linear-gradient(160deg,#1e3530,#0f1d1d 70%)}
.czs-card-main{display:flex;flex-direction:column;height:100%;justify-content:flex-end}
.czs-card--primary h2{font-size:clamp(2.2rem,4vw,4rem);letter-spacing:-.05em;line-height:1.02;padding-right:0;margin-bottom:22px}
.czs-card--primary p{font-size:1.06rem;color:#d3ddd8}
.czs-card--primary .czs-link{margin-top:8px}
.czs-features{display:flex;flex-direction:column;border-top:1px solid var(--cz-line)}
.czs-feature{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--cz-line);font-size:.98rem;font-weight:600;color:var(--cz-white)}
.czs-feature::before{content:'✓';color:var(--cz-lime);font-weight:900;font-size:.85rem}
.czs-orbit{position:absolute!important;top:-90px;right:-90px;width:300px;aspect-ratio:1;border:1px solid rgba(197,245,108,.22);border-radius:50%;pointer-events:none;z-index:0!important}
.czs-orbit::before{content:'';position:absolute;inset:44px;border:1px solid rgba(197,245,108,.14);border-radius:50%}
.czs-orbit i{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--cz-lime);box-shadow:0 0 14px var(--cz-lime);left:calc(50% - 4px);top:calc(50% - 4px);animation:czs-orbit 16s linear infinite}
.czs-orbit i:nth-child(2){animation-duration:22s;animation-direction:reverse}
@keyframes czs-orbit{from{transform:rotate(0deg) translateX(150px)}to{transform:rotate(360deg) translateX(150px)}}

/* ── metodo (sezione chiara) ── */
.czs-method .cz-split{align-items:start}
.czs-method h2{margin-bottom:28px}
.czs-method h2 .cz-accent{color:#2f5a08}
.czs-method-text p:not(.cz-eyebrow){color:var(--cz-ink-soft);max-width:60ch;margin:0 0 16px}
.czs-steps{border-top:1px solid var(--cz-line-dark)}
.czs-step{display:grid;grid-template-columns:88px 1fr;gap:16px;padding:26px 4px;border-bottom:1px solid var(--cz-line-dark);transition:background .2s}
.czs-step:hover{background:rgba(63,106,18,.06)}
.czs-step-num{font-family:var(--cz-display);font-weight:800;font-size:clamp(2.2rem,3.4vw,3.2rem);line-height:.9;letter-spacing:-.06em;color:#3f6a12}
.czs-step-title{font-family:var(--cz-display);font-weight:800;font-size:1.25rem;letter-spacing:-.025em;color:var(--cz-ink);margin-bottom:6px}
.czs-step-text{font-size:1rem;line-height:1.7;color:var(--cz-ink-soft)}

/* ── CTA ── */
.czs-cta-actions{display:flex;flex-direction:column;gap:12px;min-width:280px}
.czs-noarrow::after{content:none!important}

/* ── responsive ── */
@media (max-width:1100px){
  .czs-bento{grid-template-columns:repeat(2,1fr)}
  .czs-card--primary{grid-row:auto}
}
@media (max-width:960px){
  .czs-spec{grid-template-columns:repeat(2,1fr)}
  .czs-cta-actions{min-width:0;flex-direction:row;flex-wrap:wrap}
}
@media (max-width:760px){
  .czs-card--primary{grid-template-columns:1fr;align-items:start}
}
@media (max-width:640px){
  .czs-hero h1{font-size:clamp(2.4rem,11vw,3.4rem)}
  .czs-hero h1 .cz-accent,.czs-hero h1 em{margin-left:0}
  .czs-hero h1 br{display:inline}
  .czs-chip{font-size:.7rem;padding:8px 11px}
  .czs-spec{grid-template-columns:1fr}
  .czs-spec li{padding:18px}
  .czs-bento{grid-template-columns:1fr}
  .czs-card--primary{grid-column:auto}
  .czs-card{min-height:0}
  .czs-card p{font-size:1rem}
  .czs-step{grid-template-columns:56px 1fr;padding:22px 0}
  .czs-cta-actions{flex-direction:column}
}