/*
Design token di VisitCaprarola.

Questo file dichiara SOLO custom properties: finche qualcosa non le consuma non
produce alcun effetto visivo. E il vocabolario condiviso su cui poggeranno le
fasi successive (griglia, esperienza mobile, redesign).

I valori replicano cio che il tema gia usa: i colori sono quelli piu ricorrenti
in library/css/style.css, le spaziature sono multipli del gutter di Foundation,
le metriche di griglia vengono dal foundation.css in produzione, che e stato
modificato a mano e ha .row a 80.8rem invece dei 62.5rem standard.

Struttura ispirata a Design Tokens Italia (github.com/italia/design-tokens-italia),
ridotta alle sole voci che il progetto usa davvero: importarne 299 per usarne
dieci sarebbe solo peso morto.
*/

:root {
	/* ---------------------------------------------------------------
	   Colore — rilevati da library/css/style.css, per frequenza d'uso
	   --------------------------------------------------------------- */
	--vc-colore-sfondo: #ffffff;
	--vc-colore-testo: #000000;
	--vc-colore-testo-tenue: #868787;
	--vc-colore-testo-attenuato: #999999;

	--vc-colore-blu-scuro: #11273d;
	--vc-colore-blu: #374a66;
	--vc-colore-blu-acceso: #007095;
	--vc-colore-ardesia: #5e6b76;
	--vc-colore-ambra: #f39207;

	--vc-colore-bordo: #cecece;
	--vc-colore-bordo-tenue: #eeeeee;

	/* Usato oggi solo per msapplication-TileColor in header.php */
	--vc-colore-evidenza: #f01d4f;

	/* ---------------------------------------------------------------
	   Tipografia
	   --------------------------------------------------------------- */
	--vc-font-testo: 'Titillium Web', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--vc-font-titoli: 'Signika', 'Titillium Web', sans-serif;
	--vc-font-serif: 'Droid Serif', Georgia, serif;

	--vc-peso-leggero: 300;
	--vc-peso-normale: 400;
	--vc-peso-medio: 600;
	--vc-peso-grassetto: 700;

	--vc-interlinea-stretta: 1.25;
	--vc-interlinea: 1.5;
	--vc-interlinea-ampia: 1.7;

	/* ---------------------------------------------------------------
	   Spaziatura — multipli del gutter di Foundation (0.9375rem = 15px)
	   --------------------------------------------------------------- */
	--vc-spazio-1: 0.46875rem;   /*  7.5px */
	--vc-spazio-2: 0.9375rem;    /*   15px */
	--vc-spazio-3: 1.40625rem;   /* 22.5px */
	--vc-spazio-4: 1.875rem;     /*   30px */
	--vc-spazio-6: 2.8125rem;    /* 45px   */
	--vc-spazio-8: 3.75rem;      /*   60px */

	/* ---------------------------------------------------------------
	   Griglia — valori del foundation.css IN PRODUZIONE.
	   Attenzione: quel file e stato modificato a mano. Il max-width
	   standard di Foundation 5 sarebbe 62.5rem; qui e 80.8rem, con i
	   valori originali lasciati commentati nel file.
	   --------------------------------------------------------------- */
	--vc-griglia-colonne: 12;
	--vc-griglia-gutter: 0.9375rem;
	--vc-griglia-max-width: 80.8rem;

	/* ---------------------------------------------------------------
	   Breakpoint — qui solo come riferimento leggibile.
	   Le media query NON possono usare var(): in vc-grid.css i valori
	   sono ripetuti letteralmente. Se cambi qui, cambia anche la.
	   --------------------------------------------------------------- */
	--vc-bp-small-max: 40em;      /*  640px */
	--vc-bp-medium-min: 40.063em; /*  641px */
	--vc-bp-large-min: 64.063em;  /* 1025px */

	/* ---------------------------------------------------------------
	   Forme e profondita
	   --------------------------------------------------------------- */
	--vc-raggio-0: 0;
	--vc-raggio-1: 3px;
	--vc-raggio-2: 6px;
	--vc-raggio-pieno: 999px;

	--vc-ombra-1: 0 1px 3px rgba(0, 0, 0, 0.12);
	--vc-ombra-2: 0 4px 12px rgba(0, 0, 0, 0.15);
	--vc-ombra-3: 0 10px 30px rgba(0, 0, 0, 0.18);

	/* Bersaglio tattile minimo raccomandato (WCAG 2.2 - 2.5.8) */
	--vc-tocco-minimo: 44px;
}
