/* eeever.it - token di design
   Fonte: dev/04-token-design.css del repository di progetto. Non modificare qui senza
   aggiornare anche quel file. Le combinazioni vietate sono commentate: non sono preferenze,
   sono contrasti misurati. */

:root{
  /* primari: gli alias Elementor tengono allineate pagine nuove e brand kit */
  --eee-notte:var(--e-global-color-00c9c34,#08074E);
  --eee-brand:var(--e-global-color-a3ba570,#2D2185);
  --eee-blu:var(--eee-brand);
  --eee-verde:#29F9AB;      /* accento: SOLO su fondo blu o scuro. Su bianco fa 1,38 di contrasto */

  /* secondari */
  --eee-scuro:var(--eee-notte);
  --eee-bianco:#FFFFFF;
  --eee-grigio:rgba(255,255,255,.075);

  /* terziari: barre, grafici, oggetti. MAI come testo */
  --eee-arancio:#FD6A21;
  --eee-giallo:#FFDF32;
  --eee-fucsia:#FC3899;

  /* ruoli */
  --eee-bg:var(--eee-notte);
  --eee-testo:#FFFFFF;
  --eee-muted:rgba(255,255,255,.72);
  --eee-su-blu:#FFFFFF;
  --eee-muted-su-blu:rgba(255,255,255,.66);
  --eee-bordo:rgba(255,255,255,.16);

  /* tipografia: i font sono serviti localmente da Perfmatters, niente CDN */
  --eee-font-body:'Poppins',-apple-system,'Segoe UI',Roboto,sans-serif;
  --eee-font-title:'MuseoModerno','Poppins',-apple-system,sans-serif;

  /* scala */
  --eee-h1:clamp(2.1rem,5vw,3.4rem);
  --eee-h2:clamp(1.6rem,3.2vw,2.4rem);
  --eee-h3:1.15rem;
  --eee-corpo:1rem;
  --eee-intro:1.12rem;
  --eee-micro:.72rem;

  /* forma */
  --eee-r:14px;
  --eee-r-s:9px;
  --eee-pill:999px;
  --eee-max:1120px;
  --eee-colonna:65ch;
}

/* ---------- base ---------- */
.eee-pagina{background:var(--eee-bg);color:var(--eee-testo);font-family:var(--eee-font-body);line-height:1.6}
.eee-pagina h1,.eee-pagina h2{font-family:var(--eee-font-title);font-weight:600;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}
.eee-pagina h1{font-size:var(--eee-h1)}
.eee-pagina h2{font-size:var(--eee-h2)}
.eee-pagina h3,.eee-pagina h4{font-family:var(--eee-font-body);font-weight:600;line-height:1.3}
.eee-pagina h3{font-size:var(--eee-h3)}
.eee-pagina p{max-width:var(--eee-colonna)}
.eee-wrap{max-width:var(--eee-max);margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem)}
.eee-kicker{font-size:var(--eee-micro);font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--eee-muted)}
.eee-filetto{width:56px;height:3px;background:var(--eee-verde);border-radius:2px}

/* ---------- sezioni ---------- */
.eee-sezione-blu{background:var(--eee-blu);color:var(--eee-su-blu)}
.eee-sezione-scura{background:var(--eee-scuro);color:var(--eee-su-blu)}
.eee-sezione-blu .eee-muted,.eee-sezione-scura .eee-muted{color:var(--eee-muted-su-blu)}
.eee-sezione-blu .eee-kicker,.eee-sezione-scura .eee-kicker{color:var(--eee-muted-su-blu)}
/* il verde come TESTO esiste solo qui dentro. Non spostare questa regola fuori. */
.eee-sezione-blu .eee-evidenza,.eee-sezione-scura .eee-evidenza{color:var(--eee-verde)}

/* ---------- bottoni ---------- */
.eee-btn{background:var(--eee-verde);color:var(--eee-scuro);font-weight:600;border-radius:var(--eee-pill);
         padding:.9rem 1.7rem;display:inline-block;text-decoration:none;transition:transform .15s}
.eee-btn:hover{transform:translateY(-2px)}
/* variante contorno: usare SOLO dentro .eee-sezione-blu o .eee-sezione-scura */
.eee-btn-ghost{background:none;border:1.5px solid var(--eee-verde);color:var(--eee-verde)}
.eee-btn-blu{background:var(--eee-notte);color:#fff}

/* ---------- card ---------- */
.eee-card{background:rgba(255,255,255,.075);color:#fff;border:1px solid var(--eee-bordo);border-radius:var(--eee-r);padding:1.6rem}
.eee-card-verde{background:var(--eee-verde);color:var(--eee-scuro);border-radius:var(--eee-r);padding:1.6rem}
.eee-card-scura{background:var(--eee-scuro);color:#fff;border-radius:var(--eee-r);padding:1.6rem}

/* ---------- kpi ---------- */
.eee-kpi{font-size:clamp(2.2rem,5vw,3.4rem);font-weight:700;line-height:1;font-variant-numeric:tabular-nums}
.eee-kpi-label{font-size:var(--eee-micro);text-transform:uppercase;letter-spacing:.1em;color:var(--eee-muted)}

/* ---------- griglie ---------- */
.eee-griglia{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

/* ---------- elenchi ---------- */
.eee-lista{list-style:none;padding:0}
.eee-lista li{position:relative;padding-left:1.4rem;margin-bottom:.6rem}
.eee-lista li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;
                      border-radius:50%;background:var(--eee-verde)}
.eee-sezione-blu .eee-lista li::before,.eee-sezione-scura .eee-lista li::before{background:var(--eee-verde)}

/* ---------- tabelle ---------- */
.eee-scroll{overflow-x:auto}
.eee-tabella{border-collapse:collapse;width:100%}
.eee-tabella th,.eee-tabella td{padding:.65rem .85rem;text-align:left;border-bottom:1px solid var(--eee-bordo)}
.eee-tabella th{font-size:var(--eee-micro);text-transform:uppercase;letter-spacing:.08em;color:var(--eee-muted);font-weight:600}
.eee-tabella td.n,.eee-tabella th.n{text-align:right;font-variant-numeric:tabular-nums}

/* ---------- accessibilita' ---------- */
.eee-pagina :focus-visible{outline:2px solid var(--eee-verde);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.eee-pagina *{animation:none!important;transition:none!important}}
.eee-pagina img{max-width:100%;height:auto}
