@layer tokens {
  @font-face {
    font-family: "Londrina Solid";
    src: url("../assets/fonts/LondrinaSolid-wght.woff2") format("woff2-variations");
    font-weight: 100 900;
    font-display: swap;
  }

  :root {
    --font-display: "Londrina Solid", system-ui, sans-serif;
    --font-body: system-ui, -apple-system, "Segoe UI", sans-serif;

    --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
    --text-sm: clamp(0.875rem, 0.8rem + 0.375vw, 1rem);
    --text-base: clamp(1rem, 0.9rem + 0.5vw, 1.125rem);
    --text-lg: clamp(1.125rem, 1rem + 0.625vw, 1.25rem);
    --text-xl: clamp(1.25rem, 1.1rem + 0.75vw, 1.5rem);
    --text-2xl: clamp(1.5rem, 1.3rem + 1vw, 2rem);
    --text-3xl: clamp(1.875rem, 1.5rem + 1.875vw, 2.5rem);
    --text-4xl: clamp(2.25rem, 1.75rem + 2.5vw, 3.5rem);
    --text-5xl: clamp(3rem, 2rem + 5vw, 5rem);
  }
}