@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
    :root {
        --summary-item-color-var: 0deg 100% 67%
    }
}

html {
    font-size: 18px;
}

@font-face {
  font-family: 'HankenGrotesk';
  src: url('/static/public/fonts/static/HankenGrotesk-Medium.ttf') format('truetype');
  font-weight: 400; /* Regular */
  font-style: normal;
}

@font-face {
  font-family: 'HankenGrotesk';
  src: url('/static/public/fonts/static/HankenGrotesk-Bold.ttf') format('truetype');
  font-weight: 700; /* Bold */
  font-style: normal;
}

@font-face {
  font-family: 'HankenGrotesk';
  src: url('/static/public/fonts/static/HankenGrotesk-ExtraBold.ttf') format('truetype');
  font-weight: 800; /* ExtraBold */
  font-style: normal;
}