Blackline Studio — Bold Agency Case Studies Page for Series A–C Founders

Full Landing Agency Bold

A bold, high-contrast Divi 5 agency case studies page template built around case studies, hard-number results, and founder-led conversion. Ships with hero, work grid, deep case study, stats, testimonial, and 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 page opens on a full-bleed near-black canvas (#0a0a0a) with a 3/5 + 2/5 split hero: a tight 14px uppercase eyebrow ("Selected work — 2019 to 2025") in safety orange (#ff3b1f), a 72px 800-weight Outfit headline reading "Brands that move markets. Not moodboards." letter-spaced at -2px, a 20px lede pinned to a 620px max-width, and a rounded 16px-radius portrait image with an orange-tinted 60px glow shadow anchoring the right column. That opening move sets the entire page's grammar — black backdrop, one signal-flare accent color, oversized display type set tight, and a single confident image doing the emotional work.

Below the fold, three white cards on the black field carry the case-study grid — Rivet AI, Northwind Robotics, Halcyon Health — each with a per-card FontAwesome icon in orange, a 940×650 brand image, a small industry eyebrow, "The challenge / What we shipped" copy blocks, and a bright #ff3b1f result headline separated by a hairline border. The cards lift 8px and swap to an orange-tinted 68px glow on hover. The Northwind deep-dive that follows uses a 1/2 image + 1/2 story split with orange "The moment / The challenge / Our approach" eyebrows, then a three-column #141414 stat panel (+312%, 9wks, $18M) with a pull-quote from the CEO underneath.

An outcomes block titled "For Series A–C founders" restacks the same rhythm as a four-up 1/4 grid of rgba(255,255,255,0.04) glass cards with 84px orange numerals, followed by a native divi/testimonial module inside a #141414 card with an orange left border. The page closes on a 135° gradient section — orange bleeding into black — with a 72px centered display headline and a solid-orange primary CTA that inverts to white on hover. Everything is responsive: the 72px hero heading steps to 52px on tablet and 40px on phone, section padding shrinks 140→100→80px, and every multi-column row uses flex-direction: column on phone so the case-study grid, stat cards, and hero split all restack cleanly on a single-hand thumb scroll.

What’s inside

Full-bleed dark hero with a 3/5 + 2/5 flex row — uppercase eyebrow, 72px Outfit headline at -2px letter-spacing, 620px lede, primary CTA button, and a 16px-radius portrait image with an rgba(255,59,31,0.25) glow shadow
Three-up case-study card grid: white cards over black with 20px radius, a per-card FontAwesome icon in orange, brand photo, industry eyebrow, challenge/shipped copy pair, and an orange result headline separated by a 1px hairline
Card hover state built with the native transform module — 8px lift plus a 68px orange-tinted glow — no custom CSS required
Deep-dive case-study block: 1/2 image + 1/2 story split with orange "The moment / The challenge / Our approach" eyebrows, followed by a three-column #141414 stat card row inside a rounded outer panel
Outcomes section with a four-up 1/4 stat-card grid on rgba(255,255,255,0.04) glass fills, 84px orange numerals, and 18px descriptive labels
Native divi/testimonial module wired with author, job title, portrait, and quote fields inside a #141414 card with an orange left border and 60px shadow
Gradient closer section (135° orange-to-black) with centered 72px display heading, 680px supporting paragraph, and a native divi/button primary CTA that inverts orange → white on hover
Responsive scale ladder across every section: 72→52→40px hero, 64→48→36px H2s, and 140→100→80px vertical padding, plus phone-only flex-column stacking on every multi-column row

Who it’s for

Independent branding studios, positioning consultancies, and design agencies pitching Series A–C founders — anyone selling a rebrand, a website launch, or a category-defining story to a technical or ops-heavy buyer. The tone works for hardware, industrial, SaaS, and fintech agencies where the buyer wants proof, not moodboards. It also fits growth studios, product marketing consultants, and fractional CMOs presenting portfolio work with real numbers attached. Skip it if your positioning is soft, playful, or lifestyle-led — the black-and-orange palette and industrial Outfit type are built to feel confident and expensive, not gentle. Best fit: teams that measure engagements against pipeline, ARR, or a valuation multiple and want their site to say so on the first scroll.

Customization tips

Palette shifts happen in three places: section backgrounds (#0a0a0a → your dark), the accent (#ff3b1f in eyebrows, buttons, stat numerals, icon color, and every shadow rgba(255,59,31,…)), and card fills (#ffffff on the mid grid, #141414 on the dark panels). A global find-and-replace on ff3b1f — plus the same swap on the shadow rgba tuples — repaints every eyebrow, button, icon, and stat in one pass. Keep the hero headline under ~55 characters or the 72px desktop size wraps awkwardly; the tablet drop to 52px and phone 40px will absorb longer copy. Case-study card titles look best at 2–3 words and the result headline handles ~40 characters. Portrait image renders at ~940×1400 with 16px radius — use vertical framing; horizontal photos crop wide. The case-study grid uses 940×650 crops (roughly 16:11). The testimonial portrait pulls from i.pravatar.cc as a placeholder — replace with a real 320×320 headshot before you ship.

How to install this layout

Download the layout JSON file from this page.
Open the target page in the Divi 5 builder.
Open the portability panel (up/down arrows icon) and choose the Import tab.
Upload the JSON. Tick “replace existing content” only for full-page imports.
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 Blackline Studio — Bold Agency Case Studies Page for Series A–C Founders

Is the case-study grid a native Divi 5 module or a custom builder?

It's built entirely from native divi/section, divi/row, divi/column, divi/heading, divi/text, divi/image, and divi/icon modules — no third-party plugins. Each card is a column with its own background, radius, hover transform, and box shadow, so you edit it in the visual builder like any other row.

How does the page behave on mobile?

Every multi-column row collapses to flex-direction: column on phone. The 3/5 + 2/5 hero stacks headline over image, the three case-study cards become a single vertical scroll, and the four-up stat grid restacks full-width. Display headings step down (72→52→40, 64→48→36, 56→42→34) and section padding drops 140→100→80px so the type never blows out the viewport.

What imagery do I need to replace before launch?

Six photos in total: the hero portrait (vertical, roughly 940×1400), three case-study cards (roughly 940×650, 16:11 crops), the Northwind deep-dive image (940×650), and one testimonial headshot (320×320). The testimonial portrait URL points at i.pravatar.cc, which is a random-avatar generator — swap it for a licensed headshot before you go live.

What should I edit first?

The hero eyebrow and 72px headline, then each of the three case-study cards (brand name, industry line, challenge/shipped copy, and the orange result headline). After that, the deep-dive case-study block's client name and stat trio, then the four "For Series A–C founders" stat cards — keep those numerals to two–four characters so they render cleanly at 84px.

Does the layout include a native testimonial module?

Yes. The client-proof section uses the divi/testimonial block with author, job title, portrait URL, and quote fields, wrapped inside a #141414 card with an orange left border and a 60px drop shadow. You edit the quote and portrait in place — no shortcode assembly, no separate carousel plugin.

How is the orange accent applied so I can rebrand quickly?

The #ff3b1f accent shows up as eyebrow text color, button background, stat numeral color, FontAwesome icon fill, and the shadow rgba (rgba(255,59,31,0.25) and 0.35). A global find-and-replace on the hex plus the two rgba tuples repaints every eyebrow, CTA, icon, and glow across all six sections at once.

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.