/* Generated by tools/build-web-assets.py from 02-colors/tokens.json. Do not edit. */
@font-face { font-family: "Dp Font"; src: url("./fonts/DpFont.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url("./fonts/Satoshi-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url("./fonts/Satoshi-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  /* Palette */
  --dp-white: #FFFFFF;
  --dp-fog: #F0F2F1;
  --dp-silver: #C8CCCB;
  --dp-graphite: #2B2D2D;
  --dp-black: #0E0F0F;
  --dp-yellow: #EFB413;
  --dp-muted: #5B5F5E;
  --dp-error: #B3261E;

  /* Roles */
  --dp-bg: var(--dp-white);
  --dp-bg-alt: var(--dp-fog);
  --dp-surface-dark: var(--dp-black);
  --dp-accent: var(--dp-yellow);
  --dp-text: var(--dp-black);
  --dp-text-muted: var(--dp-muted);
  --dp-text-inverse: var(--dp-white);
  --dp-border: var(--dp-silver);

  /* Type */
  --dp-font-logo: "Dp Font", sans-serif; /* logo letters only */
  --dp-font: Satoshi, "Helvetica Neue", Arial, sans-serif;
  --dp-fs-xs: 0.8125rem;
  --dp-fs-sm: 0.9375rem;
  --dp-fs-base: 1.0625rem;
  --dp-fs-lg: 1.375rem;
  --dp-fs-xl: clamp(1.75rem, 3vw, 2.5rem);
  --dp-fs-2xl: clamp(2.5rem, 6vw, 5rem);
  --dp-lh-display: 1.05;
  --dp-lh-h2: 1.1;
  --dp-lh-h3: 1.2;
  --dp-lh-body: 1.6;
  --dp-lh-small: 1.5;
  --dp-lh-caption: 1.4;
  --dp-tracking-display: -0.03em;
  --dp-tracking-h2: -0.03em;
  --dp-tracking-h3: -0.02em;
  --dp-tracking-body: 0;
  --dp-tracking-caption: 0.08em;

  /* Space */
  --dp-space-1: 0.25rem;
  --dp-space-2: 0.5rem;
  --dp-space-3: 0.75rem;
  --dp-space-4: 1rem;
  --dp-space-6: 1.5rem;
  --dp-space-8: 2rem;
  --dp-space-12: 3rem;
  --dp-space-16: 4rem;
  --dp-space-24: 6rem;

  /* Shape */
  --dp-radius-sm: 4px;
  --dp-radius-md: 8px;
  --dp-radius-pill: 999px;
  --dp-container: 1200px;
  --dp-gutter: clamp(1rem, 4vw, 2.5rem);

  /* Motion */
  --dp-dur-1: 150ms;
  --dp-dur-2: 250ms;
  --dp-dur-3: 500ms;
  --dp-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}
