look: fix scrolling to sections

This fixes:

1. The inability to scroll down to 'contacts' and other lower sections.
   We just expand the second-to-last section to allow the browser to
   scroll.
2. Updating the currently active section - this now uses a global view
   of all visible sections that is updated by the observer diff, thereby
   fixing the logic.

src/components/landing-page.tsx

@@ -51,7 +51,7 @@ function NewSection({
   after?: ReactElement;
 }) {
   return (<section id={id} className="bg-background">
-    <div className="container mx-auto px-4 gap-6 flex flex-col mt-20">
+    <div className="container mx-auto px-4 gap-6 flex flex-col">
       {children}
       {after}
     </div>

src/globals.css

@@ -160,3 +160,8 @@
 section#contact {
   min-height: 100vh;
 }
+
+/* Fix scrolling to section by fragment, making sure it shows in the right spot and not behind the navbar. */
+section {
+  scroll-margin-top: calc(var(--spacing) * 16 + var(--spacing) * 4);
+}