@import url('https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  --font-serif: "Libre Caslon Text", Georgia, serif;
  --font-sans: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", monospace;

  --color-brand-primary: #26170c;
  --color-brand-primary-container: #3d2b1f;
  --color-brand-on-primary-container: #ac9181;
  --color-brand-secondary: #665d4e;
  --color-brand-secondary-container: #ebdecb;
  --color-brand-on-secondary-container: #6b6152;
  --color-brand-surface: #f9f9f9;
  --color-brand-surface-container: #eeeeee;
  --color-brand-surface-low: #f3f3f4;
  --color-brand-surface-lowest: #ffffff;
  --color-brand-accent: #fbddca;
  --color-brand-accent-dim: #dec1af;
  --color-brand-border: rgba(38, 23, 12, 0.1);
}

body {
  background-color: var(--color-brand-surface);
  color: var(--color-brand-primary);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .font-editorial {
  font-family: var(--font-serif);
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--color-brand-surface);
}
::-webkit-scrollbar-thumb {
  background: var(--color-brand-secondary);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-brand-primary);
}

.font-label-caps {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.horizontal-rule {
  height: 1px;
  background-color: var(--color-brand-border);
  width: 100%;
}