/* caldera.photography — generated from tokens.json (design system v3). Edit the design system, not this file. */

:root {
  /* color */
  --black: #0A0A0A;
  --cream: #F7F5F0;
  --white: #FFFFFF;
  --gray: #6B6862;
  --line: #DEDBD2;
  --promo: #D0242C;
  --hero: #18222D;
  --on-dark: #B7B4A9;
  --on-dark-muted: #9C998F;
  --logo-black: #000000;
  --logo-mat: #FAF9F6;
  /* spacing */
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-56: 56px;
  --space-72: 72px;
  --space-80: 80px;
  --space-88: 88px;
  --space-96: 96px;
  /* radius */
  --radius-none: 0;
  --radius-round: 50%;
  /* layout */
  --container: 1120px;
  --text-measure: 640px;
  --breakpoint-tablet: 1023px;
  --breakpoint-mobile: 860px;
  /* font */
  --font-text: Jost, sans-serif;
}

/* text styles — usage: class="h1" etc. */
.h1 { font-family: var(--font-text); font-size: 56.576px; line-height: 58.839px; font-weight: 500; letter-spacing: -0.56576px; }
.h2 { font-family: var(--font-text); font-size: 40.96px; line-height: 45.8752px; font-weight: 500; letter-spacing: -0.4096px; }
.h3 { font-family: var(--font-text); font-size: 20px; line-height: 32px; font-weight: 500; letter-spacing: -0.2px; }
.lead { font-family: var(--font-text); font-size: 19px; line-height: 30.4px; font-weight: 400; }
.nav { font-family: var(--font-text); font-size: 18px; line-height: 28.8px; font-weight: 500; letter-spacing: 0.18px; }
.quote { font-family: var(--font-text); font-size: 17px; line-height: 25.5px; font-weight: 400; }
.body { font-family: var(--font-text); font-size: 17px; line-height: 27.2px; font-weight: 400; }
.body-sm { font-family: var(--font-text); font-size: 16px; line-height: 25.6px; font-weight: 400; }
.button { font-family: var(--font-text); font-size: 15px; line-height: 24px; font-weight: 500; letter-spacing: 0.3px; }
.small { font-family: var(--font-text); font-size: 13px; line-height: 20.8px; font-weight: 400; }
.label { font-family: var(--font-text); font-size: 12px; line-height: 19.2px; font-weight: 500; letter-spacing: 2.16px; }
.badge { font-family: var(--font-text); font-size: 11px; line-height: 17.6px; font-weight: 500; letter-spacing: 0.44px; }

/* breakpoints (CSS variables can't be used in media queries): tablet max-width 1023px, mobile max-width 860px */