Brand Style Guide · v3.0
Disruptive Director · v3.0
The threshold — boardroom door at dawn
Brand Style Guide · v3.0 · Disruptive Director
Brand identity — resolved single direction

Governance is where
the law ends and
leadership begins.

A complete visual and communication identity for a credibility-first governance education platform. One direction, fully specified, ready for HubSpot build.

View homepage concept → Color system
7 Brand tokens
9 Photo concepts
14 Homepage sections
V1 Boardroom Annual
The Disruptive Director — book mockup
01
Brand
Foundation

Compliance is the floor.
Not the ceiling.

One platform. One argument. Equipping GCC directors to move from compliance minimum into principled, courageous governance leadership.

Core positioning
Constructive Governance Leadership — equipping current and aspiring directors to ask better questions, exercise sharper oversight, and create measurable boardroom impact through principled inquiry and practical tools.
— Disruptive Director platform positioning

What the brand is

  • A credibility-first governance education platform
  • A book-led authority ecosystem built around Maali Khader's IP
  • A practice for current and aspiring directors on GCC private and nonprofit boards
  • Artifact-first — tools that can be used in real meetings

What the brand is not

  • A compliance training product
  • A personal-brand guru business
  • A corporate governance certificate program
  • A creator-led course ecosystem
  • A consulting firm with a website
Better questions.
Stronger boards.
Measurable impact.
02
Color
System

Seven colors.
One role each. No ambiguity.

Clean Teal is the only primary brand signal. White and Soft Silver carry all surfaces. Deep Navy, Coral, and Slate are accent and meta — never fill colors on primary surfaces.

Primary palette
White
#FFFFFF
Primary canvas · card backgrounds · inputs
Canvas
Soft Silver
#E6E8EB
Section bg · alt rows · dividers
Surface
Midnight Ink
#0F172A
All body text · headings · dark UI
Text
Clean Teal
#2A9D8F
CTAs · links · active nav · rule lines
Primary Accent
Accent & support
Warm Yellow
#F2C94C
Chapter badges · callouts only
Highlight only
Soft Coral Red
#E07A73
Pull-quote rules · emphasis · errors
Emphasis
Cool Slate
#6B7280
Captions · meta · labels
Muted / Meta
Deep Navy
#1F2A44
Footer · dark callout blocks only
Deep Accent
Warm Yellow — usage demonstration
Warm Yellow · #F2C94C · Permitted uses only Never fill buttons · never large backgrounds · max 2 per page
12
A
New resource Chapter 3 Pre-order

↑ Chapter number badges · resource tags · pill callouts

The A.C.T.I.V.E. framework is not a checklist. It is a disciplined way of inhabiting your seat.

↑ Callout block with yellow left-border rule (alternative to teal/coral rule)

A first-time director enters their second meeting with one job: to ask the question no one else has been asked to answer. That is the beginning of constructive disruption.

↑ Inline text highlight span — single phrase only, never whole sentences

Yellow appears at 2–3% of any surface. Its role is to signal energy and draw the eye to a single point — not to fill, not to brand. If a second instance of yellow appears on the page, check whether the first one still earns its place.
Contrast ratios
Ink / White
17.8:1
AAA ✓
Teal / White
3.4:1
AA large · links only
White / Navy
14.2:1
AAA ✓
Slate / White
4.7:1
AA ✓ · meta only
Compliance
is the floor.
Not the ceiling.
Newsreader · 400 weight · opsz 60 · −1.8% tracking
03
Type
System

Newsreader × Inter.
Authority and legibility.

Newsreader is a variable optical-axis serif with genuine warmth — it reads like a serious imprint, not a governance institute. Inter handles every functional surface. JetBrains Mono carries all metadata.

NEWSREADER
Variable opsz 6–144
wght 300–600
Display · Headings
The disruptive director.
NEWSREADER 400
H1–H3 · Section titles
40px · opsz 36
Better questions. Stronger boards.
NEWSREADER 400
H4 · Subheads · Cards
24px · opsz 24
The A.C.T.I.V.E. Practice
NEWSREADER 300 italic
Pull-quotes · Callouts
20px · opsz 12
"The most powerful tool in the boardroom is a well-framed, courageous question."
INTER 400
Body text · UI copy
16px · lh 1.65
The corporate boardroom stands at a crossroads. In an era of unprecedented volatility, technological disruption, and heightened stakeholder expectations, the traditional governance playbook has become a liability. Directors who merely oversee are no longer sufficient.
JETBRAINS MONO
Labels · Meta · Kickers
11px · tracking +0.14em
01 — Board Governance · GCC Region · A.C.T.I.V.E. Framework
04
UI
Components

Functional precision.
No decorative friction.

2px radius throughout. Teal drives all action. Coral signals errors and emphasis. Nothing earns a component slot unless it converts or informs.

