/* Healthero branding for the pre-work form, passcode screen, and admin page.
   Colors were sampled from the Healthero site screenshot. Fonts are hosted
   here (no requests to outside font services).
   To change the look, edit the values in :root below, or change the wordmark below. */

@font-face { font-family: "Nunito"; font-weight: 400; font-style: normal; font-display: swap; src: url("fonts/nunito-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Nunito"; font-weight: 600; font-style: normal; font-display: swap; src: url("fonts/nunito-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Nunito"; font-weight: 700; font-style: normal; font-display: swap; src: url("fonts/nunito-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Fraunces"; font-weight: 400; font-style: normal; font-display: swap; src: url("fonts/fraunces-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Fraunces"; font-weight: 600; font-style: normal; font-display: swap; src: url("fonts/fraunces-latin-600-normal.woff2") format("woff2"); }

:root {
  --bg: #fafafa;            /* page background */
  --bar: #e7e8e2;          /* header bar behind the logo */
  --bar-line: #d8d8d4;
  --card: #ffffff;
  --ink: #2e2e2d;          /* body text */
  --head: #000000;         /* headings */
  --muted: #5f615e;
  --line: #d8d8d4;
  --line-soft: #e6e6e2;
  --field-line: #a9aaa4;
  --accent: #1d1d1d;       /* buttons, links, numbers */
  --accent-ink: #ffffff;
  --focus: #1b6ef3;
  --error: #a12622;
  --error-ink: #7a1e1a;
  --notice-bg: #f1f1ec;
  --notice-line: #d4d4cb;
  --ok-bg: #e8eee6;
  --ok-line: #aebfaa;
  --err-bg: #f6e6e4;
  --err-line: #d9aaa5;
}

body {
  font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: var(--bg);
  color: var(--ink);
}

h1, h2 {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  color: var(--head);
  letter-spacing: -0.005em;
}
h1 { font-weight: 400; }
h2 { font-weight: 600; }

a { text-decoration: underline; text-underline-offset: 2px; }

.brand-bar {
  background: var(--bar);
  border-bottom: 1px solid var(--bar-line);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  padding: 14px 16px;
  text-align: center;
}
.wordmark {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--head);
  line-height: 1.2;
}
.wordmark b { font-weight: 600; }
@media (max-width: 520px) {
  .wordmark { font-size: 1.3rem; }
}