How it works

• Each letter is one closed outline in M3Brand's themeable file (layers m3c-m, m3c-three, m3c-c); its path is traced with stroke-dasharray and pathLength="1" (stroke-dashoffset 1 → 0), painted like its fill.
• Sequential: the M, a short gap, the 3, a short gap, the C; the fill and the caption fade in after the last stroke while the outlines fade out. Mirrored: all three at once, the 3 from the other end.
• Speed follows the Silk draw: each letter 0.6 of its outline time (4.5 / 2.8 / 1.4 s), fill 1.2 / 0.8 / 0.5 s — a run takes as long as Silk's.
• The fill is the file itself, inlined: nothing is rasterised, and its colours are CSS variables (brand palette, dark palette, or the theme with Logo Colours = Theme).