/* assets/tokens/tokens.css — Archis Dental Clinic design tokens */

:root {
  /* ── Colour ─────────────────────────────────────────── */
  --archis-bone:    #FAFAF8;  /* page ground */
  --archis-linen:   #EFEDE6;  /* secondary surface */
  --archis-white:   #FFFFFF;  /* cards on bone */
  --archis-line:    #E2E0DA;  /* hairline dividers */
  --archis-stroke:  #C9C6BD;  /* outlined controls */

  --archis-ink:     #141414;  /* primary text, dark surfaces */
  --archis-ink-70:  #4A4A48;  /* body text */
  --archis-ink-45:  #6E6E6A;  /* captions, labels */
  --archis-ink-30:  #8E8B84;  /* disabled */

  --archis-night:   #1C1B19;  /* raised surface on ink */
  --archis-night-line: #2E2D2A;
  --archis-night-stroke: #3A3835;

  --archis-enamel:  #0E9E92;  /* accent — fills, graphics */
  --archis-deep:    #0B6B63;  /* accent — text & buttons (AA on bone) */
  --archis-deeper:  #073F3A;  /* accent — pressed */
  --archis-mint:    #6FD8CC;  /* accent on dark */
  --archis-mint-ink:#0A3F3A;  /* text on mint */
  --archis-wash:    #DFF1EF;  /* accent tint surface */

  --archis-gum:     #F0C7B1;  /* warm — human moments */
  --archis-gum-ink: #6B4F3F;

  /* ── Type ───────────────────────────────────────────── */
  --archis-font-display: 'Instrument Serif', Georgia, serif;
  --archis-font-sans: 'Manrope', system-ui, -apple-system, sans-serif;

  --archis-text-xs:   11px;
  --archis-text-sm:   12px;
  --archis-text-base: 13px;
  --archis-text-md:   14px;
  --archis-text-lg:   15px;
  --archis-text-xl:   17px;
  --archis-text-2xl:  21px;
  --archis-display-sm: 26px;
  --archis-display-md: 32px;
  --archis-display-lg: 42px;

  --archis-tracking-label: 0.14em;
  --archis-tracking-lockup: 0.30em;

  /* ── Space (4pt) ────────────────────────────────────── */
  --archis-space-1: 4px;
  --archis-space-2: 8px;
  --archis-space-3: 12px;
  --archis-space-4: 16px;
  --archis-space-5: 20px;
  --archis-space-6: 24px;
  --archis-space-7: 28px;
  --archis-space-8: 32px;

  --archis-gutter: 22px;        /* app screen side padding */

  /* ── Radius ─────────────────────────────────────────── */
  --archis-radius-sm: 8px;
  --archis-radius-md: 12px;
  --archis-radius-lg: 16px;
  --archis-radius-xl: 20px;
  --archis-radius-2xl: 22px;
  --archis-radius-sheet: 26px;
  --archis-radius-pill: 999px;

  /* ── Motion ─────────────────────────────────────────── */
  --archis-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --archis-dur-app: 200ms;      /* app: 150–250ms */
  --archis-dur-web: 320ms;      /* web: 200–400ms */
  --archis-stagger: 60ms;
  --archis-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── Targets ────────────────────────────────────────── */
  --archis-tap-min: 48px;
}