@font-face {
  font-family: "Pupcat";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/pupcat.ttf") format("truetype");
}

@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("fonts/manrope.woff2") format("woff2");
}

:root {
  color-scheme: light;
  --pico-font-family: "Manrope", sans-serif;
  --pico-background-color: #fff;
  --pico-color: #202020;
}

html,
body {
  --pico-background-color: #fff;
  --pico-color: #202020;
  background-color: #fff;
  color: #202020;
}

.brand {
  display: flex;
  align-items: center;
  gap: 1rem;
  text-decoration: none;
}

.brand img {
  display: block;
}

.brand h1 {
  margin: 0;
}

.site-header-inner,
.site-main,
.site-footer {
  width: min(100% - 2rem, 58rem);
  margin-inline: auto;
}

.site-header-inner {
  padding: 1rem 0 0;
}

.site-main {
  padding: 1rem 0 0;
}

.site-main section {
  margin-bottom: 0;
}

.site-footer {
  padding-bottom: 1rem;
}

input:not([type="checkbox"]),
select,
textarea {
  background-color: #fff;
  border-color: #202020;
  color: #202020;
}

input[type="checkbox"] {
  background-color: #fff;
  border-color: #202020;
}

input[type="checkbox"]:checked {
  background-color: #62bdbe;
  border-color: #62bdbe;
}

.errorlist {
  color: #d62182;
}

#id_slots {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 1rem;
}

.lookup-error {
  color: #d62182;
}

input[aria-invalid="true"],
select[aria-invalid="true"],
textarea[aria-invalid="true"] {
  border-color: #d62182;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #6f9f3a;
  font-family: "Pupcat", sans-serif;
}

.brand span {
  color: #6f9f3a;
  font-family: "Pupcat", sans-serif;
}

a {
  color: #62bdbe;
  text-decoration: none;
}

a:hover,
a:focus {
  color: #62bdbe;
  text-decoration: underline;
}

.eyebrow {
  font-family: inherit;
}

button {
  background-color: #62bdbe !important;
  border-color: #62bdbe !important;
  color: #fff;
}

button:hover {
  background-color: #4f9fa0 !important;
  border-color: #4f9fa0 !important;
}

.grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
