/* QUANTIC DATA — auth panels v2 (login/signup). Tokens da styles.css.
   Il pannello visual è SEMPRE dark (finestra-prodotto), la card segue il tema. */

.auth-wrap{min-height:100vh;display:flex;flex-direction:column}

/* header slim: solo back + azione alternativa (il logo vive sopra la card) */
.auth-top{display:flex;align-items:center;gap:16px;padding:18px clamp(18px,4vw,44px)}
.auth-top .to-site{font-size:.88rem;color:var(--muted);text-decoration:none;transition:color .15s var(--ease)}
.auth-top .to-site:hover{color:var(--text)}
.auth-top .alt{margin-left:auto;font-size:.88rem;color:var(--muted);text-decoration:none;border:1px solid var(--line);border-radius:10px;padding:7px 14px;transition:all .15s var(--ease)}
.auth-top .alt:hover{color:var(--text);border-color:rgba(147,160,189,.35)}

/* layout */
.auth-main{flex:1;display:grid;grid-template-columns:minmax(400px,520px) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start;width:100%;max-width:1200px;margin:0 auto;padding:clamp(4px,1.5vh,24px) clamp(18px,4vw,44px) 44px}
.auth-col{display:grid;gap:0;justify-items:center}

/* logo sopra la card */
.auth-logo{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:18px;text-decoration:none;color:var(--text)}
.auth-logo .mark{width:46px;height:46px}
.auth-logo .wordmark{font-family:'Sora',-apple-system,sans-serif;font-size:1.25rem;letter-spacing:-.02em}
.auth-logo .wordmark span{font-weight:450}.auth-logo .wordmark b{font-weight:700}

/* form card */
.auth-card{width:100%;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(26px,3.4vw,38px);box-shadow:0 24px 60px rgba(3,5,12,.35)}
.auth-card h1{font-family:'Sora',-apple-system,sans-serif;font-weight:600;font-size:clamp(1.3rem,2.2vw,1.55rem);letter-spacing:-.02em;line-height:1.25;text-align:center}
.auth-card .sub{color:var(--muted);font-size:.92rem;margin-top:8px;text-align:center}
.auth-card .sub a{color:var(--accent);text-decoration:none}
.auth-card .sub a:hover{text-decoration:underline}

.afield{display:grid;gap:6px;margin-top:16px}
.afield label{font-size:.82rem;color:var(--muted);font-weight:500}
.afield input{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font:inherit;font-size:.95rem;color:var(--text);width:100%;transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}
.afield input::placeholder{color:rgba(147,160,189,.45)}
.afield input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,227,194,.15)}
.afield .hint{font-size:.78rem;color:rgba(147,160,189,.7)}
.arow{display:flex;align-items:center;justify-content:space-between;margin-top:10px;font-size:.85rem}
.arow a{color:var(--muted);text-decoration:none}
.arow a:hover{color:var(--text)}
.auth-card .btn-cta{width:100%;justify-content:center;margin-top:18px;padding:13px 18px;font-size:1rem}
.auth-trust{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:15px;font-size:.8rem;color:var(--muted)}
.auth-trust span{display:flex;align-items:center;gap:6px}
.auth-trust .ic{width:14px;height:14px;stroke:var(--accent);stroke-width:1.8;fill:none;stroke-linecap:round}
.auth-note{display:none;margin-top:14px;border:1px solid rgba(231,169,60,.5);background:rgba(231,169,60,.08);border-radius:12px;padding:12px 14px;font-size:.88rem;color:var(--muted)}
.auth-note.show{display:block}
.auth-note a{color:var(--accent);text-decoration:none}
.legal{margin-top:14px;font-size:.76rem;color:rgba(147,160,189,.65);text-align:center}

/* ===== visual panel: SEMPRE dark, finestra-prodotto ===== */
.auth-visual{position:relative;border-radius:var(--r-lg);border:1px solid rgba(147,160,189,.18);color:#E6EAF5;background:
  radial-gradient(70% 55% at 78% 8%,rgba(109,92,255,.22),transparent 62%),
  radial-gradient(55% 45% at 12% 96%,rgba(37,227,194,.12),transparent 62%),
  radial-gradient(45% 40% at 30% 30%,rgba(46,124,246,.14),transparent 66%),
  #070A14;
  overflow:hidden;display:flex;flex-direction:column;gap:18px;padding:clamp(24px,3vw,36px);position:sticky;top:20px;height:min(88vh,760px)}
.auth-visual::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(147,160,189,.14) 1px,transparent 1.4px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(80% 70% at 50% 30%,black,transparent 85%);
  mask-image:radial-gradient(80% 70% at 50% 30%,black,transparent 85%)}
