@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/fonts/manrope-latin.woff2') format('woff2');
}

@font-face {
  font-family: Raleway;
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url('/fonts/raleway-latin.woff2') format('woff2');
}

@font-face {
  font-family: Questrial;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/questrial-latin.woff2') format('woff2');
}

:root {
  --pbs-ink: #080808;
  --pbs-paper: #ffffff;
  --pbs-soft: #f6f6f6;
  --pbs-faint: #f2f2f2;
  --pbs-line: #d6d6d6;
  --pbs-muted: #777777;
  --pbs-body: #404040;
  --pbs-eyebrow: #555555;
  --pbs-alert: #9b2226;
  --pbs-success: #6f9c6a;

  /* Site header, shared by the portfolio and store headers. */
  --pbs-header-line: #e9e9e9;
  --pbs-nav: #333333;
  --pbs-nav-current: #666666;
  --pbs-nav-hover: #888888;
  --pbs-nav-separator: #999999;

  /* Dark surfaces: footer and full screen mobile menu. */
  --pbs-night: #0a0a0a;
  --pbs-night-line: #2b2b2b;
  --pbs-night-faint: #5c5c5c;
  --pbs-night-muted: #9a9a9a;
  --pbs-night-copy: #b3b3b3;

  --pbs-heading: 'Raleway', 'Helvetica Neue', Arial, sans-serif;
  --pbs-body-font: 'Manrope', Arial, sans-serif;
  --pbs-accent-font: 'Questrial', Arial, sans-serif;
  --pbs-content-width: 1180px;
  --pbs-page-gutter: clamp(20px, 4vw, 62px);
  --pbs-section-space: clamp(56px, 8vw, 104px);
  --pbs-space-2xs: 4px;
  --pbs-space-xs: 8px;
  --pbs-space-sm: 12px;
  --pbs-space-md: 16px;
  --pbs-space-lg: 24px;
  --pbs-space-xl: 32px;
  --pbs-space-2xl: 48px;
  --pbs-space-3xl: 64px;
}