/* tokens.css — the palette + type + motion system.
   Earth tones everywhere; brown + beige lead. The warm halo (--halo) is the
   globe's atmosphere glow. */

:root {
  /* paper / neutrals */
  --paper:      #f4ecdb;
  --paper-2:    #ece0c8;
  --paper-3:    #e2d4b8;
  --line:       #cdbb98;

  /* warm earth — brown hero, beige supporting */
  --clay:       #7a5638;
  --clay-deep:  #5a3d27;
  --clay-soft:  #a3815c;
  --sand:       #d9c6a2;
  --taupe:      #b6a282;
  --sage:       #93a07a;
  --olive:      #79835c;

  /* ink (text) */
  --ink:        #4a3729;
  --ink-soft:   #6e5743;
  --ink-faint:  #927a62;

  /* warm atmosphere glow around the globe (was a cool blue) */
  --halo:       #e7d2a8;

  /* type */
  --font-display: "Hoefler Text", "Baskerville", "Palatino Linotype", Palatino,
                  "Iowan Old Style", Georgia, serif;
  --font-body:    "Avenir Next", "Avenir", "Segoe UI", system-ui, -apple-system,
                  "Helvetica Neue", sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;

  /* shape */
  --radius:    14px;
  --radius-lg: 24px;
  --radius-sm: 9px;

  /* shadow */
  --shadow-soft:  0 12px 34px rgba(74, 55, 41, 0.18);
  --shadow-lift:  0 18px 50px rgba(74, 55, 41, 0.26);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.4);

  /* motion */
  --dur-fast: 220ms;
  --dur:      460ms;
  --dur-slow: 820ms;
  --ease:     cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* layout */
  --maxw: 1100px;
}