/*
 * @file: variables.css
 * values in use throughout codebase
 */

:root {
  /* COLORS */
  --color-white: #fff;
  --color-black: #000;
  --color-dark-gray: #333;
  --color-medium-gray: #666;
  --color-medium-gray-2: #676767;
  --color-medium-gray-3: #737373;
  --color-light-gray: #ebebeb;
  --color-blue: #007fad;
  --color-medium-blue: #4bbbe0;
  --color-light-blue: #a4d8ef;
  --color-red: #a70e13;

  --app-bg: var(--color-white);
  --nav-bg: var(--color-white);

  /*
    FONTS

    Font stacks referenced here are defined in ./fonts.css and contain a
    font's name and size-optimized fallbacks created to reduce layout shift.

    Usage:
    - Context-specific variables (heading, subheading, body) should be the first choice.
    - Generic variables (sans, serif, display) should be used when the context doesn't fit or is unknown
    - Never use the font stack variables directly.
  */

  /* Global Defaults */
  --font-sans: var(--font-stack-america, Helvetica, Arial, sans-serif);
  --font-serif: var(--font-stack-crimson, Georgia, serif);
  --font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono",
    "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono",
    "Courier New", monospace; /* https://modernfontstacks.com/ */

  /* UI elements */
  --font-display: var(--font-stack-america, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, sans-serif);

  /* Headings */
  --font-heading: var(--font-sans);
  --font-subheading: var(--font-serif);

  /* Body copy */
  --font-body: var(--font-serif);

  /* Layout */
  --standard-gutter: 20px;
  --standard-width: calc(100% - 40px);
  --standard-max-width: 1280px;

  /* App Navigation */
  /* Space above the nav when sticky (e.g. to accomodate a banner) */
  --nav-inset-top: 0px;
  /* Height of the nav. Set to 0 as a fallback in case the page lacks a nav component. */
  --nav-height: 0px;

  /**
   * The total offset of the navbar
   * Used to offset anchor links to account for the navbar and
   * positioning other fixed elements
   */
  --nav-offset: calc(var(--nav-inset-top, 0px) + var(--nav-height, 0px));
}

/*
  SciAm Reset
  A subset of essentials pulled from modern-normalize and cssremedy.

  About CSS Remedy:
  > Sets CSS properties or values to what they would be if the CSSWG were creating the CSS today,
  > from scratch, and didn’t have to worry about backwards compatibility.

  Notable differences from both:
  - Removed compatibility fixes for dead browsers (IE, non-Chromium Edge/Opera, etc.)
  - Removed elements that will likely go unused
  - Tweaks to make component development more predictable
  - :where() used extensively for zero specificity
  - Forms aren't really reset, just mildly more consistent
*/

/**
 * ----------------
 * Document
 * ----------------
 */

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Predictable border behavior across browsers and elements
     ++ allow us to add a border to an element by simply adding a border-width
*/

:where(*, ::before, ::after) {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: currentColor;
  border-color: var(--border-color, currentColor); /* 2 */
}

/*
1. Set default font size to 16px
2. Use a consistent sensible line-height in all browsers.
3. Use default display stack or system font stack instead of Times.
4. Prevent adjustments of font size after orientation changes in iOS.
5. Use a more readable default tab size.
*/

