Fix arbitrary shorthand syntax to use v3 syntax instead of v4 syntax (#2233)

Author: RobinMalfait

src/blog/tailwindcss-v3-3/index.mdx

@@ -670,7 +670,7 @@ export function MyComponent({ company }) {
         "--brand-hover-color": company.brandHoverColor,
       }}
       className="bg-[var(--brand-color)] hover:bg-[var(--brand-hover-color)]" // [!code --]
-      className="bg-(--brand-color) hover:bg-(--brand-hover-color)" // [!code ++]
+      className="bg-[--brand-color] hover:bg-[--brand-hover-color]" // [!code ++]
     />
   );
 }