/* VMC2 online – stili limitati al contenitore .vmc2 */
.vmc2{
  --v-ink:#313131; --v-ink2:#555; --v-ink3:#888; --v-line:#e3dccd; --v-surface:#ffffff;
  --v-accent:#007f7e; --v-accent-ink:#ffffff; --v-accent-soft:#e3f1f0; --v-title:#820000;
  --v-warn:#9a3b1b; --v-warn-soft:#fbeee6; --v-ok:#2f6b3a; --v-ok-soft:#e8f3ea; --v-focus:#007f7e;
  --s-red:#f7a8a8; --s-orange:#ffcb7a; --s-green:#a9d6a0; --s-blue:#a9d8f2; --s-grey:#c4c4c4;
  --s-lilac:#c9b8e2; --s-mot:#bccad8; --s-tot:#8ea4bb;
  --paper:#ffffff; --paper-ink:#1a1a1a; --paper-line:#2a2a2a;
  color:var(--v-ink); line-height:1.55; max-width:980px; margin:0 auto 32px; box-sizing:border-box;
}
.vmc2 *{box-sizing:border-box}
.vmc2 [hidden]{display:none!important}
.vmc2 a{color:var(--v-accent)}
.vmc2 .vmc2-h{color:var(--v-title); font-size:1.35em; margin:0 0 4px; line-height:1.25}
.vmc2 p{margin:0}
.vmc2 .vmc2-muted,.vmc2 .vmc2-small{color:var(--v-ink2)}
.vmc2 .vmc2-small{font-size:.875em}
.vmc2 .vmc2-eyebrow{font-size:.78em; letter-spacing:.08em; text-transform:uppercase; color:var(--v-ink3); font-weight:600}
.vmc2 .vmc2-panel{background:var(--v-surface); border:1px solid var(--v-line); border-radius:10px; padding:clamp(16px,3vw,28px); display:flex; flex-direction:column; gap:16px}
.vmc2 .vmc2-notice{border-radius:8px; padding:12px 16px; font-size:.95em; margin-bottom:16px}
.vmc2 .vmc2-panel .vmc2-notice{margin-bottom:0}
.vmc2 .vmc2-notice-ok{background:var(--v-ok-soft); color:var(--v-ok)}
.vmc2 .vmc2-notice-warn{background:var(--v-warn-soft); color:var(--v-warn)}
.vmc2 .vmc2-hp{position:absolute!important; left:-9999px; width:1px; height:1px; overflow:hidden}

