{
  "$schema": "https://shadcn-vue.com/schema/registry-item.json",
  "name": "press-kit-brand-assets",
  "title": "Press Kit Brand Assets",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-vue/blocks/press-kit-brand-assets/PressKitBrandAssets.vue",
      "content": "<script lang=\"ts\">\nexport interface LogoAsset {\n  id: string\n  title: string\n  category: string\n  description: string\n  dimensions: string\n  bestFor: string\n  theme: 'light' | 'dark' | 'adaptive'\n  formats: { label: string; ext: string; size: string }[]\n}\n\nexport interface BrandColor {\n  id: string\n  name: string\n  hex: string\n  oklch: string\n  rgb: string\n  role: string\n  contrast: string\n  usage: string\n  bgClass: string\n  textDark?: boolean\n}\n\nexport interface Executive {\n  id: string\n  name: string\n  role: string\n  bio: string\n  avatarUrl?: string\n  initials: string\n  fileSize: string\n  dimensions: string\n  topics: string[]\n  socials: { platform: 'x' | 'linkedin' | 'github'; url: string }[]\n}\n\nexport interface BrandGuidelineRule {\n  type: 'do' | 'dont'\n  text: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue'\nimport { computed, ref } from 'vue'\nimport {\n  Check,\n  CheckCircle2,\n  Copy,\n  Download,\n  ExternalLink,\n  FileArchive,\n  FileCode,\n  FileImage,\n  FileText,\n  Globe,\n  Info,\n  Layers,\n  Mail,\n  Palette,\n  ShieldCheck,\n  User,\n  XCircle,\n} from 'lucide-vue-next'\nimport { cn } from '@/lib/utils'\nimport { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card'\nimport { Separator } from '@/components/ui/separator'\n\nconst DEFAULT_LOGOS: LogoAsset[] = [\n  {\n    id: 'horizontal-primary',\n    title: 'Primary Horizontal Logo',\n    category: 'Full Wordmark',\n    description: 'The standard lockup combining the faceted block logomark with horizontal typography and .dev badge.',\n    dimensions: '3840 × 1080 px',\n    bestFor: 'Light surfaces, navigation bars, marketing hero headers, and pitch decks.',\n    theme: 'light',\n    formats: [\n      { label: 'Vector SVG', ext: 'svg', size: '14 KB' },\n      { label: '4K PNG (Alpha)', ext: 'png', size: '280 KB' },\n      { label: 'Modern WebP', ext: 'webp', size: '94 KB' },\n    ],\n  },\n  {\n    id: 'app-icon-mark',\n    title: 'Square App Icon Mark',\n    category: 'Logomark Symbol',\n    description: 'Standalone geometric prism icon optimized for square aspect ratios and high-density icons.',\n    dimensions: '1024 × 1024 px',\n    bestFor: 'Favicons, desktop dock icons, app store assets, and square social avatars.',\n    theme: 'adaptive',\n    formats: [\n      { label: 'Vector SVG', ext: 'svg', size: '8 KB' },\n      { label: 'High-Res PNG', ext: 'png', size: '165 KB' },\n      { label: 'Icon WebP', ext: 'webp', size: '62 KB' },\n    ],\n  },\n  {\n    id: 'monochrome-dark',\n    title: 'Dark Mode Monochromatic Logo',\n    category: 'Dark Backgrounds',\n    description: 'Single-tone pure-white silhouette engineered for deep slate surfaces and obsidian backgrounds.',\n    dimensions: '3840 × 1080 px',\n    bestFor: 'Developer terminals, dark theme dashboards, midnight wallpapers, and video overlays.',\n    theme: 'dark',\n    formats: [\n      { label: 'Vector SVG', ext: 'svg', size: '12 KB' },\n      { label: '4K PNG (White)', ext: 'png', size: '240 KB' },\n      { label: 'Dark WebP', ext: 'webp', size: '88 KB' },\n    ],\n  },\n  {\n    id: 'monochrome-light',\n    title: 'Light Mode Inverted Logo',\n    category: 'Print & Documents',\n    description: 'High-density obsidian monochrome lockup for single-ink printing and high-contrast editorial media.',\n    dimensions: '3840 × 1080 px',\n    bestFor: 'Whitepapers, physical print collateral, invoices, PDF documents, and newsprint.',\n    theme: 'light',\n    formats: [\n      { label: 'Vector SVG', ext: 'svg', size: '12 KB' },\n      { label: '4K PNG (Black)', ext: 'png', size: '235 KB' },\n      { label: 'Print WebP', ext: 'webp', size: '85 KB' },\n    ],\n  },\n]\n\nconst DEFAULT_COLORS: BrandColor[] = [\n  {\n    id: 'primary-emerald',\n    name: 'Primary Emerald',\n    hex: '#10B981',\n    oklch: 'oklch(0.696 0.170 162.48)',\n    rgb: 'rgb(16, 185, 129)',\n    role: 'Primary Interactive Brand Color',\n    contrast: 'WCAG AAA 7.4:1',\n    usage: 'Primary brand color for CTAs, active pills, key highlights, and success indicators.',\n    bgClass: 'bg-[#10B981]',\n    textDark: true,\n  },\n  {\n    id: 'midnight-slate',\n    name: 'Midnight Slate',\n    hex: '#0F172A',\n    oklch: 'oklch(0.208 0.042 265.75)',\n    rgb: 'rgb(15, 23, 42)',\n    role: 'Dark Neutral Surface Base',\n    contrast: 'WCAG AAA 16.2:1',\n    usage: 'Core neutral background and high-contrast dark surface foundations across dark layouts.',\n    bgClass: 'bg-[#0F172A]',\n    textDark: false,\n  },\n  {\n    id: 'accent-blue',\n    name: 'Accent Blue',\n    hex: '#3B82F6',\n    oklch: 'oklch(0.623 0.214 259.80)',\n    rgb: 'rgb(59, 130, 246)',\n    role: 'Secondary Interactive Accent',\n    contrast: 'WCAG AA 4.8:1',\n    usage: 'Secondary accent for active links, information badges, focus rings, and secondary metrics.',\n    bgClass: 'bg-[#3B82F6]',\n    textDark: true,\n  },\n  {\n    id: 'background-base',\n    name: 'Background Base',\n    hex: '#F8FAFC',\n    oklch: 'oklch(0.985 0.002 247.80)',\n    rgb: 'rgb(248, 250, 252)',\n    role: 'Light Neutral Surface Fills',\n    contrast: 'WCAG AAA 19.5:1',\n    usage: 'Clean ambient light surface foundation, card backgrounds, and elevated container fills.',\n    bgClass: 'bg-[#F8FAFC]',\n    textDark: true,\n  },\n  {\n    id: 'amber-highlight',\n    name: 'Amber Highlight',\n    hex: '#F59E0B',\n    oklch: 'oklch(0.769 0.188 70.08)',\n    rgb: 'rgb(245, 158, 11)',\n    role: 'Warning & Spotlight Accent',\n    contrast: 'WCAG AAA 8.1:1',\n    usage: 'Warm highlight for warnings, pro tier tags, system notices, and featured sponsor badges.',\n    bgClass: 'bg-[#F59E0B]',\n    textDark: true,\n  },\n]\n\nconst DEFAULT_EXECUTIVES: Executive[] = [\n  {\n    id: 'elena-rostova',\n    name: 'Elena Rostova',\n    role: 'Chief Executive Officer & Co-Founder',\n    bio: 'Pioneered component registry architecture and headless design systems. Former principal architect at NextGen UI. Leading UIPKGE’s mission to make design-engineering frictionless for global software teams.',\n    avatarUrl: 'https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?q=80&w=400&auto=format&fit=crop',\n    initials: 'ER',\n    fileSize: '12.4 MB',\n    dimensions: '4000 × 5000 px · 300 DPI',\n    topics: ['Component Architecture', 'Design Systems', 'Open-Source Sustainability', 'Developer Experience'],\n    socials: [\n      { platform: 'x', url: 'https://x.com/elenarostova' },\n      { platform: 'linkedin', url: 'https://linkedin.com/in/elenarostova' },\n      { platform: 'github', url: 'https://github.com/elenarostova' },\n    ],\n  },\n  {\n    id: 'marcus-vance',\n    name: 'Marcus Vance',\n    role: 'Chief Technology Officer & Co-Founder',\n    bio: 'Specializes in multi-framework compiler tooling, zero-runtime tokens, and high-performance WebAssembly render pipelines. Previously led frontend infrastructure and UI performance engineering at CloudScale.',\n    avatarUrl: 'https://images.unsplash.com/photo-1534528741775-53994a69daeb?q=80&w=400&auto=format&fit=crop',\n    initials: 'MV',\n    fileSize: '11.8 MB',\n    dimensions: '4000 × 5000 px · 300 DPI',\n    topics: ['Web Performance', 'AST Tooling', 'Tailwind v4 Engine', 'Reka UI Headless Core'],\n    socials: [\n      { platform: 'x', url: 'https://x.com/marcusvance' },\n      { platform: 'linkedin', url: 'https://linkedin.com/in/marcusvance' },\n      { platform: 'github', url: 'https://github.com/marcusvance' },\n    ],\n  },\n]\n\nconst DEFAULT_GUIDELINES: BrandGuidelineRule[] = [\n  { type: 'do', text: 'Maintain minimum clear space equal to 50% of the logomark height around all sides.' },\n  { type: 'do', text: 'Use the official OKLCH and Hex values when reproducing brand swatches in digital media.' },\n  { type: 'do', text: 'Use high-contrast monochromatic variants for single-color print, laser etching, or stamps.' },\n  { type: 'dont', text: 'Do not stretch, distort, rotate, or alter the aspect ratio of official logo assets.' },\n  { type: 'dont', text: 'Do not add drop shadows, outer glows, strokes, or unapproved gradients to the mark.' },\n  { type: 'dont', text: 'Do not place the full-color primary mark on low-contrast or visually busy backgrounds.' },\n]\n\nconst props = withDefaults(\n  defineProps<{\n    companyName?: string\n    title?: string\n    subtitle?: string\n    version?: string\n    lastUpdated?: string\n    pressEmail?: string\n    pressKitZipSize?: string\n    pressKitZipUrl?: string\n    factSheetPdfSize?: string\n    boilerplateText?: string\n    logos?: LogoAsset[]\n    colors?: BrandColor[]\n    executives?: Executive[]\n    guidelines?: BrandGuidelineRule[]\n    variant?: 'default' | 'compact'\n    class?: HTMLAttributes['class']\n  }>(),\n  {\n    companyName: 'UIPKGE',\n    title: 'Brand Guidelines & Press Kit',\n    subtitle: 'Official logos, brand colors, typography rules, and executive media assets.',\n    version: 'v2.4',\n    lastUpdated: 'August 2026',\n    pressEmail: 'press@uipkge.dev',\n    pressKitZipSize: '48 MB',\n    pressKitZipUrl: '#',\n    factSheetPdfSize: '2.4 MB',\n    boilerplateText:\n      'UIPKGE is an open-source dual-framework UI registry providing copy-paste accessible components for Vue 3 and React 19 with 100% code ownership. Headquartered in San Francisco with a distributed core maintainer team.',\n    variant: 'default',\n  },\n)\n\nconst activeLogos = computed(() => props.logos ?? DEFAULT_LOGOS)\nconst activeColors = computed(() => props.colors ?? DEFAULT_COLORS)\nconst activeExecutives = computed(() => props.executives ?? DEFAULT_EXECUTIVES)\nconst activeGuidelines = computed(() => props.guidelines ?? DEFAULT_GUIDELINES)\n\nconst activeTab = ref<'all' | 'logos' | 'colors' | 'leadership' | 'press'>('all')\nconst copiedKey = ref<string | null>(null)\nconst downloadedKey = ref<string | null>(null)\n\nasync function copyToClipboard(key: string, text: string) {\n  try {\n    await navigator.clipboard.writeText(text)\n    copiedKey.value = key\n    setTimeout(() => {\n      if (copiedKey.value === key) {\n        copiedKey.value = null\n      }\n    }, 1800)\n  } catch {\n    // Fallback: noop\n  }\n}\n\nfunction handleDownload(key: string, fileName: string) {\n  downloadedKey.value = key\n  // Simulated download feedback\n  setTimeout(() => {\n    if (downloadedKey.value === key) {\n      downloadedKey.value = null\n    }\n  }, 2000)\n}\n</script>\n\n<template>\n  <div\n    data-slot=\"press-kit-brand-assets\"\n    :class=\"cn('bg-background text-foreground w-full transition-colors', props.class)\"\n  >\n    <div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8 lg:py-16\">\n      <!-- Header Hero Section -->\n      <div class=\"border-border bg-card relative overflow-hidden rounded-2xl border p-6 shadow-xs sm:p-10\">\n        <div />\n        <div />\n\n        <div class=\"relative z-10 flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between\">\n          <div class=\"max-w-3xl space-y-4\">\n            <div class=\"flex flex-wrap items-center gap-2\">\n              <Badge variant=\"outline\" class=\"border-primary/30 bg-primary/10 text-primary gap-1.5 font-medium\">\n                <Palette class=\"size-3.5 shrink-0\" />\n                <span>Media & Brand Hub</span>\n              </Badge>\n              <Badge variant=\"secondary\" class=\"font-mono text-xs\">\n                {{ version }}\n              </Badge>\n              <span class=\"text-muted-foreground text-xs\">Updated {{ lastUpdated }}</span>\n            </div>\n\n            <h1 class=\"text-3xl font-bold tracking-tight sm:text-4xl lg:text-5xl\">\n              {{ title }}\n            </h1>\n\n            <p class=\"text-muted-foreground max-w-2xl text-base leading-relaxed sm:text-lg\">\n              {{ subtitle }}\n            </p>\n\n            <div class=\"text-muted-foreground flex flex-wrap items-center gap-4 pt-1 text-xs\">\n              <div class=\"flex items-center gap-1.5\">\n                <ShieldCheck class=\"text-primary size-4 shrink-0\" />\n                <span>Editorial Use License (CC BY-NC 4.0)</span>\n              </div>\n              <Separator orientation=\"vertical\" class=\"hidden h-3 sm:block\" />\n              <div class=\"flex items-center gap-1.5\">\n                <FileArchive class=\"text-muted-foreground size-4 shrink-0\" />\n                <span>24 Verified Brand Assets</span>\n              </div>\n              <Separator orientation=\"vertical\" class=\"hidden h-3 sm:block\" />\n              <div class=\"flex items-center gap-1.5\">\n                <Globe class=\"text-muted-foreground size-4 shrink-0\" />\n                <span>Vector & 300 DPI Print Ready</span>\n              </div>\n            </div>\n          </div>\n\n          <!-- Primary Download Action Card -->\n          <div class=\"flex flex-col gap-3 sm:min-w-[280px] lg:flex-col\">\n            <Button\n              aria-label=\"Download attachment\"\n              size=\"lg\"\n              class=\"focus-visible:ring-ring h-auto min-h-10 w-full gap-2 py-2.5 text-center font-semibold whitespace-normal shadow-sm focus-visible:ring-2\"\n              @click=\"handleDownload('all-zip', 'uipkge-complete-press-kit.zip')\"\n            >\n              <Check v-if=\"downloadedKey === 'all-zip'\" class=\"size-4 shrink-0\" />\n              <Download v-else class=\"size-4 shrink-0\" />\n              <span>\n                {{\n                  downloadedKey === 'all-zip'\n                    ? 'Press Kit Downloaded'\n                    : `Download Complete Press Kit (.ZIP · ${pressKitZipSize})`\n                }}\n              </span>\n            </Button>\n\n            <div class=\"grid grid-cols-2 gap-2\">\n              <Button\n                variant=\"outline\"\n                size=\"sm\"\n                class=\"h-auto min-h-8 w-full gap-1.5 text-center text-xs whitespace-normal\"\n                @click=\"copyToClipboard('email-header', pressEmail)\"\n              >\n                <Check v-if=\"copiedKey === 'email-header'\" class=\"text-primary size-3.5 shrink-0\" />\n                <Mail v-else class=\"size-3.5 shrink-0\" />\n                <span>{{ copiedKey === 'email-header' ? 'Copied' : 'Press Desk' }}</span>\n              </Button>\n\n              <Button\n                variant=\"outline\"\n                size=\"sm\"\n                class=\"h-auto min-h-8 w-full gap-1.5 text-center text-xs whitespace-normal\"\n                @click=\"copyToClipboard('boilerplate-header', boilerplateText)\"\n              >\n                <Check v-if=\"copiedKey === 'boilerplate-header'\" class=\"text-primary size-3.5 shrink-0\" />\n                <Copy v-else class=\"size-3.5 shrink-0\" />\n                <span>{{ copiedKey === 'boilerplate-header' ? 'Copied' : 'Boilerplate' }}</span>\n              </Button>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <!-- Quick Section Anchor Tabs (Default Variant) -->\n      <div v-if=\"variant === 'default'\" class=\"mt-8 flex items-center gap-2 overflow-x-auto pb-2\">\n        <Button\n          :variant=\"activeTab === 'all' ? 'default' : 'ghost'\"\n          size=\"sm\"\n          class=\"h-auto min-h-8 gap-1.5 text-center text-xs whitespace-normal\"\n          @click=\"activeTab = 'all'\"\n        >\n          <Layers class=\"size-3.5 shrink-0\" />\n          <span>All Assets</span>\n        </Button>\n        <Button\n          :variant=\"activeTab === 'logos' ? 'default' : 'ghost'\"\n          size=\"sm\"\n          class=\"h-auto min-h-8 gap-1.5 text-center text-xs whitespace-normal\"\n          @click=\"activeTab = 'logos'\"\n        >\n          <FileImage class=\"size-3.5 shrink-0\" />\n          <span>Logos & Marks ({{ activeLogos.length }})</span>\n        </Button>\n        <Button\n          :variant=\"activeTab === 'colors' ? 'default' : 'ghost'\"\n          size=\"sm\"\n          class=\"h-auto min-h-8 gap-1.5 text-center text-xs whitespace-normal\"\n          @click=\"activeTab = 'colors'\"\n        >\n          <Palette class=\"size-3.5 shrink-0\" />\n          <span>Color Palette ({{ activeColors.length }})</span>\n        </Button>\n        <Button\n          :variant=\"activeTab === 'leadership' ? 'default' : 'ghost'\"\n          size=\"sm\"\n          class=\"h-auto min-h-8 gap-1.5 text-center text-xs whitespace-normal\"\n          @click=\"activeTab = 'leadership'\"\n        >\n          <User class=\"size-3.5 shrink-0\" />\n          <span>Leadership ({{ activeExecutives.length }})</span>\n        </Button>\n        <Button\n          :variant=\"activeTab === 'press' ? 'default' : 'ghost'\"\n          size=\"sm\"\n          class=\"h-auto min-h-8 gap-1.5 text-center text-xs whitespace-normal\"\n          @click=\"activeTab = 'press'\"\n        >\n          <Mail class=\"size-3.5 shrink-0\" />\n          <span>Press Contact</span>\n        </Button>\n      </div>\n\n      <!-- SECTION 1: Official Logo Downloads -->\n      <div v-if=\"activeTab === 'all' || activeTab === 'logos'\" class=\"mt-12 space-y-6\">\n        <div class=\"flex flex-col justify-between gap-4 sm:flex-row sm:items-end\">\n          <div>\n            <div class=\"text-primary flex items-center gap-2 text-xs font-semibold tracking-wider uppercase\">\n              <FileImage class=\"size-4 shrink-0\" />\n              <span>Official Vectors & Assets</span>\n            </div>\n            <h2 class=\"mt-1 text-2xl font-bold tracking-tight sm:text-3xl\">Official Logo Downloads</h2>\n            <p class=\"text-muted-foreground mt-1 max-w-2xl text-sm\">\n              High-resolution vector assets for print and digital publishing. Please preserve minimum clear space.\n            </p>\n          </div>\n          <Badge variant=\"outline\" class=\"gap-1 self-start font-mono text-xs sm:self-auto\">\n            <span>4 Approved Variants</span>\n          </Badge>\n        </div>\n\n        <div class=\"grid gap-6 md:grid-cols-2\">\n          <Card\n            v-for=\"logo in activeLogos\"\n            :key=\"logo.id\"\n            class=\"border-border hover:border-border/80 flex flex-col justify-between overflow-hidden border shadow-xs transition-colors\"\n          >\n            <div>\n              <!-- Logo Preview Surface with Checkered / Contrast Backdrop -->\n              <div\n                :class=\"\n                  cn(\n                    'relative flex min-h-[190px] items-center justify-center overflow-hidden p-4 text-center transition-colors sm:p-8',\n                    logo.theme === 'dark'\n                      ? 'bg-zinc-950 text-white'\n                      : logo.theme === 'light' && logo.id === 'monochrome-light'\n                        ? 'bg-zinc-100 text-zinc-950 dark:bg-zinc-200'\n                        : 'bg-muted/40 text-foreground bg-[radial-gradient(var(--border)_1px,transparent_1px)] [background-size:12px_12px]',\n                  )\n                \"\n              >\n                <!-- Rendered Vector Logo Preview -->\n                <!-- Horizontal Logo -->\n                <div v-if=\"logo.id === 'horizontal-primary'\" class=\"flex items-center gap-3.5\">\n                  <div\n                    class=\"flex size-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-tr from-emerald-600 to-teal-400 text-white shadow-xs\"\n                  >\n                    <svg viewBox=\"0 0 36 36\" fill=\"none\" class=\"size-6 shrink-0\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path\n                        d=\"M18 3L31 10.5V25.5L18 33L5 25.5V10.5L18 3Z\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2.5\"\n                        stroke-linejoin=\"round\"\n                      />\n                      <path\n                        d=\"M18 3V18L31 10.5\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.7\"\n                      />\n                      <path\n                        d=\"M18 18L5 10.5\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.7\"\n                      />\n                      <path\n                        d=\"M18 18V33\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.9\"\n                      />\n                      <path d=\"M18 10.5L24.5 14.25V21.75L18 25.5L11.5 21.75V14.25L18 10.5Z\" fill=\"currentColor\" />\n                    </svg>\n                  </div>\n                  <div class=\"flex items-baseline gap-1.5\">\n                    <span class=\"font-sans text-2xl font-bold tracking-tight\">uipkge</span>\n                    <span class=\"bg-success/15 text-success rounded px-1.5 py-0.5 text-xs font-semibold\"> .dev </span>\n                  </div>\n                </div>\n\n                <!-- Square App Icon Mark -->\n                <div v-else-if=\"logo.id === 'app-icon-mark'\" class=\"flex items-center justify-center\">\n                  <div\n                    class=\"text-success relative flex size-20 shrink-0 items-center justify-center rounded-2xl bg-gradient-to-br from-zinc-900 via-zinc-800 to-zinc-950 p-4 shadow-md ring-1 ring-white/10\"\n                  >\n                    <svg viewBox=\"0 0 36 36\" fill=\"none\" class=\"size-12 shrink-0\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path\n                        d=\"M18 3L31 10.5V25.5L18 33L5 25.5V10.5L18 3Z\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2.5\"\n                        stroke-linejoin=\"round\"\n                      />\n                      <path\n                        d=\"M18 3V18L31 10.5\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.7\"\n                      />\n                      <path\n                        d=\"M18 18L5 10.5\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.7\"\n                      />\n                      <path\n                        d=\"M18 18V33\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.9\"\n                      />\n                      <path d=\"M18 10.5L24.5 14.25V21.75L18 25.5L11.5 21.75V14.25L18 10.5Z\" fill=\"currentColor\" />\n                    </svg>\n                  </div>\n                </div>\n\n                <!-- Dark Mode Monochromatic Logo -->\n                <div v-else-if=\"logo.id === 'monochrome-dark'\" class=\"flex items-center gap-3.5\">\n                  <div\n                    class=\"flex size-10 shrink-0 items-center justify-center rounded-xl border border-white/20 bg-white/10 text-white\"\n                  >\n                    <svg viewBox=\"0 0 36 36\" fill=\"none\" class=\"size-6 shrink-0\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path\n                        d=\"M18 3L31 10.5V25.5L18 33L5 25.5V10.5L18 3Z\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2.5\"\n                        stroke-linejoin=\"round\"\n                      />\n                      <path\n                        d=\"M18 3V18L31 10.5\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.7\"\n                      />\n                      <path\n                        d=\"M18 18L5 10.5\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.7\"\n                      />\n                      <path\n                        d=\"M18 18V33\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.9\"\n                      />\n                      <path d=\"M18 10.5L24.5 14.25V21.75L18 25.5L11.5 21.75V14.25L18 10.5Z\" fill=\"currentColor\" />\n                    </svg>\n                  </div>\n                  <div class=\"flex items-baseline gap-1.5\">\n                    <span class=\"font-sans text-2xl font-bold tracking-tight text-white\">uipkge</span>\n                    <span class=\"rounded bg-white/15 px-1.5 py-0.5 text-xs font-semibold text-white/90\">.dev</span>\n                  </div>\n                </div>\n\n                <!-- Light Mode Inverted Logo -->\n                <div v-else class=\"flex items-center gap-3.5\">\n                  <div class=\"flex size-10 shrink-0 items-center justify-center rounded-xl bg-zinc-950 text-zinc-100\">\n                    <svg viewBox=\"0 0 36 36\" fill=\"none\" class=\"size-6 shrink-0\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path\n                        d=\"M18 3L31 10.5V25.5L18 33L5 25.5V10.5L18 3Z\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2.5\"\n                        stroke-linejoin=\"round\"\n                      />\n                      <path\n                        d=\"M18 3V18L31 10.5\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.7\"\n                      />\n                      <path\n                        d=\"M18 18L5 10.5\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.7\"\n                      />\n                      <path\n                        d=\"M18 18V33\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\"\n                        stroke-linejoin=\"round\"\n                        opacity=\"0.9\"\n                      />\n                      <path d=\"M18 10.5L24.5 14.25V21.75L18 25.5L11.5 21.75V14.25L18 10.5Z\" fill=\"currentColor\" />\n                    </svg>\n                  </div>\n                  <div class=\"flex items-baseline gap-1.5\">\n                    <span class=\"font-sans text-2xl font-bold tracking-tight text-zinc-950\">uipkge</span>\n                    <span class=\"rounded bg-zinc-950/10 px-1.5 py-0.5 text-xs font-semibold text-zinc-950\">.dev</span>\n                  </div>\n                </div>\n\n                <!-- Specs Pill -->\n                <div class=\"absolute right-2.5 bottom-2.5\">\n                  <span\n                    class=\"bg-background/80 text-foreground border-border/50 rounded border px-2 py-0.5 font-mono text-xs backdrop-blur-sm\"\n                  >\n                    {{ logo.dimensions }}\n                  </span>\n                </div>\n              </div>\n\n              <!-- Card Content Details -->\n              <CardHeader class=\"p-5 pb-3\">\n                <div class=\"flex flex-wrap items-center justify-between gap-2\">\n                  <CardTitle class=\"text-base font-semibold\">{{ logo.title }}</CardTitle>\n                  <Badge variant=\"secondary\" class=\"text-xs\">{{ logo.category }}</Badge>\n                </div>\n                <CardDescription class=\"mt-1 text-xs leading-relaxed\">\n                  {{ logo.description }}\n                </CardDescription>\n                <div class=\"text-muted-foreground flex items-center gap-1.5 pt-1 text-xs\">\n                  <Info class=\"text-primary size-3.5 shrink-0\" />\n                  <span class=\"line-clamp-1\"\n                    ><strong class=\"text-foreground font-medium\">Best for:</strong> {{ logo.bestFor }}</span\n                  >\n                </div>\n              </CardHeader>\n            </div>\n\n            <!-- Card Footer Download Buttons -->\n            <CardFooter class=\"p-5 pt-0\">\n              <div class=\"w-full space-y-2\">\n                <div class=\"text-muted-foreground flex items-center justify-between text-xs font-medium\">\n                  <span>Available Formats</span>\n                  <span class=\"font-mono text-xs\">Vector & Bitmaps</span>\n                </div>\n                <div class=\"grid grid-cols-3 gap-2\">\n                  <Button\n                    aria-label=\"Download attachment\"\n                    v-for=\"fmt in logo.formats\"\n                    :key=\"fmt.ext\"\n                    variant=\"outline\"\n                    size=\"sm\"\n                    class=\"focus-visible:ring-ring h-auto min-h-8 w-full flex-col gap-0.5 px-1.5 py-2 text-center text-xs whitespace-normal focus-visible:ring-2\"\n                    @click=\"handleDownload(`${logo.id}-${fmt.ext}`, `${logo.id}.${fmt.ext}`)\"\n                  >\n                    <div class=\"flex items-center gap-1 font-medium\">\n                      <Check v-if=\"downloadedKey === `${logo.id}-${fmt.ext}`\" class=\"text-primary size-3 shrink-0\" />\n                      <Download v-else class=\"text-muted-foreground size-3 shrink-0\" />\n                      <span class=\"truncate\">{{ fmt.label.split(' ')[0] }}</span>\n                    </div>\n                    <span class=\"text-muted-foreground font-mono text-xs\">{{ fmt.size }}</span>\n                  </Button>\n                </div>\n              </div>\n            </CardFooter>\n          </Card>\n        </div>\n      </div>\n\n      <!-- SECTION 2: Official Brand Palette & OKLCH Color Swatches -->\n      <div v-if=\"activeTab === 'all' || activeTab === 'colors'\" class=\"mt-16 space-y-6\">\n        <div class=\"flex flex-col justify-between gap-4 sm:flex-row sm:items-end\">\n          <div>\n            <div class=\"text-primary flex items-center gap-2 text-xs font-semibold tracking-wider uppercase\">\n              <Palette class=\"size-4 shrink-0\" />\n              <span>Token Palette & Swatches</span>\n            </div>\n            <h2 class=\"mt-1 text-2xl font-bold tracking-tight sm:text-3xl\">Official Brand Palette & OKLCH</h2>\n            <p class=\"text-muted-foreground mt-1 max-w-2xl text-sm\">\n              Perceptually uniform color tokens with high WCAG contrast ratings for both dark and light UI surfaces.\n            </p>\n          </div>\n          <Badge variant=\"outline\" class=\"gap-1 self-start font-mono text-xs sm:self-auto\">\n            <span>5 Core Swatches</span>\n          </Badge>\n        </div>\n\n        <div class=\"grid gap-4 sm:grid-cols-2 lg:grid-cols-5\">\n          <Card\n            v-for=\"color in activeColors\"\n            :key=\"color.id\"\n            class=\"border-border flex flex-col justify-between overflow-hidden border shadow-xs\"\n          >\n            <div>\n              <!-- Swatch Visual Header -->\n              <div\n                :class=\"\n                  cn('border-border/40 relative flex h-24 w-full flex-col justify-between border-b p-3', color.bgClass)\n                \"\n              >\n                <div class=\"flex items-center justify-between\">\n                  <span\n                    :class=\"\n                      cn(\n                        'rounded-full px-2 py-0.5 text-xs font-medium backdrop-blur-md',\n                        color.textDark ? 'bg-black/10 text-black' : 'bg-white/20 text-white',\n                      )\n                    \"\n                  >\n                    {{ color.contrast }}\n                  </span>\n                </div>\n                <div class=\"flex items-center justify-between\">\n                  <span :class=\"cn('font-mono text-xs font-bold', color.textDark ? 'text-black' : 'text-white')\">\n                    {{ color.hex }}\n                  </span>\n                </div>\n              </div>\n\n              <!-- Color Details -->\n              <div class=\"space-y-3 p-4\">\n                <div>\n                  <h3 class=\"text-foreground text-sm font-semibold\">{{ color.name }}</h3>\n                  <p class=\"text-primary mt-0.5 text-xs font-medium\">{{ color.role }}</p>\n                </div>\n\n                <p class=\"text-muted-foreground text-xs leading-relaxed\">\n                  {{ color.usage }}\n                </p>\n\n                <!-- Copy Value Blocks -->\n                <div class=\"space-y-1.5 pt-1\">\n                  <div\n                    class=\"bg-muted/60 border-border/40 flex items-center justify-between rounded-md border px-2.5 py-1.5 text-xs\"\n                  >\n                    <span class=\"text-muted-foreground truncate font-mono text-xs\">{{ color.hex }}</span>\n                    <button\n                      type=\"button\"\n                      class=\"text-foreground hover:text-primary focus-visible:ring-ring flex min-h-6 items-center gap-1 rounded px-1 text-xs transition-colors focus-visible:ring-2\"\n                      :aria-label=\"`Copy ${color.name} HEX`\"\n                      @click=\"copyToClipboard(`hex-${color.id}`, color.hex)\"\n                    >\n                      <Check v-if=\"copiedKey === `hex-${color.id}`\" class=\"text-primary size-3 shrink-0\" />\n                      <Copy v-else class=\"size-3 shrink-0\" />\n                      <span class=\"text-xs\">{{ copiedKey === `hex-${color.id}` ? 'Copied' : 'HEX' }}</span>\n                    </button>\n                  </div>\n\n                  <div\n                    class=\"bg-muted/60 border-border/40 flex items-center justify-between rounded-md border px-2.5 py-1.5 text-xs\"\n                  >\n                    <span class=\"text-muted-foreground truncate font-mono text-xs\" :title=\"color.oklch\">\n                      {{ color.oklch.split('(')[1].replace(')', '') }}\n                    </span>\n                    <button\n                      type=\"button\"\n                      class=\"text-foreground hover:text-primary focus-visible:ring-ring flex min-h-6 items-center gap-1 rounded px-1 text-xs transition-colors focus-visible:ring-2\"\n                      :aria-label=\"`Copy ${color.name} OKLCH`\"\n                      @click=\"copyToClipboard(`oklch-${color.id}`, color.oklch)\"\n                    >\n                      <Check v-if=\"copiedKey === `oklch-${color.id}`\" class=\"text-primary size-3 shrink-0\" />\n                      <Copy v-else class=\"size-3 shrink-0\" />\n                      <span class=\"text-xs\">{{ copiedKey === `oklch-${color.id}` ? 'Copied' : 'OKLCH' }}</span>\n                    </button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </Card>\n        </div>\n      </div>\n\n      <!-- SECTION 3: Executive Leadership Headshots & Bios -->\n      <div v-if=\"activeTab === 'all' || activeTab === 'leadership'\" class=\"mt-16 space-y-6\">\n        <div class=\"flex flex-col justify-between gap-4 sm:flex-row sm:items-end\">\n          <div>\n            <div class=\"text-primary flex items-center gap-2 text-xs font-semibold tracking-wider uppercase\">\n              <User class=\"size-4 shrink-0\" />\n              <span>Media Spokespersons</span>\n            </div>\n            <h2 class=\"mt-1 text-2xl font-bold tracking-tight sm:text-3xl\">Executive Leadership & Bios</h2>\n            <p class=\"text-muted-foreground mt-1 max-w-2xl text-sm\">\n              Official executive headshots and media blurbs for press releases, podcasts, and event keynotes.\n            </p>\n          </div>\n          <Badge variant=\"outline\" class=\"gap-1 self-start font-mono text-xs sm:self-auto\">\n            <span>300 DPI Studio Photography</span>\n          </Badge>\n        </div>\n\n        <div class=\"grid gap-6 md:grid-cols-2\">\n          <Card\n            v-for=\"exec in activeExecutives\"\n            :key=\"exec.id\"\n            class=\"border-border flex flex-col justify-between overflow-hidden border shadow-xs\"\n          >\n            <div class=\"space-y-5 p-6\">\n              <div class=\"flex flex-col items-start gap-4 sm:flex-row sm:items-center\">\n                <Avatar class=\"border-border size-20 shrink-0 rounded-2xl border-2 shadow-sm\">\n                  <AvatarImage :src=\"exec.avatarUrl\" :alt=\"exec.name\" class=\"object-cover\" />\n                  <AvatarFallback class=\"bg-primary/10 text-primary rounded-2xl text-lg font-bold\">\n                    {{ exec.initials }}\n                  </AvatarFallback>\n                </Avatar>\n\n                <div class=\"space-y-1\">\n                  <div class=\"flex flex-wrap items-center gap-2\">\n                    <h3 class=\"text-foreground text-lg font-bold\">{{ exec.name }}</h3>\n                    <Badge variant=\"secondary\" class=\"text-xs font-normal\">Executive</Badge>\n                  </div>\n                  <p class=\"text-primary text-xs font-medium\">{{ exec.role }}</p>\n                  <p class=\"text-muted-foreground font-mono text-xs\">{{ exec.dimensions }}</p>\n                </div>\n              </div>\n\n              <p class=\"text-muted-foreground text-xs leading-relaxed\">\n                {{ exec.bio }}\n              </p>\n\n              <div class=\"space-y-1.5\">\n                <span class=\"text-foreground text-xs font-medium\">Speaking Topics & Focus Areas:</span>\n                <div class=\"flex flex-wrap gap-1.5\">\n                  <Badge\n                    v-for=\"topic in exec.topics\"\n                    :key=\"topic\"\n                    variant=\"outline\"\n                    class=\"bg-muted/40 text-xs font-normal\"\n                  >\n                    {{ topic }}\n                  </Badge>\n                </div>\n              </div>\n            </div>\n\n            <CardFooter\n              class=\"border-border/40 bg-muted/20 mt-2 flex flex-col items-stretch justify-between gap-3 border-t p-6 pt-0 sm:flex-row sm:items-center\"\n            >\n              <div class=\"text-muted-foreground flex items-center gap-1 text-xs\">\n                <FileImage class=\"text-primary size-3.5 shrink-0\" />\n                <span>{{ exec.fileSize }} RAW TIFF & JPG</span>\n              </div>\n\n              <Button\n                aria-label=\"Download attachment\"\n                size=\"sm\"\n                variant=\"default\"\n                class=\"focus-visible:ring-ring h-auto min-h-8 gap-1.5 text-center text-xs whitespace-normal focus-visible:ring-2\"\n                @click=\"handleDownload(`headshot-${exec.id}`, `${exec.id}-headshot-300dpi.jpg`)\"\n              >\n                <Check v-if=\"downloadedKey === `headshot-${exec.id}`\" class=\"size-3.5 shrink-0\" />\n                <Download v-else class=\"size-3.5 shrink-0\" />\n                <span>{{\n                  downloadedKey === `headshot-${exec.id}` ? 'Headshot Downloaded' : 'Download Headshot (300 DPI)'\n                }}</span>\n              </Button>\n            </CardFooter>\n          </Card>\n        </div>\n      </div>\n\n      <!-- SECTION 4: Press Hub & Media Contact + Brand Guidelines -->\n      <div v-if=\"activeTab === 'all' || activeTab === 'press'\" class=\"mt-16 grid gap-6 lg:grid-cols-2\">\n        <!-- Press Desk Contact Card -->\n        <Card class=\"border-border flex flex-col justify-between border shadow-xs\">\n          <CardHeader class=\"p-6 pb-4\">\n            <div class=\"flex flex-wrap items-center justify-between gap-2\">\n              <div class=\"text-primary flex items-center gap-2 text-xs font-semibold tracking-wider uppercase\">\n                <Mail class=\"size-4 shrink-0\" />\n                <span>Press & Media Inquiries</span>\n              </div>\n              <Badge variant=\"outline\" class=\"font-mono text-xs\">{{ version }}</Badge>\n            </div>\n            <CardTitle class=\"mt-1 text-xl font-bold\">Get in Touch with Media Relations</CardTitle>\n            <CardDescription class=\"text-xs leading-relaxed\">\n              Direct access for accredited tech journalists, conference organizers, analysts, and podcast hosts.\n            </CardDescription>\n          </CardHeader>\n\n          <CardContent class=\"space-y-4 p-6 pt-0\">\n            <!-- Email Box -->\n            <div\n              class=\"border-border bg-muted/40 flex flex-wrap items-center justify-between gap-3 rounded-lg border p-3.5\"\n            >\n              <div class=\"flex min-w-0 items-center gap-3\">\n                <div class=\"bg-primary/10 text-primary flex size-9 shrink-0 items-center justify-center rounded-md\">\n                  <Mail class=\"size-4 shrink-0\" />\n                </div>\n                <div>\n                  <p class=\"text-foreground text-xs font-semibold\">{{ pressEmail }}</p>\n                  <p class=\"text-muted-foreground text-xs\">Official Media & Inquiries Desk</p>\n                </div>\n              </div>\n              <Button\n                variant=\"outline\"\n                size=\"sm\"\n                class=\"h-auto min-h-8 gap-1.5 text-center text-xs whitespace-normal\"\n                @click=\"copyToClipboard('press-email', pressEmail)\"\n              >\n                <Check v-if=\"copiedKey === 'press-email'\" class=\"text-primary size-3.5 shrink-0\" />\n                <Copy v-else class=\"size-3.5 shrink-0\" />\n                <span>{{ copiedKey === 'press-email' ? 'Copied' : 'Copy' }}</span>\n              </Button>\n            </div>\n\n            <!-- Media SLA & Guidelines Grid -->\n            <div class=\"grid grid-cols-2 gap-3 pt-1\">\n              <div class=\"border-border/60 bg-card space-y-1 rounded-lg border p-3\">\n                <div class=\"text-foreground flex items-center gap-1.5 text-xs font-semibold\">\n                  <ShieldCheck class=\"text-primary size-3.5 shrink-0\" />\n                  <span>&lt; 24h Response</span>\n                </div>\n                <p class=\"text-muted-foreground text-xs\">Prompt turnaround on verified interview and quote requests.</p>\n              </div>\n\n              <div class=\"border-border/60 bg-card space-y-1 rounded-lg border p-3\">\n                <div class=\"text-foreground flex items-center gap-1.5 text-xs font-semibold\">\n                  <Globe class=\"text-primary size-3.5 shrink-0\" />\n                  <span>Embargo Previews</span>\n                </div>\n                <p class=\"text-muted-foreground text-xs\">Advance beta access and documentation under NDA/embargo.</p>\n              </div>\n            </div>\n          </CardContent>\n\n          <CardFooter class=\"border-border/40 bg-muted/10 mt-2 border-t p-6 pt-0\">\n            <div class=\"flex w-full flex-col items-stretch justify-between gap-3 pt-3 sm:flex-row sm:items-center\">\n              <span class=\"text-muted-foreground text-xs\">Need company numbers & metrics?</span>\n              <Button\n                aria-label=\"Download attachment\"\n                variant=\"outline\"\n                size=\"sm\"\n                class=\"h-auto min-h-8 gap-1.5 text-center text-xs whitespace-normal\"\n                @click=\"handleDownload('factsheet-pdf', 'uipkge-company-factsheet.pdf')\"\n              >\n                <Check v-if=\"downloadedKey === 'factsheet-pdf'\" class=\"text-primary size-3.5 shrink-0\" />\n                <FileText v-else class=\"size-3.5 shrink-0\" />\n                <span>{{\n                  downloadedKey === 'factsheet-pdf' ? 'Downloaded' : `Company Fact Sheet (.PDF · ${factSheetPdfSize})`\n                }}</span>\n              </Button>\n            </div>\n          </CardFooter>\n        </Card>\n\n        <!-- Company Boilerplate & Usage Rules -->\n        <Card class=\"border-border flex flex-col justify-between border shadow-xs\">\n          <CardHeader class=\"p-6 pb-4\">\n            <div class=\"flex flex-wrap items-center justify-between gap-2\">\n              <div class=\"text-primary flex items-center gap-2 text-xs font-semibold tracking-wider uppercase\">\n                <FileCode class=\"size-4 shrink-0\" />\n                <span>Brand Rules & Boilerplate</span>\n              </div>\n              <Button\n                variant=\"ghost\"\n                size=\"xs\"\n                class=\"text-primary h-auto min-h-8 gap-1 text-center text-xs whitespace-normal\"\n                @click=\"copyToClipboard('boilerplate-text', boilerplateText)\"\n              >\n                <Check v-if=\"copiedKey === 'boilerplate-text'\" class=\"size-3 shrink-0\" />\n                <Copy v-else class=\"size-3 shrink-0\" />\n                <span>{{ copiedKey === 'boilerplate-text' ? 'Copied Boilerplate' : 'Copy Boilerplate' }}</span>\n              </Button>\n            </div>\n            <CardTitle class=\"mt-1 text-xl font-bold\">Official Company Boilerplate</CardTitle>\n            <CardDescription class=\"text-xs leading-relaxed\">\n              Approved copy for standard \"About the Company\" sections in press releases and event booklets.\n            </CardDescription>\n          </CardHeader>\n\n          <CardContent class=\"space-y-4 p-6 pt-0\">\n            <div\n              class=\"border-border bg-muted/40 text-muted-foreground rounded-lg border p-3.5 text-xs leading-relaxed italic\"\n            >\n              \"{{ boilerplateText }}\"\n            </div>\n\n            <!-- Quick Do's & Don'ts -->\n            <div class=\"space-y-2\">\n              <span class=\"text-foreground text-xs font-semibold\">Brand Usage Rules:</span>\n              <div class=\"grid gap-2\">\n                <div\n                  v-for=\"(rule, idx) in activeGuidelines.slice(0, 4)\"\n                  :key=\"idx\"\n                  class=\"text-muted-foreground flex items-start gap-2 text-xs\"\n                >\n                  <CheckCircle2 v-if=\"rule.type === 'do'\" class=\"text-success mt-0.5 size-3.5 shrink-0\" />\n                  <XCircle v-else class=\"text-warning mt-0.5 size-3.5 shrink-0\" />\n                  <span class=\"leading-normal\">{{ rule.text }}</span>\n                </div>\n              </div>\n            </div>\n          </CardContent>\n\n          <CardFooter class=\"border-border/40 bg-muted/10 mt-2 border-t p-6 pt-0\">\n            <div class=\"text-muted-foreground flex w-full items-center justify-between pt-3 text-xs\">\n              <span>Questions regarding brand trademark usage?</span>\n              <a\n                :href=\"`mailto:${pressEmail}?subject=Brand%20Guideline%20Inquiry`\"\n                class=\"text-primary inline-flex items-center gap-1 font-medium hover:underline\"\n              >\n                Contact Legal Desk\n                <ExternalLink class=\"size-3 shrink-0\" />\n              </a>\n            </div>\n          </CardFooter>\n        </Card>\n      </div>\n    </div>\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/PressKitBrandAssets.vue"
    }
  ],
  "dependencies": [
    "lucide-vue-next"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/vue/avatar.json",
    "https://uipkge.dev/r/vue/badge.json",
    "https://uipkge.dev/r/vue/button.json",
    "https://uipkge.dev/r/vue/card.json",
    "https://uipkge.dev/r/vue/separator.json"
  ],
  "description": "Comprehensive brand guidelines and press kit hub with official logo downloads in vector SVG/4K PNG/WebP, OKLCH brand palette tokens, executive leadership headshots (300 DPI), and press contact resources.",
  "categories": [
    "marketing",
    "brand",
    "media"
  ]
}