Tidewell Movement Studio — Organic Wellness Home Page for Divi 5

The layout opens with a full-viewport hero built from a single 4/4 column group locked to 80vh on desktop and 70vh on tablet (the min-height is explicit in the JSON, so the section never collapses around short copy). A Pexels lifestyle photo fills the section background at cover size with a 70% dark espresso gradient overlay (rgba 34,26,16) applied directly over the image, which keeps the cream H1 legible at every screen size without manual contrast work. The headline uses Fraunces at 72px desktop, stepping down to 52px on tablet and 38px on phone, with a textWrap: balance setting that handles awkward line breaks automatically. Below it sits a 20px DM Sans paragraph and a horizontally wrapping button row: a solid forest-green pill (#41603a, border-radius 999px) for the primary booking CTA and a borderless ghost pill for secondary navigation. A hairline cream Divider module then anchors three all-caps micro-detail Text modules in 14px DM Sans, giving first-time visitors address, hours, and class-size cap before they scroll.

The second section and the three-class showcase that follows form the educational core. Four Blurb modules sit in a two-column 1/2 + 1/2 grid; each blurb has a circular forest-green icon badge (Font Awesome, 32px, 16px padding on all sides, border-radius 999px) aligned left, a Fraunces title in near-black (#2e2a22), and DM Sans body copy in warm taupe (#675b49). Both columns collapse to full-width on phone via explicit flexType: 24_24 settings in the column decoration. Below that, three alternating image-text rows present the three class formats. Images are sized to a strict 4:3 aspect ratio with object-fit cover set in the Image module's advanced sizing. The Yoga row carries order: -1 on the image column at the phone breakpoint, pulling the photo above its copy on small screens and keeping the visual reading pattern consistent across all three rows without any DOM reordering in the template.

Testimonials are assembled from styled columns rather than a dedicated testimonial module. Three cards use 28px corner radius, a 1px warm border (#dccdb4), and box-shadow preset1, with flexDirection: column and justifyContent: space-between inside each card so the portrait row sits at the card bottom regardless of quote length. Portrait images enforce a 1:1 aspect ratio at 56px display width with object-fit cover, so any square headshot drops in without manual cropping decisions. The process section is a four-column grid (2 columns tablet, 1 column phone) where each step has a 48px green circular badge with a bold centered step number, a Fraunces H3, and a 16px body line. The Divider connectors between badges carry disabledOn: phone, removing the visual connectors on narrow screens and leaving a clean vertical list. The page closes with a floating parchment card laid over a full-bleed background photo, the primary booking button repeated, and a 1px #dccdb4 Divider module providing breathing room between the subhead and the CTA.