/* moduli */
.vmc2 .vmc2-form{display:flex; flex-direction:column; gap:6px}
.vmc2 .vmc2-row{display:flex; gap:10px; flex-wrap:wrap}
.vmc2 .vmc2-row input{flex:1 1 240px}
.vmc2 .vmc2-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 20px}
@media (max-width:640px){.vmc2 .vmc2-grid{grid-template-columns:1fr}}
.vmc2 .vmc2-field{display:flex; flex-direction:column; gap:6px; min-width:0; border:0; padding:0; margin:0}
.vmc2 .vmc2-full{grid-column:1/-1}
.vmc2 .vmc2-lbl{font-weight:600; font-size:.95em; padding:0}
.vmc2 input[type=email],.vmc2 input[type=text],.vmc2 input[type=number],.vmc2 select{font:inherit; color:var(--v-ink); background:#fff; border:1px solid #cfc7b6; border-radius:6px; padding:10px 12px; width:100%; max-width:100%}
.vmc2 input:focus-visible,.vmc2 select:focus-visible,.vmc2 button:focus-visible{outline:3px solid var(--v-focus); outline-offset:2px}
.vmc2 .vmc2-check,.vmc2 .vmc2-radio{display:flex; gap:10px; align-items:flex-start; cursor:pointer}
.vmc2 .vmc2-check input,.vmc2 .vmc2-radio input{width:20px; height:20px; margin-top:3px; flex:none; accent-color:var(--v-accent)}
.vmc2 .vmc2-radio{margin-top:4px}
.vmc2 .vmc2-req{color:var(--v-warn)}
.vmc2 .vmc2-err{color:var(--v-warn); font-weight:600; font-size:.9em}
.vmc2 .vmc2-actions{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.vmc2 .vmc2-btn{font:inherit; font-weight:700; border-radius:7px; padding:11px 20px; cursor:pointer; border:1px solid var(--v-accent); background:var(--v-accent); color:var(--v-accent-ink); line-height:1.2}
.vmc2 .vmc2-btn:disabled{opacity:.45; cursor:not-allowed}
.vmc2 .vmc2-btn.vmc2-ghost{background:transparent; color:var(--v-accent)}

/* passi */
.vmc2 .vmc2-steps{display:flex; gap:6px; flex-wrap:wrap; list-style:none; padding:0; margin:0 0 8px}
.vmc2 .vmc2-steps li{font-size:.8em; font-weight:600; padding:6px 12px; border-radius:999px; border:1px solid var(--v-line); color:var(--v-ink3); background:#fff; margin:0}
.vmc2 .vmc2-steps li[aria-current="step"]{background:var(--v-accent); border-color:var(--v-accent); color:#fff}
.vmc2 .vmc2-steps li.done{color:var(--v-accent); border-color:var(--v-accent)}
.vmc2 .vmc2-timer{margin:0 0 12px}

/* questionario */
.vmc2 .vmc2-intro{background:var(--v-accent-soft); border-radius:8px; padding:14px 16px; font-size:.95em}
.vmc2 .vmc2-items{display:flex; flex-direction:column; border:1px solid var(--v-line); border-radius:10px; background:#fff}
.vmc2 .vmc2-item{display:flex; flex-direction:column; gap:10px; padding:18px 18px 16px; border-top:1px solid var(--v-line)}
.vmc2 .vmc2-item:first-child{border-top:0}
.vmc2 .vmc2-qtext{font-size:1em; line-height:1.4}
.vmc2 .vmc2-qtext strong{font-weight:700; letter-spacing:.01em}
.vmc2 strong,.vmc2 b{font-weight:700}
.vmc2 .vmc2-qn{display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:12px; background:var(--v-accent); color:#fff; font-size:.75em; font-weight:700; margin-right:4px; vertical-align:1px}
.vmc2 .vmc2-qval{display:inline-block; margin-left:6px; font-variant-numeric:tabular-nums; font-weight:700; font-size:.9em; color:var(--v-ink3)}
.vmc2 .vmc2-qval.set{color:var(--v-accent)}

.vmc2 .vmc2-scale{--c:var(--s-grey); position:relative; container-type:inline-size; background:linear-gradient(to right,var(--paper) 0%,var(--paper) 15%,var(--c) 100%); border:1.5px solid var(--paper-line); border-radius:3px; color:var(--paper-ink); padding:4px 12px 3px; user-select:none; -webkit-user-select:none}
.vmc2 .vmc2-c-red{--c:var(--s-red)} .vmc2 .vmc2-c-orange{--c:var(--s-orange)} .vmc2 .vmc2-c-green{--c:var(--s-green)} .vmc2 .vmc2-c-blue{--c:var(--s-blue)} .vmc2 .vmc2-c-grey{--c:var(--s-grey)} .vmc2 .vmc2-c-lilac{--c:var(--s-lilac)} .vmc2 .vmc2-c-mot{--c:var(--s-mot)} .vmc2 .vmc2-c-tot{--c:var(--s-tot)}
.vmc2 .vmc2-scale:focus-within{outline:3px solid var(--v-focus); outline-offset:3px}
.vmc2 .vmc2-nums{position:relative; height:16px; font-size:11px; font-weight:700; font-variant-numeric:tabular-nums}
.vmc2 .vmc2-nums span{position:absolute; top:0; transform:translateX(-50%)}
.vmc2 .vmc2-track{position:relative; height:30px}
.vmc2 .vmc2-ticks{position:absolute; inset:0;
  background-image:linear-gradient(var(--paper-line),var(--paper-line)),linear-gradient(to right,var(--paper-line) 1px,transparent 1px),linear-gradient(to right,var(--paper-line) 1.5px,transparent 1.5px);
  background-size:100% 1px,2% 40%,10% 100%; background-position:0 50%,0 50%,0 0; background-repeat:no-repeat,repeat-x,repeat-x; border-right:1.5px solid var(--paper-line)}
.vmc2 .vmc2-marker{position:absolute; top:-5px; bottom:-5px; width:0; left:0; pointer-events:none; opacity:0; transition:opacity .15s}
.vmc2 .vmc2-marker::before{content:""; position:absolute; left:-2px; top:0; bottom:0; width:4px; background:#b3261e; border-radius:2px; box-shadow:0 0 0 1.5px #fff}
.vmc2 .vmc2-marker::after{content:""; position:absolute; left:-8px; top:50%; width:16px; height:16px; margin-top:-8px; border-radius:50%; background:#b3261e; box-shadow:0 0 0 2px #fff}
.vmc2 .vmc2-scale.set .vmc2-marker{opacity:1}
.vmc2 .vmc2-anchors{position:relative; height:17px; font-size:11px; white-space:nowrap}
.vmc2 .vmc2-anchors span{position:absolute; top:1px; transform:translateX(-50%)}
.vmc2 .vmc2-anchors span.first{transform:none; left:-8px!important; font-weight:700}
.vmc2 .vmc2-anchors span.last{transform:none; left:auto!important; right:-8px; font-weight:700}
.vmc2 .vmc2-anchors .mid{color:#444}
@container (max-width:470px){ .vmc2 .vmc2-nums .odd{display:none} .vmc2 .vmc2-anchors .mid{display:none} }
.vmc2 .vmc2-rng{position:absolute; left:12px; right:12px; top:0; bottom:0; width:calc(100% - 24px); margin:0; opacity:0; cursor:pointer; -webkit-appearance:none; appearance:none; background:transparent; touch-action:pan-y}
.vmc2 .vmc2-rng::-webkit-slider-thumb{-webkit-appearance:none; width:1px; height:60px}
.vmc2 .vmc2-rng::-moz-range-thumb{width:1px; height:60px; border:0}

.vmc2 .vmc2-progress{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap}
.vmc2 .vmc2-bar{height:6px; border-radius:3px; background:var(--v-line); flex:1 1 200px; overflow:hidden}
.vmc2 .vmc2-bar i{display:block; height:100%; width:0; background:var(--v-accent); transition:width .2s}
.vmc2 .vmc2-count{font-variant-numeric:tabular-nums; font-weight:600; font-size:.9em; color:var(--v-ink2)}

/* profilo */
.vmc2 .vmc2-back{margin-top:4px; font-weight:600}
.vmc2.vmc2-printdoc{max-width:none; margin:0; display:flex; flex-direction:column; gap:10px}
.vmc2.vmc2-printdoc .vmc2-printhead{display:flex; flex-direction:column; gap:8px; border-bottom:1px solid var(--v-line); padding-bottom:8px; margin-bottom:4px}
.vmc2.vmc2-printdoc .vmc2-printbanner{display:block; width:100%; height:auto; max-height:18mm; object-fit:contain; object-position:left center}
.vmc2.vmc2-printdoc .vmc2-printsite{display:flex; justify-content:space-between; align-items:flex-end; gap:12px}
.vmc2.vmc2-printdoc .vmc2-printname{display:block; color:#820000; font-weight:700; font-size:15pt; line-height:1.2}
.vmc2.vmc2-printdoc .vmc2-printdesc{display:block; color:#777; font-size:9.5pt}
.vmc2.vmc2-printdoc .vmc2-printurl{color:var(--v-ink2); font-size:9.5pt; white-space:nowrap}
.vmc2.vmc2-printdoc .vmc2-profile{gap:8px; margin-top:6px}
.vmc2.vmc2-printdoc .vmc2-pfill{-webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2.vmc2-printdoc .vmc2-prow,.vmc2.vmc2-printdoc .vmc2-paxis{grid-template-columns:200px minmax(0,1fr) 40px}
.vmc2 .vmc2-profile{display:flex; flex-direction:column; gap:12px}
.vmc2 .vmc2-prow,.vmc2 .vmc2-paxis{display:grid; grid-template-columns:220px minmax(0,1fr) 44px; gap:14px; align-items:center}
.vmc2 .vmc2-pname{font-weight:600; font-size:.95em}
.vmc2 .vmc2-pname small{display:block; font-weight:400; color:var(--v-ink3); font-size:.82em}
.vmc2 .vmc2-prow.counter .vmc2-pname small{color:var(--v-warn)}
.vmc2 .vmc2-ptrack{position:relative; height:22px; background-image:linear-gradient(to right,var(--v-line) 1px,transparent 1px); background-size:10% 100%; background-repeat:repeat-x; border-left:1px solid var(--v-ink3); border-right:1px solid var(--v-line); -webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2 .vmc2-pfill{position:absolute; left:0; top:3px; bottom:3px; border-radius:0 3px 3px 0; border:1px solid rgba(0,0,0,.25); background:var(--c)}
.vmc2 .vmc2-pnum{font-variant-numeric:tabular-nums; font-weight:700; text-align:right}
.vmc2 .vmc2-paxis div{position:relative; height:14px; font-size:11px; color:var(--v-ink3); font-variant-numeric:tabular-nums}
.vmc2 .vmc2-paxis span{position:absolute; transform:translateX(-50%)}
@media (max-width:640px){
  .vmc2 .vmc2-prow,.vmc2 .vmc2-paxis{grid-template-columns:minmax(0,1fr) 40px}
  .vmc2 .vmc2-prow .vmc2-pname{grid-column:1/-1}
  .vmc2 .vmc2-paxis>div:first-child{display:none}
}
/* pagina delle spinte motivazionali */
.vmc2 .vmc2-defs{margin:0; padding-left:1.2em; display:flex; flex-direction:column; gap:6px}
.vmc2 .vmc2-hint{display:block; font-size:.85em; font-style:italic; color:var(--v-ink2); margin-top:2px; padding-left:30px}

/* profilo: riquadri */
.vmc2 .vmc2-pbox{border:1px solid var(--v-line); border-radius:10px; padding:16px 18px; display:flex; flex-direction:column; gap:10px}
.vmc2 .vmc2-ph{margin:0; font-size:1.05em; color:var(--v-title); line-height:1.3}
.vmc2 #vmc2-profwrap{display:flex; flex-direction:column; gap:16px}
.vmc2 .vmc2-prevwrap{margin-top:6px}
.vmc2 .vmc2-prevmsg{font-size:.9em; font-style:italic; color:var(--v-ink2)}
.vmc2 .vmc2-prev{display:flex; flex-direction:column; gap:4px}
.vmc2 .vmc2-prevtrack{position:relative; height:22px; border:1px solid var(--v-ink3); border-radius:11px; background:linear-gradient(to right,#e9eef3,#fff 50%,#e9eef3); -webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2 .vmc2-prevtrack::before{content:""; position:absolute; left:50%; top:-4px; bottom:-4px; border-left:1.5px dashed var(--v-ink3)}
.vmc2 .vmc2-prevdot{position:absolute; top:50%; width:16px; height:16px; margin:-8px 0 0 -8px; border-radius:50%; background:var(--v-accent); box-shadow:0 0 0 2px #fff; -webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2 .vmc2-prevlbl{display:flex; justify-content:space-between; gap:8px; font-size:.78em; color:var(--v-ink2); line-height:1.2}
.vmc2 .vmc2-prevlbl span:nth-child(2){text-align:center}
.vmc2 .vmc2-prevlbl span:last-child{text-align:right}

/* profilo: colonne verticali */
.vmc2 .vmc2-vscroll{container-type:inline-size; padding-top:8px}
.vmc2 .vmc2-vchart{display:grid; grid-template-columns:30px minmax(0,1fr)}
.vmc2 .vmc2-vy{position:relative; height:240px; font-size:11px; color:var(--v-ink3); font-variant-numeric:tabular-nums}
.vmc2 .vmc2-vy span{position:absolute; right:6px; transform:translateY(50%)}
.vmc2 .vmc2-vplot,.vmc2 .vmc2-vlabels{display:grid; grid-template-columns:1fr .4fr repeat(7,1fr)}
.vmc2 .vmc2-vplot{position:relative; height:240px; border-left:1px solid var(--v-ink3); border-bottom:1px solid var(--v-ink3);
  background-image:linear-gradient(to top,var(--v-line) 1px,transparent 1px); background-size:100% 10%; background-position:0 100%; -webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2 .vmc2-vcol{position:relative; height:100%}
.vmc2 .vmc2-vbar{position:absolute; bottom:0; left:22%; right:22%; background:var(--c); border:1px solid rgba(0,0,0,.25); border-bottom:0; border-radius:3px 3px 0 0; -webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2 .vmc2-vline{position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none}
.vmc2 .vmc2-vline polyline{fill:none; stroke:#313131; stroke-width:1.75; stroke-dasharray:6 4; vector-effect:non-scaling-stroke}
.vmc2 .vmc2-vdot{position:absolute; width:9px; height:9px; margin:0 0 -4.5px -4.5px; border-radius:50%; background:#313131; box-shadow:0 0 0 1.5px #fff; -webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2 .vmc2-vlab{display:flex; flex-direction:column; align-items:center; text-align:center; gap:1px; padding:6px 2px 0; font-size:11.5px; line-height:1.2; hyphens:manual; min-width:0}
.vmc2 .vmc2-vlegend{display:none; list-style:none; margin:10px 0 0; padding:0; font-size:.85em; line-height:1.3; flex-direction:column; gap:4px}
.vmc2 .vmc2-vlegend li{display:flex; align-items:center; gap:6px; margin:0}
.vmc2 .vmc2-vlegend i{flex:none; width:12px; height:12px; border-radius:2px; background:var(--c); border:1px solid rgba(0,0,0,.25); -webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2 .vmc2-vlegend b{min-width:22px; text-align:right; font-variant-numeric:tabular-nums}
.vmc2 .vmc2-vlegend li.counter{margin-bottom:4px}
@container (max-width:520px){ .vmc2 .vmc2-vchart{grid-template-columns:24px minmax(0,1fr)} .vmc2 .vmc2-vlab{font-size:11px; padding:5px 0 0} .vmc2 .vmc2-vlab span,.vmc2 .vmc2-vlab small{display:none} .vmc2 .vmc2-vlegend{display:flex} .vmc2 .vmc2-vplot,.vmc2 .vmc2-vy{height:200px} .vmc2 .vmc2-vbar{left:16%; right:16%} }
.vmc2 .vmc2-vlab b{font-size:1.15em; font-variant-numeric:tabular-nums}
.vmc2 .vmc2-vlab span{font-weight:600}
.vmc2 .vmc2-vlab small{color:var(--v-ink3); font-size:.9em}
.vmc2 .vmc2-vlab.counter small{color:var(--v-warn)}

/* profilo: commenti */
.vmc2 .vmc2-comments{background:#fbf8f2; gap:8px; -webkit-print-color-adjust:exact; print-color-adjust:exact}
.vmc2 .vmc2-comments p{line-height:1.5}
.vmc2 .vmc2-comments .vmc2-sint{font-weight:600}
.vmc2 .vmc2-comments .vmc2-ask{margin-top:4px; padding-top:10px; border-top:1px solid var(--v-line)}
.vmc2 .vmc2-comments .vmc2-ask em{color:var(--v-ink2)}
.vmc2 .vmc2-comments .vmc2-cnote{font-size:.8em; color:var(--v-ink3)}

/* profilo in stampa */
.vmc2.vmc2-printdoc #vmc2-profwrap,.vmc2.vmc2-printdoc .vmc2-pbox{gap:6px}
.vmc2.vmc2-printdoc .vmc2-pbox{padding:8px 12px; break-inside:avoid}
.vmc2.vmc2-printdoc .vmc2-vscroll{overflow:visible}
.vmc2.vmc2-printdoc .vmc2-vplot,.vmc2.vmc2-printdoc .vmc2-vy{height:36mm}
.vmc2.vmc2-printdoc .vmc2-vlab{font-size:8.5pt}
.vmc2.vmc2-printdoc .vmc2-profile{gap:5px; margin-top:0}
.vmc2.vmc2-printdoc .vmc2-ptrack{height:14px}
.vmc2.vmc2-printdoc .vmc2-vscroll{padding-top:4px}
.vmc2.vmc2-printdoc .vmc2-printhead{gap:4px; padding-bottom:6px}
.vmc2.vmc2-printdoc .vmc2-comments{gap:4px}
.vmc2.vmc2-printdoc .vmc2-comments p{line-height:1.32; font-size:9pt}
.vmc2.vmc2-printdoc > .vmc2-small{font-size:8.5pt}
.vmc2.vmc2-printdoc .vmc2-h{font-size:14pt; margin:0}
.vmc2.vmc2-printdoc .vmc2-comments .vmc2-ask{padding-top:5px; margin-top:2px}
.vmc2.vmc2-printdoc .vmc2-comments .vmc2-cnote{font-size:8pt}

@media print{
  .vmc2 .vmc2-steps,.vmc2 .vmc2-actions,.vmc2 .vmc2-timer{display:none!important}
  .vmc2 .vmc2-pfill{-webkit-print-color-adjust:exact; print-color-adjust:exact}
}
@media (prefers-reduced-motion:reduce){.vmc2 *{transition:none!important}}
