/* Fonts */

/* Inter variável (latin) */
@font-face {
	font-family: "Inter";
	src: local("Inter"), local("Inter Variable"),
		url("fonts/inter/Inter-Latin-Variable.woff2") format("woff2");
	font-weight: 100 900; /* faixa completa */
	font-style: normal;
	font-display: swap; /* evita FOIT */
}

/* Host Grotesk variável (latin) */
@font-face {
	font-family: "Host Grotesk";
	src: local("Host Grotesk"), local("Host Grotesk Variable"),
		url("fonts/host-grotesk/HostGrotesk-Latin-Variable.woff2")
		format("woff2");
	font-weight: 300 800; /* faixa típica no pacote variável */
	font-style: normal;
	font-display: swap;
}

:root {
	
	--font-inter: "Inter", Arial, Helvetica, sans-serif;
	--font-host-grotesk: "Host Grotesk", Arial, Helvetica, sans-serif;
	
	/* Base */
	--color-primary-500-opacity-70: #0372ffb3;
	--color-primary-950: #06112f;
	--color-primary-900: #141b50;
	--color-primary-800: #212870;
	--color-primary-700: #2e3d9a;
	--color-primary-600: #0563db;
	--color-primary-500: #0372ff;
	--color-primary-400: #318cff;
	--color-primary-300: #68abff;
	--color-primary-200: #9dc8ff;
	--color-primary-100: #c8e0ff;
	--color-primary-50:  #e8f2ff;
	
	/* Secondary */
	--color-secondary-950: #310d05;
	--color-secondary-900: #571c10;
	--color-secondary-800: #7a2d1d;
	--color-secondary-700: #a53e26;
	--color-secondary-600: #c64f2e;
	--color-secondary-500: #e26f4b;
	--color-secondary-400: #f48a65;
	--color-secondary-300: #ffaa8a;
	--color-secondary-200: #ffc4a8;
	--color-secondary-100: #ffdcc8;
	--color-secondary-50:  #fff2eb;
	
	/* Neutral */
	--color-neutral-950-opacity-20: #03071233;
	--color-neutral-950: #030712;
	--color-neutral-900: #111827;
	--color-neutral-800: #1f2937;
	--color-neutral-700: #374151;
	--color-neutral-600: #4b5563;
	--color-neutral-500: #6b7280;
	--color-neutral-400: #9ca3af;
	--color-neutral-300: #d1d5db;
	--color-neutral-200: #e5e7eb;
	--color-neutral-100: #f3f4f6;
	--color-neutral-75:  #f5f5f6;
	--color-neutral-50:  #f9fafb;
	
	/* Pure */
	--color-pure-white: #ffffff;
	--color-pure-black: #000000;
	
	/* State - Red */
	--color-red-950: #450a0a;
	--color-red-900: #7f1d1d;
	--color-red-800: #991b1b;
	--color-red-700: #b91c1c;
	--color-red-600: #dc2626;
	--color-red-500: #ef4444;
	--color-red-400: #f87171;
	--color-red-300: #fca5a5;
	--color-red-200: #fecaca;
	--color-red-100: #fee2e2;
	--color-red-50:  #fef2f2;
	
	/* State - Yellow */
	--color-yellow-950: #422006;
	--color-yellow-900: #713f12;
	--color-yellow-800: #854d0e;
	--color-yellow-700: #a16207;
	--color-yellow-600: #ca8a04;
	--color-yellow-500: #eab308;
	--color-yellow-400: #facc15;
	--color-yellow-300: #fde047;
	--color-yellow-200: #fef08a;
	--color-yellow-100: #fef9c3;
	--color-yellow-50:  #fefce8;
	
	/* State - Green */
	--color-green-950: #052e16;
	--color-green-900: #14532d;
	--color-green-800: #166534;
	--color-green-700: #15803d;
	--color-green-600: #16a34a;
	--color-green-500: #22c55e;
	--color-green-400: #4ade80;
	--color-green-300: #86efac;
	--color-green-200: #bbf7d0;
	--color-green-100: #dcfce7;
	--color-green-50:  #f0fdf4;
	
	/* Opacity */
	
	
	
	
}