@snow-labs/brutal-ui 0.4.0 → 0.5.0

package/dist/components/brutal/hero.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/button.tsx","../../../src/components/brutal/section.tsx","../../../src/components/brutal/hero.tsx"],"names":["ButtonPrimitive","jsx"],"mappings":"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","file":"hero.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst buttonVariants = cva(\n  \"group/button inline-flex shrink-0 items-center justify-center rounded-lg whitespace-nowrap font-bold transition-all duration-150 select-none outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        // Primary: Black bg, white text, offset shadow\n        default:\n          \"border-brutal border-foreground bg-primary text-primary-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // CTA: Mint green bg — the Bannerbear signature\n        cta: \"border-brutal border-foreground bg-cta text-cta-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Brand: Dynamic brand color bg\n        brand:\n          \"border-brutal border-foreground bg-brand text-brand-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Outline: White bg, black border, offset shadow\n        outline:\n          \"border-brutal border-foreground bg-background text-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Secondary: Light bg, border, smaller shadow\n        secondary:\n          \"border-brutal border-foreground bg-secondary text-secondary-foreground shadow-brutal-sm hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal active:translate-x-px active:translate-y-px active:shadow-none\",\n        // Ghost: No border/shadow, subtle hover\n        ghost: \"hover:bg-secondary hover:text-foreground\",\n        // Link: Text only\n        link: \"text-foreground underline-offset-4 hover:underline\",\n        // Destructive\n        destructive:\n          \"border-brutal border-destructive bg-destructive text-destructive-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Nav: Thin border, no shadow (for nav Sign In buttons)\n        nav: \"border border-foreground bg-background text-foreground hover:bg-foreground hover:text-background\",\n      },\n      size: {\n        xs: \"h-7 gap-1 px-2.5 text-xs\",\n        sm: \"h-8 gap-1.5 px-3 text-sm\",\n        default: \"h-10 gap-2 px-5 text-sm\",\n        lg: \"h-12 gap-2 px-7 text-base\",\n        xl: \"h-14 gap-2.5 px-9 text-lg\",\n        icon: \"size-10\",\n        \"icon-sm\": \"size-8\",\n        \"icon-lg\": \"size-12\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n);\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Button, buttonVariants };\n","import { cn } from \"../../lib/utils\";\n\nexport type SectionColor =\n  | \"white\"\n  | \"brand\"\n  | \"brand-muted\"\n  | \"blue\"\n  | \"gray\"\n  | \"cream\"\n  | \"black\"\n  | \"cta\";\n\nexport type SectionPattern =\n  | \"dots\"\n  | \"stripes\"\n  | \"noise\"\n  | \"grain\"\n  | \"crosshatch\"\n  | \"grid-dots\"\n  | \"gradient-mesh\"\n  | \"none\";\n\ninterface BrutalSectionProps {\n  children: React.ReactNode;\n  color?: SectionColor;\n  className?: string;\n  containerSize?: \"sm\" | \"default\" | \"lg\";\n  padding?: \"sm\" | \"default\" | \"lg\";\n  pattern?: SectionPattern;\n  /** @deprecated Use pattern=\"dots\" instead */\n  dots?: boolean;\n  /** @deprecated Use pattern=\"stripes\" instead */\n  stripes?: boolean;\n  id?: string;\n}\n\nconst colorMap: Record<SectionColor, string> = {\n  white: \"bg-background text-foreground\",\n  brand: \"bg-brand\",\n  \"brand-muted\": \"bg-brand-muted text-foreground\",\n  blue: \"bg-section-blue\",\n  gray: \"bg-section-gray text-foreground\",\n  cream: \"bg-section-cream text-foreground\",\n  black: \"bg-foreground text-background\",\n  cta: \"bg-cta\",\n};\n\nconst containerMap = {\n  sm: \"brutal-container-sm\",\n  default: \"brutal-container\",\n  lg: \"brutal-container-lg\",\n};\n\nconst paddingMap = {\n  sm: \"brutal-section-sm\",\n  default: \"brutal-section\",\n  lg: \"brutal-section py-28 sm:py-36 md:py-44\",\n};\n\nconst patternMap: Record<SectionPattern, string> = {\n  dots: \"brutal-dots\",\n  stripes: \"brutal-stripes\",\n  noise: \"brutal-noise\",\n  grain: \"brutal-grain\",\n  crosshatch: \"brutal-crosshatch\",\n  \"grid-dots\": \"brutal-grid-dots\",\n  \"gradient-mesh\": \"brutal-gradient-mesh\",\n  none: \"\",\n};\n\nexport function BrutalSection({\n  children,\n  color = \"white\",\n  className,\n  containerSize = \"default\",\n  padding = \"default\",\n  pattern,\n  dots = false,\n  stripes = false,\n  id,\n}: BrutalSectionProps) {\n  const resolvedPattern = pattern\n    ?? (dots ? \"dots\" : undefined)\n    ?? (stripes ? \"stripes\" : undefined)\n    ?? \"none\";\n\n  return (\n    <section\n      id={id}\n      className={cn(\n        paddingMap[padding],\n        colorMap[color],\n        patternMap[resolvedPattern],\n        className\n      )}\n    >\n      <div className={containerMap[containerSize]}>{children}</div>\n    </section>\n  );\n}\n","import { cn } from \"../../lib/utils\";\nimport { Button } from \"../ui/button\";\nimport { BrutalSection } from \"./section\";\nimport type { SectionPattern } from \"./section\";\n\ntype HeroVariant = \"split\" | \"centered\" | \"overlap\" | \"asymmetric\";\n\ninterface BrutalHeroProps {\n  variant?: HeroVariant;\n  badge?: string;\n  badgePosition?: \"above\" | \"inline\" | \"floating\";\n  headline: string;\n  description: string;\n  ctaText: string;\n  ctaHref?: string;\n  ctaVariant?: \"cta\" | \"brand\" | \"default\";\n  secondaryText?: string;\n  secondaryHref?: string;\n  visual?: React.ReactNode;\n  color?: \"white\" | \"brand\" | \"brand-muted\" | \"gray\";\n  pattern?: SectionPattern;\n  proof?: string;\n  className?: string;\n}\n\nexport function BrutalHero({\n  variant = \"split\",\n  badge,\n  badgePosition = \"above\",\n  headline,\n  description,\n  ctaText,\n  ctaHref = \"#\",\n  ctaVariant = \"cta\",\n  secondaryText,\n  secondaryHref,\n  visual,\n  color = \"brand\",\n  pattern,\n  proof,\n  className,\n}: BrutalHeroProps) {\n  const badgeElement = badge && (\n    <div\n      className={cn(\n        \"inline-flex w-fit border-brutal border-foreground bg-background px-3 py-1 font-mono text-xs font-bold uppercase tracking-widest text-foreground shadow-brutal-sm\",\n        badgePosition === \"floating\" && \"absolute -top-3 left-6 z-10\",\n      )}\n    >\n      {badge}\n    </div>\n  );\n\n  const textContent = (\n    <div className={cn(\n      \"flex flex-col gap-6\",\n      variant === \"centered\" && \"items-center text-center\",\n    )}>\n      {badgePosition === \"above\" && badgeElement}\n\n      <h1 className={cn(\n        \"brutal-display text-balance\",\n        variant === \"centered\" && \"mx-auto max-w-4xl\",\n      )}>\n        {badgePosition === \"inline\" && badgeElement}\n        {headline}\n      </h1>\n\n      <p className={cn(\n        \"brutal-body-lg max-w-lg opacity-80\",\n        variant === \"centered\" && \"mx-auto\",\n      )}>\n        {description}\n      </p>\n\n      <div className={cn(\n        \"flex flex-col gap-3 sm:flex-row sm:gap-4\",\n        variant === \"centered\" && \"sm:justify-center\",\n      )}>\n        <Button variant={ctaVariant} size=\"xl\" className=\"w-full sm:w-auto\" render={<a href={ctaHref} />}>\n          {ctaText}\n        </Button>\n        {secondaryText && (\n          <Button variant=\"outline\" size=\"xl\" className=\"w-full sm:w-auto\" render={<a href={secondaryHref || \"#\"} />}>\n            {secondaryText}\n          </Button>\n        )}\n      </div>\n\n      {proof && (\n        <p className=\"flex items-center gap-2 text-sm font-medium opacity-70\">\n          <span className=\"inline-flex size-5 items-center justify-center border border-current text-xs\">\n            ✓\n          </span>\n          {proof}\n        </p>\n      )}\n    </div>\n  );\n\n  const layoutClass = {\n    split: \"grid items-center gap-12 lg:grid-cols-2 lg:gap-16\",\n    centered: \"flex flex-col items-center gap-12\",\n    overlap: \"relative\",\n    asymmetric: \"grid items-center gap-12 lg:grid-cols-[3fr_2fr] lg:gap-16\",\n  }[variant];\n\n  return (\n    <BrutalSection color={color} padding=\"lg\" pattern={pattern} className={cn(\"relative\", className)}>\n      {badgePosition === \"floating\" && badgeElement}\n\n      <div className={layoutClass}>\n        {textContent}\n\n        {visual && variant === \"overlap\" ? (\n          <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center opacity-20\">\n            {visual}\n          </div>\n        ) : visual ? (\n          <div className={cn(\n            \"flex items-center justify-center\",\n            variant === \"asymmetric\" && \"-rotate-2 transform\",\n          )}>\n            {visual}\n          </div>\n        ) : null}\n      </div>\n    </BrutalSection>\n  );\n}\n"]}
+{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/button.tsx","../../../src/components/brutal/section.tsx","../../../src/components/brutal/hero.tsx"],"names":["ButtonPrimitive","jsx"],"mappings":"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","file":"hero.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst buttonVariants = cva(\n  \"group/button inline-flex shrink-0 items-center justify-center rounded-lg whitespace-nowrap font-bold transition-all duration-150 select-none outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        // Primary: Black bg, white text, offset shadow\n        default:\n          \"border-brutal border-foreground bg-primary text-primary-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // CTA: Mint green bg — the Bannerbear signature\n        cta: \"border-brutal border-foreground bg-cta text-cta-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Brand: Dynamic brand color bg\n        brand:\n          \"border-brutal border-foreground bg-brand text-brand-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Outline: White bg, black border, offset shadow\n        outline:\n          \"border-brutal border-foreground bg-background text-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Secondary: Light bg, border, smaller shadow\n        secondary:\n          \"border-brutal border-foreground bg-secondary text-secondary-foreground shadow-brutal-sm hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal active:translate-x-px active:translate-y-px active:shadow-none\",\n        // Ghost: No border/shadow, subtle hover\n        ghost: \"hover:bg-secondary hover:text-foreground\",\n        // Link: Text only\n        link: \"text-foreground underline-offset-4 hover:underline\",\n        // Destructive\n        destructive:\n          \"border-brutal border-destructive bg-destructive text-destructive-foreground shadow-brutal hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-brutal-lg active:translate-x-px active:translate-y-px active:shadow-brutal-sm\",\n        // Nav: Thin border, no shadow (for nav Sign In buttons)\n        nav: \"border border-foreground bg-background text-foreground hover:bg-foreground hover:text-background\",\n      },\n      size: {\n        xs: \"h-7 gap-1 px-2.5 text-xs\",\n        sm: \"h-8 gap-1.5 px-3 text-sm\",\n        default: \"h-10 gap-2 px-5 text-sm\",\n        lg: \"h-12 gap-2 px-7 text-base\",\n        xl: \"h-14 gap-2.5 px-9 text-lg\",\n        icon: \"size-10\",\n        \"icon-sm\": \"size-8\",\n        \"icon-lg\": \"size-12\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n);\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Button, buttonVariants };\n","import { cn } from \"../../lib/utils\";\n\nexport type SectionColor =\n  | \"white\"\n  | \"brand\"\n  | \"brand-muted\"\n  | \"blue\"\n  | \"gray\"\n  | \"cream\"\n  | \"black\"\n  | \"cta\";\n\nexport type SectionPattern =\n  | \"dots\"\n  | \"stripes\"\n  | \"noise\"\n  | \"grain\"\n  | \"crosshatch\"\n  | \"grid-dots\"\n  | \"gradient-mesh\"\n  | \"none\";\n\ninterface BrutalSectionProps {\n  children: React.ReactNode;\n  color?: SectionColor;\n  className?: string;\n  containerSize?: \"sm\" | \"default\" | \"lg\";\n  padding?: \"sm\" | \"default\" | \"lg\";\n  pattern?: SectionPattern;\n  /** @deprecated Use pattern=\"dots\" instead */\n  dots?: boolean;\n  /** @deprecated Use pattern=\"stripes\" instead */\n  stripes?: boolean;\n  id?: string;\n}\n\nconst colorMap: Record<SectionColor, string> = {\n  white: \"bg-background text-foreground\",\n  brand: \"bg-brand\",\n  \"brand-muted\": \"bg-brand-muted text-foreground\",\n  blue: \"bg-section-blue\",\n  gray: \"bg-muted text-foreground\",\n  cream: \"bg-secondary text-foreground\",\n  black: \"bg-foreground text-background\",\n  cta: \"bg-cta\",\n};\n\nconst containerMap = {\n  sm: \"brutal-container-sm\",\n  default: \"brutal-container\",\n  lg: \"brutal-container-lg\",\n};\n\nconst paddingMap = {\n  sm: \"brutal-section-sm\",\n  default: \"brutal-section\",\n  lg: \"brutal-section py-28 sm:py-36 md:py-44\",\n};\n\nconst patternMap: Record<SectionPattern, string> = {\n  dots: \"brutal-dots\",\n  stripes: \"brutal-stripes\",\n  noise: \"brutal-noise\",\n  grain: \"brutal-grain\",\n  crosshatch: \"brutal-crosshatch\",\n  \"grid-dots\": \"brutal-grid-dots\",\n  \"gradient-mesh\": \"brutal-gradient-mesh\",\n  none: \"\",\n};\n\nexport function BrutalSection({\n  children,\n  color = \"white\",\n  className,\n  containerSize = \"default\",\n  padding = \"default\",\n  pattern,\n  dots = false,\n  stripes = false,\n  id,\n}: BrutalSectionProps) {\n  const resolvedPattern = pattern\n    ?? (dots ? \"dots\" : undefined)\n    ?? (stripes ? \"stripes\" : undefined)\n    ?? \"none\";\n\n  return (\n    <section\n      id={id}\n      className={cn(\n        paddingMap[padding],\n        colorMap[color],\n        patternMap[resolvedPattern],\n        className\n      )}\n    >\n      <div className={containerMap[containerSize]}>{children}</div>\n    </section>\n  );\n}\n","import { cn } from \"../../lib/utils\";\nimport { Button } from \"../ui/button\";\nimport { BrutalSection } from \"./section\";\nimport type { SectionPattern } from \"./section\";\n\ntype HeroVariant = \"split\" | \"centered\" | \"overlap\" | \"asymmetric\";\n\ninterface BrutalHeroProps {\n  variant?: HeroVariant;\n  badge?: string;\n  badgePosition?: \"above\" | \"inline\" | \"floating\";\n  headline: string;\n  description: string;\n  ctaText: string;\n  ctaHref?: string;\n  ctaVariant?: \"cta\" | \"brand\" | \"default\";\n  secondaryText?: string;\n  secondaryHref?: string;\n  visual?: React.ReactNode;\n  color?: \"white\" | \"brand\" | \"brand-muted\" | \"gray\";\n  pattern?: SectionPattern;\n  proof?: string;\n  className?: string;\n}\n\nexport function BrutalHero({\n  variant = \"split\",\n  badge,\n  badgePosition = \"above\",\n  headline,\n  description,\n  ctaText,\n  ctaHref = \"#\",\n  ctaVariant = \"cta\",\n  secondaryText,\n  secondaryHref,\n  visual,\n  color = \"brand\",\n  pattern,\n  proof,\n  className,\n}: BrutalHeroProps) {\n  const badgeElement = badge && (\n    <div\n      className={cn(\n        \"inline-flex w-fit border-brutal border-foreground bg-background px-3 py-1 font-mono text-xs font-bold uppercase tracking-widest text-foreground shadow-brutal-sm\",\n        badgePosition === \"floating\" && \"absolute -top-3 left-6 z-10\",\n      )}\n    >\n      {badge}\n    </div>\n  );\n\n  const textContent = (\n    <div className={cn(\n      \"flex flex-col gap-6\",\n      variant === \"centered\" && \"items-center text-center\",\n    )}>\n      {badgePosition === \"above\" && badgeElement}\n\n      <h1 className={cn(\n        \"brutal-display text-balance\",\n        variant === \"centered\" && \"mx-auto max-w-4xl\",\n      )}>\n        {badgePosition === \"inline\" && badgeElement}\n        {headline}\n      </h1>\n\n      <p className={cn(\n        \"brutal-body-lg max-w-lg opacity-80\",\n        variant === \"centered\" && \"mx-auto\",\n      )}>\n        {description}\n      </p>\n\n      <div className={cn(\n        \"flex flex-col gap-3 sm:flex-row sm:gap-4\",\n        variant === \"centered\" && \"sm:justify-center\",\n      )}>\n        <Button variant={ctaVariant} size=\"xl\" className=\"w-full sm:w-auto\" render={<a href={ctaHref} />}>\n          {ctaText}\n        </Button>\n        {secondaryText && (\n          <Button variant=\"outline\" size=\"xl\" className=\"w-full sm:w-auto\" render={<a href={secondaryHref || \"#\"} />}>\n            {secondaryText}\n          </Button>\n        )}\n      </div>\n\n      {proof && (\n        <p className=\"flex items-center gap-2 text-sm font-medium opacity-70\">\n          <span className=\"inline-flex size-5 items-center justify-center border border-current text-xs\">\n            ✓\n          </span>\n          {proof}\n        </p>\n      )}\n    </div>\n  );\n\n  const layoutClass = {\n    split: \"grid items-center gap-12 lg:grid-cols-2 lg:gap-16\",\n    centered: \"flex flex-col items-center gap-12\",\n    overlap: \"relative\",\n    asymmetric: \"grid items-center gap-12 lg:grid-cols-[3fr_2fr] lg:gap-16\",\n  }[variant];\n\n  return (\n    <BrutalSection color={color} padding=\"lg\" pattern={pattern} className={cn(\"relative\", className)}>\n      {badgePosition === \"floating\" && badgeElement}\n\n      <div className={layoutClass}>\n        {textContent}\n\n        {visual && variant === \"overlap\" ? (\n          <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center opacity-20\">\n            {visual}\n          </div>\n        ) : visual ? (\n          <div className={cn(\n            \"flex items-center justify-center\",\n            variant === \"asymmetric\" && \"-rotate-2 transform\",\n          )}>\n            {visual}\n          </div>\n        ) : null}\n      </div>\n    </BrutalSection>\n  );\n}\n"]}

