Explore fixes (#4540)

* Use safe check, check for next page, handle varied lengths

* Fix border width

* Move safe check

* Add font_heavy and use it on the explore page headers

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>

src/alf/atoms.ts

@@ -267,6 +267,9 @@ export const atoms = {
   font_bold: {
     fontWeight: tokens.fontWeight.bold,
   },
+  font_heavy: {
+    fontWeight: tokens.fontWeight.heavy,
+  },
   italic: {
     fontStyle: 'italic',
   },

src/alf/tokens.ts

@@ -118,6 +118,7 @@ export const fontWeight = {
   normal: '400',
   semibold: '500',
   bold: '600',
+  heavy: '700',
 } as const
 
 export const gradients = {