/* Firn Dental design tokens. Two worlds: day (restorative) and night (aesthetic).
   Every colour has an RGB triplet twin so JS can interpolate the whole palette during the theme crossfade.
   Contrast (WCAG): ink/paper 12.5:1 · heading/paper 15.8 · muted/paper 5.9 · label/paper 4.56 · accent/paper 4.8
   night: ink/bg 15.1 · muted/bg 8.8 · label/bg 6.0 · accent/bg 9.5 · footer ink on white 14.9 */

@font-face { font-family: "Outfit"; font-style: normal; font-weight: 100 700; font-display: swap; src: url("../fonts/outfit-var-latin.woff2") format("woff2"); }
@font-face { font-family: "Instrument Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/instrument-serif-latin.woff2") format("woff2"); }
@font-face { font-family: "Instrument Serif"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/instrument-serif-italic-latin.woff2") format("woff2"); }

:root {
  --font-sans: "Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif: "Instrument Serif", Georgia, serif;

  /* day: glacier light */
  --bg: #E8ECEE;            --bg-rgb: 232, 236, 238;
  --bg-alt: #F4F7F8;
  --paper: #E8ECEE;         --paper-rgb: 232, 236, 238;
  --ink: #0B2A3C;           --ink-rgb: 11, 42, 60;
  --muted: #4D5B63;
  --heading: #08131A;       --heading-rgb: 8, 19, 26;
  --label: #5F6C72;
  --accent: #1A6E91;        --accent-rgb: 26, 110, 145;
  --accent-end: #6EC1D9;    --accent-end-rgb: 110, 193, 217;
  --line-rgb: 11, 42, 60;
  --card-rgb: 255, 255, 255;
  --glass-rgb: 255, 255, 255;
  --footer-bg: #0B2A3C;     --footer-bg-end: #071E2B;
  --footer-ink: #FFFFFF;    --footer-ink-rgb: 255, 255, 255;
  --btn-bg: #0B2A3C;        --btn-ink: #FFFFFF;
  --overlay-rgb: 232, 236, 238;
  --sky: #5E8FB0;           --sky-rgb: 94, 143, 176;
  --whiteout: #F3F6F7;      --whiteout-rgb: 243, 246, 247;
  --dot: #0B2A3C;           --dot-hi: #6EC1D9;
  --error: #B3402E;

  /* layout */
  --gutter: clamp(20px, 3.4vw, 48px);
  --max: 1440px;
  --radius-s: 3px; --radius-m: 6px; --radius-l: 14px; --radius-pill: 100px;

  /* motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);       /* the house curve: hovers, reveals */
  --ease-in-out: cubic-bezier(0.45, 0, 0.55, 1);    /* breathing loops */
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --dur-fast: 0.25s; --dur: 0.5s; --dur-slow: 0.9s;
}

:root[data-theme="night"] {
  /* night: polar sky over the ice */
  --bg: #08161F;            --bg-rgb: 8, 22, 31;
  --bg-alt: #0B1D28;
  --paper: #0E2230;         --paper-rgb: 14, 34, 48;
  --ink: #E3EAEE;           --ink-rgb: 227, 234, 238;
  --muted: #A9B6BE;
  --heading: #F4F7F8;       --heading-rgb: 244, 247, 248;
  --label: #8695A0;
  --accent: #5FC9E0;        --accent-rgb: 95, 201, 224;
  --accent-end: #8C7BFF;    --accent-end-rgb: 140, 123, 255;
  --line-rgb: 227, 234, 238;
  --card-rgb: 14, 34, 48;
  --glass-rgb: 8, 22, 31;
  --footer-bg: #E3EAEE;     --footer-bg-end: #CBD5DA;
  --footer-ink: #08161F;    --footer-ink-rgb: 8, 22, 31;
  --btn-bg: #E3EAEE;        --btn-ink: #08161F;
  --overlay-rgb: 6, 14, 22;
  --sky: #061019;           --sky-rgb: 6, 16, 25;
  --whiteout: #6F7F88;      --whiteout-rgb: 111, 127, 136;
  --dot: #E3EAEE;           --dot-hi: #FFFFFF;
  --error: #F07A62;
}