← Styleguide

Internal — Design Reference

Card Directions

Card treatments 00–16 and statement-band treatments 17–22, all built from the existing brand tokens. The current card leads as the baseline, and the same sample content runs through every standard card variant so styles compare directly; the band treatments set the home intro's real copy six ways.

Not linked from navigation. Noindex. Nothing here ships until a direction is chosen.

Family 0 — Baseline

Chart Plate — The Current Card

The card in production today: white→paper wash, graticule cap, waterline keel. Shown for comparison; every family below is a candidate replacement.

00 Chart Plate (current)

Base, tint, and beam modifiers of the shared .card system, exactly as they run on the live pages.

white→paper wash · 1px hairline · radius-xl · shadow-card · graticule cap · 3px waterline keel

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

Family A — Flat & Ruled

Print-Calm, No Shadows

Elevation traded for ink: hairlines, rules, and hard edges. These sit quietest in dense grids and read closest to the site's card-free logbook sections.

01 Chart Corners

Flat plotting-sheet card with tick brackets from nautical chart margins. For dense grids where elevation feels heavy.

white · 1px hairline · radius-sm · no shadow · 2px blue corner brackets · bare icon

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

02 Ledger Plate

The site's logbook rows, cardified: paper surface, strong top rule, big Playfair numeral. For numbered process or feature sequences.

paper · 2px ink top rule · radius 0 · no shadow · blue plate numeral · no icon

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

03 Offset Plate

Flat poster look: hard ink outline with a solid offset shadow. Confident and graphic; for a marquee trio, not long lists.

white · 2px ink border · radius-sm · solid blue-soft offset shadow · outlined icon chip

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

Family B — Accent Edges

One Edge Does the Branding

The surface stays plain; a single colored edge — a hoist bar, a keel footer, a waterline header — gives each card its identity.

04 Signal Flag

A 4px hoist bar on the left edge. Workhorse list card; the orange bar marks the one featured item in a set.

white · 1px hairline · radius-sm · no shadow · 4px blue left bar (orange = featured)

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

05 Split Keel

White body with a tinted footer strip carrying the action. A clear action zone without spending any orange.

white body · blue-50 keel footer · 1px hairline · radius-lg · shadow-card · ghost arrow

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

06 Waterline Header

A tinted header block separated from the body by a tiny static wave seam — the Waves motif miniaturized into card anatomy.

blue-50 header · static wave seam · white body · 1px hairline · radius-lg · no shadow

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

Family C — Nautical Decor

The Motif as Decoration

Plain surfaces with one nautical gesture each — a porthole, a rose, a run of rigging. Ceremonial rather than workhorse; best in small doses.

07 Porthole Medallion

Centered card with a ringed icon medallion breaching the top edge. Ceremonial — for a three-up pillars moment, not dense grids.

white · 1px hairline · radius-lg · shadow-card · ringed medallion · centered

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

08 Compass Rose Corner

Clean white card with the oversized rose ghosting off one corner in pale blue. A quiet brand watermark for editorial content.

white · 1px hairline · radius-lg · no shadow · monochrome-blue compass watermark

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

09 Rope Stitch

Dashed rigging border. The loosest variant in the set — trades polish for warmth; for asides, tips, secondary content.

white · 2px dashed blue-soft border · radius-lg · no shadow · bare icon

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

Family D — On the Blue

Inverted & Translucent

Cards that carry the band gradient themselves, or sit on top of it. White text throughout; the compass reads as-is against the blue.

10 Ensign

Full-gradient inverted card for white sections — a highlight moment, one or two per page at most.

band gradient · inset white ring + shadow-card · radius-xl · compass watermark · band icon chip

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

11 Frosted Chart

Translucent card for content sitting on blue bands — heroes, CTA bands. Shown here on a demo band strip for context.

10% white fill · 35% white hairline · backdrop blur · radius-lg · no shadow · band icon chip

Virtual Assistance

Billing & Insurance, Handled

Claims, invoices, and follow-ups — off your plate and moving. We keep the paperwork current so your week stays yours.

Explore Virtual Assistance

Marketing & Design

A Website That Pulls Its Weight

A fast, polished site that says the right things to the right people. Built, launched, and kept shipshape — no upkeep worries on your end.

See Marketing & Design

How We Work

One Crew, Every Course

Ongoing or as-needed, we fit into the way you already work. You bring the problem. We bring the solution.

Meet the Crew