html {
  font-size: 100%; /* 1 */
  line-height: 1.5; /* 2 */
  font-family: "GT America", "America Temp: Helvetica Neue", "America Temp: Helvetica", "America Temp: Arial", "America Temp: Roboto";
  font-family: var(--font-display, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, sans-serif); /* 3 */
  -webkit-text-size-adjust: 100%; /* 4 */
  /* DISABLED: Uncomment if we start using code blocks
  -moz-tab-size: 4;
  tab-size: 4;
  */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so we can set them via `html` class across browsers
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/**
 * ----------------
 * Flow Content
 * ----------------
 */

/* Reset default spacing */

:where(blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre) {
  margin: 0;
}

:where(fieldset) {
  margin: 0;
  padding: 0;
}

:where(legend) {
  padding: 0;
}

:where(ol, ul, menu) {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
1. Correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

:where(hr) {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Remove the default font size and weight for headings.

This puts the burden of styling headings to the component scope and
establishes headings as purely semantic elements.
*/

:where(h1, h2, h3, h4, h5, h6) {
  font-size: inherit;
  font-weight: inherit;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

:where(table) {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/**
 * ----------------
 * Phrasing Content
 * https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories#phrasing_content
 * ----------------
 */

/* DISABLED: Reset links to optimize for opt-in styling instead of opt-out.
:where(a) {
  color: inherit;
  text-decoration: inherit;
}
*/

/*
1. Set proper `mono` font family by default.
2. Correct `em` font sizing inconsistencies across browsers.
*/

/* DISABLED: Uncomment if we start using code blocks
:where(code, kbd, samp, pre) {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 1em;
}
*/

/*
Correct font size in all browsers.
*/

:where(small) {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from shifting line heights.
*/

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

:where(sub) {
  bottom: -0.25em;
}

:where(sup) {
  top: -0.5em;
}

/* Add the correct display in Safari. */

:where(summary) {
  display: list-item;
}

/**
 * ----------------
 * Interactive Content
 * https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories#interactive_content
 * ----------------
 */

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

:where(button, input, optgroup, select, textarea) {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

:where(button, select) {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

:where(button, [type="button"], [type="reset"], [type="submit"]) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

:where([type="search"]) {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to a nice cool gray.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

:where(button, [role="button"]) {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:where(:disabled) {
  cursor: default;
}

/*
 * ----------------
 * Replaced Elements / Embedded Content
 * https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element
 * https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories#embedded_content
 * ----------------
 */

/*
1. Treat embedded objects like the block-scoped elements we think they are. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

:where(img, svg, video, canvas, audio, iframe, embed, object) {
  display: block; /* 1 */
  vertical-align: middle;
}

/*
1. Prevent images from breaking out of their containers.
2. Preserve intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
3. Never stretch images.
*/

:where(img, video) {
  max-width: 100%; /* 1 */
  height: auto; /* 2 */
  -o-object-fit: cover;
     object-fit: cover; /* 3 */
}

/* These are inline by default which often causes unexpected spacing issues. */

:where(picture) {
  display: contents;
}

:where(source) {
  display: none;
}

/**
 * ----------------
 * Other
 * ----------------
 */

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden] {
  display: none;
}

/**
 * Crimson Text, pulled from Google Fonts
 * https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap
 */

/* vietnamese */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/static/assets/Crimson Text-reg_it_vi-82cceeb9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
  size-adjust: 115%;
}

/* latin-ext */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/static/assets/Crimson Text-reg_it_ex-ecf7fc23.woff2") format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  size-adjust: 115%;
}

/* latin */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/static/assets/Crimson Text-reg_it-381a244e.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  size-adjust: 115%;
}

/* vietnamese */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("/static/assets/Crimson Text-semibold_it_vi-8b87a226.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
  size-adjust: 115%;
}

/* latin-ext */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("/static/assets/Crimson Text-semibold_it_ex-5b34977c.woff2") format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  size-adjust: 115%;
}

/* latin */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("/static/assets/Crimson Text-semibold_it-6c40672d.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  size-adjust: 115%;
}

/* vietnamese */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("/static/assets/Crimson Text-bold_it_vi-bebcfb14.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
  size-adjust: 115%;
}

/* latin-ext */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("/static/assets/Crimson Text-bold_it_ex-ddfb0e44.woff2") format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  size-adjust: 115%;
}

/* latin */

@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("/static/assets/Crimson Text-bold_it-875b693a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  size-adjust: 115%;
}

/* vietnamese */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/assets/Crimson Text-reg-aac0df38.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
  size-adjust: 115%;
}

/* latin-ext */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/assets/Crimson Text-reg_ex-c874bcb3.woff2") format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  size-adjust: 115%;
}

/* latin */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/assets/Crimson Text-reg-aac0df38.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  size-adjust: 115%;
}

/* vietnamese */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/assets/Crimson Text-semibold_vi-e72d7de1.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
  size-adjust: 115%;
}

/* latin-ext */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/assets/Crimson Text-semibold_ex-f150e228.woff2") format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  size-adjust: 115%;
}

