/* ================
   AZ Medica – Design Tokens → CSS Variables + Utilities
   Fonte: Penpot token JSON (Optima titoli, Lato paragrafi, palette #117070 / #6EBC7F / grigi)
   ================ */

/* Webfonts: sostituisci gli URL con i tuoi file se li hai */
@font-face{
  font-family: "Optima";
  src: local("Optima"), 
       url("fonts/optima/OPTIMA.woff2") format("woff2"),
       url("fonts/optima/OPTIMA.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Optima";
  src: local("Optima Italic"),
       url("fonts/optima/Optima_Italic.woff2") format("woff2"),
       url("fonts/optima/Optima_Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face{
  font-family: "Optima";
  src: url("fonts/optima/Optima-Medium.woff2") format("woff2"),
       url("fonts/optima/Optima-Medium.woff") format("woff"); /* rinominato senza spazi */
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Optima";
  src: local("Optima Bold"),
       url("fonts/optima/OPTIMA_B.woff2") format("woff2"),
       url("fonts/optima/OPTIMA_B.woff") format("woff");
  font-weight: 700;
  font-style: normal; /* <-- non 'bold' */
  font-display: swap;
}

@font-face{
  font-family: "Lato";
  src: local("Lato Regular"),
       url("fonts/lato/Lato-Regular.woff2") format("woff2"),
       url("fonts/lato/Lato-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Lato";
  src: local("Lato Italic"),
       url("fonts/lato/Lato-Italic.woff2") format("woff2"),
       url("fonts/lato/Lato-Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face{
  font-family: "Lato";
  src: local("Lato Bold"),
       url("fonts/lato/Lato-Bold.woff2") format("woff2"),
       url("fonts/lato/Lato-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Lato";
  src: local("Lato Bold Italic"),
       url("fonts/lato/Lato-BoldItalic.woff2") format("woff2"),
       url("fonts/lato/Lato-BoldItalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

:root{
  /* ===== Colors ===== */
  --color-primario: #117070;         /* bordo/text bold, hover menu, bottone secondario, testo outline */
  --color-verde-cuore: #6EBC7F;      /* separatori, sotto titoli, success, footer a:hover, bg button primario */
  --color-paragrafi: #333334;         /* testo paragrafi */
  --color-titoli: #000000;            /* titoli */
  --color-link: #117070;              /* link (non footer) */
  --color-link-visitato: #70a9a9;     /* link visitato */
  --color-errore: #B21E1C;            /* error */
  --color-warning: #ff9a30;           /* warning */
  --color-body: #f8f8f8;              /* sfondo body */
  --color-sfondo-chiaro: #d3ead8;     /* hero/card chiari */
  --color-sfondo-chiaro-hero: color-mix(in srgb, var(--color-sfondo-chiaro) 40%, transparent);
  --color-sfondo-chiaro-medio-hero: color-mix(in srgb, var(--color-sfondo-chiaro) 60%, transparent);
  --color-border: #CDCBCB;            /* contorni neutri (dal brand manual) */
  --color-precisazioni: #616162;      /* testo precisazioni */
  --color-grigi: #616162;             /* testo grigi */
  --color-bianco: #fff;               /* testo bianco */
  --color-accordtion-open: #cbc9c9;

  /* ===== Typography ===== */
  --ff-titoli: "Optima", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ff-paragrafi: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ff-li: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --fs-h1: 28px;
  --fs-h2: 26px;
  --fs-h3: 24px;
  --fs-h4: 22px;
  --fs-p: 20px;
  --fs-li: 20px;

  --fw-h: 600;  /* headings */
  --fw-nr: 400; /* normal */

  --letter-spacing: 0.05em;
  --h1-text-case: uppercase;

  /* ===== Radii & spacing ===== */
  --radius-btn: 5px;
  --radius-card: 14px;
  --space-1: .5rem;
  --space-2: .75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
}