@font-face {
  font-family: 'Noto IKEA Latin';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('NotoIKEALatin-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Noto IKEA Latin';
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  src: url('NotoIKEALatin-Italic.ttf') format('truetype');
}

@font-face {
  font-family: 'Noto IKEA Latin';
  font-weight: 700;
  font-style: normal;  
  font-display: swap;
  src: url('NotoIKEALatin-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Noto IKEA Latin';
  font-weight: 700;
  font-style: italic;  
  font-display: swap;
  src: url('NotoIKEALatin-BoldItalic.ttf') format('truetype');
}

:root {
  --clr-white: #fff;
  --clr-black: #000;
  --clr-bumblebee: #F0B902;

  --ff-base: 'Noto IKEA Latin', sans-serif;

  --shadow: 0px 0px 10px 2px rgba(0,0,0,0.1); 

  --fs-base: 1.6rem;
  --fs-lg: 1.8rem;
  --fs-xl: 2.8rem;
  --fs-2xl: 4.0rem;
  --fs-3xl: 6.4rem;
   
  font: 10px/1.3 var(--ff-base);
}

body {
  background-color: var(--clr-bumblebee);
  color: var(--clr-black);
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 100svh;
}