/* latin */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/assets/Crimson Text-semibold-94af2060.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  size-adjust: 115%;
}

/* vietnamese */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/assets/Crimson Text-bold_vi-8dee6155.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
  size-adjust: 115%;
}

/* latin-ext */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/assets/Crimson Text-bold_ex-28ae72da.woff2") format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  size-adjust: 115%;
}

/* latin */

@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/assets/Crimson Text-bold-2fcaf682.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  size-adjust: 115%;
}

@font-face {
  font-family: "GT America";
  src: url('/static/assets/GT-America-Standard-Regular-e5f8894e.woff2') format('woff2');
  font-display: swap;
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "GT America";
  src: url('/static/assets/GT-America-Standard-Regular-Italic-8034e51e.woff2') format('woff2');
  font-display: swap;
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: "GT America";
  src: url('/static/assets/GT-America-Standard-Bold-d386c658.woff2') format('woff2');
  font-display: swap;
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "GT America";
  src: url('/static/assets/GT-America-Standard-Bold-Italic-915de75d.woff2') format('woff2');
  font-display: swap;
  font-weight: 700;
  font-style: italic;
}

/**
 * Font Stacks
 *
 * In order to reduce the layout shift caused by font loading, we use these font stacks to
 * ensure that the fallback fonts have approximately the same metrics as the fonts they are replacing.
 *
 * The font stacks were generated with packages provided by @capsizecss, then hand-tweaked.
 */

/** Generated Font Stack Fallbacks **/

@font-face {
  font-family: "America Temp: Helvetica Neue";
  src: local('Helvetica Neue');
  ascent-override: 99.1131%;
  descent-override: 25.5712%;
  size-adjust: 101.3%; /* Hand-tweaked from 100.8949%;*/
}

@font-face {
  font-family: "America Temp: Helvetica Neue";
  font-weight: 700;
  src: local('Helvetica Neue Bold');
  ascent-override: 99.1131%;
  descent-override: 25.5712%;
  size-adjust: 100%;
}

@font-face {
  font-family: "America Temp: Helvetica";
  src: local('Helvetica');
  ascent-override: 97.8728%;
  descent-override: 25.2512%;
  size-adjust: 102.1735%;
}

@font-face {
  font-family: "America Temp: Arial";
  src: local('Arial');
  ascent-override: 97.8728%;
  descent-override: 25.2512%;
  size-adjust: 102.1735%;
}

@font-face {
  font-family: "America Temp: Roboto";
  src: local('Roboto');
  ascent-override: 97.981%;
  descent-override: 25.2791%;
  size-adjust: 102.0606%;
}

@font-face {
  font-family: "Crimson Temp: Times New Roman";
  src: local('Times New Roman');
  ascent-override: 97.4198%;
  descent-override: 35.9812%;
  size-adjust: 112.051285%;
}

@font-face {
  font-family: "Crimson Temp: Georgia";
  src: local('Georgia');
  ascent-override: 106.9358%;
  descent-override: 39.4958%;
  size-adjust: 101.3725%; /* Hand-tweaked from 88.7653% */
}

@font-face {
  font-family: "Crimson Temp: Georgia";
  font-weight: 700;
  src: local('Georgia Bold');
  ascent-override: 112.6794%;
  descent-override: 41.6172%;
  size-adjust: 95.795%; /* Hand-tweaked from 84.2407% */
}

/** Font Stacks **/

:root {
  --font-stack-crimson: "Crimson Text", "Crimson Temp: Georgia", "Crimson Temp: Times New Roman";
  --font-stack-america: "GT America", "America Temp: Helvetica Neue", "America Temp: Helvetica", "America Temp: Arial", "America Temp: Roboto";
}

html {
  background: #fff;
  background: var(--app-bg, #fff);
  scroll-padding-top: calc(0px + 0px);
  scroll-padding-top: var(--nav-offset, 1rem);
  /* scroll-behavior: smooth; */
}

body {
  font-family: "GT America", "America Temp: Helvetica Neue", "America Temp: Helvetica", "America Temp: Arial", "America Temp: Roboto";
  font-family: var(--font-display);
  color: #333;
  color: var(--color-dark-gray);
}