@font-face {
  font-family: 'Bricolage Grotesque';
  src: url('./fonts/BricolageGrotesque-variable.ttf') format('truetype');
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 75% 100%;
  font-display: swap;
}
:root {
  --savry-ember: #EE3F24;
  --savry-noodle: #FFEFCB;
  --savry-matcha: #023820;
  --savry-yolk: #F9A11B;
  --savry-tofu: #FFF4E6;
  --savry-marigold: #FFAD19;
  --savry-corn: #F6F0E2;
  --savry-card: var(--savry-tofu);
  --savry-font: 'Bricolage Grotesque', system-ui, sans-serif;
  --savry-text: var(--savry-matcha);
  --savry-surface: var(--savry-corn);
  --savry-action: var(--savry-matcha);
  --savry-action-text: var(--savry-tofu);
  --savry-radius-control: 10px;
  --savry-radius-card: 20px;
}
.savry-body { font-family: var(--savry-font); font-weight: 400; font-optical-sizing: auto; line-height: 1.6; }
.savry-heading { font-family: var(--savry-font); font-weight: 800; font-optical-sizing: auto; letter-spacing: -.035em; line-height: 1.08; }
.savry-label { font-family: var(--savry-font); font-weight: 600; font-optical-sizing: auto; }