Create ServicesCTA component

[breadadams]

• Depends on Create Text component #5
• Depends on Create Icon component #8

Zeplin

Effects

This module's effects are going to to be controlled by scroll. As in that when this section is reached it will "anchor" to the page and the user scrolling down will animate it to the "open state" displayed below.

Those animation steps are:

1. The darker background panel appears, with the "What we do" title, fade in from bottom together.
2. The center card should rotate in on the X & Z axes - with perspective. As or once the center card has finished, its title and icon should fade in.
3. The left & right cards slide "out and down" to make the "L" shape, once the shape is fully created the title and icon fade in.

For mobile it will be a bit different as they are all squares:

1. The first step is the same as desktop.
2. The first card will appear from the right, rotating in on the Y axis with perspective.
3. The second card will appear from the left, rotating the opposite to the 1st card.
4. The third card will appear like the first card.