Divi5Lab

Caldwell & Pierce — Corporate Legal Landing Page for Divi 5

A polished corporate law firm landing page for Divi 5: navy-and-oxblood hero, practice area cards, partner-led process steps, office gallery, client testimonials, FAQ, and a consultation-driven final CTA.

Rate this element

Be the first to rate

Download this section — free

  • Divi 5 JSON — import in seconds
  • Commercial license included
  • No account needed

Click to view the full page

Overview

The layout opens with an asymmetric 3_5 / 2_5 hero on deep navy (#101F33): a small burgundy eyebrow ("Attorneys at Law · Est. 1998"), a 58px Playfair Display headline, a 560px-capped subhead in cream at 82% opacity, then a burgundy "Schedule a Consultation" button with a phone-number reassurance line beneath it. A tall 1000×1200 portrait image (5:6, soft cream border and 24px vertical shadow) sits in the right column and drops below the copy on mobile.

An inline stat row breaks the hero with a hairline top border (rgba cream, 15%): three Playfair Display numerals — 1,200+, 60+, Partner-handled — under all-caps micro-labels. It's a compact credibility beat before the section change. The section below flips to cream (#F6F3EE) and repeats those four proof points as its own credibility strip, each anchored by a 36px burgundy divider — same trust cues, different visual weight.

Practice areas sit on white in two rows of three cards (1_3 columns, 28px column gap, 20px radius, subtle #101F33 12%-opacity border, preset3 shadow). Each card is a Blurb module with a burgundy FontAwesome icon, a 22px Libre Baskerville title and a 26px-line Inter paragraph, plus a hover-lift transform (translateY -6px, deeper shadow) so the grid feels tactile without being loud. The "Why Caldwell & Pierce" block returns to a 1_2 image/text split with four titled reassurance paragraphs (partner-led, plain English, written fees, one-business-day reply). Section padding steps down cleanly at each breakpoint (120→90→64px), the hero headline drops from 58 → 44 → 34px, and every row switches to flexDirection column on phone so nothing squeezes.

What’s inside

  • Asymmetric 3_5 / 2_5 hero with eyebrow, 58px serif h1, 560px-capped subhead, burgundy CTA, phone-reassurance line, and a tall 1000×1200 portrait image with cream border
  • Inline three-column stat row (1,200+ matters, 60+ years, Partner-handled) sitting inside the hero above a hairline divider
  • Cream credibility strip repeating four trust cues as centered Heading + burgundy Divider + all-caps Text triads
  • Six practice-area Blurb cards in a 1_3 grid with FontAwesome icons, 20px radius, preset3 shadow, and a hover translateY -6px lift
  • Standalone consultation CTA below the practice grid with a supporting reassurance paragraph
  • 50/50 image + text "Why us" section with four titled H3 paragraphs (partner-led, plain English, written fees, one-day reply)
  • Three-family type system pre-wired: Playfair Display for hero, Libre Baskerville for body headings, Inter for micro-copy
  • Per-breakpoint padding, font sizing, and flex-direction overrides on every section (desktop / tablet / phone)

Who it’s for

Built for boutique law firms — family, estate, business, litigation, real estate, employment — but the tone travels well to any traditional professional-services practice that sells on judgment and reputation instead of volume. Solo attorneys and small partnerships get a partner-led narrative that matches how they actually work. Accountants, CPAs, tax advisors, financial planners, notaries, mediators, and arbitrators can drop their disciplines into the six practice-area cards without rebuilding the section. The formal serif type and navy/burgundy palette also suit private-client wealth advisors, chartered surveyors, and consulting firms whose clients expect gravitas rather than startup energy.

Customization tips

The palette is three preset colors: navy #101F33, cream #F6F3EE, burgundy #7C2F33. Swap burgundy for forest green, oxblood, or a muted gold and the whole page shifts mood without any layout work — burgundy repeats on the eyebrows, CTAs, icons, and dividers. Keep the hero headline around ten words at desktop size (58px on Playfair Display); longer copy pushes into a third line. Practice-card paragraphs read best at 25–40 words so the six cards balance across the two rows. The hero portrait wants a 5:6 vertical crop near 1000×1200 — a landscape image will float small against the tall left column. Practice-area icons are FontAwesome unicode set inside each Blurb, so you can trade them out for any non-legal discipline. Firm name, phone number (in the hero reassurance line), and the three stat numerals live in separate modules — edit each rather than assuming a global swap.

How to install this layout

  1. Download the layout JSON file from this page.
  2. Open the target page in the Divi 5 builder.
  3. Open the portability panel (up/down arrows icon) and choose the Import tab.
  4. Upload the JSON. Tick “replace existing content” only for full-page imports.
  5. Check the page at desktop and mobile widths, then swap in your copy and images.

Full walkthrough with troubleshooting: How to Import a Divi 5 Layout.

Questions about Caldwell & Pierce — Corporate Legal Landing Page for Divi 5

Is the layout responsive?

Yes — every section has its own tablet and phone overrides. Hero padding steps down 120 → 90 → 70px, the h1 drops 58 → 44 → 34px, the 3_5 / 2_5 hero row switches to flexDirection column on phone, and the practice-area grid rewraps from three columns to two on tablet and one on phone.

Which Divi 5 modules does it use?

Native modules only: Section, Row, Column, Text, Heading, Button, Image, Divider, and Blurb — the practice-area cards are Blurb modules with FontAwesome icons. Nothing custom, no third-party dependency.

Can I show more or fewer than six practice areas?

Yes. Duplicate a Blurb column to add a card; the second practice-area row wraps independently from the first, so an odd count (five, seven) still balances. For fewer than three, switch the row's column structure to 1_2 or 4_4 rather than leaving empty columns.

Does the hero image have to be a portrait?

The right column is sized for a tall crop around 5:6 (1000×1200 in the source). A landscape photo will render short and leave whitespace under the stats row — either recrop, or swap the image column to 3_5 and the copy column to 2_5 for the wider format.

What should I edit first?

Firm name and founding year (they appear in the hero eyebrow, the h1, the credibility strip, and the "Why us" section — each is its own module), the phone number in the reassurance line under the hero button, and the three stat numerals. Then rewrite the six practice-area cards; the icons are FontAwesome unicodes on each Blurb.

Do the practice-area cards animate on hover?

Yes — a subtle translateY of -6px with a deeper preset3 shadow on hover, defined per column. If you want them static, clear the transform and hover boxShadow on each of the six columns.

Which Divi version does this layout need?

Divi 5. The layout is generated natively for Divi 5 and validated against its real module structure before publication, so it imports clean into the current builder.

Can I use this layout on client websites?

Yes. Every download includes a commercial license covering unlimited sites you own or build for clients. Only reselling or redistributing the layout file itself is prohibited.

More full landing pages

Browse all full landing pages