/* Valutatore 079 · percorso visivo a quadrati (stile digitale nero e rame) */

/* ---------- percorso in 4 tappe ---------- */
.vt-route{list-style:none;padding:0;margin:0 0 2rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;position:relative;counter-reset:n}
.vt-route:before{content:"";position:absolute;left:12%;right:12%;top:38px;height:2px;z-index:0;
  background:repeating-linear-gradient(90deg,rgba(236,196,143,.35) 0 8px,transparent 8px 16px);background-size:32px 2px;animation:vtFlow 1.2s linear infinite}
@keyframes vtFlow{to{background-position:32px 0}}
.vt-node{position:relative;z-index:1;display:grid;justify-items:center;text-align:center;gap:.3rem;color:var(--muted)}
.vt-node-box{position:relative;display:grid;place-items:center;width:76px;height:76px;border-radius:18px;
  background:linear-gradient(160deg,#2a2119,#0f0c0a);border:1px solid rgba(236,196,143,.3);transition:.4s cubic-bezier(.2,.7,.2,1)}
.vt-node-box svg{width:30px;height:30px;fill:none;stroke:rgba(236,196,143,.7);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.vt-node-box b{position:absolute;top:-9px;right:-9px;font:500 .7rem var(--mono);padding:.15rem .4rem;border-radius:6px;background:#0b0a09;border:1px solid rgba(236,196,143,.35);color:var(--teal-2)}
.vt-node strong{font:400 1.08rem/1.2 var(--serif);color:var(--ink)}
.vt-node small{font-size:.78rem}
.vt-here{display:none;font:500 .66rem var(--mono);letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:var(--on-copper);background:var(--teal-2);padding:.15rem .5rem;border-radius:4px}
.vt-node.on .vt-here{display:inline-block;animation:blink 1.6s steps(1) infinite}
.vt-node.on .vt-node-box{transform:translateY(-4px) scale(1.06);border-color:transparent;background:linear-gradient(135deg,#f0c995,#c6935f 60%,#9b683a);box-shadow:0 0 0 6px rgba(236,196,143,.12),0 14px 40px rgba(198,147,95,.45)}
.vt-node.on .vt-node-box svg{stroke:var(--on-copper)}
.vt-node.on .vt-node-box:after{content:"";position:absolute;inset:-10px;border-radius:24px;border:1px solid rgba(236,196,143,.5);animation:vtPing 1.8s ease-out infinite}
@keyframes vtPing{from{opacity:1;transform:scale(.9)}to{opacity:0;transform:scale(1.18)}}
.vt-node.done .vt-node-box{border-color:rgba(127,214,161,.55)}
.vt-node.done .vt-node-box b{color:#7fd6a1;border-color:rgba(127,214,161,.55)}
.vt-node.done .vt-node-box b:after{content:" ✓"}
.vt-route .vt-node{opacity:0;transform:translateY(14px);transition:.6s cubic-bezier(.2,.7,.2,1)}
.vt-route.in .vt-node{opacity:1;transform:none}
.vt-route.in .vt-node:nth-child(2){transition-delay:.1s}.vt-route.in .vt-node:nth-child(3){transition-delay:.2s}.vt-route.in .vt-node:nth-child(4){transition-delay:.3s}

/* ---------- area di lavoro ---------- */
.vt-shell{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(260px,.75fr);gap:1.4rem;align-items:start}
.vt-card,.vt-scheda{position:relative;border-radius:24px;border:1px solid rgba(236,196,143,.28);
  background:linear-gradient(170deg,rgba(34,27,21,.94),rgba(12,10,8,.96));box-shadow:0 40px 90px rgba(0,0,0,.55)}
.vt-card{overflow:hidden}
.vt-card:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;background:repeating-linear-gradient(0deg,rgba(255,231,196,.035) 0 1px,transparent 1px 3px)}
.vt-bar{display:flex;align-items:center;gap:.45rem;padding:.8rem 1.1rem;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;color:var(--muted)}
.vt-bar i{width:10px;height:10px;border-radius:50%;background:rgba(236,196,143,.25)}
.vt-bar i:first-child{background:#c6935f}
.vt-bar span{margin-left:.6rem}
.vt-bar b{margin-left:auto;color:var(--teal-2);font-weight:500}
.vt-progress{height:3px;background:rgba(236,196,143,.1)}
.vt-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--deep),var(--teal-2));box-shadow:0 0 14px var(--teal-2);transition:width .6s cubic-bezier(.2,.7,.2,1)}

/* 6 quadrati delle domande */
.vt-steps{display:grid;grid-template-columns:repeat(6,1fr);gap:.5rem;padding:1rem 1.2rem 0}
.vt-sq{position:relative;display:grid;justify-items:center;gap:.25rem;padding:.6rem .2rem .5rem;border-radius:12px;border:1px solid rgba(236,196,143,.18);
  background:rgba(255,255,255,.02);color:var(--muted);font-size:.72rem;transition:.3s}
.vt-sq svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.vt-sq.done{color:#cfeedd;border-color:rgba(127,214,161,.45);background:rgba(127,214,161,.06)}
.vt-sq.done:after{content:"✓";position:absolute;top:3px;right:6px;font-size:.62rem;color:#7fd6a1}
.vt-sq.cur{color:var(--on-copper);border-color:transparent;background:linear-gradient(135deg,#f0c995,var(--teal));box-shadow:0 8px 24px rgba(198,147,95,.4);transform:translateY(-2px)}
.vt-sq:not(.done):not(.cur){opacity:.75}
.vt-card.vt-out .vt-steps{display:none}

.vt-body{position:relative;padding:clamp(1.2rem,3vw,2rem);min-height:440px}
.vt-step{display:grid;gap:1.1rem;animation:vtIn .45s cubic-bezier(.2,.7,.2,1)}
@keyframes vtIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.vt-mia{display:flex;gap:.8rem;align-items:center;font:400 clamp(1.3rem,2.4vw,1.6rem)/1.25 var(--serif);margin:0}
.vt-mia img{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none;border:2px solid var(--teal)}
.vt-sub{color:var(--muted);font-size:.95rem;margin:0}
.vt-small{color:var(--muted);font-size:.8rem;line-height:1.5;margin:0}
.vt-warn{font-size:.88rem;color:#ffe2b8;background:rgba(198,147,95,.12);border-left:2px solid var(--teal);padding:.6rem .8rem;border-radius:6px;margin:0}

/* tessere quadrate delle risposte */
.vt-tiles{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fill,minmax(118px,1fr))}
.vt-tiles.vt-2{grid-template-columns:repeat(2,minmax(0,200px))}
.vt-tiles.vt-3{grid-template-columns:repeat(3,1fr)}
.vt-tile{position:relative;display:grid;justify-items:center;align-content:center;gap:.55rem;aspect-ratio:1/1;padding:.7rem .5rem;border-radius:16px;
  border:1px solid rgba(236,196,143,.26);background:linear-gradient(160deg,rgba(48,38,28,.75),rgba(14,12,10,.85));color:var(--ink);
  font-size:.86rem;line-height:1.2;text-align:center;overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s,background .25s}
.vt-tile svg{width:34px;height:34px;fill:none;stroke:var(--teal-2);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s}
.vt-glyph{font:500 1.9rem/1 var(--mono);color:var(--teal-2)}
.vt-tile:before{content:"";position:absolute;inset:6px;pointer-events:none;
  background:linear-gradient(var(--teal-2),var(--teal-2)) top left/10px 1px no-repeat,linear-gradient(var(--teal-2),var(--teal-2)) top left/1px 10px no-repeat,
    linear-gradient(var(--teal-2),var(--teal-2)) bottom right/10px 1px no-repeat,linear-gradient(var(--teal-2),var(--teal-2)) bottom right/1px 10px no-repeat;opacity:.45;transition:.3s}
.vt-tile:after{content:"";position:absolute;left:0;right:0;top:-60%;height:60%;pointer-events:none;opacity:0;background:linear-gradient(180deg,transparent,rgba(255,231,196,.18))}
.vt-tile:hover{transform:translateY(-4px);border-color:rgba(236,196,143,.6);box-shadow:0 14px 34px rgba(0,0,0,.45),0 0 26px rgba(198,147,95,.2)}
.vt-tile:hover svg{transform:scale(1.1)}
.vt-tile:hover:before{opacity:1;inset:4px}
.vt-tile:hover:after{animation:scan 1s ease-out}
.vt-tile.on{border-color:transparent;background:linear-gradient(140deg,#f2cd9b,#c6935f 60%,#9b683a);color:var(--on-copper);font-weight:600;box-shadow:0 0 0 3px rgba(236,196,143,.18),0 16px 36px rgba(198,147,95,.4)}
.vt-tile.on svg{stroke:var(--on-copper)}.vt-tile.on .vt-glyph{color:var(--on-copper)}
.vt-tile.on:before{opacity:0}
.vt-tick{position:absolute;top:8px;right:9px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:.7rem;font-style:normal;
  background:var(--on-copper);color:#f2cd9b;transform:scale(0);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.vt-tile.on .vt-tick{transform:scale(1)}
.vt-tile.pick{animation:vtPick .38s ease-out}
@keyframes vtPick{40%{transform:scale(.94)}100%{transform:scale(1)}}
.vt-mini .vt-tile{aspect-ratio:auto;padding:.75rem}
.vt-sub-q{display:grid;gap:.6rem;padding-top:.4rem;border-top:1px dashed rgba(236,196,143,.2);animation:vtIn .4s both}

/* campi */
.vt-field{display:grid;gap:.35rem;min-width:0}
.vt-field>span,.vt-field-l{font-size:.78rem;color:var(--muted);font-family:var(--mono);letter-spacing:.04em}
.vt-field-l{display:block;margin-bottom:.45rem}
.vt-field input{width:100%;padding:.85rem 1rem;border-radius:12px;border:1px solid rgba(236,196,143,.26);background:rgba(0,0,0,.4);color:var(--ink);font:inherit;outline:none;transition:.2s}
.vt-field input:focus{border-color:var(--teal-2);box-shadow:0 0 0 3px rgba(236,196,143,.18)}
.vt-field input:disabled{opacity:.4}
.vt-unit{position:relative}.vt-unit input{font:500 1.5rem var(--mono);padding-right:3rem}.vt-unit b{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:500}
.vt-mqbox{display:flex;gap:1rem;align-items:flex-end;flex-wrap:wrap}.vt-mqbox .vt-field{width:min(260px,100%)}
.vt-2col{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.vt-check{display:flex;gap:.6rem;align-items:flex-start;font-size:.88rem;color:var(--muted);cursor:pointer;padding:.7rem 0}
.vt-check input{accent-color:#c6935f;width:18px;height:18px;margin:.1rem 0 0}
.vt-check a{color:var(--teal-2);text-decoration:underline}

/* contatori locali e bagni */
.vt-counters{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.vt-counter{display:grid;justify-items:center;gap:.5rem;padding:1.2rem .8rem;border-radius:18px;border:1px solid rgba(236,196,143,.26);background:linear-gradient(160deg,rgba(48,38,28,.75),rgba(14,12,10,.85))}
.vt-counter>svg{width:28px;height:28px;fill:none;stroke:var(--teal-2);stroke-width:1.4}
.vt-counter>span{font:500 .78rem var(--mono);color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.vt-counter>div{display:flex;align-items:center;gap:1rem}
.vt-counter button{width:46px;height:46px;border-radius:12px;font-size:1.4rem;color:var(--ink);border:1px solid rgba(236,196,143,.3);background:rgba(236,196,143,.06);transition:.2s}
.vt-counter button:hover{background:var(--teal);color:var(--on-copper);border-color:transparent}
.vt-counter output{min-width:2ch;text-align:center;font:500 2.6rem/1 var(--mono);color:var(--teal-2)}
.vt-counter output.bump{animation:vtPick .3s}

.vt-nav{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:.4rem;flex-wrap:wrap}
.vt-back,.vt-link{color:var(--muted);font-size:.9rem;padding:.4rem 0;text-decoration:underline;text-underline-offset:.25em;background:none;border:0;cursor:pointer}
.vt-back:hover,.vt-link:hover{color:var(--ink)}
.vt-next{font-size:1rem;padding:.95rem 1.6rem}
.vt-next:disabled{opacity:.3;cursor:not-allowed;transform:none;box-shadow:none;filter:grayscale(.4)}
.vt-next:disabled:after{display:none}
.vt-next:not(:disabled){animation:vtReady 2.4s ease-in-out infinite}
@keyframes vtReady{50%{box-shadow:0 0 0 6px rgba(236,196,143,.12),0 14px 44px rgba(198,147,95,.55)}}
.vt-wide{width:100%;justify-content:center}

/* scheda dal vivo */
.vt-scheda{padding:1.3rem;display:grid;gap:1rem;position:sticky;top:7rem}
.vt-scheda-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.vt-scheda-head strong{font:400 1.4rem var(--serif)}
.vt-ring{--p:0;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;flex:none;
  background:conic-gradient(var(--teal-2) calc(var(--p)*1%),rgba(236,196,143,.12) 0);transition:--p .6s;position:relative}
@property --p{syntax:"<number>";inherits:false;initial-value:0}
.vt-ring:before{content:"";position:absolute;inset:5px;border-radius:50%;background:#110e0b}
.vt-ring span{position:relative;font:500 .9rem var(--mono);color:var(--teal-2)}
.vt-rows{margin:0;display:grid;gap:.45rem}
.vt-r{display:grid;gap:.15rem;padding:.6rem .75rem;border-radius:12px;border:1px solid rgba(236,196,143,.12);background:rgba(0,0,0,.25);transition:.3s}
.vt-r dt{display:flex;align-items:center;gap:.5rem;font:500 .7rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.vt-r dt i{width:8px;height:8px;border-radius:2px;border:1px solid rgba(236,196,143,.45)}
.vt-r dd{margin:0;font-size:.9rem;color:rgba(245,239,230,.4);font-family:var(--mono)}
.vt-r.ok dd{color:var(--ink);font-family:var(--sans)}
.vt-r.ok dt i{background:#7fd6a1;border-color:#7fd6a1;box-shadow:0 0 8px #7fd6a1}
.vt-r.cur{border-color:rgba(236,196,143,.55);background:rgba(236,196,143,.07)}
.vt-r.cur dt i{animation:blink 1s steps(1) infinite;background:var(--teal-2)}

/* scansione */
.vt-loading{min-height:380px;align-content:center;justify-items:center;text-align:center}
.vt-scan-grid{display:grid;grid-template-columns:repeat(8,22px);gap:6px}
.vt-scan-grid i{width:22px;height:22px;border-radius:5px;border:1px solid rgba(236,196,143,.3);animation:vtCell 1.4s ease-in-out infinite;animation-delay:calc(var(--k)*55ms)}
@keyframes vtCell{0%,100%{background:transparent}40%{background:rgba(236,196,143,.75);box-shadow:0 0 12px rgba(236,196,143,.6)}}
.vt-scramble{font:500 clamp(2rem,5vw,3.2rem) var(--mono);color:var(--teal-2);text-shadow:0 0 22px rgba(236,196,143,.45)}
.vt-log{font-family:var(--mono);font-size:.82rem;color:var(--muted);text-align:left;min-height:6.5em}
.vt-log p{margin:.2rem 0;animation:vtIn .3s both}
.vt-log p:last-child:after{content:"▍";margin-left:.3em;color:var(--teal-2);animation:blink .8s steps(1) infinite}

/* risultato */
.vt-kicker{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-2);margin:0}
.vt-range{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.vt-range>span{grid-column:1/-1;font:400 clamp(2rem,4.6vw,3.2rem) var(--serif);color:var(--teal-2)}
.vt-cell{position:relative;padding:1rem 1.1rem;border-radius:16px;border:1px solid rgba(236,196,143,.35);background:rgba(0,0,0,.35)}
.vt-cell small{display:block;font:500 .7rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.vt-cell span{display:block;font:400 clamp(1.7rem,3.6vw,2.6rem)/1.1 var(--serif);background:linear-gradient(100deg,#ecc48f,#fff1dc 40%,#c6935f);-webkit-background-clip:text;background-clip:text;color:transparent}
.vt-meter{height:8px;border-radius:8px;background:rgba(236,196,143,.1);position:relative;overflow:hidden}
.vt-meter span{position:absolute;left:10%;right:10%;top:0;bottom:0;border-radius:8px;background:linear-gradient(90deg,var(--deep),var(--teal-2),var(--deep));animation:vtMeter 1.4s cubic-bezier(.2,.7,.2,1) both}
@keyframes vtMeter{from{left:50%;right:50%}}
.vt-tags{display:flex;flex-wrap:wrap;gap:.45rem}
.vt-tags span{font-size:.76rem;padding:.35rem .75rem;border-radius:8px;border:1px solid var(--line);color:var(--muted)}
.vt-alert{border:1px solid rgba(236,196,143,.4);background:rgba(198,147,95,.1);border-radius:14px;padding:1rem 1.1rem}
.vt-alert strong{display:block;color:#ffe2b8}
.vt-alert p{margin:.3rem 0 0;font-size:.9rem;color:#e6dbcc}
.vt-next-k{margin-top:.4rem}
.vt-choices{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.vt-choice{position:relative;display:grid;gap:.55rem;align-content:start;text-align:left;padding:1.3rem;border-radius:18px;color:var(--ink);
  border:1px solid rgba(236,196,143,.28);background:linear-gradient(160deg,rgba(48,38,28,.75),rgba(14,12,10,.85));transition:.3s}
.vt-choice .vt-node-box{width:56px;height:56px;border-radius:14px}
.vt-choice .vt-node-box svg{width:24px;height:24px}
.vt-choice strong{font:400 1.25rem/1.2 var(--serif)}
.vt-choice small{color:var(--muted);font-size:.86rem;line-height:1.45}
.vt-choice em{font-style:normal;font-weight:600;color:var(--teal-2);margin-top:.2rem}
.vt-choice:hover{transform:translateY(-4px);border-color:rgba(236,196,143,.6);box-shadow:0 18px 40px rgba(0,0,0,.45),0 0 30px rgba(198,147,95,.2)}
.vt-choice-main{border-color:rgba(236,196,143,.55);background:radial-gradient(120% 100% at 100% 0%,rgba(198,147,95,.3),transparent 60%),linear-gradient(160deg,rgba(48,38,28,.85),rgba(14,12,10,.9))}
.vt-choice-main .vt-node-box{background:linear-gradient(135deg,#f0c995,#c6935f 60%,#9b683a);border-color:transparent}
.vt-choice-main .vt-node-box svg{stroke:var(--on-copper)}
.vt-form h3,.vt-done h3{font-size:1.8rem;margin:0}
.vt-done{justify-items:start}
.vt-done-mark{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;font-size:1.8rem;color:var(--on-copper);background:linear-gradient(135deg,#f0c995,#c6935f);box-shadow:0 0 0 8px rgba(236,196,143,.12);animation:vtPick .6s}
.vt-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ---------- responsive ---------- */
@media(max-width:980px){.vt-shell{grid-template-columns:1fr}.vt-scheda{position:static;order:2}}
@media(max-width:700px){
  .vt-route{grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}
  .vt-route:before{top:28px}
  .vt-node-box{width:56px;height:56px;border-radius:14px}.vt-node-box svg{width:24px;height:24px}
  .vt-node strong{font-size:.82rem}.vt-node small{display:none}
  .vt-steps{grid-template-columns:repeat(6,1fr);gap:.3rem;padding:.8rem .8rem 0}.vt-sq span{display:none}.vt-sq{padding:.55rem 0}
  .vt-tiles{grid-template-columns:repeat(2,1fr)}.vt-tiles.vt-3{grid-template-columns:repeat(3,1fr)}
  .vt-tile{aspect-ratio:auto;min-height:104px}
  .vt-choices,.vt-2col{grid-template-columns:1fr}
  .vt-body{min-height:0}
}
@media(prefers-reduced-motion:reduce){
  .vt-route:before,.vt-node.on .vt-node-box:after,.vt-next:not(:disabled),.vt-scan-grid i,.vt-step,.vt-log p,.vt-meter span,.vt-node.on .vt-here{animation:none}
  .vt-route .vt-node{opacity:1;transform:none}
}

/* Il modulo usa lo spazio della pagina interna, senza il secondo margine della homepage. */
.inside > #valutazione{padding:1.5rem 0 2rem;--muted:#d9ccbd}
.vt-shell,.vt-card,.vt-body,.vt-step,.vt-tiles,.vt-scheda,.vt-counter{min-width:0}
.vt-card{overflow:visible}
.vt-step{grid-template-columns:minmax(0,1fr)}
.vt-tile,.vt-tile-l,.vt-choices>*{min-width:0;overflow-wrap:anywhere}
.vt-field>span,.vt-field-l,.vt-small,.vt-sub{font-size:.95rem;line-height:1.5}
.vt-field input{font-size:1rem;border-color:#a58a6b;background:#17130f}
.vt-field input::placeholder{color:#bdb0a1}
.vt-sq:not(.done):not(.cur){opacity:1}
.vt-body :is(input,button,a){scroll-margin-block:9rem 2rem}
.vt-card .hud{display:none}
@media(max-width:700px){
 .vt-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
 .vt-sq{display:flex;align-items:center;justify-content:center;gap:.35rem;min-height:44px}
 .vt-sq span{display:inline;font-size:.83rem}
 .vt-route{grid-template-columns:repeat(2,minmax(0,1fr))}
 .vt-route:before{display:none}
 .vt-node small{display:block}
 .vt-body{padding:1rem}
 .vt-tiles,.vt-tiles.vt-3{grid-template-columns:repeat(2,minmax(0,1fr))}
 .vt-counter{display:flex;flex-wrap:wrap}.vt-counter>div{margin-left:auto}
 .vt-nav{flex-wrap:wrap}
}
@media(max-width:700px){.vt-counters{grid-template-columns:minmax(0,1fr)}}