@use "theme";
@use "font";
@use "mixins/media";
@use "pages/about";
@use "pages/home";

$font-sans: "Inclusive Sans", sans-serif;
$font-disp: "Kurale", serif;
$font-mono: monospace;

body {
  font-family: $font-sans;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: $font-disp;
}

a:hover {
  text-decoration-thickness: 3px;
}

.monospace {
  font-family: $font-mono;
}

#skip-navigation {
  position: fixed;
  top: -100%;
  right: 0;
  &:focus {
    top: 0;
  }
}

.site {
  display: flex;
  flex-direction: column;

  width: min(1000px, 100vw);

  margin: 1em auto;
}