{
  "metadata": {
    "version": "1.0",
    "lastUpdated": "2024-12-19",
    "description": "BrainGrid Brand Reference - Complete brand tokens and guidelines"
  },
  "colors": {
    "primary": [
      {
        "name": "Lime",
        "hex": "#C2E476",
        "cssVariable": "--color-brand-lime",
        "tailwindClass": "bg-brand-lime",
        "textClass": "text-brand-lime",
        "usage": "Primary brand color"
      },
      {
        "name": "Jungle",
        "hex": "#10312D",
        "cssVariable": "--color-brand-jungle",
        "tailwindClass": "bg-brand-jungle",
        "textClass": "text-brand-jungle",
        "usage": "Dark backgrounds, text"
      },
      {
        "name": "Cream",
        "hex": "#F3F1E8",
        "cssVariable": "--color-brand-cream",
        "tailwindClass": "bg-brand-cream",
        "textClass": "text-brand-cream",
        "usage": "Light backgrounds"
      }
    ],
    "secondary": [
      {
        "name": "Lime Mid",
        "hex": "#B4D864",
        "cssVariable": "--color-brand-lime-mid",
        "tailwindClass": "bg-brand-lime-mid",
        "textClass": "text-brand-lime-mid",
        "usage": "Gradient midpoint"
      },
      {
        "name": "Lime Dark",
        "hex": "#AACF57",
        "cssVariable": "--color-brand-lime-dark",
        "tailwindClass": "bg-brand-lime-dark",
        "textClass": "text-brand-lime-dark",
        "usage": "Gradient endpoint"
      },
      {
        "name": "Jungle Dark",
        "hex": "#0B211F",
        "cssVariable": "--color-brand-jungle-dark",
        "tailwindClass": "bg-brand-jungle-dark",
        "textClass": "text-brand-jungle-dark",
        "usage": "Darker accent"
      },
      {
        "name": "Jungle Light",
        "hex": "#3D5752",
        "cssVariable": "--color-brand-jungle-light",
        "tailwindClass": "bg-brand-jungle-light",
        "textClass": "text-brand-jungle-light",
        "usage": "Lighter accent"
      },
      {
        "name": "Offwhite",
        "hex": "#FCFCFB",
        "cssVariable": "--color-brand-offwhite",
        "tailwindClass": "bg-brand-offwhite",
        "textClass": "text-brand-offwhite",
        "usage": "Clean backgrounds"
      },
      {
        "name": "Purple",
        "hex": "#795BC2",
        "cssVariable": "--color-brand-purple",
        "tailwindClass": "bg-brand-purple",
        "textClass": "text-brand-purple",
        "usage": "Accent color"
      },
      {
        "name": "Purple Dark",
        "hex": "#473392",
        "cssVariable": "--color-brand-purple-dark",
        "tailwindClass": "bg-brand-purple-dark",
        "textClass": "text-brand-purple-dark",
        "usage": "Accent dark"
      },
      {
        "name": "Black",
        "hex": "#121212",
        "cssVariable": "--color-brand-black",
        "tailwindClass": "bg-brand-black",
        "textClass": "text-brand-black",
        "usage": "Deep black"
      }
    ]
  },
  "gradients": {
    "primary": {
      "name": "Lime Gradient",
      "css": "linear-gradient(to bottom, #C2E476 0%, #B4D864 59.306%, #AACF57 100%)",
      "tailwindClasses": "bg-gradient-to-b from-brand-lime via-brand-lime-mid via-[59.306%] to-brand-lime-dark",
      "utilityClass": "gradient-lime",
      "usage": "Primary CTA buttons, hero elements, accent backgrounds"
    }
  },
  "typography": {
    "fonts": [
      {
        "name": "Headline",
        "family": "Futura PT Cond",
        "fallback": "sans-serif",
        "cssVariable": "--font-headline",
        "tailwindClass": "font-futura",
        "fontWeights": ["400 (normal)", "500 (medium)", "700 (bold)", "800 (extrabold)"],
        "usage": "Headlines, section titles, hero text"
      },
      {
        "name": "Body",
        "family": "Uncut Sans",
        "fallback": "Inter, system-ui, -apple-system, sans-serif",
        "cssVariable": "--font-body",
        "tailwindClass": "font-sans",
        "fontWeights": ["400 (normal)", "500 (medium)", "600 (semibold)", "700 (bold)"],
        "usage": "Body text, paragraphs, UI elements"
      }
    ],
    "headings": [
      {
        "level": "h1",
        "utilityClass": "heading-h1",
        "fontSize": {
          "mobile": "3rem (48px)",
          "tablet": "3.75rem (60px)",
          "desktop": "4.5rem (72px)"
        },
        "lineHeight": "1.08",
        "fontWeight": "800 (extrabold)",
        "fontFamily": "Futura PT Cond",
        "textTransform": "uppercase",
        "letterSpacing": "-0.025em",
        "tailwindClasses": "font-futura text-5xl font-extrabold uppercase tracking-tight leading-[1.08] md:text-6xl lg:text-7xl",
        "usage": "Hero headlines, page titles"
      },
      {
        "level": "h2",
        "utilityClass": "heading-h2",
        "fontSize": {
          "mobile": "1.875rem (30px)",
          "tablet": "2.25rem (36px)",
          "desktop": "3rem (48px)"
        },
        "lineHeight": "1.1",
        "fontWeight": "800 (extrabold)",
        "fontFamily": "Futura PT Cond",
        "textTransform": "uppercase",
        "letterSpacing": "-0.025em",
        "tailwindClasses": "font-futura text-3xl font-extrabold uppercase tracking-tight leading-[1.1] md:text-4xl lg:text-5xl",
        "usage": "Section headings"
      },
      {
        "level": "h3",
        "utilityClass": "heading-h3",
        "fontSize": {
          "mobile": "1.5rem (24px)",
          "tablet": "1.875rem (30px)",
          "desktop": "1.875rem (30px)"
        },
        "lineHeight": "1.2",
        "fontWeight": "800 (extrabold)",
        "fontFamily": "Futura PT Cond",
        "textTransform": "uppercase",
        "tailwindClasses": "font-futura text-2xl font-extrabold uppercase leading-[1.2] md:text-3xl",
        "usage": "Subsection headings, card titles"
      },
      {
        "level": "h4",
        "utilityClass": "heading-h4",
        "fontSize": {
          "mobile": "1.25rem (20px)",
          "tablet": "1.5rem (24px)",
          "desktop": "1.5rem (24px)"
        },
        "lineHeight": "1.3",
        "fontWeight": "600 (semibold)",
        "fontFamily": "Uncut Sans",
        "textTransform": "none",
        "tailwindClasses": "font-sans text-xl font-semibold leading-[1.3] md:text-2xl",
        "usage": "Feature titles, list headings"
      }
    ]
  },
  "logos": {
    "primary": {
      "name": "BrainGrid Logo",
      "variants": [
        {
          "name": "Lime on Jungle (for dark backgrounds)",
          "svg": "https://www.braingrid.ai/brand/full-logo-lime-on-jungle.svg",
          "png": "https://www.braingrid.ai/logos/full-logo-lime-on-jungle.png"
        },
        {
          "name": "Jungle on Lime (for light backgrounds)",
          "svg": "https://www.braingrid.ai/brand/full-logo-jungle-on-lime.svg",
          "png": "https://www.braingrid.ai/logos/full-logo-jungle-on-lime.png"
        },
        {
          "name": "White on Transparent",
          "svg": "https://www.braingrid.ai/brand/logo-white-on-transparent.svg",
          "png": "https://www.braingrid.ai/logos/logo-white-on-transparent.png"
        },
        {
          "name": "Lime on Transparent",
          "svg": "https://www.braingrid.ai/brand/logo-lime-on-transparent.svg"
        }
      ]
    },
    "symbol": {
      "name": "BrainGrid Symbol",
      "variants": [
        {
          "name": "Lime on Jungle (for dark backgrounds)",
          "svg": "https://www.braingrid.ai/brand/symbol-lime-on-jungle.svg"
        },
        {
          "name": "Jungle on Lime (for light backgrounds)",
          "svg": "https://www.braingrid.ai/brand/symbol-jungle-on-lime.svg"
        },
        {
          "name": "Cream on Jungle",
          "svg": "https://www.braingrid.ai/brand/symbol-cream-on-jungle.svg"
        },
        {
          "name": "Jungle on Transparent",
          "svg": "https://www.braingrid.ai/brand/symbol-jungle-on-transparent.svg"
        },
        {
          "name": "Symbol 800px",
          "png": "https://www.braingrid.ai/logos/braingrid-symbol-800.png"
        }
      ]
    }
  },
  "spacing": {
    "scale": {
      "0": "0px",
      "1": "4px",
      "2": "8px",
      "3": "12px",
      "4": "16px",
      "5": "20px",
      "6": "24px",
      "8": "32px",
      "10": "40px",
      "12": "48px",
      "16": "64px",
      "20": "80px",
      "24": "96px"
    },
    "sections": {
      "small": "py-12 md:py-16",
      "medium": "py-16 md:py-24",
      "large": "py-24 md:py-32"
    }
  },
  "guidelines": {
    "dos": [
      "Use the lime gradient for primary CTAs and key highlights",
      "Maintain strong contrast between lime text and jungle backgrounds",
      "Use Futura PT Cond in uppercase for headlines",
      "Use Uncut Sans for body text and UI elements",
      "Apply the gradient consistently from top to bottom",
      "Use cream (#F3F1E8) for primary text on dark backgrounds",
      "Maintain adequate whitespace around logo elements"
    ],
    "donts": [
      "Don't use lime on light backgrounds without sufficient contrast",
      "Don't stretch or distort the logo",
      "Don't use lowercase for headlines in Futura",
      "Don't mix brand colors in non-approved combinations",
      "Don't apply gradients horizontally (always vertical)",
      "Don't use the logo smaller than 24px height",
      "Don't place logo on busy backgrounds without a container"
    ]
  },
  "identity": {
    "mission": "Help builders turn ideas into reliable AI-native SaaS products",
    "tagline": "From idea to production-ready app."
  },
  "principles": [
    "Clear over clever",
    "Practical over hype",
    "Respect the builder",
    "Focus on reliability and craft"
  ],
  "voice": {
    "tone": ["confident", "calm", "direct"],
    "personality": ["builder-first", "practical", "honest"],
    "style": [
      "Plain language over jargon",
      "Short sentences",
      "Builder-first perspective",
      "Respect the reader's time"
    ],
    "avoid": ["Buzzwords", "Excessive hype", "Salesy language", "Vague promises"]
  },
  "terminology": {
    "preferred": [
      { "term": "AI Product Planner", "context": "Our core AI agent" },
      { "term": "AI-native SaaS", "context": "Products built with AI from the start" },
      { "term": "engineering-grade tasks", "context": "Well-specified, actionable work" },
      { "term": "builders", "context": "Our users - founders, developers, product people" },
      { "term": "requirements", "context": "What needs to be built" },
      { "term": "ship", "context": "Get to production (not deploy or launch)" }
    ],
    "avoid": [
      { "term": "magic", "reason": "Vague and hype-driven" },
      { "term": "no-code", "reason": "We're for builders who ship real products" },
      { "term": "one-click", "reason": "Oversimplifies real work" },
      { "term": "automagically", "reason": "Buzzword" },
      { "term": "revolutionary", "reason": "Overused hype" },
      { "term": "game-changing", "reason": "Overused hype" }
    ]
  },
  "visualPersonality": {
    "attributes": ["clean", "modern", "functional", "professional"],
    "avoid": [
      "Overly playful illustrations",
      "Neon gradients",
      "Gimmicky animations",
      "Generic stock imagery"
    ]
  },
  "cssVariables": {
    "colors": {
      "--color-brand-lime": "#C2E476",
      "--color-brand-lime-mid": "#B4D864",
      "--color-brand-lime-dark": "#AACF57",
      "--color-brand-jungle": "#10312D",
      "--color-brand-jungle-dark": "#0B211F",
      "--color-brand-jungle-light": "#3D5752",
      "--color-brand-cream": "#F3F1E8",
      "--color-brand-offwhite": "#FCFCFB",
      "--color-brand-purple": "#795BC2",
      "--color-brand-purple-dark": "#473392",
      "--color-brand-black": "#121212"
    },
    "gradientColors": {
      "--color-gradient-lime": "#C2E476",
      "--color-gradient-lime-mid": "#B4D864",
      "--color-gradient-lime-dark": "#AACF57"
    },
    "typography": {
      "--font-headline": "'Futura PT Cond', sans-serif",
      "--font-body": "'Uncut Sans', Inter, system-ui, -apple-system, sans-serif"
    }
  }
}