/* FSC Configuratore — CSS (dal mockup approvato, mix 4 colori)
   Usa i token fsc se presenti; i fallback li rendono autonomo. */

.fsc-cfg{--c-white:var(--fsc-white,#FFFFFF);--c-cream:var(--fsc-cream,#F7F6F3);--c-g100:var(--fsc-grey-100,#E8E6E1);--c-g200:var(--fsc-grey-200,#CCCAC4);--c-g500:var(--fsc-grey-500,#888680);--c-g700:var(--fsc-grey-700,#444240);--c-black:var(--fsc-black,#0D0D0D);--c-r1:var(--fsc-r1,#EF5FFF);--c-r2:var(--fsc-r2,#DEDC12);--c-r3:var(--fsc-r3,#18ED93);--c-r4:var(--fsc-r4,#54CCEF);--c-crit:var(--fsc-critical,#FF6160);--c-mono:var(--fsc-mono,"Consolas","Courier New",monospace);
  max-width:760px;margin:0 auto;background:var(--c-white);border:1px solid var(--c-g100);border-radius:16px;overflow:hidden;color:var(--c-black);line-height:1.55}

.fsc-cfg__head{display:flex;align-items:center;gap:10px;padding:14px 20px;border-bottom:1px solid var(--c-g100)}
.fsc-cfg__dot{width:8px;height:8px;border-radius:50%;background:var(--c-r3);animation:fsccfg-pulse 1.8s ease-in-out infinite}
@keyframes fsccfg-pulse{0%,100%{opacity:1}50%{opacity:.3}}
.fsc-cfg__title{font-size:.85rem;font-weight:700}
.fsc-cfg__count{margin-left:auto;font-family:var(--c-mono);font-size:.7rem;color:var(--c-g500)}
.fsc-cfg__progress{display:flex;gap:4px;padding:0 20px;margin-top:14px}
.fsc-cfg__progress span{height:4px;border-radius:3px;flex:1;background:var(--c-g100);transition:background .22s}
.fsc-cfg__progress span.done:nth-child(1){background:var(--c-r1)}
.fsc-cfg__progress span.done:nth-child(2){background:var(--c-r2)}
.fsc-cfg__progress span.done:nth-child(3){background:var(--c-r3)}
.fsc-cfg__progress span.done:nth-child(4){background:var(--c-r4)}
.fsc-cfg__body{padding:22px 20px 24px}

.fsc-cfg__stripe{display:flex;gap:4px;margin-bottom:12px}
.fsc-cfg__stripe span{display:block;height:4px;border-radius:3px}
.fsc-cfg__stripe span:nth-child(1){width:34px;background:var(--c-r1)}
.fsc-cfg__stripe span:nth-child(2){width:20px;background:var(--c-r2)}
.fsc-cfg__stripe span:nth-child(3){width:44px;background:var(--c-r3)}
.fsc-cfg__stripe span:nth-child(4){width:16px;background:var(--c-r4)}

.fsc-cfg__q{font-size:1.25rem;font-weight:900;letter-spacing:-.03em;margin:0 0 4px}
.fsc-cfg__hint{font-size:.85rem;color:var(--c-g500);margin:0 0 18px}

.fsc-cfg__opts{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.fsc-cfg__opt{border:1px solid var(--c-g100);border-left:3px solid transparent;border-radius:10px;padding:14px 12px;cursor:pointer;background:var(--c-cream);transition:border-color .15s,background .15s;text-align:left;font:inherit;color:inherit}
.fsc-cfg__opt:hover{background:var(--c-white);border-color:var(--c-g200)}
.fsc-cfg__opt:nth-child(4n+1){border-left-color:var(--c-r1)}
.fsc-cfg__opt:nth-child(4n+2){border-left-color:var(--c-r2)}
.fsc-cfg__opt:nth-child(4n+3){border-left-color:var(--c-r3)}
.fsc-cfg__opt:nth-child(4n+4){border-left-color:var(--c-r4)}
.fsc-cfg__opt .name{font-size:.9rem;font-weight:700;margin-bottom:2px;display:block}
.fsc-cfg__opt .hint{font-size:.72rem;color:var(--c-g500);display:block}
.fsc-cfg__opt--critico{border-color:#ffcaca}
.fsc-cfg__opt--critico .name{color:var(--c-crit)}
.fsc-cfg__back{background:none;border:none;color:var(--c-g500);font-size:.78rem;cursor:pointer;padding:0;margin-top:18px;font-family:var(--c-mono)}
.fsc-cfg__back:hover{color:var(--c-black)}

.fsc-cfg__labels{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.fsc-cfg__label{font-family:var(--c-mono);font-size:.66rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:.28rem .85rem;border-radius:99px;background:var(--c-black);color:#fff}
.fsc-cfg__label--start{background:#e8fdf5;color:#0f6b44}
.fsc-cfg__label--crit{background:#FFF0F0;color:var(--c-crit);border:1.5px solid #FFCACA}

.fsc-cfg__pkgs{display:grid;gap:8px}
.fsc-cfg__pkg{border:1px solid var(--c-g100);border-top-width:3px;border-radius:12px;padding:16px;background:var(--c-cream);position:relative}
.fsc-cfg__pkg:nth-child(3n+1){border-top-color:var(--c-r1)}
.fsc-cfg__pkg:nth-child(3n+2){border-top-color:var(--c-r3)}
.fsc-cfg__pkg:nth-child(3n+3){border-top-color:var(--c-r4)}
.fsc-cfg__pkg:nth-child(3n+1) input{accent-color:var(--c-r1)}
.fsc-cfg__pkg:nth-child(3n+2) input{accent-color:#0f6b44}
.fsc-cfg__pkg:nth-child(3n+3) input{accent-color:var(--c-r4)}
.fsc-cfg__pkg--hero{border-color:var(--c-r3);border-top-color:var(--c-r3);background:#f4fef9}
.fsc-cfg__pkg--hero.fsc-cfg__pkg--crit{border-color:var(--c-crit);border-top-color:var(--c-crit);background:#fff6f6}
.fsc-cfg__flag{position:absolute;top:-9px;right:14px;font-family:var(--c-mono);font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--c-r3);color:#083b24;padding:2px 10px;border-radius:99px}
.fsc-cfg__pkg--crit .fsc-cfg__flag{background:var(--c-crit);color:#4b1010}
.fsc-cfg__pkg-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px;gap:10px}
.fsc-cfg__pkg-name{font-size:1rem;font-weight:900;letter-spacing:-.02em}
.fsc-cfg__pkg-price{font-family:var(--c-mono);font-size:.78rem;color:var(--c-g500);white-space:nowrap}
.fsc-cfg__pkg-desc{font-size:.8rem;color:var(--c-g500);line-height:1.55;margin:0 0 10px}
.fsc-cfg__inc{display:grid;gap:4px;margin:0 0 10px;padding:0;list-style:none}
.fsc-cfg__inc li{font-size:.78rem;padding-left:18px;position:relative}
.fsc-cfg__inc li::before{content:"";position:absolute;left:0;top:.5em;width:10px;height:5px;border-radius:99px;background:var(--c-r3)}
.fsc-cfg__addons{display:grid;gap:6px;border-top:1px dashed var(--c-g200);padding-top:10px}
.fsc-cfg__addons-title{font-family:var(--c-mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--c-g500)}
.fsc-cfg__addon{display:flex;align-items:center;gap:8px;font-size:.8rem;cursor:pointer}
.fsc-cfg__addon .p{margin-left:auto;font-family:var(--c-mono);font-size:.7rem;color:var(--c-g500);white-space:nowrap}
.fsc-cfg__pick{margin-top:12px;font-size:.8rem;font-weight:700;padding:9px 18px;border-radius:99px;border:1px solid var(--c-black);background:var(--c-white);cursor:pointer;transition:all .15s;font-family:inherit}
.fsc-cfg__pick:hover,.fsc-cfg__pick.is-on{background:var(--c-black);color:#fff}

.fsc-cfg__send{margin-top:16px;border-top:1px solid var(--c-g100);padding-top:16px;display:grid;gap:10px}
.fsc-cfg__send label{font-size:.78rem;font-weight:700;color:var(--c-g700);display:grid;gap:4px}
.fsc-cfg__send label small{font-weight:400;color:var(--c-g500)}
.fsc-cfg__send input,.fsc-cfg__send textarea{font:inherit;font-size:.88rem;padding:9px 12px;border:1px solid var(--c-g100);border-radius:9px;background:var(--c-cream);width:100%;box-sizing:border-box}
.fsc-cfg__send input:focus,.fsc-cfg__send textarea:focus{outline:none;background:var(--c-white);border-color:var(--c-black)}
.fsc-cfg__submit{font-size:.85rem;font-weight:700;padding:12px 22px;border-radius:99px;border:none;cursor:pointer;background:var(--c-black);color:#fff;justify-self:start;font-family:inherit}
.fsc-cfg__submit:disabled{opacity:.5;cursor:wait}
.fsc-cfg__result{font-size:.85rem;font-weight:600;margin:0;display:none}
.fsc-cfg__result.is-ok{display:block;color:#0f6b44}
.fsc-cfg__result.is-error{display:block;color:#a62b2a}

.fsc-cfg__done{text-align:center;padding:28px 10px}
.fsc-cfg__done h3{font-size:1.2rem;font-weight:900;letter-spacing:-.03em;margin:12px 0 6px}
.fsc-cfg__done p{font-size:.85rem;color:var(--c-g500);margin:0}

@media(max-width:560px){.fsc-cfg__opts{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.fsc-cfg *{animation:none!important;transition:none!important}}
