{
  "color": {
    "vermilion-pulse": {
      "$value": "#ff3b1f",
      "$type": "color",
      "$description": "Vermilion Pulse — Bold primary accent for CTAs, active states, product highlights, badges, and high-emphasis interactive moments. Adds heat and confidence without fighting the Cobalt Glow hero treatment."
    },
    "cobalt-glow": {
      "$value": "#5683d2",
      "$type": "color",
      "$description": "Cobalt Glow — Hero gradient midpoint, decorative accents, link hover washes. Provides the atmospheric blue that carries the dawn-sky hero treatment"
    },
    "obsidian": {
      "$value": "#0c0a08",
      "$type": "color",
      "$description": "Obsidian — Primary text color, dark canvas surfaces, navigation bar, footer. The near-black that grounds the system with 19.8:1 contrast against white"
    },
    "paper": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Paper — Page background in light sections, text on dark surfaces, input fills. The clean canvas that lets product imagery and the vermilion accent command attention"
    },
    "limestone": {
      "$value": "#f4f2f0",
      "$type": "color",
      "$description": "Limestone — Card surfaces, elevated panels, warm neutral fills. Replaces drop shadows as the separation mechanism in light-mode layouts"
    },
    "charcoal": {
      "$value": "#1a1919",
      "$type": "color",
      "$description": "Charcoal — Elevated dark surfaces, filled dark buttons, card overlays. One step lifted from Obsidian for subtle depth without true black"
    },
    "slate": {
      "$value": "#4d505d",
      "$type": "color",
      "$description": "Slate — Borders, dividers, muted structural elements. Carries a cool undertone that keeps it from competing with the warm Limestone surfaces"
    },
    "fog": {
      "$value": "#999ba3",
      "$type": "color",
      "$description": "Fog — Secondary text, helper copy, muted labels, icon strokes. The 50% gray that handles all de-emphasized content"
    },
    "bone": {
      "$value": "#d2cecb",
      "$type": "color",
      "$description": "Bone — Hairline borders on light surfaces, subtle dividers, card outlines. Warmer than Slate, used where Slate would feel cold against Limestone"
    }
  },
  "font": {
    "lausanne": {
      "$value": "Lausanne",
      "$type": "fontFamily",
      "$description": "Primary typeface for all UI, headings, body, nav, buttons, and display. Lausanne is a custom commissioned sans-serif with optical sizing across 11 steps — its compressed line-height at 64px (0.74-1.05) gives hero headlines an editorial slab feel without switching to a serif. Weight 400 carries everything; 500 is reserved for nav and emphasis."
    },
    "arial": {
      "$value": "Arial",
      "$type": "fontFamily",
      "$description": "Arial — detected in extracted data but not described by AI"
    }
  },
  "typography": {
    "xs": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "10px",
        "fontWeight": 400,
        "lineHeight": 1.6
      },
      "$type": "typography",
      "$description": "Typography step xs at 10px"
    },
    "sm": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "13px",
        "fontWeight": 400,
        "lineHeight": 1.46
      },
      "$type": "typography",
      "$description": "Typography step sm at 13px"
    },
    "sm-2": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "14px",
        "fontWeight": 500,
        "lineHeight": 1
      },
      "$type": "typography",
      "$description": "Typography step sm-2 at 14px"
    },
    "sm-3": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "14px",
        "fontWeight": 400,
        "lineHeight": 0.74
      },
      "$type": "typography",
      "$description": "Typography step sm-3 at 14px"
    },
    "sm-4": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "14px",
        "fontWeight": 400,
        "lineHeight": 1.43
      },
      "$type": "typography",
      "$description": "Typography step sm-4 at 14px"
    },
    "sm-5": {
      "$value": {
        "fontFamily": "Arial",
        "fontSize": "14px",
        "fontWeight": 400,
        "lineHeight": 1.2
      },
      "$type": "typography",
      "$description": "Typography step sm-5 at 14px"
    },
    "base": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "16px",
        "fontWeight": 400,
        "lineHeight": 1.5
      },
      "$type": "typography",
      "$description": "Typography step base at 16px"
    },
    "base-2": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "16px",
        "fontWeight": 400,
        "lineHeight": 1.38
      },
      "$type": "typography",
      "$description": "Typography step base-2 at 16px"
    },
    "base-3": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "16px",
        "fontWeight": 400,
        "lineHeight": 0.68
      },
      "$type": "typography",
      "$description": "Typography step base-3 at 16px"
    },
    "base-4": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "16px",
        "fontWeight": 400,
        "lineHeight": 1.2
      },
      "$type": "typography",
      "$description": "Typography step base-4 at 16px"
    },
    "lg": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "18px",
        "fontWeight": 400,
        "lineHeight": 1.33
      },
      "$type": "typography",
      "$description": "Typography step lg at 18px"
    },
    "xl": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "20px",
        "fontWeight": 400,
        "lineHeight": 1.3
      },
      "$type": "typography",
      "$description": "Typography step xl at 20px"
    },
    "2xl": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "24px",
        "fontWeight": 400,
        "lineHeight": 1.17
      },
      "$type": "typography",
      "$description": "Typography step 2xl at 24px"
    },
    "2xl-2": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "28px",
        "fontWeight": 400,
        "lineHeight": 1.14
      },
      "$type": "typography",
      "$description": "Typography step 2xl-2 at 28px"
    },
    "4xl": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "40px",
        "fontWeight": 400,
        "lineHeight": 1.05
      },
      "$type": "typography",
      "$description": "Typography step 4xl at 40px"
    },
    "5xl": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "48px",
        "fontWeight": 400,
        "lineHeight": 1.04
      },
      "$type": "typography",
      "$description": "Typography step 5xl at 48px"
    },
    "5xl-2": {
      "$value": {
        "fontFamily": "lausanne",
        "fontSize": "64px",
        "fontWeight": 400,
        "lineHeight": 1
      },
      "$type": "typography",
      "$description": "Typography step 5xl-2 at 64px"
    }
  },
  "spacing": {
    "4": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Spacing 4px"
    },
    "8": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Spacing 8px"
    },
    "12": {
      "$value": "12px",
      "$type": "dimension",
      "$description": "Spacing 12px"
    },
    "16": {
      "$value": "16px",
      "$type": "dimension",
      "$description": "Spacing 16px"
    },
    "20": {
      "$value": "20px",
      "$type": "dimension",
      "$description": "Spacing 20px"
    },
    "24": {
      "$value": "24px",
      "$type": "dimension",
      "$description": "Spacing 24px"
    },
    "28": {
      "$value": "28px",
      "$type": "dimension",
      "$description": "Spacing 28px"
    },
    "32": {
      "$value": "32px",
      "$type": "dimension",
      "$description": "Spacing 32px"
    },
    "40": {
      "$value": "40px",
      "$type": "dimension",
      "$description": "Spacing 40px"
    },
    "48": {
      "$value": "48px",
      "$type": "dimension",
      "$description": "Spacing 48px"
    },
    "52": {
      "$value": "52px",
      "$type": "dimension",
      "$description": "Spacing 52px"
    },
    "64": {
      "$value": "64px",
      "$type": "dimension",
      "$description": "Spacing 64px"
    },
    "76": {
      "$value": "76px",
      "$type": "dimension",
      "$description": "Spacing 76px"
    },
    "128": {
      "$value": "128px",
      "$type": "dimension",
      "$description": "Spacing 128px"
    },
    "160": {
      "$value": "160px",
      "$type": "dimension",
      "$description": "Spacing 160px"
    },
    "176": {
      "$value": "176px",
      "$type": "dimension",
      "$description": "Spacing 176px"
    },
    "unit": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Base spacing unit"
    }
  },
  "radius": {
    "md": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Border radius md"
    },
    "lg": {
      "$value": "7.8px",
      "$type": "dimension",
      "$description": "Border radius lg"
    },
    "xl": {
      "$value": "12px",
      "$type": "dimension",
      "$description": "Border radius xl"
    }
  },
  "shadow": {
    "subtle": {
      "$value": "rgba(255, 255, 255, 0.6) 0px 0px 2px 0px inset",
      "$type": "shadow",
      "$description": "Shadow elevation subtle"
    }
  },
  "surface": {
    "paper-canvas": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Surface level 0: Base page background for all light-mode sections"
    },
    "limestone-card": {
      "$value": "#f4f2f0",
      "$type": "color",
      "$description": "Surface level 1: Product feature cards, elevated content panels"
    },
    "charcoal-overlay": {
      "$value": "#1a1919",
      "$type": "color",
      "$description": "Surface level 2: Dark elevated surfaces, filled dark buttons, image overlays"
    },
    "obsidian-ground": {
      "$value": "#0c0a08",
      "$type": "color",
      "$description": "Surface level 3: Deepest surface for navigation, footer, and hero dark zones"
    }
  },
  "$extensions": {
    "com.refero.extraction": {
      "url": "https://ramp.com",
      "siteName": "Ramp",
      "extractedAt": "2026-06-03T15:17:17.732Z",
      "variant": "extended"
    }
  }
}