/* ==========================================================================
   VARIABLES — Karlows Morris design tokens
   Warm paper + black ink + banana yellow. No neon, no AI-gradient defaults.
   ========================================================================== */
:root{
  /* ---- Color: paper / surfaces ---- */
  --paper:            #F7F4EA;
  --paper-soft:        #FBF9F2;
  --paper-warm:         #F1EBD6;
  --paper-deep:          #EDE6CC;

  /* ---- Color: ink / text ---- */
  --ink:               #17160F;
  --ink-soft:           #2C2A20;
  --muted:               #6F6A59;
  --muted-soft:            #8B8571;

  /* ---- Color: banana accent ---- */
  --banana:            #EFBE22;
  --banana-ink:         #7A5B00;
  --banana-light:        #F7D65F;
  --banana-soft:           #FCEFB4;

  /* ---- Color: lines ---- */
  --border:            #DBD4BC;
  --border-strong:      #C6BC9C;

  /* ---- Color: contrast surfaces ---- */
  --paper-black:       #14130E;
  --paper-black-soft:   #1E1C14;

  /* ---- Color: status ---- */
  --success:           #3E7A35;
  --danger:             #A23B2E;

  /* ---- Glass navbar ---- */
  --glass-bg:          rgba(247, 244, 234, 0.58);
  --glass-bg-scrolled: rgba(251, 249, 242, 0.86);
  --glass-border:      rgba(219, 212, 188, 0.85);
  --glass-border-top:  rgba(255, 253, 246, 0.6);

  /* ---- Type families ----
     Display + mono: Victor Mono — a developer's typeface, semi-bold, italic where
     it earns the emphasis. Keeps the whole technical voice in one family.
     Body: IBM Plex Sans — clean, highly readable.
     Hand: Caveat — sparing use for annotations only. */
  --font-display: 'Victor Mono', 'SFMono-Regular', Consolas, monospace;
  --font-body:    'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:    'Victor Mono', 'SFMono-Regular', Consolas, monospace;
  --font-hand:    'Caveat', cursive;

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(.16,.9,.3,1);
  --ease-soft: cubic-bezier(.4,0,.2,1);
  --dur-fast: 180ms;
  --dur-base: 260ms;
  --dur-slow: 420ms;

  /* ---- Elevation ---- */
  --shadow-sm: 0 2px 8px rgba(26,22,10,0.05);
  --shadow-md: 0 8px 24px rgba(26,22,10,0.07);
  --shadow-lg: 0 16px 40px rgba(26,22,10,0.10);
  --shadow-glass: 0 8px 30px rgba(26,22,10,0.08);

  /* ---- Radius ---- */
  --radius-card: 18px;
  --radius-btn: 12px;
  --radius-tag: 999px;

  /* ---- Layout ---- */
  --container: 1320px;

  /* ---- Links (editable in one place) ---- */
  --url-support: "#";
}
