/*
 * Design tokens — unpodavedere.it
 * Valori presi dall'handoff di design. Non inventare colori o spaziature
 * fuori da questa scala: la coerenza del sito dipende da qui.
 */

:root {
	/* --- Colori --- */
	--c-nero: #1A1917;          /* nero caldo: fondi scuri, testo principale */
	--c-nero-profondo: #111010; /* footer mobile, secondo livello */
	--c-campo: #151412;         /* fondo campi form su scuro */
	--c-testo: #3A3833;         /* corpo su fondo chiaro */
	--c-taupe: #5C584F;         /* testo secondario */
	--c-grigio: #8A857A;        /* label, meta, stati spenti */
	--c-grigio-chiaro: #B5AF9F; /* testo spento nei placeholder immagine */
	--c-oro: #B8956A;           /* accenti, spunte, bordi attivi, CTA WhatsApp */
	--c-su-scuro: #C9C4B8;      /* testo su fondo scuro */
	--c-crema: #EAD5B6;         /* fondi caldi: libri, mercatino, form "simile" */
	--c-contenitore: #F1EEE7;   /* fondo contenitori immagine e sezioni chiare */
	--c-divisore: #E2DED5;
	--c-bordo: #D8D2C6;
	--c-pagina: #FAFAF8;

	/* --- Tipografia --- */
	--f-display: 'Fraunces', Georgia, 'Times New Roman', serif;
	--f-testo: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	/* Scala display */
	--t-62: 3.875rem; --t-56: 3.5rem;  --t-52: 3.25rem; --t-42: 2.625rem;
	--t-40: 2.5rem;   --t-38: 2.375rem; --t-34: 2.125rem; --t-30: 1.875rem;
	--t-26: 1.625rem; --t-24: 1.5rem;  --t-22: 1.375rem; --t-20: 1.25rem;
	--t-19: 1.1875rem;

	/* Scala corpo */
	--t-18: 1.125rem; --t-17: 1.0625rem; --t-16: 1rem;    --t-15: 0.9375rem;
	--t-14: 0.875rem; --t-13: 0.8125rem; --t-12: 0.75rem; --t-11: 0.6875rem;
	--t-10: 0.625rem;

	/* --- Spaziature --- */
	--s-3: 3px;   --s-4: 4px;   --s-6: 6px;   --s-8: 8px;   --s-10: 10px;
	--s-12: 12px; --s-14: 14px; --s-18: 18px; --s-20: 20px; --s-22: 22px;
	--s-26: 26px; --s-28: 28px; --s-32: 32px; --s-40: 40px; --s-48: 48px;
	--s-56: 56px; --s-64: 64px; --s-72: 72px; --s-80: 80px; --s-88: 88px;
	--s-96: 96px;

	/* Padding di sezione */
	--pad-sezione: var(--s-48);

	/* --- Radius: 2px sui bottoni, 999px sui chip, 0 su tutto il resto --- */
	--r-bottone: 2px;
	--r-chip: 999px;

	/* --- Ombre: solo due in tutto il sito --- */
	--ombra-opera: 0 18px 40px rgba(26, 25, 23, .14);

	/* --- Transizioni --- */
	--tr: 170ms ease-out;
}

@media (max-width: 860px) {
	:root {
		--pad-sezione: var(--s-20);
		--t-62: 2.5rem;
		--t-56: 2.25rem;
		--t-52: 2.125rem;
		--t-42: 1.875rem;
	}
}