:root {
  --gapSection3: 2.4rem;
  --gapSection2: 1.8rem;
  --gapSection1: 1.5rem;
  --gapPair: 1rem;
  --gapWithinPair: 0.6rem;
  --gapWithinSubPair: 0.3rem;
  --containerPadding-main: clamp(1.2rem, 0.4rem + 1.7vw, 2.5rem);
  --containerPadding-content: clamp(1rem, 0.4rem + 5vw, 5rem);
  --containerPadding-content-small: clamp(1rem, 0.2rem + 2.5vw, 2.5rem);
  --containerPadding-page: clamp(1rem, 0.4rem + 1.4vw, 5rem);
  --containerPadding-fieldset: 1rem;
  --containerPadding-medium: 0.6rem;
  --containerPadding-small: 0.4rem;
  /*
  Calculated using https://www.desmos.com/calculator/vcu39oluty

  Minimum width target: 400px screen width => 342px (21.4rem)

  Target end widths
  thin:   400px screen width => 200px (12.5rem)
  		2200px screen width => 250px (15.6rem)
  medium: 2200px screen width => 510px (31.9rem)
  wide:   2200px screen width => 820px (51.3rem)
  */
  --paragraphWidth-thin: clamp(12.5rem, calc(18.2ch + 2.8vw), 15.6rem);
  --paragraphWidth-medium: clamp(21.4rem, calc(29.3ch + 9.32vw), 31.9rem);
  --paragraphWidth-wide: clamp(21.4rem, calc(22.7ch + 26.6vw), 51.3rem);
  --paragraphMinWidth-thin: min(10ch, 100%);
  --paragraphMinWidth-medium: min(20ch, 100%);
  --paragraphMinWidth-wide: min(30ch, 100%);
  --inputWidth: 25ch;
  --inputWidth-short: 5ch;
  --borderRadius-small: 0.2rem;
  --borderRadius-medium: 0.4rem;
  --borderRadius-large: 0.6rem;
  --duration-veryLong: 1.5s;
  --duration-long: 0.8s;
  --duration-medium: 0.5s;
  --duration-short: 0.3s;
  --duration-veryShort: 0.2s;
  --headerSize1: clamp(1.6rem, 0.5rem + 2vw, 2.4rem);
  --headerSize2: clamp(1.3rem, 0.4rem + 1.6vw, 1.6rem);
  --headerSize3: 1.17rem;
  --headerSize4: 1rem;
  --fieldsetHeaderSize: clamp(1.1rem, 0.2rem + 1.2vw, 1.4rem);
  --fieldsetHeaderSize-nested: clamp(1rem, 0.2rem + 1vw, 1.2rem);
  --font-normal: "Atkinson Hyperlegible", Arial, sans-serif;
  --font-heading: "Poppins", "Atkinson Hyperlegible", Arial, sans-serif;
  --font-input: "Noto Sans Display", Arial, sans-serif;
  --weight-heading: 700;
}
@media (max-width: 25rem) {
  :root {
    --paragraphWidth-thin: 100%;
    --paragraphWidth-medium: 100%;
    --paragraphWidth-wide: 100%;
  }
}

.marginBlock-section2 {
  margin-block: var(--gapSection2);
}

.marginInline-section2 {
  margin-inline: var(--gapSection2);
}

.marginBlockStart-section2 {
  margin-block-start: var(--gapSection2);
}

.marginBlockEnd-section2 {
  margin-block-end: var(--gapSection2);
}

.marginInlineStart-section2 {
  margin-inline-start: var(--gapSection2);
}

.marginInlineEnd-section2 {
  margin-inline-end: var(--gapSection2);
}

.marginBlock-section1 {
  margin-block: var(--gapSection1);
}

.marginInline-section1 {
  margin-inline: var(--gapSection1);
}

.marginBlockStart-section1 {
  margin-block-start: var(--gapSection1);
}

.marginBlockEnd-section1 {
  margin-block-end: var(--gapSection1);
}

.marginInlineStart-section1 {
  margin-inline-start: var(--gapSection1);
}

.marginInlineEnd-section1 {
  margin-inline-end: var(--gapSection1);
}

.marginBlock-pair {
  margin-block: var(--gapPair);
}

.marginInline-pair {
  margin-inline: var(--gapPair);
}

.marginBlockStart-pair {
  margin-block-start: var(--gapPair);
}

.marginBlockEnd-pair {
  margin-block-end: var(--gapPair);
}

.marginInlineStart-pair {
  margin-inline-start: var(--gapPair);
}

.marginInlineEnd-pair {
  margin-inline-end: var(--gapPair);
}

.marginBlock-withinPair {
  margin-block: var(--gapWithinPair);
}

.marginInline-withinPair {
  margin-inline: var(--gapWithinPair);
}

.marginBlockStart-withinPair {
  margin-block-start: var(--gapWithinPair);
}

.marginBlockEnd-withinPair {
  margin-block-end: var(--gapWithinPair);
}

.marginInlineStart-withinPair {
  margin-inline-start: var(--gapWithinPair);
}

.marginInlineEnd-withinPair {
  margin-inline-end: var(--gapWithinPair);
}/*# sourceMappingURL=definitions.css.map */