№ 01 · Travis County
Travis County Civil and Family
Courts Facility
1700 Guadalupe St · Austin, TX 78701
Where most of our cases are heard. We know the family-court judges, the clerks, the hours, the parking.
— INTERNAL · NOT INDEXED —
Better Divorce Austin
Design System.
A live reference for the Texan Marquee design system. Source of truth: bda.css for tokens, src/components/bda/ for components. This page renders the actual current state.
§ 01
Color tokens.
Defined as CSS custom properties on .bda-root in src/assets/styles/bda.css.
Pairing rules. Cream + ink is the default. Maroon is emphasis only (italic, never bold). Navy is chrome only (footer, county strip, navy CTA bands). Gold appears only on navy. Sage is for the closing word of a multi-line headline (max one per page).
§ 02
Typography.
Three families. All headlines and prose use Playfair Display. JetBrains Mono is for editorial labels. Inter is the UI fallback.
--bda-ff-serifPlayfair Display The hardest part is deciding whether to decide. Headlines, decks, body prose
--bda-ff-monoJetBrains Mono The hardest part is deciding whether to decide. Editorial labels, kicker tags, badges
--bda-ff-sansInter Variable The hardest part is deciding whether to decide. UI fallback, applied to .bda-root
Headline scale
Hero H1Headline.96px / 0.96 / -0.025em
Hero H1 (mobile)Headline.56px / 0.96 / -0.025em
Section H2Section title.48px / 1.05 / -0.02em
Pillar H2Pillar section.40px / 1.05 / -0.02em
Card H3Card heading.26px / 1.15
Body scale
Lead (.lead)Italic lead paragraph for opening sections.24px / 1.45 / italic
Standard proseStandard body paragraph for long-form content.19–20px / 1.55
SidebarSidebar copy and small annotations.14–16px / 1.4
Mono label— EDITORIAL LABEL —11px / 0.16em / uppercase
§ 03
Spacing & layout.
No formal scale. Spacing is composed per-section using these reference values. Page width 1440px max, fluid below 900px.
- Section padding (desktop). 64–96px vertical, 40px horizontal.
- Section padding (mobile <900px). 32–48px vertical, 20px horizontal.
- Grid gaps. 32–64px between major columns.
- Section dividers.
border-bottom: 3px double var(--bda-ink) - Subtle dividers.
border-bottom: 1px dashed var(--bda-ink) - Responsive collapse. All multi-column grids collapse to single column at 900px.
§ 04
Components, live.
Rendered from the actual source. src/components/bda/ · 22 components total.
EyebrowLabel
— — A FAMILY LAW FIRM, IN PLAIN ENGLISH — —
StatStrip
Trusler Legal · est. 2001Board Certified Family Law (TBLS)Master Credentialed CollaborativeSettlement-first practice
PullQuote (size lg, sage emphasis)
— THE FIRM'S CREED —
"No family situation ever improved at the courthouse.
So we don't take you there unless we have to."
— Cristi Trusler, Founder
EntryRow
SidebarCard — three variants
— The Particulars —
Typical duration 5–9 months
Fee structure Hourly + flat
Court appearances 0–2
Forum Travis Co.
— Lead Counsel —
Cristi Trusler
Founder. Board Certified in Family Law (TBLS). Practicing collaborative divorce in Texas since 2002.
— A Real Number —
"One in two"
First conversations that do not become divorces. Reconciliation, waiting, a different professional.
NoteCard
No. i.
Texas is a community property state.
Most of what was earned or acquired during the marriage belongs to both of you under § 3.002. Division is "just and right" (§ 7.001), not automatically 50/50.
CourthouseCard
Travis County Civil and Family
Callout (note from counsel)
SectionHeader
What "community property" actually means
QAGrid (auto-emits FAQPage schema when used in a page with Q&A)
— PEOPLE LIKE YOU OFTEN ASK —
Honest answers
to fair questions.
Q · 01
"I'm not sure I want a divorce. Is it too early to call?"
No. About half of our first conversations do not become matters. The initial consult is a paid hour with Cristi — $250, the first hour prepaid — and it is actual legal advice, not a sales pitch.
Q · 02
"What should I bring or prepare?"
Nothing. Do not gather paperwork yet. The first call is about you, not your assets.
RelatedRow
LastUpdated
§ 05
Component catalog.
Full inventory of src/components/bda/. Above section renders the visually distinctive ones; this table is the complete list.
| Component | File | Role |
|---|---|---|
Banner | Banner.astro | Top phone/hours band |
SiteMast | SiteMast.astro | Newspaper-style masthead with brand + nav |
Crumbs | Crumbs.astro | Breadcrumb trail |
Footer | Footer.astro | Firm address, disclaimer, TBLS verification |
LastUpdated | LastUpdated.astro | Visible date + machine-readable time |
Schema | Schema.astro | JSON-LD @graph injection (no visual) |
Marquee | Marquee.astro | El Arroyo letter-board, drawn, switcher |
MarqueePhoto | MarqueePhoto.astro | Real photo override of Marquee |
EyebrowLabel | EyebrowLabel.astro | Pre-headline kicker, mono caps |
PullQuote | PullQuote.astro | Signed pull quote with optional label |
Callout | Callout.astro | A note from counsel inline callout |
SectionHeader | SectionHeader.astro | Numbered section header |
StatStrip | StatStrip.astro | Horizontal credentials/stat strip |
SidebarCard | SidebarCard.astro | Universal sidebar card |
NoteCard | NoteCard.astro | Numbered roman-numeral note card |
CourthouseCard | CourthouseCard.astro | Courthouse profile with meta grid |
EntryRow | EntryRow.astro | Homepage entry-point row link |
QAGrid | QAGrid.astro | Q&A grid (auto-FAQPage schema) |
RelatedRow | RelatedRow.astro | Related-content ribbon |
AuthorByline | AuthorByline.astro | Resolves author from attorneys collection |
JournalIssueHeader | JournalIssueHeader.astro | Journal masthead |
JournalArticle | JournalArticle.astro | Journal article wrapper |
§ 06
Editorial patterns.
Recurring conventions across pages. Part of brand voice; do not refactor away.
Editorial labels (— LABEL —)
Mono caps, maroon, em-dashes wrapping. Used for sidebar card labels, section eyebrows, kicker tags. These em-dashes are signature, not the AI tells eliminated from body prose. Examples:
- — THE PARTICULARS —
- — LEAD COUNSEL —
- — A REAL NUMBER —
- — PRACTICE AREAS · TEXAS FAMILY LAW —
- — FOUNDER · TRUSLER LEGAL PLLC —
Swash italic accent
Sage italic for the closing word of a multi-line H1. <span class="swash">final word.</span>. Maximum one per H1.
The hardest part is
deciding whether
to decide.
"A Real Number" sidebar card
A defensible number framed as a quoted phrase. Statutory > federal > sourceable public range > qualitative. Never invent firm-specific case counts.
- "One in two" — first conversations that don't become matters (entry-point: considering)
- "Three to seven" — years for a typical structured-note buyout (entry-point: business-owners)
- "Ten years" — § 8.051 spousal maintenance threshold (entry-point: over-50)
- "Twenty percent" — § 154.125 child support guideline (entry-point: children-first)
§ 07
Voice rules.
Source: project_bda_voice.md memory. Summary here for reference.
Always
- Direct, plain English
- Settlement-first by design, court-capable by training
- Mildly literary
- Short fragments are OK if they earn it
- Statute citations inline (Tex. Fam. Code § 6.001)
- Numbers anchored to TFC, federal, or hedged ranges
- Answer-first opening paragraphs (40–80 words, self-contained, RAG-extractable)
- Section passages 134–167 words, lead with sub-answer
Never
- Em-dash sandwiches in body prose (X — clause — Y)
- "Not X but Y" inversions
- Hollow tricolons (X. Y. Z. with no payoff)
- "It's not X — it's Y" closure patterns
- Filler: actually, really, essentially, fundamentally
- Phantom statistics (firm-specific case counts not from real records)
- Competitor patterns: compassionate, passionate, fight for you, aggressive, warrior
- Corporate jargon, AI-flat phrasing
- Labeled "Quick Answer:" or "TL;DR" boxes
§ 08
URL architecture.
V1 routes. Legacy /v2/* paths still build but are excluded from sitemap.
/— homepage/where-you-are/[slug]— 6 audience-driven entry points/[slug]— 10 SEO-driven legal-category pillars/blog/[slug]— long-form essays + topical posts/the-firm/travis-county— geo page/attorneys/cristi-trusler— authority hub/how-we-work— flagship process page/contact— contact/design-system— this page (noIndex)