@font-face {
  font-family: "Helvetica";
  src: url("./Helvetica.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Helvetica";
  src: url("./Helvetica-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Helvetica";
  src: url("./Helvetica-BoldOblique.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Puff";
  src: url("./DynaPuff.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-sans: "Helvetica", Arial, sans-serif;
  --font-puff: "Puff", sans-serif;
  --color-brand-black:        #0F0F0F;
  --color-brand-dark-purple:  #3e065f;
  --color-brand-purple:       #700b97;
  --color-brand-light-purple: #8e05c2;
  --color-whitesmoke:         #f5f5f5;
}

body {
  color: var(--color-brand-black);
  background-color: var(--color-whitesmoke);
}

@layer components {

}