:root {
  /* Brand recovered from the former production storefront. */
  --lp-brand-primary: #005741;
  --lp-brand-dark: #003f31;
  --lp-brand-accent: #4ba708;
  --lp-brand-highlight: #ffe329;
  --lp-brand-highlight-strong: #f3d700;

  /* Semantic colours. Components consume these rather than ad-hoc shades. */
  --lp-color-text: #24342d;
  --lp-color-heading: var(--lp-brand-primary);
  --lp-color-muted: #627168;
  --lp-color-subtle: #87938d;
  --lp-color-link: var(--lp-brand-accent);
  --lp-color-link-hover: var(--lp-brand-primary);
  --lp-color-surface: #fff;
  --lp-color-surface-soft: #f7faf8;
  --lp-color-surface-brand: #eef7f3;
  --lp-color-surface-strong: #e3eee8;
  --lp-color-border: #d9e4de;
  --lp-color-border-strong: #b9cec4;
  --lp-color-success: #17633b;
  --lp-color-success-soft: #e7f5ed;
  --lp-color-warning: #825700;
  --lp-color-warning-soft: #fff5d9;
  --lp-color-danger: #9d2b24;
  --lp-color-danger-soft: #fff0ef;
  --lp-color-danger-text: #75211d;
  --lp-color-rating: #e2b800;
  --lp-color-badge-muted-bg: #edf1ef;
  --lp-color-badge-muted-text: #65706b;
  --lp-color-signal-soft: #e6f4ed;
  --lp-color-fallback-a: #dbeee5;
  --lp-color-fallback-b: #f6faf8;
  --lp-color-fallback-c: #cfe4da;

  /* Type system: Big Shoulders = brand/editorial; Montserrat = interface/body. */
  --lp-font-ui: "Montserrat", Arial, sans-serif;
  --lp-font-brand: "Big Shoulders Display", var(--lp-font-ui);
  --lp-text-xs: .78rem;
  --lp-text-sm: .875rem;
  --lp-text-base: 1rem;
  --lp-text-md: 1.0625rem;
  --lp-text-lg: 1.125rem;
  --lp-text-xl: 1.25rem;
  --lp-h1: clamp(2.7rem, 4.2vw, 3.65rem);
  --lp-h2: clamp(2.05rem, 3vw, 2.75rem);
  --lp-h3: 1.55rem;
  --lp-h4: 1.2rem;
  --lp-line-body: 1.6;

  /* Layout / rhythm. */
  --lp-container: 1170px;
  --lp-container-wide: 1280px;
  --lp-gutter: 40px;
  --lp-section-y: clamp(3.25rem, 5vw, 4.75rem);
  --lp-page-y: clamp(2rem, 3vw, 3rem);
  --lp-checkout-section-gap: 1.35rem;
  --lp-announcement-height: 34px;
  --lp-header-main: 96px;
  --lp-nav-height: 52px;
  --lp-header-stack: calc(var(--lp-announcement-height) + var(--lp-header-main) + var(--lp-nav-height));

  /* Shape / elevation. */
  --lp-radius-sm: 6px;
  --lp-radius-md: 10px;
  --lp-radius-lg: 14px;
  --lp-radius-xl: 20px;
  --lp-radius-pill: 999px;
  --lp-shadow-soft: 0 8px 24px rgba(0, 63, 49, .055);
  --lp-shadow-card: 0 14px 34px rgba(0, 63, 49, .09);
  --lp-shadow-panel: 0 24px 60px rgba(0, 42, 32, .16);
  --lp-focus-ring: 0 0 0 3px rgba(75, 167, 8, .2);

  /* Compatibility aliases for Core markup. */
  --lp-green-900: var(--lp-brand-dark);
  --lp-green-800: var(--lp-brand-primary);
  --lp-green-700: var(--lp-brand-accent);
  --lp-green-600: #16835f;
  --lp-green-100: var(--lp-color-surface-brand);
  --lp-green-050: var(--lp-color-surface-soft);
  --lp-lime: var(--lp-brand-accent);
  --lp-yellow: var(--lp-brand-highlight);
  --lp-ink: var(--lp-color-text);
  --lp-muted: var(--lp-color-muted);
  --lp-line: var(--lp-color-border);
  --lp-surface: var(--lp-color-surface);
  --lp-bg: var(--lp-color-surface-soft);
  --lp-danger: var(--lp-color-danger);
  --lp-success: var(--lp-color-success);
  --lp-sale: var(--lp-brand-primary);
  --lp-shadow: var(--lp-shadow-card);
  --lp-r4: var(--lp-radius-sm);
  --lp-r6: var(--lp-radius-sm);
  --lp-r8: var(--lp-radius-md);
  --lp-r10: var(--lp-radius-lg);
  --lp-font: var(--lp-font-ui);
  --lp-brand: var(--lp-font-brand);
}
