💄 Refactor email templates and components for improved styling (#2451)

packages/react-email/ui/Heading.tsx

@@ -3,10 +3,16 @@ import { Heading as BaseHeading } from "@react-email/components"
 type HeadingProps = React.PropsWithChildren
 
 export const Heading = ({ children }: HeadingProps) => (
-  <BaseHeading
-    as="h1"
-    className="text-2xl leading-8 font-semibold tracking-[-0.02em] text-body m-0 mb-5"
-  >
+  <BaseHeading as="h1" style={headingStyle}>
     {children}
   </BaseHeading>
 )
+
+const headingStyle = {
+  color: "#17212b",
+  fontSize: "26px",
+  fontWeight: "700",
+  letterSpacing: "-0.3px",
+  lineHeight: "34px",
+  margin: "0 0 20px",
+}