/* GSVDESIGN — schema animato del sistema qualità (qualita.html). Tutto sotto .sgq;
   le animazioni si attivano con la classe sgq-anim su <html>, solo senza «riduci movimento». */
.sgq{--cycle:16s}
.sgq h2 em{font-style:italic;font-weight:400;color:var(--accent)}
.sgq h2,.sgq h3{font-family:var(--display);font-weight:600;line-height:1.1;margin:0}
.sgq p{margin:0}
.sgq .sec{padding:clamp(64px,9vw,112px) 0;border-bottom:1px solid var(--line)}
.sgq .sec-head{display:grid;grid-template-columns:80px 1fr;gap:0 24px;margin-bottom:clamp(32px,5vw,56px)}
.sgq .sec-num{font:500 13px/1 var(--sans);letter-spacing:.2em;color:var(--ink-2);padding-top:12px;border-top:2px solid var(--accent)}
.sgq .sec-head h2{font-size:clamp(30px,4vw,48px);margin:6px 0 14px}
.sgq .sec-head p{max-width:64ch;color:var(--ink-2)}
.sgq .pdca{display:grid;grid-template-columns:1fr minmax(280px,420px) 1fr;align-items:center;gap:clamp(16px,3vw,40px)}
.sgq .io{background:var(--white);border-top:2px solid var(--accent);padding:22px 22px 24px;position:relative}
.sgq .io h3{font-size:24px;margin:8px 0 12px}
.sgq .io ul{margin:0;padding:0;list-style:none}
.sgq .io li{padding:7px 0;border-top:1px solid var(--line);font-size:15px}
.sgq .io .arrow{position:absolute;top:50%;width:clamp(16px,3vw,40px);height:2px;background:var(--accent)}
.sgq .io.in-put .arrow{right:calc(-1 * clamp(16px,3vw,40px))}
.sgq .io.out-put .arrow{left:calc(-1 * clamp(16px,3vw,40px))}
.sgq .io .arrow::after{content:"";position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left:7px solid var(--accent);border-right:0}
.sgq .ring{width:100%;height:auto;display:block}
.sgq .ring .track{fill:none;stroke:var(--line);stroke-width:1}
.sgq .ring .arc{fill:none;stroke:var(--ink);stroke-width:10;stroke-linecap:butt;stroke-dasharray:221.6 720.9}
.sgq .ring .head{fill:var(--ink)}
.sgq .ring .letter{font:600 46px var(--display);fill:var(--ink);text-anchor:middle;dominant-baseline:central}
.sgq .ring .clause{font:500 12px var(--sans);letter-spacing:.14em;fill:var(--ink-2);text-anchor:middle}
.sgq .ring .core{fill:var(--white);stroke:var(--accent);stroke-width:1}
.sgq .ring .core-t{font:600 21px var(--display);fill:var(--ink);text-anchor:middle}
.sgq .ring .core-s{font:500 10.5px var(--sans);letter-spacing:.18em;fill:var(--accent);text-anchor:middle}
.sgq .ring .dot{fill:var(--accent)}
.sgq .ring .halo{fill:var(--accent);opacity:.18}
.sgq .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:clamp(32px,5vw,52px);border-top:1px solid var(--line)}
.sgq .step{padding:20px 20px 8px 0;border-right:1px solid var(--line);position:relative}
.sgq .step+.step{padding-left:20px}
.sgq .step:last-child{border-right:0}
.sgq .step::before{content:"";position:absolute;left:0;right:0;top:-1px;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left}
.sgq .step+.step::before{left:0}
.sgq .step .k{font:600 30px/1 var(--display);color:var(--ink)}
.sgq .step .k small{font:500 11px var(--sans);letter-spacing:.18em;color:var(--ink-2);margin-left:8px;vertical-align:middle}
.sgq .step h3{font-size:22px;margin:10px 0 8px}
.sgq .step p{font-size:15px;color:var(--ink-2)}
.sgq .sgq-band{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:start;padding:22px 0;border-top:1px solid var(--line)}
.sgq .sgq-band-t{font:500 11px/1.5 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);padding-top:8px}
.sgq .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.sgq .chips li{background:var(--white);border:1px solid var(--line);padding:7px 14px;font-size:14px;font-weight:400}
.sgq .sgq-band.core-band{background:var(--white);border-top:2px solid var(--accent);padding:28px 24px 30px;margin:6px 0;grid-template-columns:176px 1fr}
.sgq .sgq-band.core-band .sgq-band-t{color:var(--accent)}
.sgq .chain{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:16px;position:relative;counter-reset:n}
.sgq .chain::before{content:"";position:absolute;left:8px;right:8px;top:8px;height:1px;background:var(--accent);transform-origin:left}
.sgq .chain .pulse{position:absolute;top:4px;left:8px;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgba(151,27,47,.15);opacity:0}
.sgq .chain li{position:relative;padding-top:30px;counter-increment:n}
.sgq .chain li::before{content:"";position:absolute;left:0;top:0;width:17px;height:17px;border-radius:50%;background:var(--white);border:2px solid var(--accent)}
.sgq .chain li h3{font-size:19px;line-height:1.2;margin-bottom:6px}
.sgq .chain li h3::before{content:counter(n,decimal-leading-zero);display:block;font:500 11px/1 var(--sans);letter-spacing:.18em;color:var(--ink-2);margin-bottom:8px}
.sgq .chain li p{font-size:14px;color:var(--ink-2);line-height:1.55}
.sgq .feedback{grid-column:2;display:flex;align-items:center;gap:16px;margin-top:26px;font:500 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.sgq .feedback .dash{flex:1;height:2px;background:repeating-linear-gradient(90deg,var(--accent) 0 8px,transparent 8px 16px)}
.sgq .feedback .tip{width:0;height:0;border:6px solid transparent;border-right:9px solid var(--accent);border-left:0}
.sgq .flow{width:100%;height:auto;display:block}
.sgq .flow.v{display:none;max-width:380px;margin:0 auto}
.sgq .flow .base{stroke:var(--ink);stroke-width:1.5;fill:none}
.sgq .flow .loop{stroke:var(--accent);stroke-width:1.5;fill:none;stroke-dasharray:6 6}
.sgq .flow .node{fill:var(--white);stroke:var(--ink);stroke-width:1.5}
.sgq .flow .node.end{fill:var(--accent);stroke:var(--accent)}
.sgq .flow .n{font:600 26px var(--display);fill:var(--ink);text-anchor:middle;dominant-baseline:central}
.sgq .flow .node.end+.n{fill:var(--white)}
.sgq .flow .t{font:600 22px var(--display);fill:var(--ink)}
.sgq .flow .s{font:300 14.5px var(--sans);fill:var(--ink-2)}
.sgq .flow .lt{font:500 11px var(--sans);letter-spacing:.16em;fill:var(--accent)}
.sgq .flow .token rect{fill:var(--white);stroke:var(--accent);stroke-width:1.5}
.sgq .flow .token path{stroke:var(--accent);stroke-width:1.2}
.sgq .flow-note{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:clamp(28px,4vw,44px)}
.sgq .flow-note div{border-top:1px solid var(--line);padding-top:14px;font-size:15px;color:var(--ink-2)}
.sgq .flow-note b{display:block;font:600 20px/1.2 var(--display);color:var(--ink);margin-bottom:6px}
.sgq .tl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:20px;position:relative}
.sgq .tl::before{content:"";position:absolute;left:0;right:0;top:9px;height:2px;background:var(--accent);transform-origin:left}
.sgq .tl li{position:relative;padding-top:38px}
.sgq .tl li::before{content:"";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:var(--bg);border:2px solid var(--accent)}
.sgq .tl li.on::before{background:var(--accent)}
.sgq .tl .y{font:600 34px/1 var(--display)}
.sgq .tl h3{font:500 13px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:10px 0 6px}
.sgq .tl p{font-size:14.5px;color:var(--ink-2)}
.sgq-anim .sgq .rv{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.sgq-anim .sgq .rv.in{opacity:1;transform:none}
.sgq-anim .sgq .stag>*{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.sgq-anim .sgq .stag.in>*{opacity:1;transform:none}
.sgq-anim .sgq .stag.in>*:nth-child(2){transition-delay:.12s}
.sgq-anim .sgq .stag.in>*:nth-child(3){transition-delay:.24s}
.sgq-anim .sgq .stag.in>*:nth-child(4){transition-delay:.36s}
.sgq-anim .sgq .stag.in>*:nth-child(5){transition-delay:.48s}
.sgq-anim .sgq .stag.in>*:nth-child(6){transition-delay:.60s}
.sgq-anim .sgq .stag.in>*:nth-child(7){transition-delay:.72s}
.sgq-anim .sgq .stag.in>*:nth-child(8){transition-delay:.84s}
.sgq-anim .sgq .ring .arc{stroke-dashoffset:221.6;transition:stroke-dashoffset 1.1s ease}
.sgq-anim .sgq .ring.in .arc{stroke-dashoffset:0}
.sgq-anim .sgq .ring.in .arc:nth-of-type(2){transition-delay:.35s}
.sgq-anim .sgq .ring.in .arc:nth-of-type(3){transition-delay:.7s}
.sgq-anim .sgq .ring.in .arc:nth-of-type(4){transition-delay:1.05s}
.sgq-anim .sgq .ring .head,.sgq-anim .sgq .ring .orbit{opacity:0;transition:opacity .4s ease 1.6s}
.sgq-anim .sgq .ring.in .head,.sgq-anim .sgq .ring.in .orbit{opacity:1}
.sgq-anim .sgq .ring .orbit{transform-box:view-box;transform-origin:200px 200px;animation:orbit var(--cycle) linear infinite paused}
.sgq-anim .sgq .ring .halo{transform-box:fill-box;transform-origin:center;animation:halo 2s ease-out infinite}
.sgq-anim .sgq .ring .q,.sgq-anim .sgq .step{animation:phase var(--cycle) linear infinite paused}
.sgq-anim .sgq .ring .q1,.sgq-anim .sgq .step:nth-child(1){animation-delay:0s}
.sgq-anim .sgq .ring .q2,.sgq-anim .sgq .step:nth-child(2){animation-delay:-12s}
.sgq-anim .sgq .ring .q3,.sgq-anim .sgq .step:nth-child(3){animation-delay:-8s}
.sgq-anim .sgq .ring .q4,.sgq-anim .sgq .step:nth-child(4){animation-delay:-4s}
.sgq-anim .sgq .run .orbit,.sgq-anim .sgq .run .q,.sgq-anim .sgq .run .step{animation-play-state:running}
.sgq-anim .sgq .step::before{animation:inherit;animation-name:bar}
.sgq-anim .sgq .ring .q{--c:var(--ink)}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes halo{0%{transform:scale(.6);opacity:.35}100%{transform:scale(2.4);opacity:0}}
@keyframes phase{0%,24%{color:var(--accent);stroke:var(--accent);fill:var(--accent)}25%,100%{}}
@keyframes bar{0%{transform:scaleX(0)}24%{transform:scaleX(1);opacity:1}25%,100%{transform:scaleX(1);opacity:0}}
.sgq-anim .sgq .ring .arc.q{animation-name:arcphase}
.sgq-anim .sgq .ring .head.q{animation-name:fillphase}
.sgq-anim .sgq .ring .letter.q{animation-name:fillphase}
@keyframes arcphase{0%,24%{stroke:var(--accent)}25%,100%{stroke:var(--ink)}}
@keyframes fillphase{0%,24%{fill:var(--accent)}25%,100%{fill:var(--ink)}}
.sgq-anim .sgq .step{animation-name:none}
.sgq-anim .sgq .step .k{animation:inherit;animation-name:kphase}
@keyframes kphase{0%,24%{color:var(--accent)}25%,100%{color:var(--ink)}}
.sgq-anim .sgq .chain::before{transform:scaleX(0);transition:transform 1.4s cubic-bezier(.6,0,.2,1)}
.sgq-anim .sgq .chain.in::before{transform:scaleX(1)}
.sgq-anim .sgq .chain.in .pulse{animation:run 6s cubic-bezier(.45,0,.55,1) 1.4s infinite}
@keyframes run{0%{left:8px;opacity:0}6%{opacity:1}94%{opacity:1}100%{left:calc(100% - 17px);opacity:0}}
.sgq-anim .sgq .feedback .dash{animation:back 1.2s linear infinite}
@keyframes back{to{background-position:-16px 0}}
.sgq-anim .sgq .tl::before{transform:scaleX(0);transition:transform 1.6s cubic-bezier(.6,0,.2,1)}
.sgq-anim .sgq .tl.in::before{transform:scaleX(1)}
.sgq-anim .sgq .tl li.on::before{animation:beat 2.4s ease-in-out infinite}
@keyframes beat{0%,100%{box-shadow:0 0 0 0 rgba(151,27,47,.35)}50%{box-shadow:0 0 0 9px rgba(151,27,47,0)}}
@media (max-width:1000px){.sgq .pdca{grid-template-columns:1fr;max-width:520px;margin:0 auto}
.sgq .io .arrow{display:none}
.sgq .pdca .ring{order:-1;max-width:420px;margin:0 auto}
.sgq .steps{grid-template-columns:repeat(2,1fr)}
.sgq .step:nth-child(2){border-right:0}
.sgq .step:nth-child(3){padding-left:0}
.sgq .chain{grid-template-columns:repeat(3,1fr);row-gap:34px}
.sgq .chain::before,.sgq .chain .pulse{display:none}
.sgq .tl{grid-template-columns:repeat(3,1fr);row-gap:34px}
.sgq .tl::before{display:none}}
@media (max-width:760px){.sgq .flow.h{display:none}
.sgq .flow.v{display:block}
.sgq .flow-note{grid-template-columns:1fr}}
@media (max-width:640px){.sgq .sec-head{grid-template-columns:1fr}
.sgq .sec-num{width:64px;margin-bottom:14px}
.sgq .steps{grid-template-columns:1fr}
.sgq .step,.sgq .step+.step{padding-left:0;border-right:0;border-bottom:1px solid var(--line);padding-bottom:16px}
.sgq .sgq-band,.sgq .sgq-band.core-band{grid-template-columns:1fr;gap:12px}
.sgq .sgq-band.core-band{padding:22px 16px}
.sgq .chain{grid-template-columns:1fr;row-gap:0}
.sgq .chain li{padding:0 0 22px 34px;border-left:1px solid var(--accent);margin-left:8px}
.sgq .chain li:last-child{border-left-color:transparent}
.sgq .chain li::before{left:-9px}
.sgq .tl{grid-template-columns:1fr;row-gap:0}
.sgq .tl li{padding:0 0 26px 36px;border-left:2px solid var(--accent);margin-left:9px}
.sgq .tl li:last-child{border-left-color:transparent}
.sgq .tl li::before{left:-11px}}
@media (prefers-reduced-motion:reduce){.sgq *{animation:none!important;transition:none!important}}
.sgq .sgq-note{margin-top:clamp(28px,4vw,44px);padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--ink-2);max-width:none}
.sgq>.sec:first-child{border-top:1px solid var(--line)}
.sgq .chips a{color:inherit;text-decoration:none;border-bottom:1px solid var(--accent)}
.sgq .chips a:hover{color:var(--accent)}
.sgq .sec--white .tl li::before{background:#fbfaf8}
.sgq .sec--white .tl li.on::before{background:var(--accent)}
.sgq .sec-head{grid-template-columns:1fr;gap:0}
.sgq .sec-head .eyebrow{margin:0}
.sgq .sec-head h2{margin-top:14px}
