version: "1.0"
name: "Neo-Brutalism"

colors:
  background: "#FFFFFF"
  surface: "#FFFFFF"
  text-primary: "#000000"
  text-secondary: "#343434"
  border: "#000000"
  accent-1: "#FFD400"
  accent-2: "#FF5A36"
  accent-3: "#0055FF"
  shadow: "#000000"

typography:
  headline-lg:
    family: "Space Grotesk"
    weight: 700
    size: "48px"
    line-height: "1.08"
    letter-spacing: "-0.03em"
  headline-sm:
    family: "Space Grotesk"
    weight: 700
    size: "24px"
    line-height: "1.25"
  body-md:
    family: "Inter"
    weight: 400
    size: "16px"
    line-height: "1.6"
  label-md:
    family: "Inter"
    weight: 600
    size: "13px"
    text-transform: "uppercase"
    letter-spacing: "0.05em"

rounded:
  sm: "0px"
  md: "0px"
  lg: "0px"

spacing:
  xs: "8px"
  sm: "16px"
  md: "32px"
  lg: "64px"

border-width:
  sm: "1px"
  md: "3px"
  lg: "4px"

components:
  button-primary:
    background: "#FFFFFF"
    color: "#000000"
    border: "3px solid #000000"
    border-radius: "0px"
    box-shadow: "4px 4px 0 #000000"
    padding: "12px 24px"
    text-transform: "uppercase"
    hover:
      background: "#FFD400"
      transform: "translate(2px, 2px)"
      box-shadow: "2px 2px 0 #000000"

  card-surface:
    background: "#FFFFFF"
    border: "3px solid #000000"
    border-radius: "0px"
    box-shadow: "8px 8px 0 #000000"
    padding: "32px"

rationale:
  - Favor rectangular modules, sticker-like labels, and obvious section dividers.
  - Use uppercase display copy sparingly but confidently on actions and navigation.