/* ---------------------------------------------------------------
   Silo brand tokens
   NOTE: reconstructed from the brand brief because the
   Silo_Design_System folder is not present in this repo.
   When the real Silo_Design_System/tokens.css lands, replace this
   file with it and reconcile any drift (accent hex values for
   honey, sage, sky and plum were not specified and are educated
   guesses here).
   --------------------------------------------------------------- */

:root {
  /* Colour — core */
  --bg: #f8f8f6;            /* off-white page background */
  --paper: #ffffff;         /* white cards */
  --ink: #0e0e0c;           /* near-black, never pure black */
  --ink-soft: #5c5c55;      /* secondary text on light */
  --ink-faint: #6e6e66;     /* tertiary text, captions (AA on bg and paper) */
  --line: rgba(14, 14, 12, 0.1);
  --line-soft: rgba(14, 14, 12, 0.06);

  /* Colour — accent */
  --coral: #fb6c61;         /* the one accent, one primary action per screen */
  --coral-deep: #e8584d;    /* hover */
  --coral-tint: #feeae8;    /* soft coral wash */
  --coral-text: #b03a30;    /* coral for small text on coral-tint (AA) */

  /* Colour — decorative accents, small moments only */
  --honey: #e0a64f;
  --honey-tint: #f7ecdb;
  --sage: #8fa888;
  --sage-tint: #e9efe6;
  --sky: #8cb3cc;
  --sky-tint: #e6eef3;
  --plum: #a187a7;
  --plum-tint: #efe9f0;

  /* Colour — on ink */
  --on-ink: #f8f8f6;
  --on-ink-soft: rgba(248, 248, 246, 0.66);

  /* Type */
  --font: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --text-display: clamp(2.75rem, 7.5vw, 5rem);
  --text-h2: clamp(2rem, 4.5vw, 3.1rem);
  --text-h3: clamp(1.2rem, 2vw, 1.4rem);
  --text-lead: clamp(1.1rem, 1.8vw, 1.3rem);
  --text-body: 1.0625rem;
  --text-small: 0.9375rem;
  --text-caption: 0.8125rem;

  /* Radius */
  --radius-card: 24px;
  --radius-tile: 16px;
  --radius-pill: 999px;

  /* Buttons */
  --btn-height: 56px;
  --btn-height-sm: 44px;

  /* Space */
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 8rem;

  /* Motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.7s;
}
