/*
 * AB Tutors website — design tokens.
 * Navy, crimson and a warm white, with Lora for headlines and Figtree for text. The tone takes after
 * americanboard.org (serif navy headlines, crimson buttons) without using its logo or its apple.
 * Every colour and the font are set once here.
 */
:root {
  --navy: #024B74;         /* headers, buttons, links, icons (9.2:1 with white) */
  --navy-deep: #02344F;    /* footer, pressed buttons */
  --navy-light: #03639A;   /* text links, focus ring */
  --crimson: #B8202E;      /* the logo ribbon, main buttons, the booked lesson (6.5:1 with white) */
  --crimson-dark: #951A25; /* pressed buttons */
  --red: #B8202E;          /* errors */
  --warm: #FAF7F2;         /* hero and soft bands */
  --fog: #C7D9E8;          /* quiet text and lines on navy */
  --fog-light: #EEF4F9;    /* open times, inner page headers, icon tiles */

  --paper: #FFFFFF;        /* page ground */
  --page: #F4F7F9;         /* tinted bands */
  --line: #D9E3E8;
  --line-strong: #B4C3CE;  /* form field borders */

  --ink: #162A38;          /* body text and headings */
  --muted: #4F6472;        /* secondary text (5.9:1 on --page) */
  --good: #1D6B44;
  --bad: #C12030;

  --serif: "Lora", Georgia, "Times New Roman", serif;
  --sans: "Figtree", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;

  --wrap: 1160px;
  --measure: 62ch;         /* longest comfortable line of body text */
  --radius: 0;             /* panels, cards, tables and fields are square */
  --radius-button: 3px;    /* buttons only, as in the platform */
}

/* Figtree is served from this site (the Content-Security-Policy only allows fonts from 'self'). */
@font-face {
  font-family: "Figtree"; font-style: normal; font-weight: 300 900; font-display: swap;
  src: url("../fonts/figtree-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Figtree"; font-style: normal; font-weight: 300 900; font-display: swap;
  src: url("../fonts/figtree-latin-wght-normal.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Lora, for headlines. Served from this site; licence in assets/fonts/Lora-LICENSE.txt. */
@font-face {
  font-family: "Lora"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("../fonts/lora-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Lora"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("../fonts/lora-latin-wght-normal.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}