Brand guidelines
Line and light
The brand is built from very little: one-pixel hairlines that hold everything in place, and one kind of light, a soft glow from the middle of an Evergreen ground, like early light on the harbor. The brand moves only through its logo films.
01 · Line
Hairlines do the structure.
Every card, row and divider is a one-pixel line in the border role: Evergreen at 12% on light grounds, Mint at 20% on dark. A line darkens one step on hover. Thicker lines appear only where they carry meaning.
Hairline · 1px
Rows, cards, dividers; the darker one on hover.
The cut
A hairline may run from a label to the edge, like the wordmark's angled cuts.
Underline · 2px
The chosen tab.
Focus · 2px Sea glass
FocusedThe focus ring, and progress from Mint to Current.
02 · Light
One light: a glow from the middle.
The home statement, the share card and the guide's dark panels are lit the same way: Evergreen brightening to its 700 step at the center, deepening to 900 at the edges. Sea glass glows softly behind the phone. Cards cast no shadow; only menus, dialogs and toasts float.
The lit panel
radial-gradient(ellipse 70% 80% at 50% 46%, #1F4642, #153936 58%, #0F2B29)
The Sea glass glow
Sea glass at 32%, blurred 48px, behind the phone only
The one shadow
0 1px 2px / 6%, 0 8px 24px -12px / 12%, tinted Evergreen
03 · Logo films
The family's own animations.
The motion that carries the brand is the 2025 logo animations, as they were made: each company's mark drawn in one stroke, and the morph that turns every mark into the next. They are re-colored only, Mint on Evergreen or Evergreen on Paper, by scripts/brand/logo-films.mjs. They play once when reached (the morph loops), and hold on the finished mark for reduced motion.
In each company's own line color, from its brand tokens, for the company panels on the home page and Subsidiaries. The day films are cut on pure white and the night films on pure black, and blended onto the panel (darken by day, lighten at night), so the line sits on the panel's own color with no edge. The home stage uses the same films cut on black (hero-*), screened over the dark ground as the marks spiral in.
