Design system

Text classes in action.

Live specimens of the site type scale. Editors usually only paste editorial-accent into title fields — everything else is applied by templates.

This page is for client and editor reference. It is noindexed and not in the main menu.

Tokens

Type scale

.heading-xl

Progress isn’t chance.

.heading-lg · .section-title

Section heading sample

Same scale via .section-title

.heading-md

Subsection / card title

p · .body-lg · .body-md · .lead

Body copy at ~18px. You aren’t looking for another therapy hour — you’re looking for a place that knows your path.

.page-lead

Slightly larger lead under a section title — used for intros and CTAs.

.small · .muted · .label

Small / muted supporting text at 14px.

Muted variant for secondary notes.

Label uppercase

Labels

Eyebrows

.section-eyebrow

Section eyebrow

.page-hero__eyebrow

Page hero eyebrow

.label--accent

Accent label

Inline emphasis

Editorial accent

The one class editors paste into ACF titles. Brand orange, not italic. Keep spaces around the word.

<em class="editorial-accent">…</em> — correct

The right rhythm for your child.

Missing spaces — avoid

The rightrhythmfor your child.

.text-accent

Colour-only utility: accent text

Paste into ACF title fields:

The right <em class="editorial-accent">rhythm</em> for your child.

Inner pages

Page hero stack

Who we are

Clinical architecture for your child.

Lead sits under the title — quieter, readable, one or two sentences.

.page-hero__eyebrow · .page-hero__title · .page-hero__lead

Long-form

Page prose

.page-prose

Subsection inside prose

You aren’t looking for ‘good enough’ care or another therapy hour — you’re looking for a place that knows your path and walks it with you.

Strong text uses semibold weight. Links keep the brand underline treatment.

Quotes

Pull quote

.pull-quote

They didn’t just treat a diagnosis — they walked the path with us.
Parent voice

Actions

Buttons

.page-btn--primary Start your journey

.page-btn--secondary Talk to us

.btn--primary · .btn--outline · .btn--text

Primary Outline Text

Surfaces

Cream context with accent.

Section backgrounds (.page-section--cream / --navy) change title colour; they are not text classes themselves.