/* -------- RESOURCES */
@layer reset {
  html {
    color-scheme: light dark;
    font: clamp(1rem, 1rem + 0.5vw, 2rem)/1.4 system-ui, sans-serif;
    tab-size: 2;
    hanging-punctuation: first allow-end last;
    word-break: break-word;
  }

  body {
    margin: 0;
  }

  *,
*::before,
*::after {
    box-sizing: border-box;
  }

  h1,
h2 {
    font-weight: 900;
    letter-spacing: -0.02rem;
  }

  h1,
h2,
h3 {
    line-height: 1.1;
  }

  h1,
h2,
h3,
h4,
h5,
h6 {
    text-wrap: balance;
    margin-block-start: 0;
  }

  p,
li,
dd {
    text-wrap: pretty;
  }

  a {
    text-underline-offset: 2px;
  }

  sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }

  sub {
    inset-block-end: -0.25em;
  }

  sup {
    inset-block-start: -0.5em;
  }

  ul,
ol,
dl {
    margin: 0;
    padding: 0;
    list-style-position: inside;
  }
  ul ul,
ul ol,
ul dl,
ol ul,
ol ol,
ol dl,
dl ul,
dl ol,
dl dl {
    padding-inline-start: 2ch;
  }

  img,
video,
iframe {
    display: block;
    max-inline-size: 100%;
    block-size: auto;
    border-style: none;
  }

  figure {
    inline-size: fit-content;
    margin-inline: auto;
  }

  figcaption {
    contain: inline-size;
    font-size: 90%;
  }

  input,
select,
textarea,
button {
    font: inherit;
    /* FUTURE: appearance: base; */
  }

  label {
    display: block;
  }

  input:not(:where([type="submit"],
      [type="checkbox"],
      [type="radio"],
      [type="button"],
      [type="reset"])) {
    inline-size: 100%;
  }

  button,
input:where([type="submit"],
    [type="reset"],
    [type="button"]) {
    background: CanvasText;
    color: Canvas;
    border: 1px solid transparent;
  }

  textarea {
    field-sizing: content;
    min-block-size: 5lh;
    inline-size: 100%;
    max-inline-size: 100%;
  }

  pre,
code,
kbd,
samp {
    font-family: ui-monospace, SFMono-Regular, monospace;
  }

  pre {
    white-space: pre-wrap;
    background: CanvasText;
    color: Canvas;
    padding: 1.5rem;
  }

  svg {
    fill: currentColor;
  }

  [aria-disabled=true i],
[disabled] {
    cursor: not-allowed;
  }

  [disabled],
label:has(input[disabled]) {
    opacity: 0.5;
  }
  [disabled] [disabled],
label:has(input[disabled]) [disabled] {
    opacity: 1;
  }

  hr {
    border-style: solid;
    border-width: 1px 0 0;
    color: inherit;
    height: 0;
    overflow: visible;
    margin-block: 2.5rem;
  }

  :target {
    scroll-margin: 3rlh;
  }

  table {
    caption-side: bottom;
    border-collapse: collapse;
  }
  table td {
    font-size: 90%;
  }
  table td,
table th {
    word-break: normal;
    border: 1px solid gray;
    padding: 0.5rem;
  }

  [role=region][aria-labelledby][tabindex] {
    overflow: auto;
  }

  caption {
    font-size: 90%;
  }

  [hidden] {
    display: none !important;
  }

  .screenreader-only:not(:focus):not(:active) {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }

  :focus-visible {
    outline-offset: 2px;
  }

  @media (prefers-reduced-motion: no-preference) {
    @view-transition {
      navigation: auto;
    }
    html {
      interpolate-size: allow-keywords;
    }
  }
}
/* -------- BEGIN STYLESHEET */
html {
  height: auto;
  min-height: 400px;
  width: 100%;
  min-width: 400px;
  background-color: #644CFF;
}

body {
  min-width: 400px;
  color: #FFF;
  background-color: #644CFF;
  font-family: "sizmo", sans-serif;
  font-weight: 400;
  font-style: italic;
}

::selection {
  background-color: #11031E;
  color: #FFF;
}

a {
  color: inherit;
  text-decoration: underline;
}
a:hover {
  color: #11031E;
}
a:active {
  color: #644CFF;
}

button {
  border-radius: 50vh;
  border: 1px solid #11031E;
  background-color: transparent;
}
button:hover {
  background-color: #11031E;
}
button:hover a {
  color: #FFF;
}
button a {
  display: block;
  padding: 0.375em 1em 0.5625em 1em;
  font-size: 0.75em;
  color: #11031E;
  text-decoration: none;
  text-transform: uppercase;
}

#page-wrapper {
  padding: 2em;
}

#page-header {
  margin: 0 auto 2.5em auto;
}
#page-header #page-logo {
  margin: 0;
  text-align: center;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#page-header #page-logo span {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(0 0 99.9% 99.9%);
  overflow: hidden;
  height: 1px;
  width: 1px;
  padding: 0;
  border: 0;
}
#page-header #page-logo img {
  display: block;
  width: 25vw;
  min-width: 280px;
  height: auto;
  margin: 0 auto 0.25em auto;
}

#page-menu {
  width: 100%;
}
#page-menu ul {
  width: 100%;
  font-size: 0.625em;
  text-align: center;
  color: #11031E;
}
#page-menu ul li {
  display: inline-block;
  text-transform: uppercase;
}
#page-menu ul li a {
  text-decoration: none;
  letter-spacing: 0.02em;
}
#page-menu ul li a:hover {
  color: #FFF;
}
#page-menu ul li a span {
  position: relative;
  top: -0.125em;
  padding-right: 0.125em;
  font-size: 0.8125em;
}

#page-main {
  width: 100%;
}

#page-footer {
  margin-top: 4.5em;
}
#page-footer #site-colophon {
  width: 100%;
  color: #11031E;
  text-align: center;
}
#page-footer #site-colophon p {
  width: 100%;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

h2 {
  font-size: 1.625em;
}

h1, h2, h3, h4, h5 {
  line-height: 1em;
  letter-spacing: 0.03125em;
  font-family: "bagel-fat-one", sans-serif;
  font-weight: 400;
  font-style: normal;
}

p {
  font-size: 0.75em;
  line-height: 150%;
}
p.heading {
  font-weight: bold;
}

footer {
  font-size: 0.625em;
}

/* Pages */
body#home {
  text-align: center;
}
body#home button {
  margin-top: 1em;
}

/* Breakpoints */
@media only screen and (max-width: 640px) {
  .line-break:before {
    content: "";
    display: block;
  }
}

/*# sourceMappingURL=style.css.map */
