/* Gravity single-product store: design tokens (owner: creative). See docs/creative/visual-system.md.
   Same variable names as the brand block in sites/_template/assets/style.css, so a store can swap this in as-is.
   Pick a palette per product with <html data-palette="stone">; no attribute = ink.
   Contrast (WCAG 2.x) checked 2026-10-01 for every palette: fg/bg >= 7, muted on bg+surface >= 4.5,
   accent on bg+surface >= 4.5, on-dark-muted and dark-accent on dark >= 4.5, button text >= 4.5. */

:root{
  /* type: self-hosted OFL fonts already in sites/_template/assets/fonts */
  --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --dw:500;--bw:500;
  /* type scale (fluid, mobile first): hero / h2 / h3 / body / small */
  --fs-hero:clamp(2.75rem,10vw,5.25rem);--fs-h2:clamp(1.75rem,5vw,2.5rem);--fs-h3:1.375rem;--fs-body:1.0625rem;--fs-small:.9375rem;
  /* space + shape */
  --space-section:clamp(3.5rem,8vw,5rem);--wrap:70rem;--r:4px;

  /* ink (default): deep navy + ivory + brass. Calm, premium; fits most products */
  --bg:#f6f1e9;--fg:#1d2230;--muted:#5a5e6a;--surface:#ece4d7;--line:#d9cdb9;--accent:#7d5f33;
  --dark:#1d2230;--on-dark:#f6f1e9;--on-dark-muted:#b9bdc8;--dark-accent:#c9a978;
  --btn-bg:#1d2230;--btn-fg:#f6f1e9;
}

/* stone: warm grey + charcoal + terracotta. Kitchen, tools, home */
[data-palette="stone"]{
  --bg:#f4f3f0;--fg:#1c1c1a;--muted:#585752;--surface:#e7e5df;--line:#d3d0c8;--accent:#9a3f22;
  --dark:#1c1c1a;--on-dark:#f4f3f0;--on-dark-muted:#b5b3ac;--dark-accent:#e08a63;
  --btn-bg:#9a3f22;--btn-fg:#ffffff;
}

/* forest: deep green + paper + copper. Outdoor, bike, garden */
[data-palette="forest"]{
  --bg:#f3f1ea;--fg:#18241e;--muted:#4f5a53;--surface:#e4e6dc;--line:#cdd2c4;--accent:#2f5d46;
  --dark:#18241e;--on-dark:#f3f1ea;--on-dark-muted:#aeb8b0;--dark-accent:#d2a46c;
  --btn-bg:#18241e;--btn-fg:#f3f1ea;
}

/* modern type option for technical products: one font family, no serif */
[data-type="sans"]{--display:var(--sans);--dw:500}