/* ==========================================================================
   Design tokens - colours, type, spacing. Change the brand here.
   ========================================================================== */
:root {
  /* Brand */
  --orange: #f26a14;
  --orange-hot: #ff7a1c;
  --orange-deep: #c9470a;
  --amber: #f9a825;
  --gold: #eaa13a;
  --chili: #d62a1f;
  --leaf: #5a9a2e;

  /* Ink (dark paper) */
  --ink-0: #0c0a08;
  --ink-1: #120f0c;
  --ink-2: #1b1612;
  --ink-3: #2a221b;

  /* Cream (light paper) */
  --paper: #f2e4c9;
  --paper-lit: #f8eed9;
  --paper-fibre: #fff8e8;
  --card: #fbf3e2;

  /* Text */
  --text-dark: #2b1b10;
  --text-muted: #8c7b69;
  --text-light: #f4ece0;
  --text-light-muted: #b9ab9b;

  /* Type */
  --font-display: "Yatra One", "Mukta", serif;
  --font-hand: "Kalam", "Mukta", cursive;
  --font-body: "Mukta", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-label: "Poppins", "Mukta", system-ui, sans-serif;

  /* Layout */
  --container: 1280px;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --radius: 14px;
  --header-h: 84px;

  /* Torn edge height (see paper.css) */
  --tear-h: 46px;
}

@media (max-width: 720px) {
  :root {
    --tear-h: 28px;
    --header-h: 68px;
  }
}