/* avvocato.co — foglio di stile unico.
   Principi: un elenco si legge di fretta e quasi sempre dal telefono.
   Le due etichette di abilitazione devono distinguersi a colpo d'occhio,
   perché sono l'unica informazione che il lettore non deve fraintendere.
   Nessun tracciamento, nessuna risorsa di terzi, un solo file. */

:root{
  --bg:#F2F1EE;
  --surface:#FFFFFF;
  --surface-2:#F8F7F4;
  --ink:#16181D;
  --ink-2:#454A54;
  --muted:#767C88;
  --rule:#DFDDD7;
  --rule-2:#C4C1B8;

  --accent:#1F3A5F;          /* blu d'inchiostro: intestazioni, collegamenti */
  --accent-soft:#E3E9F1;
  --ordine:#6B4A12;          /* bronzo: iscrizione a un Ordine italiano */
  --ordine-soft:#F3EADA;
  --estera:#1D5A52;          /* verde ottone: abilitazione straniera */
  --estera-soft:#DCEBE7;

  --serif:Charter,"Bitstream Charter","Iowan Old Style",Georgia,"Noto Serif","Liberation Serif",serif;
  --sans:'Inter',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  --misura:38rem;
  --pad:clamp(1.1rem,5vw,2rem);
  --largo:64rem;
}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#121418;
    --surface:#1A1D23;
    --surface-2:#22262D;
    --ink:#E9EAED;
    --ink-2:#B6BAC3;
    --muted:#858B96;
    --rule:#2C3039;
    --rule-2:#414651;
    --accent:#8FB3DE;
    --accent-soft:#1B2634;
    --ordine:#D9B472;
    --ordine-soft:#2B2314;
    --estera:#7FCBBC;
    --estera-soft:#122622;
  }
}
:root[data-theme="dark"]{
  --bg:#121418; --surface:#1A1D23; --surface-2:#22262D;
  --ink:#E9EAED; --ink-2:#B6BAC3; --muted:#858B96;
  --rule:#2C3039; --rule-2:#414651;
  --accent:#8FB3DE; --accent-soft:#1B2634;
  --ordine:#D9B472; --ordine-soft:#2B2314;
  --estera:#7FCBBC; --estera-soft:#122622;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto}
a{color:var(--accent);text-underline-offset:.15em}
a:hover{text-decoration-thickness:2px}

.salta{position:absolute;left:-9999px;top:0;background:var(--accent);color:#fff;padding:.6rem 1rem;z-index:20}
.salta:focus{left:.5rem;top:.5rem}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

.int{width:min(100% - 2*var(--pad),var(--largo));margin-inline:auto}

/* ---------- testata ---------- */
.testata{background:var(--surface);border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:10}
.testata-int{
  width:min(100% - 2*var(--pad),var(--largo));margin-inline:auto;
  display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;align-items:center;
  padding:.7rem 0;
}
.marchio{
  font-family:var(--serif);font-size:1.35rem;font-weight:600;
  color:var(--ink);text-decoration:none;letter-spacing:-.01em;margin-right:auto;
}
.marchio span{color:var(--muted);font-weight:400}
.menu{display:flex;flex-wrap:wrap;gap:.15rem .35rem;align-items:center}
.menu a{
  color:var(--ink-2);text-decoration:none;font-size:.94rem;font-weight:500;
  padding:.45rem .6rem;border-radius:.35rem;
}
.menu a:hover{background:var(--surface-2);color:var(--ink)}
.menu a.attivo{color:var(--accent);background:var(--accent-soft)}
.menu-cta{
  background:var(--accent)!important;color:var(--surface)!important;
  border-radius:.35rem;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .menu-cta{color:#121418!important}
}
:root[data-theme="dark"] .menu-cta{color:#121418!important}

/* ---------- apertura ---------- */
.apertura{background:var(--surface);border-bottom:1px solid var(--rule);padding:clamp(2rem,7vw,3.6rem) 0}
.apertura h1{
  font-family:var(--serif);font-weight:600;letter-spacing:-.015em;
  font-size:clamp(1.7rem,5.2vw,2.7rem);line-height:1.15;margin:0 0 .8rem;
  max-width:20ch;
}
.occhiello{color:var(--ink-2);max-width:var(--misura);margin:0 0 .9rem;font-size:1.06rem}
.conteggio{color:var(--muted);font-size:.92rem;margin:0;font-variant-numeric:tabular-nums}

h2{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;font-size:clamp(1.25rem,3.4vw,1.6rem);margin:0 0 .9rem}

/* ---------- paesi in pillole ---------- */
.fascia-paesi{padding:1.8rem 0;border-bottom:1px solid var(--rule)}
.pills{display:flex;flex-wrap:wrap;gap:.5rem}
.pill{
  display:inline-flex;align-items:center;gap:.45rem;
  background:var(--surface);border:1px solid var(--rule-2);border-radius:2rem;
  padding:.4rem .85rem;text-decoration:none;color:var(--ink);font-size:.94rem;font-weight:500;
}
.pill:hover{border-color:var(--accent);color:var(--accent)}
.pill span{color:var(--muted);font-size:.82rem;font-variant-numeric:tabular-nums}

/* ---------- ricerca ---------- */
.elenco{padding:2rem 0}
.cerca{margin:0 0 1.4rem;max-width:var(--misura)}
.cerca label{display:block;font-size:.88rem;color:var(--muted);margin-bottom:.35rem}
.cerca input{
  width:100%;min-width:0;
  font:inherit;font-size:1.02rem;
  padding:.7rem .85rem;
  background:var(--surface);color:var(--ink);
  border:1px solid var(--rule-2);border-radius:.45rem;
}
.cerca input:focus{border-color:var(--accent)}
.cerca-esito{margin:.45rem 0 0;font-size:.86rem;color:var(--muted);min-height:1.2em}

/* ---------- schede ---------- */
.schede{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,20rem),1fr))}
.scheda{
  background:var(--surface);border:1px solid var(--rule);border-radius:.6rem;
  padding:1.1rem 1.15rem;
}
.scheda[hidden]{display:none!important}
.scheda-nome{font-family:var(--serif);font-size:1.2rem;font-weight:600;margin:0 0 .15rem;line-height:1.25}
.scheda-nome a{color:var(--ink);text-decoration:none}
.scheda-nome a:hover{color:var(--accent);text-decoration:underline}
.scheda-studio{margin:0 0 .1rem;font-size:.92rem;color:var(--ink-2)}
.scheda-luogo{margin:0 0 .7rem;font-size:.88rem;color:var(--muted)}

/* ---------- etichette di abilitazione ---------- */
.ets{list-style:none;margin:0 0 .75rem;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.et{
  font-size:.8rem;font-weight:500;line-height:1.35;
  padding:.25rem .55rem;border-radius:.3rem;
  border:1px solid transparent;
}
.et-ordine{background:var(--ordine-soft);color:var(--ordine);border-color:color-mix(in srgb,var(--ordine) 30%,transparent)}
.et-estera{background:var(--estera-soft);color:var(--estera);border-color:color-mix(in srgb,var(--estera) 30%,transparent)}
.ets-grande .et{font-size:.9rem;padding:.35rem .7rem}
.ets-esempio{margin-bottom:1.2rem}

/* ---------- materie ---------- */
.tags{margin:0;display:flex;flex-wrap:wrap;gap:.3rem}
.tag{
  font-size:.8rem;text-decoration:none;color:var(--ink-2);
  background:var(--surface-2);border:1px solid var(--rule);
  padding:.2rem .5rem;border-radius:.3rem;
}
.tag:hover{color:var(--accent);border-color:var(--accent)}

.niente{margin:1.2rem 0 0;color:var(--ink-2)}
.niente[hidden]{display:none!important}

/* ---------- richiamo ---------- */
.richiamo{background:var(--surface);border-top:1px solid var(--rule);padding:2.4rem 0}
.richiamo p{color:var(--ink-2);max-width:var(--misura)}
.bottone{
  display:inline-block;background:var(--accent);color:var(--surface);
  text-decoration:none;font-weight:600;padding:.65rem 1.2rem;border-radius:.4rem;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .bottone{color:#121418}
}
:root[data-theme="dark"] .bottone{color:#121418}

/* ---------- teste di sezione, indici ---------- */
.testa-sezione{background:var(--surface);border-bottom:1px solid var(--rule);padding:2rem 0 1.8rem}
.testa-sezione h1{font-family:var(--serif);font-weight:600;letter-spacing:-.015em;
  font-size:clamp(1.5rem,4.4vw,2.2rem);line-height:1.2;margin:0 0 .6rem}
.briciole{font-size:.86rem;color:var(--muted);margin:0 0 .5rem}
.briciole a{color:var(--muted)}

.indice{list-style:none;margin:2rem 0;padding:0;display:grid;gap:.1rem}
.indice li{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem;
  padding:.7rem 0;border-bottom:1px solid var(--rule);
}
.indice a{font-weight:500;text-decoration:none;font-size:1.05rem}
.indice a:hover{text-decoration:underline}
.conta{color:var(--muted);font-size:.84rem;font-variant-numeric:tabular-nums}
.indice-desc{flex-basis:100%;color:var(--ink-2);font-size:.9rem}

/* ---------- profilo ---------- */
.profilo{padding:2rem 0 3rem}
.profilo h1{font-family:var(--serif);font-weight:600;letter-spacing:-.015em;
  font-size:clamp(1.6rem,4.6vw,2.3rem);line-height:1.15;margin:0 0 .2rem}
.profilo-studio{margin:0 0 1rem;color:var(--ink-2);font-size:1.05rem}
.profilo-note{max-width:var(--misura);color:var(--ink-2);margin:1.2rem 0}
.dati{
  margin:1.6rem 0;padding:1.1rem 1.2rem;
  background:var(--surface);border:1px solid var(--rule);border-radius:.6rem;
  display:grid;gap:.75rem;
}
.dato{display:grid;grid-template-columns:7.5rem 1fr;gap:.2rem .9rem;align-items:baseline}
.dato dt{color:var(--muted);font-size:.85rem;margin:0}
.dato dd{margin:0}
@media (max-width:30rem){.dato{grid-template-columns:1fr}}
.verifica{font-size:.86rem;color:var(--muted);margin:1.4rem 0 0;max-width:var(--misura)}

/* ---------- testo lungo ---------- */
.testo{padding:2rem 0 3rem;max-width:var(--misura)}
.testo h2{margin:2rem 0 .7rem}
.testo h2:first-child{margin-top:0}
.testo p,.testo ul{color:var(--ink-2)}
.testo ul{padding-left:1.15rem}
.testo li{margin:.3rem 0}
.testo strong{color:var(--ink)}

/* ---------- piede ---------- */
.pieda{background:var(--surface);border-top:1px solid var(--rule);margin-top:3rem;padding:2rem 0 2.6rem}
.pieda-int{width:min(100% - 2*var(--pad),var(--largo));margin-inline:auto}
.pieda-avviso{max-width:var(--misura);color:var(--ink-2);font-size:.92rem;margin:0 0 1.2rem}
.pieda-avviso strong{color:var(--ink)}
.pieda-menu{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;margin-bottom:1rem}
.pieda-menu a{font-size:.9rem;color:var(--ink-2);text-decoration:none}
.pieda-menu a:hover{color:var(--accent);text-decoration:underline}
.pieda-credito{font-size:.86rem;color:var(--muted);margin:0}

/* voce di indice quando l'elenco è ancora vuoto */
.indice li.vuoto{color:var(--ink-2);border-bottom:none;padding-top:0}
