/* ============================================================
   Veendo — foglio di stile del sito investitori
   Unica fonte per token e componenti. Ogni pagina importa questo.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
h1, h2, h3, h4, p, ol, ul, figure { margin: 0; }
ol, ul { padding: 0; }
table { border-spacing: 0; }
button, input { font: inherit; color: inherit; }
img, svg { max-width: 100%; display: block; }

:root {
  /* superfici */
  --bg:#0B0B0D; --fg:#F9FAFB;
  --surface:#111118; --surface-sm:#0E0E15; --surface-lg:#141421;
  --border:#1F2937; --border-hover:#374151; --muted:#D1D5DB;

  /* marchio */
  --lime:#A3C616; --teal:#67C1BB; --blue:#4085C6;
  --gradient:linear-gradient(135deg,#A3C616 0%,#67C1BB 50%,#4085C6 100%);

  /* servizio */
  --warning:#FAC800; --danger:#FB2C36;

  --font:'Lato',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --font-mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,"Roboto Mono",monospace;

  --r-card:16px; --r-field:12px; --r-pill:999px;
  --frame:1080px; --prose:62ch;
}

body {
  background:var(--bg); color:var(--fg); font-family:var(--font);
  font-size:17px; line-height:1.7; font-weight:400;
  -webkit-font-smoothing:antialiased;
}
.frame { max-width:var(--frame); margin-inline:auto; padding-inline:28px; }

/* ---------- reimposta lo stato "visitato" dei link ----------
   Senza queste righe il browser applica il proprio colore ai link già
   visitati (di norma un viola), con una precedenza superiore alle nostre
   classi. Ogni componente cliccabile ricorrente va reimpostato qui, una
   volta sola, invece che pagina per pagina. */
a, a:visited { color:inherit; text-decoration:none; }
.wordmark, .wordmark:visited { color:var(--fg); }
.navpill nav a, .navpill nav a:visited { color:var(--muted); }
.navpill nav a.on, .navpill nav a.on:visited { color:var(--fg); border-bottom-color:var(--lime); }
.btn-primary, .btn-primary:visited { color:#0B0B0D; }
.btn-secondary, .btn-secondary:visited { color:var(--fg); }
footer a, footer a:visited { color:var(--lime); }

/* ---------- tipografia ---------- */
.t-display{font-size:clamp(2.1rem,5.2vw,3.7rem);line-height:1.07;font-weight:900;letter-spacing:-.03em}
.t-h1{font-size:clamp(1.8rem,4.2vw,2.7rem);line-height:1.12;font-weight:900;letter-spacing:-.025em}
.t-h2{font-size:clamp(1.3rem,2.6vw,1.62rem);line-height:1.3;font-weight:700;letter-spacing:-.015em;max-width:26ch;text-wrap:balance}
.t-lead{font-size:20px;line-height:1.6;font-weight:300}
.lime{color:var(--lime)}
.gr{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.num{font-variant-numeric:tabular-nums}

p{color:var(--muted);max-width:var(--prose);margin:0 0 1.15em}
p:last-child{margin-bottom:0}
strong{color:var(--fg);font-weight:700}

/* ---------- atmosfera ---------- */
.glow{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0}
.glow-teal{background:var(--teal);opacity:.08}
.glow-blue{background:var(--blue);opacity:.07}

/* ---------- navbar a pillola ---------- */
.navwrap{position:sticky;top:16px;z-index:30;display:flex;justify-content:center;pointer-events:none}
.navpill{
  pointer-events:auto;display:flex;align-items:center;
  background:rgba(17,17,24,.92);backdrop-filter:blur(12px);
  border:2px solid var(--border);border-radius:var(--r-pill);
  padding:8px 18px;max-width:calc(100% - 32px);
}
.wordmark{font-size:16px;font-weight:900;letter-spacing:-.01em;white-space:nowrap;text-decoration:none;color:var(--fg)}
.wordmark i{color:var(--lime);font-style:normal}
.navpill nav{display:flex;gap:2px;margin-left:16px}
.navpill nav a{
  font-size:13px;font-weight:700;color:var(--muted);text-decoration:none;
  padding:8px 11px;border-bottom:2px solid transparent;white-space:nowrap;
}
.navpill nav a:hover{color:var(--fg)}
.navpill nav a.on{color:var(--fg);border-bottom-color:var(--lime)}
@media(max-width:860px){.navpill nav{display:none}}

/* ---------- menu compatto su schermi stretti ---------- */
.nav-toggle{
  display:none;margin-left:14px;background:transparent;border:2px solid var(--border-hover);
  border-radius:10px;width:38px;height:38px;align-items:center;justify-content:center;
  flex-direction:column;gap:4px;cursor:pointer;flex:none;padding:0;
}
.nav-toggle span{width:16px;height:2px;background:var(--fg);border-radius:1px;display:block}
.nav-toggle:focus-visible{outline:2px solid var(--lime);outline-offset:2px}

.nav-drop{
  display:none;position:fixed;top:70px;left:50%;transform:translateX(-50%);
  width:min(260px,calc(100% - 32px));z-index:29;flex-direction:column;gap:2px;
  background:rgba(17,17,24,.97);backdrop-filter:blur(12px);
  border:2px solid var(--border);border-radius:16px;padding:10px;
}
.nav-drop.aperto{display:flex}
.nav-drop a, .nav-drop a:visited{
  padding:12px 14px;border-radius:10px;font-size:14.5px;font-weight:700;
  color:var(--muted);text-decoration:none;
}
.nav-drop a:hover{color:var(--fg)}
.nav-drop a.on, .nav-drop a.on:visited{color:var(--fg);background:var(--surface-lg)}

@media(max-width:860px){.nav-toggle{display:flex}}

/* ---------- pill di sezione ---------- */
.pill{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid rgba(163,198,22,.35);color:var(--lime);
  text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:700;
  padding:6px 14px;border-radius:var(--r-pill);
}
.pill::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--lime)}

