/* Copied verbatim from Clarkit3ct/reworld-design-system/colors_and_type.css (v2 tokens) on 2026-09-16 [S139-sablefarms]. Edit upstream first. */
/* ─────────────────────────────────────────────────────────────
   re•world design system · v2 tokens — THE BRAND
   Sources, in order of authority:
     · 26-0607 Boulder Creek Investment Deck  (pixel-sampled, 21 pages)
     · 26-0131 Business Plan "An Invitation to Regenerate" (19 pages)
     · reworld.us  (live, measured 2026-07-15)
     · @reworld.us Instagram  (mood: dark green photography,
       light lowercase letterspaced overlays)
   Art direction, RC 2026-07-16: greens lead — deeper, more
   presence. Brown demoted. Cormorant Garamond + Inter.

   v1 of this file tokenized the internal hub by mistake; that
   system now lives, intact and clearly labelled, at
   ui_kits/hub/tokens.css. It is NOT the brand.
   ───────────────────────────────────────────────────────────── */

:root{

  /* ── grounds · warm paper, from both decks ───────────────── */
  --cream:#f7f1e8;   /* light ground · June deck 19%           */
  --sand:#ede8da;    /* THE ground · dominant in both decks    */
  --white:#ffffff;   /* sparing — pull-outs, tables            */

  /* ── the greens · the heart of the system ────────────────
     A five-step ramp, light to dark. All five are sampled from
     the decks — none invented. This ramp IS the brand colour
     story; it does the work the hub gave to one bright accent. */
  --sage:#6b7d5e;    /* softest · quiet panels, tags           */
  --moss:#6c7b4a;    /* the workhorse panel green              */
  --olive:#5a6b41;   /* deep panel · hover/pressed states      */
  --forest:#324231;  /* display ink · headings live here       */
  --fir:#27331f;     /* darkest · near-black green             */

  /* ── ink ─────────────────────────────────────────────────
     Display ink is forest. Body ink is a green-cast charcoal —
     DERIVED, not sampled: the decks set body in #4f443e (warm
     brown); RC redirected to green (2026-07-16). This is fir
     pulled toward neutral so long text doesn't read tinted.  */
  --ink:#2a2f25;
  --muted:#6d7163;   /* secondary text on sand · derived, green-grey */

  /* ── bark · demoted, not deleted ─────────────────────────
     #4f443e is genuinely in both decks (13% of the business
     plan). Kept as a support neutral for photo captions and
     warm moments. Never the ink, never a panel.              */
  --bark:#4f443e;

  /* ── rules + edges ───────────────────────────────────────
     The decks are editorial: thin dark rules, not grey borders.
     --rule is the 1px forest hairline under headings and across
     timelines. --hairline is the quiet sand-tone divider.     */
  --rule:var(--forest);
  --hairline:#d9d3c2;

  /* ── type · Cormorant Garamond + Inter ───────────────────
     Confirmed in both human-made decks, five months apart.
     Cormorant = display only. Inter = everything else.
     (reworld.us currently uses Host Grotesk — open question,
     RC chose Inter for now, 2026-07-16.)                     */
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,monospace;

  /* ── type scale · from the decks' proportions ────────────
     Cormorant runs LARGE — it's a delicate face and earns its
     elegance through scale, not weight. Don't shrink it.      */
  --t-display:clamp(44px,6vw,68px); --t-display-w:500;
  --t-h2:clamp(30px,3.6vw,40px);    --t-h2-w:500;
  --t-h3:24px;                      --t-h3-w:600;
  --t-lead:19px;   /* Inter light lead-ins */
  --t-body:16px;
  --t-small:14px;
  --t-caption:12.5px;
  --t-label:11.5px;                 --t-label-w:600;

  /* letterspacing · the caps treatment is a brand signature:
     wide-tracked uppercase, on covers, eyebrows, photo overlays */
  --ls-label:.28em;
  --ls-wide:.34em;    /* cover eyebrows, "PRESENTED BY RE•WORLD" */
  --ls-display:.005em;
  --lh-display:1.08;
  --lh-body:1.68;

  /* ── spacing · print-generous ────────────────────────────── */
  --sp-1:6px;  --sp-2:12px; --sp-3:20px; --sp-4:28px;
  --sp-5:40px; --sp-6:56px; --sp-7:80px; --sp-8:104px;
  --wrap:1140px;
  --wrap-pad:36px;

  /* ── corners · square. This is print language ─────────────
     The decks round nothing. Squareness is part of the class.
     --r-soft exists for purely-web UI (inputs, chips) only.   */
  --r:0;
  --r-soft:4px;
  --r-pill:99px;

  /* ── elevation · almost none ─────────────────────────────
     The decks are flat. On the web, one whisper of a shadow
     for genuinely floating elements. Nothing else lifts.      */
  --shadow-soft:0 10px 34px -24px rgba(39,51,31,.35);

  /* ── motion ──────────────────────────────────────────────── */
  --ease:.16s;

  /* ── photography · the rule, as a token comment ──────────
     Imagery is dark, green, unhurried: forests, pasture light,
     gathered people. Type sits ON photographs — either cream
     Cormorant (covers) or white lowercase letterspaced Inter
     (social). Overlay scrim: --scrim. Never place dark type
     on a photo.                                              */
  --scrim:linear-gradient(to top, rgba(39,51,31,.62), rgba(39,51,31,.12));
}