Family F — Content Shapes

Stats & Quotes

Two shapes the site doesn't have yet — a results tile and a testimonial card — dressed in the same calm language as the families above.

15 Quarterdeck Stat

Oversized Playfair figure over an uppercase label. For results and metrics strips.

white · 1px hairline · 2px blue top rule · radius-lg · no shadow · display-sm blue figure

2

Service Pillars, One Crew

100%

Remote & Flexible

1

Point of Contact

16 Chart Quote

Playfair-italic pull quote on a paper surface. Placeholder copy — not real testimonials; swap in real quotes before any promotion.

paper · no border · radius-lg · no shadow · blue-soft quote mark · blue rule attribution

EMR Solutions took the busywork off my desk in the first week. Everything runs calmer with them aboard.

Office Manager · Placeholder Quote

One email and it is handled — the site, the billing follow-ups, all of it. They are the steadiest part of my week.

Small-Business Owner · Placeholder Quote
Family G — Statement Bands

The Intro Band, Six Ways

The home intro today is a centered block of light white text — nothing steers the eye. Six treatments of the same copy, verbatim, each with a different way in. Strips shown without the band's wave seam; the live section keeps it.

17 Leading Light

Hierarchy: the identity sentence opens big in Playfair italic, the detail follows smaller, and the payoff lands under a short orange rule.

hierarchy · big serif opener · muted body · orange-rule payoff · left-aligned

EMR Solutions is a boutique virtual-assistance practice — a small, dependable crew you can hand the work to.

Some clients have us run the day-to-day of their whole office; others bring us a single project. Either way, we take it on and see it through. Plenty start with one project and grow into much more — and as your business grows, we grow right alongside it.

You focus on your work. We’ll handle the rest.

18 Three Beats

Structure: the paragraph broken into three ruled beats with translucent logbook numerals — skimmable columns instead of a wall.

structure · 3 ruled beats · translucent numerals · centered payoff

EMR Solutions is a boutique virtual-assistance practice — a small, dependable crew you can hand the work to.

Some clients have us run the day-to-day of their whole office; others bring us a single project.

Either way, we take it on and see it through. Plenty start with one project and grow into much more — and as your business grows, we grow right alongside it.

You focus on your work. We’ll handle the rest.

19 Captain's Log

Editorial anchor: a narrow ruled column with a Playfair drop cap — the classic device for pulling a reader into a paragraph.

anchor · drop cap · 2px left rule · narrow measure · italic payoff

EMR Solutions is a boutique virtual-assistance practice — a small, dependable crew you can hand the work to. Some clients have us run the day-to-day of their whole office; others bring us a single project. Either way, we take it on and see it through. Plenty start with one project and grow into much more — and as your business grows, we grow right alongside it.

You focus on your work. We’ll handle the rest.

20 Frosted Panel

Surface: the paragraph gets a frosted plate to sit on (card direction 11), with the compass ghosting behind — the text becomes an object, not a field.

surface · frosted panel · compass watermark · payoff outside the glass

EMR Solutions is a boutique virtual-assistance practice — a small, dependable crew you can hand the work to. Some clients have us run the day-to-day of their whole office; others bring us a single project. Either way, we take it on and see it through. Plenty start with one project and grow into much more — and as your business grows, we grow right alongside it.

You focus on your work. We’ll handle the rest.

21 Highlight Reel

Emphasis: the body dims and three key phrases carry a translucent marker swipe — a skim path through the paragraph. The payoff's promise gets the one orange underline.

emphasis · dimmed body · white highlight swipes · orange payoff underline

EMR Solutions is a boutique virtual-assistance practice — a small, dependable crew you can hand the work to. Some clients have us run the day-to-day of their whole office; others bring us a single project. Either way, we take it on and see it through. Plenty start with one project and grow into much more — and as your business grows, we grow right alongside it.

You focus on your work. We’ll handle the rest.

22 Helm Split

Inverted lead: the payoff — the strongest line — is promoted to the big statement on the left; the paragraph becomes the supporting column on the right.

inverted hierarchy · display payoff left · ruled body right · faint compass

You focus on your work. We’ll handle the rest.

EMR Solutions is a boutique virtual-assistance practice — a small, dependable crew you can hand the work to. Some clients have us run the day-to-day of their whole office; others bring us a single project. Either way, we take it on and see it through. Plenty start with one project and grow into much more — and as your business grows, we grow right alongside it.