Button system border-radius: 2px · Inter 500 · 14px · 2px border
Get the book → Learn more Download resource Explore resources
New resource Chapter 12 Live cohort Framework tool
Primary CTA uses Clean Teal — the only fill-color button on white surfaces. 2px radius throughout matches the Boardroom Annual register (V1 spec, r=2px). Pills use JetBrains Mono at 9px.
Form elements 1.5px border · teal focus ring · coral error state
Please enter a valid email address.
Inline email capture
Subscribe

Governance insights. No noise. Unsubscribe anytime.

Inline email capture is the primary list-building surface — homepage break, QR hub landing, book-owner verification flow.
05
Homepage
V1 · Boardroom
Annual

V1 · Boardroom Annual.
14 sections. One conversion logic.

Book pre-order → QR hub routing → enterprise qualification. McKinsey Quarterly + FT Weekend register. Recommended for launch: highest conversion fit across all five personas, lowest positioning risk.

disruptivedirector.com
Pre-order now  ·  First edition ships May 2026  ·  Foreword by a senior GCC regulator
Volume I · Series 2026 · A Field Companion for GCC Private Boards

Better questions
for the boardroom.

For the directors who will shape the GCC's next decade. A practice, not a credential.

Pre-order from $28 → Start Here
$28
From
312
Pages
May 2026
Ships
The Disruptive Director — book cover
As seen at
👤
Start here
For the Director

First-time or early-stage director on a private or nonprofit GCC board. Start with the free resource pack.

Start Here →
🪑
For the Chair

Taking your first chair seat or rebuilding board culture. The book and the practicum.

The Book →
🏛
For Organizations

Institutional access to governance education, diagnostic tools, and board development programs.

Enquire →
The Book · Disruptive Director

The framework that makes
governance actionable.

The A.C.T.I.V.E. Director Practice — six principles for constructive governance leadership on GCC private and family boards.

Read the first chapter →
A
Agenda
Own your agenda rights before the meeting begins
C
Committees
Use committee work as your governance lever
T
Time
Protect independent thinking time before every meeting
I
Influence
Build principled influence without positional authority
V
Voice
Ask the question no one else will ask
E
Escalation
Know when and how to escalate a concern properly
Free Resources · Start Here
Resource
Chapter 6 Framework tool
The 5 Questions Before Every Vote
A pre-vote checklist for independent directors.
Resource
Year 1 Question library
52 Questions for Your First Year
One per week. Mapped to A.C.T.I.V.E. principles.
Resource
Tool Governance guide
Reading a Board Pack Under Time Pressure
A triage method for the night before.
The Practicum · Sept 2026

The Private Director Practicum

A structured six-week live cohort applying the A.C.T.I.V.E. framework to real board scenarios. Limited to 20 directors per cohort.

Join waitlist

Next cohort: September 2026

For Organizations

Governance development at institutional scale.

Enterprise licensing, board diagnostics, and in-house director development programs. Six engagements per year. For chairs, family offices, and institutional boards.

Start a conversation →
Hero background video · seedance 2.0
T0 · Hero background · 5s loop
▶

Generated on Higgsfield seedance_2_0. Pending render — placeholder poster shown. Swap src="https://d8j0ntlcm91z4.cloudfront.net/user_37e23QHOQpTIvEH5NlrQWaLIw8c/hf_20260428_160031_f0e28a39-27f9-4910-8e25-03d25e5b278c.mp4" with the final Higgsfield CDN URL once render completes. No structural change required.

06
Brand
Photography

Three themes.
Nine images. All conceptual.

Architectural, principled, metaphorical — never stock. Each image maps to a core argument in The Disruptive Director. Neutral ambient light; brand color enters at the HTML layer only.

✓ Use
Architectural abstraction
Empty boardrooms, thresholds, city views — governance without people
✓ Use
Principled inquiry objects
Documents, questions, annotations — visible tools of disciplined thinking
✓ Use
Strategic metaphor
Chess, thresholds, reflections — core thesis made visual
× Never
Handshake / conference stock
Smiling executives, board tables with visible faces
× Never
Generic governance still life
Books-on-desk-next-to-coffee with no conceptual intent
× Never
Color-graded toning
Teal/navy filters baked into images — color enters at UI layer only
Theme 1 — The Weight of the Seat

Governance as foresight. Use: homepage hero, course landing, institutional surfaces.

T1-A
T1–A
The Chair
Single empty chair · low angle · city at dawn
T1-B
T1–B
The Question Mark
Top-down round table · one page, one mark
T1-C
T1–C
The Threshold
Glass door · city at dawn beyond
Theme 2 — Principled Inquiry

The Socratic method. Use: resource pages, tool previews, Field Notes, module headers.

