@charset "UTF-8";

:root {
	/* =========================
       FONTS
	========================== */
	--font-heading: "Fraunces", serif;
	--font-body: "Space Grotesk", sans-serif;
	--font-mono: "IBM Plex Mono", monospace;

	/* =========================
       Sizes
	========================== */
	--wp--style--global--wide-size: 1640px;
	
	--wp--preset--spacing--90:  clamp(90px, 8vw, 180px);
	--wp--preset--spacing--120: clamp(120px, 10vw, 240px);
	--wp--preset--spacing--160: clamp(160px, 12vw, 320px);

	/* =========================
       TYPE SCALE (CLAMP)
	========================== */
  --text-h1: clamp(3rem, 2.6rem + 1.6vw, 4rem);
  --text-h2: clamp(2rem, 1.6rem + 1.6vw, 3rem);
  --text-h3: clamp(1.5rem, 1.3rem + 0.8vw, 2rem);
  --text-h4: clamp(1.25rem, 1.05rem + 0.8vw, 1.75rem);
  --text-h5: clamp(1rem, 0.8rem + 0.8vw, 1.5rem);
  --text-h6: clamp(0.75rem, 0.65rem + 0.4vw, 1rem);

  --text-paragraph: var(--text-h5);
  --text-mono: var(--text-h6);

  /* =========================
     COLORS
  ========================== */
	--color-black: #0d0d0d;
	--color-cream: #f5f1eb;
	--color-red: #ab1111;

	--color-brown-dark: #43372b;
	--color-brown: #866c53;
	--color-brown-light: #d9af8b;
	
	--color-overlay: #000000cc;
}