@import url('https://cdn.jsdelivr.net/npm/@fontsource-variable/archivo@5.1.0/index.min.css');

:root {
  --site-ink: #101313;
  --site-paper: #f2f2ed;
  --site-paper-bright: #fbfbf7;
  --site-ocean: #061420;
  --site-signal: #74f2bd;
  --site-focus: #ff352f;
  --site-line: rgba(16, 19, 19, .18);
  --site-muted: rgba(16, 19, 19, .62);
  --site-edge: clamp(18px, 3vw, 48px);
  --site-header-height: 66px;
  --site-content: 1440px;
  --site-copy: 68ch;
  --site-font: 'Archivo Variable', Arial, sans-serif;
  --site-type-display: clamp(3.25rem, 8vw, 8rem);
  --site-type-title: clamp(2.25rem, 5vw, 5.25rem);
  --site-type-lead: clamp(1.12rem, 1.8vw, 1.75rem);
  --site-type-body: clamp(1rem, 1.05vw, 1.08rem);
  --site-type-small: clamp(.72rem, .72vw, .8rem);
  --site-section-space: clamp(4.5rem, 9vw, 9rem);
}

*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--site-header-height) + 18px);
  overflow-x: clip;
  background: var(--site-paper);
}

body {
  margin: 0;
  overflow-x: clip;
  color: var(--site-ink);
  background: var(--site-paper);
  font-family: var(--site-font);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body, button, input, textarea, select { font-family: var(--site-font); }

:where(h1, h2, h3, h4, p, figure, blockquote, dl, dd) { margin: 0; }
:where(img, video, canvas, svg, iframe, model-viewer) { display: block; max-inline-size: 100%; }
video:not([data-native-controls])::-webkit-media-controls,
video:not([data-native-controls])::-webkit-media-controls-enclosure,
video:not([data-native-controls])::-webkit-media-controls-panel,
video:not([data-native-controls])::-webkit-media-controls-overlay-play-button,
video:not([data-native-controls])::-webkit-media-controls-start-playback-button {
  display: none !important;
  -webkit-appearance: none;
}
:where(a) { color: inherit; }
:where(a, button, input, textarea, select, summary, [role='button']) { min-height: 44px; }
:where(a, button, input, textarea, select, summary, [role='button']):focus-visible {
  outline: 2px solid var(--site-focus);
  outline-offset: 4px;
}

::selection { color: var(--site-ink); background: var(--site-signal); }
[id] { scroll-margin-top: calc(var(--site-header-height) + 18px); }

.skip-link {
  position: fixed;
  z-index: 10060;
  top: 8px;
  left: 8px;
  min-height: 44px;
  padding: 10px 14px;
  display: inline-flex;
  align-items: center;
  color: var(--site-ink);
  background: #fff;
  transform: translateY(-160%);
}

.skip-link:focus { transform: none; }

@media (max-width: 820px) {
  :root {
    --site-edge: 14px;
    --site-header-height: 58px;
    --site-section-space: 4.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