/* ---------- superfici ---------- */
.card{border:2px solid var(--border);border-radius:var(--r-card);background:var(--surface);padding:26px}
.card-flush{border:2px solid var(--border);border-radius:var(--r-card);background:var(--surface);overflow:hidden}

/* ---------- bottoni ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;
  border-radius:var(--r-pill);font-size:14.5px;font-weight:700;padding:0 24px;
  cursor:pointer;border:2px solid transparent;text-decoration:none;white-space:nowrap;
}
.btn-primary{background:var(--lime);color:#0B0B0D}
.btn-primary:hover{filter:brightness(1.06)}
.btn-secondary{background:transparent;border-color:var(--border-hover);color:var(--fg)}
.btn-secondary:hover{border-color:var(--fg)}
.btn-small{min-height:40px;padding:0 17px;font-size:13px}
.btn:focus-visible{outline:2px solid var(--lime);outline-offset:3px}

/* ---------- campi ---------- */
.field{
  background:var(--surface);border:2px solid var(--border);border-radius:var(--r-field);
  padding:0 16px;min-height:46px;font-size:14.5px;color:var(--fg);width:100%;
}
.field:focus{outline:none;border-color:var(--lime)}
.field::placeholder{color:var(--muted)}

/* ---------- sezioni ---------- */
section{padding-block:60px 16px;border-top:1px solid var(--border);position:relative;overflow:hidden}
section > .frame{position:relative;z-index:1}
.sec-h{display:flex;flex-direction:column;gap:14px;margin-bottom:28px}

/* ---------- tabelle ---------- */
.tbl{overflow-x:auto;margin:8px 0 6px}
table{border-collapse:collapse;width:100%;font-size:15px}
th,td{padding:12px 16px 12px 0;text-align:left;vertical-align:baseline}
thead th{
  font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  font-weight:700;border-bottom:2px solid var(--border);padding-bottom:10px;white-space:nowrap;
}
tbody tr{border-bottom:1px solid var(--border)}
tbody tr:last-child{border-bottom:0}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
td.dim{color:var(--muted);font-weight:400}

/* ---------- callout ---------- */
.banner{
  border-left:3px solid var(--lime);background:var(--surface);
  border-radius:0 var(--r-card) var(--r-card) 0;padding:18px 24px;margin:26px 0;
  font-size:15px;line-height:1.65;color:var(--muted);max-width:var(--prose);
}
.banner b{color:var(--fg)}
.banner.warn{border-left-color:var(--warning)}
.banner.blue{border-left-color:var(--blue)}

/* ---------- termini spiegati ---------- */
abbr.ac{text-decoration:none;border-bottom:1px dotted var(--border-hover);cursor:help;color:inherit}
abbr.ac:hover,abbr.ac:focus-visible{border-bottom-color:var(--lime);color:var(--fg)}
abbr.ac:focus-visible{outline:2px solid var(--lime);outline-offset:3px;border-radius:2px}
.gloss{
  position:absolute;z-index:50;pointer-events:none;opacity:0;transform:translate(-50%,-100%);
  background:var(--surface-sm);border:2px solid var(--border-hover);border-radius:var(--r-field);
  padding:12px 15px;max-width:min(330px,84vw);transition:opacity .12s;
  box-shadow:0 8px 28px rgba(0,0,0,.5);
}
.gloss.on{opacity:1}
.gloss .g-e{font-size:12.5px;font-weight:900;color:var(--lime);margin-bottom:5px;line-height:1.35}
.gloss .g-d{font-size:13.5px;line-height:1.5;color:var(--fg);font-weight:400}

/* ---------- avanzamento di lettura ---------- */
#progress{position:fixed;top:0;left:0;height:2px;background:var(--lime);width:0;z-index:40}

/* ---------- piè di pagina ---------- */
footer{
  padding-block:40px 68px;font-size:13px;color:var(--muted);
  line-height:1.75;border-top:1px solid var(--border);margin-top:60px;
}
footer p{max-width:70ch}
footer a{color:var(--lime)}

html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

@media print{
  .navwrap,#progress,.gloss,.glow{display:none!important}
  body{background:#fff;color:#111827;font-size:10.5pt}
  .card,.card-flush,.banner{border-color:#E5E7EB;background:#fff}
  p{color:#374151}
  .gr{background:none;color:#111827}
  abbr.ac{border-bottom:0}
  abbr.ac::after{content:" (" attr(data-exp) ")";color:#4B5563;font-size:.88em}
  @page{margin:16mm 13mm}
}