Assize

About This Template

Assize is a template for appellate boutiques, litigation firms, and any professional-services practice whose product is written argument. Twelve page templates cover practice areas with detail pages, a stat-anchored results docket, attorney bios with sticky admissions asides, a scientific-journal insights section with long-form articles, about, contact, an attorney-advertising legal page, and a 404 that stays in character. The signature is The Redline: the hero is a paragraph of opposing-counsel boilerplate that gets marked up live as you scroll — strikes draw through, a caret opens, tighter language sets itself, and margin notes accumulate down a persistent rail. Two designed skins ship, Record (limestone) and Bench (ink), each verified for AA contrast rather than auto-inverted. Five Zod-typed content collections cross-reference each other, and every animation resolves to a readable static state on touch or reduced motion.

Signature

The hero is a paragraph of opposing-counsel boilerplate, and scrolling edits it in front of you: strikes draw left to right through the hedges, a caret opens, and the tighter replacement sentence sets itself in madder ink while margin notes accumulate down a docket rail. It is one pinned ScrollTrigger with a scrub of 1, animating CSS custom properties rather than inline styles. The section closes by lifting the content out as the green band rises to swallow the page — sequenced so text is never stranded at failing contrast.

Features

• 12 page templates — Home, Practice, Practice Area, Results, Attorneys, Attorney Bio, Insights, Insight Article, About, Contact, Legal Notices, 404
• The Redline — a scroll-scrubbed hero paragraph that strikes its own hedges through, opens a caret, and sets the tighter replacement sentence in its place
• Redline animation is driven by CSS custom properties (--strike, --caret, --insert-o) tweened with GSAP, so CSS does the painting and nothing is inline-stamped before hydration
• Margin rail — four docket-style annotations (¶ 1 to ¶ 4), one of them carrying a rule citation, that fade in at fixed positions on the same scroll timeline
• gsap.matchMedia gates the pin to fine-pointer desktop only — touch, narrow viewports and reduced motion land directly on the finished end state with no dead pin-spacer
• Two designed skins — Record (limestone) and Bench (ink) — toggled from the nav and persisted in localStorage; roles are re-designed per skin, not auto-inverted, and both are verified AA
• 5 Zod-typed content collections with cross-references — practice areas (5), attorneys (4), case results (8), authors (3), insights (5); results reference practice areas and insights reference authors
• Count-up statistics that fire correctly even when the element is already in the viewport on load
• Insights index built as a journal docket — numbered editorial rows with a volume masthead, author, date and reading time, no card grid anywhere
• Practice area pages with a green masthead band, a full-bleed architectural band that clip-wipes in, a narrow reading measure and a sticky representative-matters aside
• Long-form insight layout with a drop cap (::first-letter) and prev/next article navigation
• Contact form with a full state machine — idle, per-field validation, submitting, sent and error, each with its own designed UI
• Ruled legal-pad baseline grid on a 32px pitch as a reusable background primitive, plus float-line, float-cross and corner decals
• Cabinet Grotesk shipped as a self-hosted variable woff2 through Astro's local font provider, with Lora served by the Fontsource provider — no font CDN calls
• AVIF everywhere through Astro's image pipeline, with per-format quality tuned in the image service config (avif effort 7, webp effort 6, mozjpeg) — zero external image requests
• Lenis smooth scroll + Astro View Transitions (ClientRouter) with GSAP ScrollTrigger teardown on every navigation, TypeScript strict, zero any

Deployment