/* One Happy Leaf -- brand design tokens
 * Signed-off homepage direction: V7 (Field Guide + editorial lower), 2026-05-30.
 * Palette character: MUTED warm-natural (bamboo + leaf green + cream).
 * The brand's joy comes from whimsical product form + gentle motion, NOT loud colour.
 */
:root{
  /* Palette (hex is fine for the freeform concept) */
  --paper:#FBF7EE;        /* warm cream paper / background (echoes the white product display cards) */
  --paper-2:#F3ECDD;      /* secondary cream surface */
  --ink:#36302A;          /* soft warm charcoal-brown, never pure black */
  --ink-soft:#6B6358;     /* muted ink for body copy */
  --bamboo:#C6A06A;       /* warm blonde bamboo -- the material signature */
  --bamboo-deep:#7E5E2C;  /* deeper bamboo for eyebrows / labels -- darkened for >=4.5:1 contrast on cream (WCAG AA) */
  --green:#5E7D43;        /* leaf green -- the eco / botanical anchor (logo green) */
  --green-light:#8CAE63;  /* lighter botanical green for highlights / growth motifs */
  --line:rgba(54,48,42,.16);   /* hairline rules, brand-ink-tinted */

  /* Shadow tint: derive layered shadows from the ink colour, never 0 0 0 */
  --shadow-rgb:54,48,42;

  /* Typography -- two distinct families + a mono for editorial labels */
  --display:"Fraunces",Georgia,serif;   /* optical soft serif, organic + characterful */
  --body:"Spectral",Georgia,serif;      /* refined reading serif */
  --mono:"IBM Plex Mono",monospace;     /* eyebrows / specimen labels / meta */

  /* Container rails -- 1440 wide (editorial-luxury rail), ~60% narrow, fluid padding */
  --rails-wide:1440px;
  --rails-narrow:880px;
  --rails-pad:clamp(1.5rem,5vw,4.5rem);

  /* Token-derived contrast: floating nav over the light hero uses ink (MUTED brand, light hero) */
  --nav-fg-floating:var(--ink);
}