T2-A
T2–A
The Margin Question
One deliberate ? in governance document
T2-B
T2–B
The Single Question
White notebook · one line · pen at rest
T2-C
T2–C
Surgical Annotation
Governance codes · methodical marks
Theme 3 — Compliance is the Floor

The central argument made visual. Use: homepage section breaks, book promotion, social anchors.

T3-A
T3–A · Feature
The Line
Floor threshold · compliance on one side, leadership on the other
T3-B
T3–B
Foresight vs Oversight
City at dawn · document reflected
T3-C
T3–C
The Decisive Move
Chess piece · strategic and final
07
Brand
Voice

Executive but accessible.
Serious without being stiff.

A trusted governance strategist talking to a peer. Not a motivational speaker. Not a compliance trainer. Every sentence earns the next one.

Preferred language
  • Constructive disruption · Principled inquiry · Fiduciary clarity
  • Better boardroom questions · Governance maturity · Practical oversight
  • Compliance is the floor, not the ceiling
  • Artifact-first learning · Executive usefulness · Measurable boardroom impact
  • Courageous leadership · Purpose-led governance · Boardroom confidence
Never use
  • Hack your board success · Game-changing secrets · Ultimate blueprint
  • Crush it in the boardroom · Skyrocket results · Easy wins
  • Guru / thought leader (self-description) · Viral
  • Transform your life · Unlock your potential · Boardroom domination
Headline pairs
On brand vs off brandSame intent, opposite register
✓ On brand ✗ Off brand
The questions a first-time director should be asking by the second meeting.5 game-changing boardroom hacks that will transform your leadership overnight.
A practice for directors who would rather read carefully than perform confidently.Unlock your boardroom potential with this proven step-by-step system.
Governance is where the law ends and leadership begins.Become a disruptive director guru and crush it at every board meeting!
08
Build
Notes

HubSpot CMS.
Build discipline.

Specifications for the Dev Agent. All decisions lock against rework at the Marketing Hub Starter → Pro upgrade at Month 4–6.

Typography Direction A — The Counsel
Display font Newsreader — variable, opsz,wght@0,6..72,400;0,6..72,500;1,6..72,400. Preconnect Google Fonts. font-display: swap. Apply font-feature-settings: "opsz" 60 at hero, 36 at section headings, 12 at pull-quotes.
Body font Inter — variable, wght@300..600. Body: 17px / 1.7 leading / letter-spacing: -0.004em. Never use Inter for pull-quotes or decorative text.
Tracking Display: letter-spacing: -0.018em (−1.8%) on all Newsreader elements. Body: -0.004em (−0.4%) on all Inter elements. Mono/labels: +0.14em, uppercase.
Weights Newsreader: 400 roman and 400 italic at display sizes. 500 for emphasis only. No weight 300 in production. Inter: 400 body, 500 UI, 600 labels.
Tokens, radius & grid HubSpot Design Manager
CSS tokens All prefixed --dd-: --dd-teal: #2A9D8F · --dd-ink: #0F172A · --dd-silver: #E6E8EB · --dd-navy: #1F2A44. Never hardcode hex in CTA modules — token-only so upgrade requires zero find-and-replace.
Radius 2px on all buttons, inputs, and cards. V1 Boardroom Annual spec. Do not use HubSpot starter theme defaults (usually 4–6px). Pills and tags: 999px.
Layout grid Spine grid: 220px 48px 1fr. Max content width: 1560px. Page padding: 32px horizontal. Section padding: 100px vertical. Base unit: 8px.
Color usage — hard constraints Not guidelines — do not override
Clean Teal #2A9D8F — the only color that fills a button. All CTAs, active nav underlines, kicker bars, focus rings, rule lines. Hover: #1E7268.
Warm Yellow #F2C94C — pill badges, chapter callouts, A.C.T.I.V.E. letter accents, inline text highlights only. Never a button fill, background block, or section color. Max 2 instances per page.
Coral Red #E07A73 — pull-quote left-border, inline stress marks, form error states. Not a CTA fill. Not a background.
Deep Navy #1F2A44 — footer, book feature panel, dark callout blocks only. Not a site canvas. White and Soft Silver carry all primary surfaces.
Media & performance CDN + HubSpot CMS
Hero video Higgsfield seedance_2_0 · Job f0e28a39 · 5s loop · 720p · autoplay muted loop playsinline. Poster: T1C. Overlay: linear-gradient(105deg, rgba(255,255,255,.92), rgba(230,232,235,.55)). Fallback: T1C static image.
Photography Hero: 1400×800px min, WebP + JPEG. Cards/social: 600×600px. All 9 images on Higgsfield CloudFront (permanent, no expiry) — full URL list in _brand-style.md §7. Never apply CSS color filters.
HubSpot rule The HubSpot MCP connected to Epirco's workspace is Epirco's own portal. All Disruptive Director HubSpot work is specification-only — produce build sheets, never write to the client portal directly.