/*
  Josh's Custom CSS Reset
  https://www.joshwcomeau.com/css/custom-css-reset/
*/
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

@media (prefers-reduced-motion: no-preference) {
  html {
    interpolate-size: allow-keywords;
  }
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

p {
  text-wrap: pretty;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
  line-height: 1.2;
}

/*
  Generic Styles
*/
:root {
  /* colors */
  --color-green: #7ec242;
  --color-green-lighter: #c1e961;
  --color-green-lightest: #e3f9b1;
  --color-green-barely: #fcfff4;
  --color-purple: #6258b9;
  --color-purple-lighter: #b8b3ea;
  --color-purple-lightest: #dedced;
  --color-purple-barely: #f8f7ff;
  --color-error: #d80037;
  --color-error-lighter: #ffe2d7;

  --color-pale: #eff3e6;

  /* default theme color */
  --th-color: var(--color-green);
  --th-color-lighter: var(--color-green-lighter);
  --th-color-lightest: var(--color-green-lightest);
  --th-color-barely: var(--color-green-barely);

  /* font and font metrics */
  --font-family: "wf-anek-latin", sans-serif;
  --fm-units-per-em: 2000;
  --fm-capital-height: 1278;
  --fm-ascender: 1800;
  --fm-descender: 400;
  --fm-line-gap: 0;
  --fm-line-height: calc(
    (var(--fm-ascender) + var(--fm-descender) + var(--fm-line-gap))
  );

  /* misc */
  --gutter: 1.5rem;

  --badge-clip-path: polygon(
    50.251% 0.501%,
    50.251% 0.501%,
    51.67% 0.582%,
    53.033% 0.823%,
    54.338% 1.221%,
    55.58% 1.773%,
    56.757% 2.474%,
    57.865% 3.322%,
    58.901% 4.312%,
    59.862% 5.442%,
    60.744% 6.709%,
    61.545% 8.108%,
    61.545% 8.108%,
    62.937% 7.296%,
    64.333% 6.641%,
    65.729% 6.142%,
    67.121% 5.802%,
    68.504% 5.622%,
    69.873% 5.603%,
    71.225% 5.747%,
    72.554% 6.054%,
    73.855% 6.527%,
    75.125% 7.166%,
    75.125% 7.166%,
    76.314% 7.946%,
    77.374% 8.837%,
    78.305% 9.834%,
    79.105% 10.932%,
    79.774% 12.128%,
    80.309% 13.415%,
    80.711% 14.791%,
    80.978% 16.249%,
    81.108% 17.786%,
    81.102% 19.397%,
    81.102% 19.397%,
    82.713% 19.389%,
    84.25% 19.519%,
    85.708% 19.785%,
    87.084% 20.187%,
    88.372% 20.724%,
    89.568% 21.393%,
    90.667% 22.195%,
    91.664% 23.126%,
    92.555% 24.187%,
    93.335% 25.376%,
    93.335% 25.376%,
    93.974% 26.646%,
    94.447% 27.947%,
    94.754% 29.276%,
    94.898% 30.627%,
    94.879% 31.997%,
    94.699% 33.38%,
    94.36% 34.771%,
    93.862% 36.168%,
    93.207% 37.564%,
    92.397% 38.955%,
    92.397% 38.955%,
    93.795% 39.756%,
    95.06% 40.639%,
    96.19% 41.6%,
    97.18% 42.636%,
    98.027% 43.744%,
    98.728% 44.921%,
    99.279% 46.163%,
    99.677% 47.468%,
    99.919% 48.831%,
    100% 50.251%,
    100% 50.251%,
    99.919% 51.67%,
    99.677% 53.034%,
    99.279% 54.338%,
    98.728% 55.58%,
    98.026% 56.757%,
    97.178% 57.865%,
    96.188% 58.901%,
    95.057% 59.862%,
    93.791% 60.744%,
    92.392% 61.545%,
    92.392% 61.545%,
    93.203% 62.937%,
    93.859% 64.333%,
    94.358% 65.729%,
    94.698% 67.121%,
    94.878% 68.504%,
    94.897% 69.873%,
    94.754% 71.225%,
    94.446% 72.553%,
    93.973% 73.855%,
    93.334% 75.125%,
    93.334% 75.125%,
    92.554% 76.314%,
    91.663% 77.375%,
    90.666% 78.306%,
    89.567% 79.107%,
    88.371% 79.775%,
    87.083% 80.311%,
    85.707% 80.713%,
    84.248% 80.979%,
    82.712% 81.11%,
    81.101% 81.102%,
    81.101% 81.102%,
    81.108% 82.714%,
    80.977% 84.251%,
    80.71% 85.71%,
    80.308% 87.086%,
    79.773% 88.374%,
    79.104% 89.569%,
    78.304% 90.668%,
    77.373% 91.665%,
    76.313% 92.555%,
    75.124% 93.335%,
    75.124% 93.335%,
    73.855% 93.974%,
    72.553% 94.447%,
    71.224% 94.755%,
    69.873% 94.899%,
    68.504% 94.881%,
    67.121% 94.701%,
    65.729% 94.362%,
    64.332% 93.863%,
    62.936% 93.208%,
    61.544% 92.397%,
    61.544% 92.397%,
    60.743% 93.795%,
    59.861% 95.06%,
    58.9% 96.19%,
    57.864% 97.18%,
    56.756% 98.027%,
    55.579% 98.728%,
    54.337% 99.279%,
    53.032% 99.677%,
    51.669% 99.919%,
    50.25% 100%,
    50.25% 100%,
    48.83% 99.919%,
    47.467% 99.677%,
    46.162% 99.279%,
    44.92% 98.727%,
    43.743% 98.026%,
    42.635% 97.178%,
    41.599% 96.187%,
    40.638% 95.057%,
    39.755% 93.79%,
    38.954% 92.391%,
    38.954% 92.391%,
    37.563% 93.202%,
    36.167% 93.858%,
    34.771% 94.357%,
    33.379% 94.697%,
    31.996% 94.878%,
    30.627% 94.897%,
    29.276% 94.753%,
    27.947% 94.446%,
    26.645% 93.973%,
    25.375% 93.334%,
    25.375% 93.334%,
    24.186% 92.554%,
    23.126% 91.663%,
    22.195% 90.666%,
    21.394% 89.568%,
    20.726% 88.372%,
    20.19% 87.084%,
    19.788% 85.709%,
    19.522% 84.25%,
    19.391% 82.712%,
    19.397% 81.101%,
    19.397% 81.101%,
    17.787% 81.107%,
    16.25% 80.977%,
    14.792% 80.71%,
    13.416% 80.308%,
    12.128% 79.772%,
    10.932% 79.104%,
    9.834% 78.304%,
    8.836% 77.373%,
    7.945% 76.313%,
    7.165% 75.124%,
    7.165% 75.124%,
    6.526% 73.855%,
    6.054% 72.553%,
    5.746% 71.224%,
    5.602% 69.873%,
    5.621% 68.503%,
    5.801% 67.12%,
    6.14% 65.728%,
    6.638% 64.332%,
    7.293% 62.936%,
    8.103% 61.544%,
    8.103% 61.544%,
    6.705% 60.743%,
    5.44% 59.861%,
    4.31% 58.9%,
    3.32% 57.864%,
    2.473% 56.756%,
    1.772% 55.579%,
    1.221% 54.337%,
    0.823% 53.032%,
    0.582% 51.669%,
    0.501% 50.25%,
    0.501% 50.25%,
    0.582% 48.83%,
    0.823% 47.467%,
    1.221% 46.162%,
    1.773% 44.92%,
    2.474% 43.743%,
    3.322% 42.635%,
    4.313% 41.599%,
    5.443% 40.638%,
    6.71% 39.755%,
    8.109% 38.954%,
    8.109% 38.954%,
    7.297% 37.563%,
    6.642% 36.167%,
    6.143% 34.771%,
    5.803% 33.379%,
    5.623% 31.996%,
    5.604% 30.627%,
    5.747% 29.276%,
    6.054% 27.947%,
    6.527% 26.645%,
    7.166% 25.375%,
    7.166% 25.375%,
    7.946% 24.186%,
    8.836% 23.125%,
    9.832% 22.194%,
    10.929% 21.393%,
    12.123% 20.725%,
    13.41% 20.189%,
    14.785% 19.787%,
    16.245% 19.52%,
    17.784% 19.39%,
    19.398% 19.397%,
    19.398% 19.397%,
    19.392% 17.786%,
    19.523% 16.249%,
    19.79% 14.79%,
    20.192% 13.414%,
    20.728% 12.127%,
    21.396% 10.931%,
    22.196% 9.833%,
    23.127% 8.836%,
    24.187% 7.945%,
    25.376% 7.165%,
    25.376% 7.165%,
    26.646% 6.526%,
    27.947% 6.054%,
    29.276% 5.746%,
    30.627% 5.602%,
    31.997% 5.621%,
    33.38% 5.801%,
    34.771% 6.14%,
    36.168% 6.638%,
    37.564% 7.293%,
    38.955% 8.103%,
    38.955% 8.103%,
    39.756% 6.705%,
    40.639% 5.44%,
    41.6% 4.31%,
    42.636% 3.32%,
    43.744% 2.473%,
    44.921% 1.772%,
    46.163% 1.221%,
    47.468% 0.823%,
    48.831% 0.582%,
    50.251% 0.501%
  );
}

body {
  font-family: var(--font-family);
}

.bg-green-lightest {
  background-color: var(--color-green-lightest);
}

.bg-purple-barely {
  background-color: var(--color-purple-barely);
}

.th-green {
  --th-color: var(--color-green);
  --th-color-lighter: var(--color-green-lighter);
  --th-color-lightest: var(--color-green-lightest);
  --th-color-barely: var(--color-green-barely);
}

.th-purple {
  --th-color: var(--color-purple);
  --th-color-lighter: var(--color-purple-lighter);
  --th-color-lightest: var(--color-purple-lightest);
  --th-color-barely: var(--color-purple-barely);
}

.page-content {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;

  > * {
    width: 100%;
  }

  > .main-content {
    flex: 1;
  }
}

.container {
  max-width: calc(80rem + 2 * var(--gutter));
  margin: 0 auto;
  padding-inline: var(--gutter);
}

.rich-text {
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin-top: 1em;
    margin-bottom: 0.5em;
    font-weight: 600;
  }

  p,
  ul,
  ol,
  img.richtext-image,
  div:has(> iframe) {
    margin-bottom: 0.75em;

    &:last-child {
      margin-bottom: 0;
    }
  }

  /* p:has(+ ul),
  p:has(+ ol) {
    margin-bottom: 0;
  } */

  ul {
    padding-left: 1.5em;
    list-style: "•";

    li {
      padding-left: 0.5em;
    }
  }

  ol {
    padding-left: 1.75em;
    list-style-type: decimal;

    li {
      padding-left: 0.25em;
    }

    ol {
      list-style-type: lower-alpha;

      ol {
        list-style-type: lower-roman;

        ol {
          list-style-type: decimal;

          ol {
            list-style-type: lower-alpha;
          }
        }
      }
    }
  }

  b,
  strong {
    font-weight: 700;
  }

  i,
  em {
    font-style: italic;
  }

  a {
    font-weight: 500;
    color: inherit;
    text-decoration: underline;

    &:hover {
      text-decoration: none;
    }
  }

  div {
    iframe {
      display: block;
      width: 100%;
      height: auto;
      aspect-ratio: 16 / 9;
    }
  }
}

.ratio-16x9 iframe,
iframe.ratio-16x9 {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}

.generic-page-header {
  padding-block: 4.75rem;

  @media (max-width: 575.98px) {
    padding-block: 2.5rem;
  }

  h1 {
    font-size: 2.25rem;
    line-height: 1.1;
    font-weight: 700;
    text-align: center;

    @media (max-width: 575.98px) {
      font-size: 1.75rem;
    }
  }
}

.generic-page-body {
  padding-block: 3.875rem;

  @media (max-width: 575.98px) {
    padding-block: 2.5rem;
  }

  .rich-text {
    max-width: 800px;
    margin-inline: auto;
    font-size: 1.125rem;

    img.richtext-image {
      margin-inline: auto;
      display: block;
      max-width: 100%;
      height: auto;

      &.full-width {
        width: 100%;
      }
    }
  }
}