@font-face {
  font-family: "Atkinson Hyperlegible";
  src: url("/fonts/atkinson-hyperlegible/AtkinsonHyperlegible-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Atkinson Hyperlegible";
  src: url("/fonts/atkinson-hyperlegible/AtkinsonHyperlegible-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
:root {
  --brand-font: "Atkinson Hyperlegible", sans-serif;
  --brand-green: #0B7A35;
  --brand-green-dark: #075E29;
  --brand-text: #4A4034;
  --brand-heading: #191611;
  --brand-border: #DED5C9;
  --brand-cream: #F7F3EC;
  --brand-white: #FFFFFF;
  --brand-red: #E40814;
  --brand-red-dark: #B80610;
  --brand-radius: 6px;
  --brand-control-radius: 3px;
}

/* Separate form actions from the fields immediately above them. */
:root form > :is(label, .form-grid, fieldset):has(input, textarea, select) + :is(button, .button, .actions),
:root form > :is(input:not([type="hidden"]), textarea, select) + :is(button, .button, .actions) {
  margin-top: 16px;
}
:root label > :is(input:not([type="checkbox"]):not([type="radio"]), textarea, select) + :is(button, .button) {
  margin-top: 7px;
}