Integration 4 block design & features
Integration4 is a centered section with two icon containers connected by an SVG illustration, followed by a heading, paragraph, and a wide aspect-ratio placeholder image. The SVG draws a horizontal line with dots at intervals over a subtle grid pattern, visually representing a data connection between the two icons.
The icon containers are rounded squares with a white background, border, and drop shadow. The SVG uses semi-transparent black strokes and fills with a linear gradient. The heading is large with medium weight. The placeholder image below has rounded corners and spans most of the container width. Spacing is generous between each visual section.
The overall feel is diagrammatic and illustrative, using the SVG connection metaphor to communicate integration. The block has moderate complexity due to the inline SVG artwork but remains visually restrained with neutral colors and no animation.
On mobile, the icon containers and SVG scale down proportionally. The image width adjusts to 90% of the viewport.