The desktop lattice is a 5–4–5 habit on ten columns. That packing, plus gap hover, does not survive a 390px screen: crystals shrink, and sticky :hover fights tap. These frames keep the same crystals and the crystal-to-lightbox open. Nothing here is wired to the homepage yet.
A
Today
Current lattice CSS in a phone column. Ten-column packing, reduced padding. This is the problem, not a proposal.
control
B
Spine
Same hexagonal habit, fewer columns: 3–2–3–2–2 on a six-column grid. The field scrolls with the page. Tap opens the lightbox. This is the one I would ship.
3–2–3 packing
C
Ribbon
One crystal at a readable size, neighbors peeking. Horizontal snap. Closest to a carousel without abandoning the crystal silhouette.
snap · ~68cqw
D
Brick
Two-up rows, every other row shifted by one cell so the hexes nest. Dense, easy to scan, a little more masonry than mineral.
staggered 2-up
E
Specimen
Lead with one large crystal, then a compact 3–2–3 of the rest. Hierarchy first, habit second. Useful if the homepage needs a hero on small screens.