/* ==========================================================================
   PopDay – design token (spaziature, raggi, tipografia, font locali).
   I colori vivono in light.css / dark.css: qui solo ciò che non cambia col tema.
   ========================================================================== */

@font-face {
	font-family: "Inter";
	src: url("../fonts/inter-latin-wght.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Poppins";
	src: url("../fonts/poppins-latin-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Poppins";
	src: url("../fonts/poppins-latin-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	/* Spaziature: 4 8 12 16 24 32 48 64 */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;
	--space-8: 64px;

	/* Raggi: 8 12 16 20 24 */
	--radius-xs: 8px;
	--radius-sm: 12px;
	--radius-md: 16px;
	--radius-lg: 20px;
	--radius-xl: 24px;
	--radius-pill: 999px;

	/* Tipografia */
	--font-heading: "Poppins", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--font-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--text-xs: 0.75rem;   /* 12 */
	--text-sm: 0.875rem;  /* 14 */
	--text-md: 1rem;      /* 16 */
	--text-body: 1rem;    /* 16 mobile → 17/18 desktop in responsive.css */
	--text-lg: 1.125rem;  /* 18 */
	--text-xl: 1.375rem;  /* 22 */
	--text-2xl: 1.75rem;  /* 28 */
	--text-3xl: 2.125rem; /* 34 */
	--text-h1: 1.875rem;  /* 30 mobile */

	--leading-tight: 1.2;
	--leading-snug: 1.35;
	--leading-body: 1.7;

	/* Layout */
	--container: 1240px;
	--gutter: var(--space-4);
	--content-width: 740px;
	--header-height: 60px;
	--bottom-nav-height: 64px;
	--tap: 44px;

	/* Movimento: breve e sobrio */
	--ease: cubic-bezier(0.2, 0, 0, 1);
	--duration: 160ms;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--duration: 0ms;
	}
}
