/* Upglory marketing site, design tokens (concept D "Kinetic", 2026-09-24).
   One file, every value the marketing pages may use. The dashboard has its
   own token file later; where the two agree it is on purpose, never by
   inheritance. Fonts load from Google for the explorations; the shipped
   site self-hosts them.

   Every length is in rem. The root grows with the screen, so a large
   monitor reads at 18 to 1.25rem where a laptop reads at 16, and every
   size, space, radius and control scales with it. Hairlines stay 1px. */
html {
  /* 1rem up to about 1280 wide, 18.7 at 1920, 20 from 2300. */
  font-size: clamp(100%, 0.75rem + 0.35vw, 125%);
}
:root {
  /* Fields. The page is cream; whole sections may be ink, cobalt or violet
     ("acts"). Colour commits at section scale, never as scattered accents. */
  --cream: #F4F1E8;
  --cream-2: #EBE7DB;
  --white: #FFFFFF;
  --ink: #101112;
  --ink-2: #2A2B2E;
  --cobalt: #1F3FE5;
  --cobalt-2: #152CA8;
  --violet: #5B4BE0;
  --violet-2: #4A3BC4;
  --violet-ground: #EDEAFB;

  /* Words on cream. */
  --text: #101112;
  --text-2: #4A4843;
  --text-3: #6E6B64;
  /* Words on a dark field. */
  --text-on-dark: #F4F1E8;
  --text-on-dark-2: rgba(244, 241, 232, .74);
  --text-on-dark-3: rgba(244, 241, 232, .52);

  /* Rules. */
  --line: rgba(16, 17, 18, .12);
  --line-strong: rgba(16, 17, 18, .32);
  --line-on-dark: rgba(244, 241, 232, .16);

  /* States: the product's five, one hue each, plus a ground for a chip. */
  --up: #146E44;
  --up-ground: #E3F2EA;
  --degraded: #8F5300;
  --degraded-ground: #FBF0DD;
  --down: #E8462F;
  --down-text: #C7311C;
  --down-ground: #FCE7E2;
  --paused: #5C5952;
  --paused-ground: #EBE7DB;
  --pending: #4C6C8C;
  --pending-ground: #E7EDF3;

  /* Check locations on a chart, one hue per location. Never a state colour.
     Copy never names or counts the locations (D-189); the product lists them. */
  --loc-1: #1F3FE5;
  --loc-2: #8A4FA8;
  --loc-3: #B8471E;

  /* Type. Three faces, one job each. */
  --font-display: "Space Grotesk", "Outfit", system-ui, sans-serif;
  --font-text: "Outfit", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Type scale. Display sizes are fluid; everything else is fixed. */
  --t-display-xl: clamp(3rem, 7.2vw, 7rem);     /* the act headline, max 11ch */
  --t-display-l: clamp(2.2rem, 5vw, 4.4rem);    /* a section headline */
  --t-display-m: clamp(1.75rem, 3.2vw, 2.75rem); /* a page headline below the hero */
  --t-title: 1.375rem;                            /* 22, a card title */
  --t-lead: clamp(1.1rem, 1.6vw, 1.35rem);        /* the sentence under a headline */
  --t-body: 1.0625rem;                            /* 17 */
  --t-body-s: 0.9375rem;                          /* 15 */
  --t-small: 0.875rem;                            /* 14 */
  --t-mono: 0.875rem;                             /* 14 */
  --t-mono-s: 0.8125rem;                          /* 13 */
  --t-kicker: 0.8125rem;                          /* 13 mono uppercase, one per act at most */

  --lh-display: .92;
  --lh-tight: 1.1;
  --lh-text: 1.45;
  --lh-loose: 1.6;
  --ls-display: -.04em;
  --ls-tight: -.02em;
  --ls-kicker: .08em;

  /* Space. An eight-step scale; sections use the top of it. */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
  --s-10: 8rem;

  /* Measure and grid. */
  --page: 80rem;
  --gutter: 2rem;
  --gutter-phone: 1.25rem;
  --measure: 40ch;   /* a paragraph under a headline */
  --measure-l: 56ch; /* running text on a text page */

  /* Shape. Pills for actions and chips, soft corners for plates, none for fields. */
  --r-pill: 62.4375rem;
  --r-card: 0.875rem;
  --r-card-l: 1.125rem;
  --r-code: 0.75rem;
  --r-chip: 0.375rem;

  /* Elevation. One shadow, for a card lifted off a dark field; cream plates carry none. */
  --shadow-lift: 0 2.5rem 5rem -2.5rem rgba(0, 0, 0, .6);

  /* Motion. One curve; three durations; the act pin is the page's one big move. */
  --ease: cubic-bezier(.16, 1, .3, 1);
  --d-fast: 300ms;
  --d-base: 500ms;
  --d-slow: 700ms;

  /* Controls. */
  --control: 3rem;   /* a button */
  --control-s: 2.5rem; /* a small button, a chip filter */
  --tap: 3rem;       /* nothing a thumb hits is smaller */
}
