/* Heartwood design tokens — from the WooDinh design system project (colors, typography, spacing, shapes). */
:root{
/* Base ramp — every value sampled from the workshop. No pure white, no pure black. */
--hw-jarrah:#A24E30;
--hw-jarrah-deep:#7A3B24;
--hw-sawdust:#6B5F4F;
--hw-verdigris:#45695E;
--hw-oak:#F4EFE6;
--hw-sapwood:#FBF8F2;
--hw-sanding-dust:#EAD3C4;
--hw-clay:#6B311D;
--hw-oiled:#2A2318;
--hw-ply-edge:#DCD3C2;
--hw-scorch:#8B3A2E;

--color-primary:var(--hw-jarrah);
--color-primary-hover:var(--hw-jarrah-deep);
--color-secondary:var(--hw-sawdust);
--color-tertiary:var(--hw-verdigris);
--color-neutral:var(--hw-oak);
--color-surface:var(--hw-sapwood);
--color-subtle:var(--hw-sanding-dust);
--color-error:var(--hw-scorch);
--color-border:var(--hw-ply-edge);

--surface-page:var(--hw-sapwood);
--surface-raised:var(--hw-oak);
--surface-tag:var(--hw-sanding-dust);

--text-body:var(--hw-oiled);
--text-heading:var(--hw-oiled);
--text-meta:var(--hw-sawdust);
--text-link:var(--hw-jarrah);
--text-link-hover:var(--hw-jarrah-deep);
--text-on-primary:var(--hw-sapwood);
--text-on-tag:var(--hw-clay);
--text-error:var(--hw-scorch);

--border-hairline:var(--hw-ply-edge);
--border-photo:var(--hw-ply-edge);
--border-focus:var(--hw-jarrah);

--scrim-lightbox:rgba(42,35,24,0.70);
--shadow-lightbox:0 12px 32px rgba(42,35,24,0.18);

/* Typography */
--font-serif:"Fraunces","Source Serif 4",Georgia,serif;
--font-sans:"Public Sans","Helvetica Neue",Arial,sans-serif;
--font-display:var(--font-serif);
--font-body:var(--font-serif);
--font-ui:var(--font-sans);

--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;

--text-body-lg-size:19px;   --text-body-lg-lh:1.7;
--text-body-md-size:17px;   --text-body-md-lh:1.65;
--text-body-sm-size:15px;   --text-body-sm-lh:1.55;
--text-caption-size:13px;   --text-caption-lh:1.5;
--text-label-size:12px;     --text-label-lh:1.3; --text-label-ls:0.1em;
--measure-prose:68ch;

/* Spacing */
--space-xs:4px;
--space-sm:8px;
--space-md:16px;
--space-lg:32px;
--space-xl:64px;
--space-margin:128px;
--space-margin-mobile:24px;
--touch-min:44px;

/* Shapes */
--radius-none:0px;
--radius-sm:2px;
--radius-md:4px;
--radius-full:9999px;
--hairline:1px;
--focus-ring-width:2px;
--focus-ring-offset:2px;
}