.auth-visual>*{position:relative}
.av-kicker{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:#8E9BB8}
.av-title{font-family:'Sora',sans-serif;font-weight:600;font-size:clamp(1.2rem,1.9vw,1.55rem);letter-spacing:-.015em;margin-top:8px;max-width:24ch;line-height:1.3;color:#E6EAF5}
.av-scene{align-self:center;width:min(58%,330px);margin:auto 0}
.av-facts{display:flex;gap:8px;flex-wrap:wrap}
.av-facts span{border:1px solid rgba(147,160,189,.22);background:rgba(5,7,15,.55);border-radius:999px;padding:6px 13px;font-size:.8rem;color:#8E9BB8}
.av-facts b{color:#E6EAF5;font-weight:600}

/* terminale nel pannello (prodotto vero, non decorazione) */
.av-term{background:rgba(5,7,15,.72);border:1px solid rgba(147,160,189,.18);border-radius:14px;overflow:hidden;backdrop-filter:blur(4px)}
.av-term .tbar{display:flex;align-items:center;gap:6px;padding:9px 13px;border-bottom:1px solid rgba(147,160,189,.14)}
.av-term .tbar i{width:9px;height:9px;border-radius:50%;background:rgba(147,160,189,.3)}
.av-term .tbar i:nth-child(1){background:#E5646E}.av-term .tbar i:nth-child(2){background:#E7A93C}.av-term .tbar i:nth-child(3){background:#3ECF8E}
.av-term .tbar span{margin-left:6px;font-family:ui-monospace,Menlo,monospace;font-size:.72rem;color:#8E9BB8}
.av-term pre{margin:0;padding:12px 14px;font-family:ui-monospace,Menlo,monospace;font-size:.76rem;line-height:1.65;color:#8E9BB8;overflow-x:auto;white-space:pre}
.av-term .c1{color:#E6EAF5}
.av-term .c2{color:#25E3C2}
.av-term .c3{color:#5E6A85}

/* scena orbite */
.qa-orbit{fill:none;stroke-width:1.6;transform-origin:110px 90px}
.qa-o1{stroke:var(--q1);opacity:.85;animation:qa-spin 9s linear infinite;transform:scaleY(.42) rotate(0deg)}
.qa-o2{stroke:var(--q2);opacity:.85;animation:qa-spin2 13s linear infinite;transform:scaleY(.42) rotate(58deg)}
.qa-o3{stroke:var(--magenta);opacity:.55;animation:qa-spin3 17s linear infinite;transform:scaleY(.42) rotate(118deg)}
.qa-core{fill:var(--accent);animation:qa-pulse 3.2s var(--ease) infinite}
.qa-sat{fill:#E6EAF5;opacity:.85}
.qa-row{stroke:var(--accent);stroke-width:3;stroke-linecap:round;opacity:.9}
.qa-row2{stroke:rgba(147,160,189,.55)}
.qa-beam{stroke:rgba(37,227,194,.4);stroke-width:1.2;stroke-dasharray:3 5;animation:qa-flow 2.6s linear infinite}
@keyframes qa-spin{to{transform:scaleY(.42) rotate(360deg)}}
@keyframes qa-spin2{from{transform:scaleY(.42) rotate(58deg)}to{transform:scaleY(.42) rotate(418deg)}}
@keyframes qa-spin3{from{transform:scaleY(.42) rotate(118deg)}to{transform:scaleY(.42) rotate(478deg)}}
@keyframes qa-pulse{0%,100%{opacity:.85}50%{opacity:1}}
@keyframes qa-flow{to{stroke-dashoffset:-16}}

/* FAQ/SEO sotto la card — quieta e compatta */
.auth-faq{width:100%;max-width:520px;margin:22px auto 0}
.auth-faq h2{font-size:.9rem;font-weight:600;color:var(--muted);margin:20px 0 4px}
.auth-faq>p{color:var(--muted);font-size:.88rem;max-width:60ch;padding:2px 2px 4px}
.auth-faq details{border-bottom:1px solid var(--line);padding:9px 2px}
.auth-faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px}
.auth-faq summary::-webkit-details-marker{display:none}
.auth-faq summary h3{font-size:.9rem;font-weight:550;display:inline}
.auth-faq summary::after{content:"+";margin-left:auto;color:var(--muted)}
.auth-faq details[open] summary::after{content:"−"}
.auth-faq p{color:var(--muted);font-size:.86rem;padding:8px 0 4px;max-width:60ch}

/* footer slim */
.auth-foot{display:flex;align-items:center;gap:18px;padding:16px clamp(18px,4vw,44px);border-top:1px solid var(--line);font-size:.82rem;color:var(--muted);flex-wrap:wrap}
.auth-foot a{color:var(--muted);text-decoration:none}
.auth-foot a:hover{color:var(--text)}
.auth-foot .cr{margin-left:auto}

@media (prefers-reduced-motion:reduce){
  .qa-o1,.qa-o2,.qa-o3,.qa-core,.qa-beam{animation:none}
}
@media (max-width:920px){
  .auth-main{grid-template-columns:1fr;max-width:600px}
  .auth-visual{order:2;gap:14px;position:static;height:auto}
  .av-scene{width:min(52%,280px);margin:6px 0}
}
@media (max-width:520px){
  .auth-top .to-site{display:none}
  .auth-card{padding:22px 18px}
  .av-term pre{font-size:.7rem}
}