:root {
  --c-linen: #E4DFD6;
  --c-paper: #F5F2EC;
  --c-white: #FFFFFF;
  --c-sage: #CCCFC0;
  --c-sage-soft: #D8DACE;
  --c-taupe: #8C7E73;
  --c-taupe-deep: #7E7167;
  --c-bordeaux: #472426;
  --c-ink: #2B1F1F;
  --c-muted: #645C57; 
  --c-line: rgba(71, 36, 38, .18);
  --c-line-soft: rgba(71, 36, 38, .10);
  --ff-display: "Open Sans", system-ui, sans-serif;
  --ff-body: "Aptos", "Open Sans", system-ui, sans-serif;
  --fs-display: clamp(2.75rem, 1.6rem + 4.6vw, 6rem);
  --fs-h1: clamp(2.25rem, 1.5rem + 3vw, 4.25rem);
  --fs-h2: clamp(1.75rem, 1.3rem + 1.8vw, 3rem);
  --fs-h3: clamp(1.25rem, 1.1rem + .6vw, 1.625rem);
  --fs-quote: clamp(1.0625rem, .98rem + .4vw, 1.375rem);
  --fs-lead: clamp(1rem, .95rem + .2vw, 1.125rem);
  --fs-body: clamp(.9375rem, .91rem + .1vw, 1rem);
  --fs-small: .875rem;
  --fs-label: .75rem;
  --tr-label: .22em;
  --r-xs: 6px;
  --r-sm: 12px;
  --r-md: 20px;
  --r-lg: 28px;
  --r-xl: 40px;
  --r-pill: 999px;
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.36, .64, 1);
  --dur-fast: .25s;
  --dur-base: .6s;
  --dur-slow: 1.1s;
  --container: 1440px;
  --gutter: clamp(16px, 2vw, 24px);
  --side: clamp(20px, 5vw, 80px);
  --section-y: clamp(56px, 7vw, 104px); /* ruimte tussen twee secties: één waarde voor de hele site */
  --header-h: 124px;
  --tag-h: 32px;
  --tag-px: 14px;
  --tag-fs: .8125rem;
  --tag-video-h: 28px;
  --tag-video-px: 12px;
  --tag-video-fs: .6875rem;
  --tag-photo-bg: rgba(43, 31, 31, .26);
  --tag-photo-bg-hover: rgba(43, 31, 31, .42);
  --tag-photo-fg: #F5F2EC;
  --tag-photo-line: rgba(245, 242, 236, .75);
}
@media (max-width: 767px) {
  :root { --header-h: 88px; }
}
