/* Shared by the Next.js site and standalone HTML pages.
 * Change only --font-size-base to scale every website font size.
 * Keep rem-based layout dimensions independent of the type scale.
 */
@font-face {
  font-family: "PlanIt Nunito";
  src: url("/fonts/Nunito.ttf") format("truetype");
  font-style: normal;
  font-weight: 200 1000;
  font-display: swap;
}

:root {
  --font-size-base: 1rem;
  --font-family-sans: "PlanIt Nunito", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --font-size-micro: calc(var(--font-size-base) * 0.625);
  --font-size-tag: calc(var(--font-size-base) * 0.6875);
  --font-size-xs: calc(var(--font-size-base) * 0.75);
  --font-size-sm: calc(var(--font-size-base) * 0.875);
  --font-size-body-sm: calc(var(--font-size-base) * 0.9375);
  --font-size-lg: calc(var(--font-size-base) * 1.125);
  --font-size-xl: calc(var(--font-size-base) * 1.25);
  --font-size-2xl: calc(var(--font-size-base) * 1.5);
  --font-size-3xl: calc(var(--font-size-base) * 1.875);
  --font-size-4xl: calc(var(--font-size-base) * 2.25);
  --font-size-5xl: calc(var(--font-size-base) * 3);
  --font-size-6xl: calc(var(--font-size-base) * 3.75);
  --font-size-7xl: calc(var(--font-size-base) * 4.5);
  --font-size-8xl: calc(var(--font-size-base) * 6);
  --font-size-9xl: calc(var(--font-size-base) * 8);
}

body {
  font-family: var(--font-family-sans);
  font-size: var(--font-size-base);
}

button, input, select, textarea {
  font: inherit;
}

code, kbd, pre, samp {
  font-family: var(--font-family-mono);
}

/* Browser defaults must use the same scale on standalone pages too. */
small { font-size: var(--font-size-sm); }
sub, sup { font-size: var(--font-size-xs); }