/* Roots Collective v3 — madder red + wool black on clean white. No beige grounds. */
:root{
/* Neutrals — wool black to unbleached linen */
--ink:#1D1B18;--ink-2:#2E2A25;--walnut:#4A3F35;--soil:#6B5E51;--ash:#9A8E80;--hemp:#D9D8D5;--flax:#F2F2F1;--linen:#FFFFFF;--ivory:#FFFFFF;
/* Natural dyes */
--madder:#9A2E22;--madder-deep:#6E1F17;--madder-soft:#E8CBC1;
--ochre:#B58A3C;--ochre-deep:#87652A;--ochre-soft:#EDE0BF;
--sage:#6E7457;--sage-deep:#4C513B;--sage-soft:#D6D7C6;
--plum:#5A2F3A;--plum-soft:#DCC8CA;
--woad:#3A4A5C;--woad-soft:#C9D0D7;
/* Semantic */
--bg-page:var(--linen);--bg-raised:var(--ivory);--bg-sunken:var(--flax);--bg-inverse:var(--ink);
--text-strong:var(--ink);--text-body:var(--ink-2);--text-muted:var(--soil);--text-faint:var(--ash);--text-inverse:var(--linen);--text-on-accent:var(--ivory);
--border-strong:var(--ink);--border-default:var(--walnut);--border-soft:var(--hemp);
--accent:var(--madder);--accent-hover:var(--madder-deep);--accent-soft:var(--madder-soft);--accent-2:var(--ochre);
--thread:var(--madder);--thread-dark:var(--ink);
--success:var(--sage-deep);--success-soft:var(--sage-soft);
--warning:var(--ochre-deep);--warning-soft:var(--ochre-soft);
--danger:var(--madder-deep);--danger-soft:var(--madder-soft);
--info:var(--woad);--info-soft:var(--woad-soft);
--focus-ring:var(--madder);
--surface-card:var(--ivory);--surface-inverse:var(--ink);--surface-overlay:rgba(29,27,24,.55);
}

/* Roots Collective v2 — type tokens */
:root{
--font-display:'PP Editorial New','Editorial New','Instrument Serif','Times New Roman',serif;
--font-sans:'Montserrat','Helvetica Neue',sans-serif;
--font-body:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;
--font-mono:'DM Mono',ui-monospace,monospace;
--fs-hero:clamp(48px,7vw,104px);/* @kind font */
--fs-d1:64px;--fs-d2:48px;--fs-d3:36px;--fs-h1:28px;--fs-h2:22px;--fs-h3:18px;
--fs-body-lg:17px;--fs-body:15px;--fs-small:13px;--fs-caption:12px;--fs-label:10px;
--lh-tight:1.0;/* @kind font */
--lh-snug:1.2;/* @kind font */
--lh-body:1.7;/* @kind font */
--tracking-display:-0.01em;--tracking-body:0;--tracking-label:0.28em;--tracking-wide:0.5em;
--fw-light:300;/* @kind font */
--fw-regular:400;/* @kind font */
--fw-medium:500;/* @kind font */
--fw-semibold:600;/* @kind font */
--type-display:400 var(--fs-d1)/var(--lh-tight) var(--font-display);
--type-heading:400 var(--fs-h1)/var(--lh-snug) var(--font-display);
--type-body:400 var(--fs-body)/var(--lh-body) var(--font-body);
--type-label:500 var(--fs-label)/1 var(--font-sans);
--type-mono:400 var(--fs-caption)/1.4 var(--font-mono);
}

/* Roots Collective v2 — space, radius, borders */
:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:144px;
--container-max:1240px;--gutter:clamp(20px,4vw,56px);/* @kind spacing */
--radius-0:0;--radius-1:2px;--radius-pill:999px;--radius-arch:999px 999px 0 0;
--border-w:1px;--border:1px solid var(--border-strong);--border-hair:1px solid var(--border-soft);
}

/* Roots Collective v2 — elevation, motion, texture. Quiet: no hard offsets, no bounce. */
:root{
--shadow-none:none;
--shadow-hair:0 0 0 1px var(--hemp);
--shadow-soft:0 24px 60px -32px rgba(29,27,24,.38);
--shadow-photo:0 30px 70px -40px rgba(74,63,53,.55);
--ease-out:cubic-bezier(.22,.61,.36,1);/* @kind other */
--ease-in-out:cubic-bezier(.65,0,.35,1);/* @kind other */
--dur-fast:160ms;/* @kind other */
--dur:280ms;/* @kind other */
--dur-slow:640ms;/* @kind other */
--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.11 0 0 0 0 0.1 0 0 0 0 0.09 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");/* @kind other */
--grain-opacity:.12;/* @kind other */
}

html{-webkit-font-smoothing:antialiased}
body{margin:0;background:var(--bg-page);color:var(--text-body);font:var(--type-body)}
a{color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;text-decoration-color:var(--hemp)}
a:hover{color:var(--madder);text-decoration-color:var(--madder)}
