/* ============================================================
   Jungle Land redesign — design tokens
   Single source of truth for colors, fonts, radii, shadows.
   Values extracted from the approved design prototypes.
   ============================================================ */

@font-face {
  font-family: 'Grandstander';
  src: url('/fonts/grandstander-v20-latin-500.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Grandstander';
  src: url('/fonts/grandstander-v20-latin-600.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Grandstander';
  src: url('/fonts/grandstander-v20-latin-700.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Grandstander';
  src: url('/fonts/grandstander-v20-latin-800.woff2') format('woff2');
  font-weight: 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Quicksand';
  src: url('/fonts/quicksand-v37-latin-500.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Quicksand';
  src: url('/fonts/quicksand-v37-latin-600.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Quicksand';
  src: url('/fonts/quicksand-v37-latin-700.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}

:root {
  /* palette */
  --bg: #FDF9ED;            /* cream page background */
  --ink: #17421F;           /* deep jungle green — headings, primary surfaces */
  --ink-deep: #0B2413;      /* darkest green — topbar, footer */
  --accent: #F26430;        /* orange — primary CTA */
  --accent-deep: #C24E1F;
  --sun: #FFC93C;           /* yellow — highlights, links on dark */
  --leaf: #8CC63E;
  --green: #2E7D32;         /* link green */
  --green-mid: #58A63C;
  --sky: #7EC8E3;
  --blue: #2A6496;
  --plum: #6A4E9C;
  --berry: #9C3E7A;
  --gold: #9A6B00;

  /* neutrals */
  --sand: #F4EEDA;          /* alt section background */
  --sand-line: #E4DCC4;     /* borders */
  --sand-chip: #EFE8D2;     /* disabled chip */
  --sand-dim: #B2A98E;      /* placeholder / hints */
  --body: #5B614F;          /* body text on cream */
  --body-2: #4A5240;
  --muted: #7A806D;
  --moss: #8A9078;

  /* tints */
  --pale-green: #DDEFC8;
  --pale-mint: #E9F6D8;
  --pale-orange: #FFE9C9;
  --pale-peach: #FFE3D6;
  --pale-blue: #DCEBF7;
  --pale-ice: #E4EEF9;
  --pale-pink: #F6DFEF;
  --pale-yellow: #FFF1C9;
  --pale-purple: #E9DFF6;
  --pale-note: #FFF6E0;     /* dashed notice background */
  --note-line: #E8C978;
  --note-ink: #8A6D1A;

  /* on-dark */
  --cream: #FDF9ED;
  --cream-92: rgba(253, 249, 237, .92);
  --on-dark-dim: #9DB392;   /* footer links, muted on green */
  --on-dark-body: #BFD0B4;
  --footer-dim: #7E9478;
  --footer-faint: #61795C;
  --topbar-tint: #CDE8A0;

  /* fonts */
  --font-display: 'Grandstander', cursive;
  --font-body: 'Quicksand', system-ui, sans-serif;

  /* radii */
  --r-xl: 32px;
  --r-lg: 28px;
  --r-md: 22px;
  --r-sm: 16px;
  --r-xs: 13px;
  --r-pill: 999px;

  /* shadows */
  --sh-card: 0 12px 30px rgba(23, 66, 31, .08);
  --sh-card-sm: 0 10px 24px rgba(23, 66, 31, .07);
  --sh-card-hover: 0 22px 44px rgba(23, 66, 31, .14);
  --sh-modal: 0 34px 90px rgba(0, 0, 0, .45);
  --sh-header: 0 8px 22px rgba(11, 36, 19, .35);
  --sh-cta: 0 10px 24px rgba(0, 0, 0, .3);

  /* layout */
  --w-page: 1240px;
  --w-content: 1160px;
  --w-narrow: 960px;
  --pad-x: 40px;
  --header-h: 76px;
}

@media (max-width: 720px) {
  :root {
    --pad-x: 20px;
  }
}
@media (max-width: 360px) {
  :root {
    --pad-x: 14px;
  }
}