{
  "meta": {
    "project": "pnw-select-rope",
    "source-url": "https://pnwselect.com/",
    "generated": "2026-04-23",
    "palette-refresh": "2026-04-26",
    "palette-name": "Steel and Rawhide",
    "direction": "depart",
    "confidence": "medium"
  },
  "colors": {
    "primary": "#BAA47A",
    "primary-hover": "#CFBB91",
    "primary-active": "#A18C66",
    "primary-subtle": "#2A2620",
    "on-primary": "#14171A",
    "secondary": "#C26721",
    "secondary-hover": "#D87A36",
    "on-secondary": "#14171A",
    "accent": "#4F5A60",
    "success": "#7DAB5F",
    "warning": "#C97B2A",
    "error": "#E26E50",
    "info": "#6FA4C4",
    "neutral-50": "#F4F1E7",
    "neutral-100": "#E8DCC0",
    "neutral-200": "#CFC2A4",
    "neutral-300": "#A89E84",
    "neutral-400": "#7E7D75",
    "neutral-500": "#5F676C",
    "neutral-600": "#4A5258",
    "neutral-700": "#353B42",
    "neutral-800": "#1F252B",
    "neutral-900": "#0E1216",
    "bg": "#0E1216",
    "bg-alt": "#1A2026",
    "surface": "#1F252B",
    "surface-raised": "#2D343C",
    "border": "#2D343C",
    "border-strong": "#4A5258",
    "text": "#E8DCC0",
    "text-muted": "#B8AC93",
    "text-inverse": "#0E1216"
  },
  "typography": {
    "font-sans": "\"Inter\", system-ui, -apple-system, Segoe UI, Roboto, sans-serif",
    "font-serif": "\"Playfair Display\", Georgia, \"Times New Roman\", serif",
    "font-mono": "\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace",
    "font-display": "\"Playfair Display\", Georgia, \"Times New Roman\", serif",
    "text-xs": {
      "size": "0.75rem",
      "line-height": "1rem"
    },
    "text-sm": {
      "size": "0.875rem",
      "line-height": "1.25rem"
    },
    "text-base": {
      "size": "1rem",
      "line-height": "1.5rem"
    },
    "text-lg": {
      "size": "1.125rem",
      "line-height": "1.75rem"
    },
    "text-xl": {
      "size": "1.25rem",
      "line-height": "1.75rem"
    },
    "text-2xl": {
      "size": "1.5rem",
      "line-height": "2rem"
    },
    "text-3xl": {
      "size": "1.875rem",
      "line-height": "2.25rem"
    },
    "text-4xl": {
      "size": "2.25rem",
      "line-height": "2.5rem"
    },
    "text-5xl": {
      "size": "3rem",
      "line-height": "1.1"
    },
    "text-6xl": {
      "size": "3.75rem",
      "line-height": "1.05"
    },
    "font-normal": "400",
    "font-medium": "500",
    "font-semibold": "600",
    "font-bold": "700",
    "leading-tight": "1.2",
    "leading-snug": "1.35",
    "leading-normal": "1.5",
    "leading-relaxed": "1.7",
    "tracking-tight": "-0.02em",
    "tracking-normal": "0",
    "tracking-wide": "0.08em"
  },
  "spacing": {
    "0": "0",
    "1": "0.25rem",
    "2": "0.5rem",
    "3": "0.75rem",
    "4": "1rem",
    "5": "1.25rem",
    "6": "1.5rem",
    "8": "2rem",
    "10": "2.5rem",
    "12": "3rem",
    "16": "4rem",
    "20": "5rem",
    "24": "6rem",
    "32": "8rem",
    "container-max": "1200px",
    "container-padding": "var(--space-6)",
    "section-padding-y": "var(--space-20)",
    "section-padding-y-sm": "var(--space-12)",
    "grid-gap": "var(--space-6)"
  },
  "radius": {
    "none": "0",
    "sm": "0.125rem",
    "md": "0.25rem",
    "lg": "0.5rem",
    "xl": "0.75rem",
    "2xl": "1rem",
    "full": "9999px"
  },
  "shadow": {
    "none": "none",
    "sm": "0 1px 2px 0 rgb(0 0 0 / 0.4)",
    "md": "0 4px 6px -1px rgb(0 0 0 / 0.5), 0 2px 4px -2px rgb(0 0 0 / 0.5)",
    "lg": "0 10px 15px -3px rgb(0 0 0 / 0.6), 0 4px 6px -4px rgb(0 0 0 / 0.6)",
    "xl": "0 20px 25px -5px rgb(0 0 0 / 0.65), 0 8px 10px -6px rgb(0 0 0 / 0.65)",
    "inner": "inset 0 2px 4px 0 rgb(0 0 0 / 0.4)",
    "focus": "0 0 0 3px rgb(186 164 122 / 0.45)"
  },
  "motion": {
    "duration": {
      "instant": "50ms",
      "fast": "150ms",
      "base": "300ms",
      "slow": "500ms"
    },
    "easing": {
      "default": "cubic-bezier(0.4, 0, 0.2, 1)",
      "in": "cubic-bezier(0.4, 0, 1, 1)",
      "out": "cubic-bezier(0, 0, 0.2, 1)",
      "bounce": "cubic-bezier(0.68, -0.55, 0.265, 1.55)"
    },
    "transition": {
      "color": "color var(--duration-fast) var(--ease-default), background-color var(--duration-fast) var(--ease-default)",
      "transform": "transform var(--duration-base) var(--ease-default)",
      "opacity": "opacity var(--duration-fast) var(--ease-default)"
    }
  },
  "breakpoints": {
    "sm": "640px",
    "md": "768px",
    "lg": "1024px",
    "xl": "1280px",
    "2xl": "1536px"
  },
  "components": {
    "button": "- **Primary:** solid fill with `--color-primary` (rawhide buckskin), text `--color-on-primary` (#14171A), `--radius-md` (4px), padding `--space-3` vertical / `--space-6` horizontal. Letter-spacing `--tracking-wide` on uppercase labels for a workwear-stencil feel.\n- **Secondary:** outline \u2014 transparent background, 1.5px border `--color-primary`, text `--color-primary`. On hover, fill to `--color-primary` + text `--color-on-primary`.\n- **Tertiary / accent CTA:** solid fill `--color-secondary` (copper rust) reserved for one signal CTA per page \u2014 \"Request a Quote\" or the audience-named primary action. Text `--color-on-secondary` (#14171A).\n- **Ghost:** no border, text `--color-text`, `--color-surface` on hover.\n- **Destructive:** solid fill `--color-error`, text `--color-neutral-900`.\n- **Sizes:** sm (text-sm, space-2/4 padding), md (default, text-base, space-3/6), lg (text-lg, space-4/8).\n- **States:** hover = one step darker (primary \u2192 primary-hover); focus shows `--shadow-focus` (rawhide ring); active = `--color-primary-active`; disabled = opacity 0.4, not-allowed cursor.\n- **Personality:** avoid playful bounces. Motion should feel deliberate (`--duration-base`, `--ease-default`). Buttons can use a subtle 1px inner highlight (inset top) to evoke stamped metal.",
    "card": "- Background: `--color-surface` (#1F252B) on page `--color-bg`, or `--color-surface-raised` (#2D343C) when stacked over surface.\n- Border: 1px solid `--color-border` (#2D343C) for ambient cards; promote to `--color-border-strong` (#4A5258 gunmetal hairline) for featured/pull tiles \u2014 the gunmetal line is the \"buckle hardware\" tell. Prefer a hairline border OR `--shadow-md`, not both (picks: hairline for dense lists, shadow for featured tiles).\n- Radius: `--radius-lg` (8px).\n- Padding: `--space-6` to `--space-8`.\n- Hover: optional `translateY(-2px)` + `--shadow-lg` + border shifts to `--color-border-strong`.\n- Feature/product cards may include a thin top-edge accent (2px `--color-primary` rawhide, or `--color-secondary` copper for the one audience-priority tile) to call out featured items.",
    "nav": "- Type: horizontal top bar, logo left, nav links centered or right, optional CTA button far right.\n- Background: `--color-bg` (#0E1216) with `--shadow-sm` when scrolled past hero; sticky by default. No transparent-to-solid fade (too glossy/consumer for this voice).\n- Link style: `--color-text` normal, weight `--font-medium`, `--color-primary` on hover/active. Uppercase optional (with `--tracking-wide`).\n- Active link indicator: 2px underline in `--color-primary` with small bottom offset.\n- Mobile: collapse to hamburger below `--bp-md` (768px). Open panel uses `--color-bg-alt` with `--shadow-lg`.\n- Logo: use the horse-head rope mark at ~40\u201348px height next to the wordmark \"PNW SELECT ROPE\" set in `--font-display` semibold uppercase with `--tracking-wide`.",
    "footer": "- Background: `--color-bg-alt` (#1A2026) \u2014 one shade lighter than body so the footer is subtly separated without a hard line.\n- Top edge: 1px `--color-border-strong` (gunmetal) hairline divider \u2014 the structural \"hardware line\" that re-asserts the buckle/panel cue.\n- Layout: 3 columns on desktop (Company / Products / Contact) + a fourth column for newsletter signup; collapses to stacked on mobile.\n- Headings: `--text-sm` `--font-semibold` uppercase in `--color-text` with `--tracking-wide`.\n- Links: `--color-text-muted`, hover `--color-primary`.\n- Legal row: `--text-xs` `--color-neutral-500` across the full width below the columns.\n- Padding: `--section-padding-y-sm` top/bottom, `--container-padding` sides.",
    "hero": "- Preferred composition: centered text OR left-aligned text + right product image; full-bleed background photo (rope detail, horse, pasture, or barn) with a `--color-bg` overlay at ~70% opacity to hold contrast. Cool gunmetal undertones in the background photograph cleanly against rawhide rope texture \u2014 lean into that.\n- Heading: `--text-5xl` on desktop / `--text-4xl` on mobile, `--font-display` (Playfair Display) `--font-normal`, `--leading-tight`, `--color-text` (#E8DCC0 parchment). Do NOT bold the headline \u2014 Playfair at 48\u201360px in regular weight is the signature. Italic on emphasized words is encouraged.\n- Eyebrow: `--text-sm` `--tracking-wide` uppercase, `--font-sans` semibold, `--color-primary`.\n- Subheading / lede: `--text-lg`, `--color-text-muted`, max-width ~60ch.\n- CTA pair: primary (solid rawhide) + secondary (outline rawhide) side-by-side. Primary label example: \"Shop the Catalog\" / \"Request a Quote\"; secondary: \"Our Rope Guide\" / \"Contact Us\". Reserve the copper-rust solid fill for the single highest-priority CTA on the page when the variant calls for chromatic emphasis.\n- Optional micro-element: a thin 1px `--color-border-strong` (gunmetal) rule beneath the eyebrow for heritage-catalog hardware vibe.",
    "form-controls": "- Input height: 2.75rem / 44px (slightly taller than schema default \u2014 reads more trade/industrial).\n- Background: `--color-surface` (#1F252B).\n- Border: 1px `--color-border` (#2D343C); focus border = `--color-primary` + `--shadow-focus` (rawhide glow).\n- Text: `--color-text`; placeholder: `--color-neutral-400`.\n- Label: `--text-sm`, `--font-medium`, `--color-text`, uppercase optional with `--tracking-wide`.\n- Helper text: `--text-xs`, `--color-text-muted`.\n- Error: border `--color-error`, helper text `--color-error`.\n- Radius: `--radius-md` (4px) for inputs/textareas, `--radius-full` for search pills only.\n- Submit button follows the primary button treatment.\n\n---"
  },
  "voice": "",
  "assets": {}
}