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

@font-face {
  font-family: Fraunces;
  src: url('../fonts/fraunces-variable-italic-latin.woff2') format('woff2');
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Serif Tibetan';
  src: url('../fonts/noto-serif-tibetan-tibetan.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
  unicode-range: U+0F00-0FFF, U+200C-200D, U+25CC;
}

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

:root {
  --plum: #451c2a;
  --plum-hover: #5b293b;
  --powder-rose: #d8b8c3;
  --rose-light: #f5edf0;
  --gold: #dbbd7c;
  --gold-branch: #d1a238;
  --paper: #f9f8f6;
  --ink: #251d21;
  --muted: #6f5f67;
  --color-bg-page: var(--paper);
  --color-bg-soft: var(--rose-light);
  --color-bg-brand: var(--plum);
  --color-text-primary: var(--ink);
  --color-text-secondary: var(--muted);
  --color-text-brand: var(--plum);
  --color-text-on-brand: var(--paper);
  --color-mark-on-brand: var(--gold);
  --color-action: var(--plum);
  --color-action-hover: var(--plum-hover);
  --color-action-label: var(--paper);
  --color-focus: var(--plum);
  --color-border: #d8cbd0;
  --font-display: Fraunces, Georgia, serif;
  --font-body: Manrope, Arial, sans-serif;
  --text-display: 80px;
  --text-heading: 44px;
  --text-subheading: 24px;
  --text-body: 16px;
  --text-small: 13px;
  --radius-control: 4px;
  --content-max: 1248px;
  --page-gutter: 48px;
  --space-section: 80px;
  --motion-fast: 150ms;
  --motion-ease: cubic-bezier(0.2, 0, 0, 1);
}

@media (max-width: 640px) {
  :root {
    --text-display: 48px;
    --text-heading: 32px;
    --page-gutter: 20px;
    --space-section: 48px;
  }
}