/* ==============================
   VARIABLES.CSS (BASE)
   Sito: Base Website (riutilizzabile)
   Ultimo aggiornamento: 2025-12-17
   ============================== */

@font-face {
  font-family: "Cabinet Grotesk";
  src: url("../fonts/CabinetGrotesk-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ● colori */
  --color-primary: #47cf73;
  --color-secondary: #2c303a;
  --color-accent: #e4d944;
  --color-bg: #131417;
  --color-bg-variant: #17191d;
  --color-text: #ffffff;

  /* ● tipografia */
  --font-primary: "Cabinet Grotesk", system-ui, -apple-system, "Segoe UI",
    Roboto, Arial, sans-serif;
  --font-secondary: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto,
    Arial, sans-serif;

  /* ● font sizes */
  --fs-1: 3.875rem; /* 62px */
  --fs-2: 2.75rem; /* 44px */
  --fs-3: 2.125rem; /* 34px */
  --fs-4: 1.5rem; /* 24px */
  --fs-5: 1.125rem; /* 18px */
  --fs-6: 0.875rem; /* 14px */

  /* ● font weight */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --fw-black: 900;
}
@media (min-width: 900px) {
  :root {
    /* Font sizes – Desktop */
    --fs-2: 3.875rem;
  }
}