@font-face {
  font-family: "Outfit";
  src: url("../typography/Outfit-Variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --dv-graphite: #605750;
  --dv-porcelain: #fcfbf9;
  --dv-mist: #eeece8;
  --dv-bronze: #9c7a55;
  --dv-ink: #57534f;
  --dv-paper: #f6f5f2;
  --dv-line: #dcd8d3;
  --dv-white: #ffffff;
  --dv-black: #000000;
  --dv-logo: var(--dv-graphite);
  --dv-logo-accent: var(--dv-bronze);
  --dv-background: var(--dv-porcelain);
  --dv-surface: var(--dv-mist);
  --dv-text: var(--dv-ink);
  --dv-action: var(--dv-ink);
  --dv-action-text: var(--dv-porcelain);
  --dv-focus: var(--dv-ink);
  --dv-accent: var(--dv-bronze);
  --dv-font: "Outfit", "Segoe UI", Arial, sans-serif;
  --dv-font-email: Arial, Helvetica, sans-serif;
  --dv-body-size: 1rem;
  --dv-body-line-height: 1.6;
  --dv-weight-body: 400;
  --dv-weight-heading: 500;
  --dv-weight-label: 600;
  --dv-radius-card: 16px;
  --dv-radius-control: 8px;
  --dv-space-unit: 4px;
}