CTA With Dashed Grid Lines

The section spans three columns with dashed border lines at all four edges. Lines use CSS linear gradients with 50% transparency to create the dash pattern. A mask composite excludes the center, fading lines toward the middle of each edge.

Lines extend beyond the container using negative positioning calculated from a configurable offset. The GridLineHorizontal and GridLineVertical components accept offset props to control line length and fade distance.

The main content area spans two columns with heading, colored text highlights, and two buttons (primary gradient and secondary outlined). The right column displays a customer quote with name and title. A dashed border separates the columns.

Useful for SaaS products, enterprise solutions, B2B services, and any CTA that benefits from a structured, professional feel with social proof.