:root {
  /* Brand */
  --fc-brand-primary: #0f6342;
  --fc-brand-accent: #c17658;
  --fc-brand-secondary: #1c4948;

  /* Neutral surfaces */
  --fc-background: #f7f2ea;
  --fc-surface: #ffffff;
  --fc-text: #20231f;
  --fc-text-muted: #686e68;
  --fc-border: #ded8ce;

  /* Semantic cues */
  --fc-success: #2f7d4a;
  --fc-warning: #a66a2c;
  --fc-danger: #a33a32;

  /*
   * Global state-surface rule:
   * Semantic colours are cue-only (small icon, badge/label or text). They must
   * NOT be used as card/panel/notice backgrounds, coloured outer borders,
   * accent stripes or semantic box-shadows. Stateful containers stay neutral.
   */
  --fc-state-surface: var(--fc-surface);
  --fc-state-border: var(--fc-border);
  --fc-state-icon-bg: var(--fc-text-muted);
  --fc-state-icon-fg: var(--fc-surface);

  /*
   * Presentation roles for the cue above. A component keeps its own semantic
   * vocabulary (a product notice stays info/shipping/warning/storage); these
   * are only the tones the compact cue may be painted in, so every stateful
   * surface in the storefront draws from one short list.
   */
  --fc-state-cue-info: var(--fc-brand-secondary);
  --fc-state-cue-success: var(--fc-success);
  --fc-state-cue-warning: var(--fc-warning);
  --fc-state-cue-danger: var(--fc-danger);
  --fc-state-cue-notice: var(--fc-brand-accent);

  /*
   * Success check standard.
   * One check glyph for every presentation-owned success/confirmation cue.
   * Reference implementation: the product-card added state. Where a check is
   * part of a compound pictogram (shield, circle) it stays an inline SVG and
   * uses the canonical geometry in fcsu_success_check_path().
   */
  --fc-check-glyph: "\2713";
  --fc-check-weight: 900;

  /* Radius */
  --fc-radius-sm: 8px;
  --fc-radius-md: 14px;
  --fc-radius-lg: 22px;
  --fc-radius-pill: 999px;

  /* Layout */
  --fc-container-wide: 1280px;
  --fc-container-content: 800px;
  /* Shared reading column for long-form surfaces (blog single, legal and
     general inner pages). One measure so every long text page lines up. */
  --fc-reading-measure: 54rem;
  --fc-header-height: 5.25rem;
  --fc-header-action-size: 2.75rem;

  /* Spacing */
  --fc-space-1: 0.5rem;
  --fc-space-2: 1rem;
  --fc-space-3: 1.5rem;
  --fc-space-4: 2rem;
  --fc-space-5: 3rem;
  --fc-space-6: 4rem;
}