/**
 * CSS Variables
 * Design tokens and variables used throughout the site
 */

:root {
  /* Spacing */
  --spacing-1x: 1rem;
  --spacing-xs-gap: var(--spacing-1x);
  --horizontal-margins: 8rem;
  --spacing-between-title-and-content: 3rem;

  /* Typography - Headings */
  --h1-size: 3.05rem;
  --h2-size: 1.95rem;
  --h3-size: 1.56rem;
  --h3-line-height: 1.04em;
  --h3-weight: 400;
  --h3-letter-spacing: -0.01em;
  --h3-margin-bottom: 0.5em;
  --h4-size: 1.25rem;
  --h5-size: 1rem;
  --h6-size: 0.8rem;
  --h6-line-height: 1.3em;
  --h6-weight: 400;
  --h6-letter-spacing: 0.1em;
  --h6-margin-bottom: 0.5em;

  /* Typography - Text */
  --global-font-family: "Google Sans Flex", sans-serif;
  --text-size: 1rem;
  --texto-corrido: 1.25rem;
  --texto-corrido-weight: 300;
  --paragrafos: #0009;

  /* Colors */
  --grey-text: #0a0a0a66;

  /* Effects */
  --herobuttonblur: 0px;
}