package/dist/components/brutal/index.js

@@ -21,8 +21,8 @@ var colorMap = {
   brand: "bg-brand",
   "brand-muted": "bg-brand-muted text-foreground",
   blue: "bg-section-blue",
-  gray: "bg-section-gray text-foreground",
-  cream: "bg-section-cream text-foreground",
+  gray: "bg-muted text-foreground",
+  cream: "bg-secondary text-foreground",
   black: "bg-foreground text-background",
   cta: "bg-cta"
 };
@@ -497,7 +497,7 @@ function StarRating({ rating }) {
     {
       className: cn(
         "text-sm",
-        i < rating ? "text-amber-500" : "text-foreground/20"
+        i < rating ? "text-brand" : "text-foreground/20"
       ),
       children: "\u2605"
     },
@@ -525,17 +525,12 @@ function TestimonialCard({
             {
               src: t.avatar,
               alt: t.name,
-              className: "size-9 border-2 object-cover",
-              style: { borderColor: "hsl(var(--brand))" }
+              className: "size-9 border-2 border-brand object-cover"
             }
           ) : /* @__PURE__ */ jsx(
             "div",
             {
-              className: "flex size-9 items-center justify-center border-2 font-bold text-brand-foreground",
-              style: {
-                borderColor: "hsl(var(--brand))",
-                backgroundColor: "hsl(var(--brand))"
-              },
+              className: "flex size-9 items-center justify-center border-2 border-brand bg-brand font-bold text-brand-foreground",
               children: t.name[0]
             }
           ),
@@ -601,7 +596,7 @@ function BrutalTestimonials({
   headline,
   testimonials,
   variant = "masonry",
-  color = "blue",
+  color = "white",
   pattern,
   className
 }) {
@@ -628,7 +623,7 @@ function BrutalIntegrationGrid({
     /* @__PURE__ */ jsxs("div", { className: "mb-12 text-center", children: [
       badge && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-4 opacity-70", children: badge }),
       /* @__PURE__ */ jsx("h2", { className: "brutal-h2 mb-4", children: headline }),
-      description && /* @__PURE__ */ jsx("p", { className: "brutal-body mx-auto max-w-lg text-muted-foreground", children: description })
+      description && /* @__PURE__ */ jsx("p", { className: "brutal-body mx-auto max-w-lg opacity-80", children: description })
     ] }),
     /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-center gap-6", children: integrations.map((item) => {
       const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -934,7 +929,7 @@ function BrutalNav({
     solid: "sticky top-0 z-50 w-full border-b-brutal border-foreground bg-brand",
     transparent: cn(
       "fixed top-0 left-0 right-0 z-50 w-full transition-all duration-200",
-      isScrolled ? "bg-background/80 text-foreground backdrop-blur-md border-b border-foreground/10" : "bg-transparent text-white"
+      isScrolled ? "bg-background/80 text-foreground backdrop-blur-md border-b border-border/30" : "bg-transparent text-foreground"
     ),
     "floating-pill": "fixed top-0 left-0 right-0 z-50 mx-4 mt-4 rounded-full border-brutal border-foreground bg-background shadow-brutal"
   };
@@ -1143,10 +1138,9 @@ function BrutalFooter({
     "footer",
     {
       className: cn(
-        "w-full border-t-4 bg-background px-6 py-12 text-foreground",
+        "w-full border-t-4 border-t-brand bg-background px-6 py-12 text-foreground",
         className
       ),
-      style: { borderTopColor: "hsl(var(--brand))" },
       children: /* @__PURE__ */ jsxs("div", { className: "brutal-container", children: [
         variant === "newsletter" && newsletter && /* @__PURE__ */ jsx(NewsletterSection, { newsletter }),
         variant === "minimal" ? /* @__PURE__ */ jsx(MinimalContent, { logo, columns, socials }) : /* @__PURE__ */ jsx(
@@ -1305,7 +1299,7 @@ function StatItem({ stat, inView }) {
       count.toLocaleString(),
       stat.suffix
     ] }),
-    /* @__PURE__ */ jsx("p", { className: "brutal-label mt-2 text-muted-foreground", children: stat.label })
+    /* @__PURE__ */ jsx("p", { className: "brutal-label mt-2 opacity-70", children: stat.label })
   ] });
 }
 function StatsBar({ stats, color = "white", className }) {