@import url('reset.css');
  @import url('utils.css');
  @import url('tokens.css');
  @import url('type.css');
  @import url('layout.css');
  @import url('spacing.css');
  @import url('component.css');
  /* @import url('colors.css'); */
  /* @import url('main.css') */
  @import url('mq.css');
  @import url('fonts.css');

  .image-grid img{
    height:100%;
    object-fit: cover;
}



 /* @font-face {
      font-family: 'HostGrotesk';
      src: url('fonts/Host_Grotesk/woff2/HostGrotesk-Regular.woff2') format('woff2');
      font-weight: 400;
      font-style: normal;
      font-display: swap;
    }

    @font-face {
      font-family: 'HostGrotesk';
      src: url('fonts/Host_Grotesk/woff2/HostGrotesk-Medium.woff2') format('woff2');
      font-weight: 500;
      font-style: normal;
      font-display: swap;
    }

    @font-face {
      font-family: 'HostGrotesk';
      src: url('fonts/Host_Grotesk/woff2/HostGrotesk-Bold.woff2') format('woff2');
      font-weight: 600;
      font-style: normal;
      font-display: swap;
    }

    @font-face {
      font-family: 'HostGrotesk';
      src: url('fonts/Host_Grotesk/woff2/HostGrotesk-ExtraBold.woff2') format('woff2');
      font-weight: 800;
      font-style: normal;
      font-display: swap;
    } */


    /* body {
      font-family: HostGrotesk;
    } */

    h1 {
      font-weight: 800 !important;
    }