@font-face {
	font-family: "Aspekta";
	src: url("../fonts/Aspekta.woff2") format("woff2");
	font-style: normal;
	font-weight: 100 900; /* se il file è variabile */
	font-display: swap;
}

:root {
	/* Primitives */
	--color-bark: #423732;
	--color-taupe: #665954;
	--color-granite: #8e817b;
	--color-travertine: #bbafa9;
	--color-almond: #cec7c6;
	--color-dust: #d7d4d3;
	--color-alabaster: #e3dfde;
	--color-smoke: #ebeaea;
	--color-platinum: #d9dfe8;
	--color-slate: #c9d0de;
	--color-powder: #afc1dd;
	--color-lavender: #7b8fac;
	--color-glaucous: #607692;
	--color-dusk: #455c7a;

	/* Tokens */
	--color-surface-primary: var(--color-alabaster);
	--color-surface-secondary: var(--color-almond);
	--color-surface-inverted: var(--color-dusk);
	--color-text-primary: var(--color-bark);
	--color-text-secondary: var(--color-granite);
	--color-text-inverted: var(--color-alabaster);
	--color-border-primary: var(--color-travertine);
	--color-border-secondary: var(--color-granite);
	--color-border-inverted: var(--color-powder);
	--color-accent: #0969da;
	--color-accent-contrast: #ffffff;
	--color-error: #b42318;
	--color-success: #067647;

	--font-sans: "Aspekta", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--font-serif: Georgia, "Times New Roman", serif;
	--font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;

	--font-size-sm: 0.875rem;
	--font-size-base: 16px;
	--font-size-lg: 1.25rem;
	--line-height-tight: 1.2;
	--line-height-base: 1.6;

	--space-unit: 1rem;
	--space-0: 0;
	--space-1: calc(var(--space-unit) * 0.5);
	--space-2: calc(var(--space-unit) * 0.75);
	--space-3: calc(var(--space-unit) * 1);
	--space-4: calc(var(--space-unit) * 1.5);
	--space-5: calc(var(--space-unit) * 2);
	--space-6: clamp(calc(var(--space-unit) * 1.5), 2.778vw, calc(var(--space-unit) * 3));
	--space-7: clamp(calc(var(--space-unit) * 3), 3.704vw, calc(var(--space-unit) * 4));
	--space-8: clamp(calc(var(--space-unit) * 4), 5.556vw, calc(var(--space-unit) * 6));
	--space-9: clamp(calc(var(--space-unit) * 4), 7.407vw, calc(var(--space-unit) * 8));
	--space-10: clamp(calc(var(--space-unit) * 6), 9.259vw, calc(var(--space-unit) * 10));
	--space-11: clamp(calc(var(--space-unit) * 8), 11.111vw, calc(var(--space-unit) * 12));
	--space-12: clamp(calc(var(--space-unit) * 8), 12.963vw, calc(var(--space-unit) * 14));

	--container-max: 90rem;
	--content-max: 50rem;
	--page-gutter: clamp(var(--space-4), 2.778vw, var(--space-6));
	--grid-gap-inline: clamp(var(--space-6), 5.556vw, var(--space-8));
	--grid-gap-block: clamp(var(--space-4), 2.778vw, var(--space-6));

	--radius-sm: 0.25rem;
	--radius-md: 0.5rem;
	--shadow-focus: 0 0 0 0.2rem rgb(9 105 218 / 25%);
	--transition-fast: 300ms cubic-bezier(0.87, 0, 0.13, 1);
	--transition-normal: 500ms cubic-bezier(0.87, 0, 0.13, 1);
	--transiition-slow: 700ms cubic-bezier(0.87, 0, 0.13, 1);

	--header-height: calc( ( var(--space-6) * 2 ) + var(--space-5) );
}