/* ============================================================
   Twisted Pine Tree Service — design tokens
   As of 2026-07-15. Palette pulled from the REAL business logo
   (hand-drawn emblem: pine + roots + chainsaw), not from the two
   learning prototypes (twisted-pine-a "Ascent" / twisted-pine-b
   "Heartwood") — those invented their own art direction for
   Brandyn's frontend-design practice. Real client deliverable is
   "redesign close to his current site + major SEO," so this kit
   is the sober, on-brand version. Verify against the live
   twistedpinetreeservice.com before shipping — not yet cross-
   checked this session (browser tool hung).
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Bitter:wght@400;600;700&family=Inter:wght@400..700&display=swap');

:root{
  --brand-name:'Twisted Pine Tree Service';

  /* ---- color: forest green + bark + chainsaw orange, on parchment ---- */
  --color-bg:#F7F3E7;              /* parchment/cream, matches the logo's banner */
  --color-surface:#EFE8D6;         /* cards, panels, alt sections */
  --color-ink:#221B12;             /* headlines — near-black bark */
  --color-body:#5B5041;            /* body text — warm bark-brown gray */
  --color-line:#DCD3BC;

  --color-primary:#6E8F2E;         /* foliage green — from the real logo */
  --color-primary-strong:#4C6320;  /* deep pine — hover / pressed */
  --color-on-primary:#FFFFFF;

  --color-accent:#D9691F;          /* chainsaw orange — from the real logo */
  --color-accent-strong:#B24F13;

  /* ---- type ---------------------------------------------------- */
  --font-display:'Bitter', Georgia, serif;     /* rugged slab, headlines */
  --font-body:'Inter', system-ui, sans-serif;  /* body / UI */

  /* ---- shape + depth ------------------------------------------- */
  --radius:10px;
  --radius-pill:999px;
  --shadow:0 10px 28px rgba(34,27,18,.14);

  /* ---- spacing -------------------------------------------------- */
  --space-1:4px;  --space-2:8px;  --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px;
}
