Fernhill Botanicals — Minimal Plant_shop Workshops Page for Divi 5

The layout opens on a deep forest green hero section (#1f2b22) with 112px top padding and 168px bottom padding on desktop, tapering to 64px and 88px on phone. Two heading modules establish the typographic system immediately: a small-caps Karla overline at 13px with 1px letter-spacing, followed by an H1 in Newsreader at 60px with tight -1px tracking and text-wrap: balance to prevent orphaned words at any viewport width. A short ruled line, constrained to 72px and auto-centered, closes the heading cluster before a lead paragraph capped at 640px max-width. A curve-style bottom section divider at 100px, with explicit heights at all three breakpoints (100px / 70px / 44px), transitions cleanly into the sage linen below so the shape scales without abrupt jumps on tablet or phone.

The workshops pricing section uses a three-column equal-height card grid with alignItems: stretch, so every card reaches the same bottom edge regardless of how much copy it carries. Two cards use a near-white cream background (#fbfcf8) with a sage border (#d4dccb); the center "Wreath night" card breaks into dusty rose (#b83d63) and adds a small pill-shaped "Most loved" badge built from a Group module with a cream background and rounded corners. Each card displays its price as a 44px Newsreader bold figure alongside a small "per person" label aligned to the baseline, so the cost reads at a glance without a separate pricing table module. Below a thin top-border divider, three icon-and-text rows use Font Awesome check marks in flexbox rows to list what is included, and every card closes with a "Book a seat" button. On tablet the columns wrap two-up before going fully single-column on phone.

The "What you will make" section delivers three alternating 50/50 image-and-text rows, each image locked to a 4:3 aspect ratio with objectFit: cover. Odd rows place the image on the left with the text column padded 48px on the right; the middle row reverses the layout, and its image column carries an order: -1 override on phone so images always appear above their text on small screens regardless of DOM position. Each text panel pairs a small Karla step label (01, 02, 03) in sage green, an H3 in Newsreader at 32px, a short body paragraph, and a plain underlined text link to available dates, keeping the section editorially calm rather than CTA-heavy.

A "How it works" split on #fbfcf8 uses a 1/3 + 2/3 column ratio, placing a section headline on the narrower left and three numbered steps on the wider right. Each step number is an 80px Newsreader bold figure, giving strong visual anchoring before the H3 and body text, with thin #d4dccb dividers separating the steps. The final section pairs a private-events feature checklist on the left with a contact form card on the right, padded at 48px on all sides and set on the sage linen background to lift it off the page. The contact form's submit button uses the same dusty rose as the featured pricing card, visually connecting the two primary conversion paths of the page.