docs: enhance FeatureContentFirst component with macOS immersive mode details and add maximize icon to LucideIcon

Author: moonrailgun

website/components/FeatureContentFirst.tsx

@@ -6,10 +6,11 @@ export function FeatureContentFirst() {
     <FeatureSection
       eyebrow="04 / CONTENT FIRST"
       heading="The web, with more room to breathe."
-      body="We work hard to give you more space for the content that matters. Read, watch, and create with the maximum of your screen — not the maximum of the browser around it."
+      body="We work hard to give you more space for the content that matters. Read, watch, and create with the maximum of your screen — not the maximum of the browser around it. On macOS immersive mode, the chrome melts away entirely, giving you a true full-screen web canvas — like F11, but native."
       bullets={[
         { icon: 'panel-left', label: 'Collapsible sidebar' },
         { icon: 'columns-2', label: 'Edge-to-edge canvas' },
+        { icon: 'maximize', label: 'macOS immersive mode' },
         { icon: 'palette', label: 'Adapts to the page' },
       ]}
       customVisual={<ContentFirstVisual />}

website/components/ui/LucideIcon.tsx

@@ -32,7 +32,8 @@ export type IconName =
   | 'download'
   | 'star'
   | 'arrow-right'
-  | 'clock';
+  | 'clock'
+  | 'maximize';
 
 const ICON_PATHS: Record<IconName, ReactNode> = {
   'panel-left': (
@@ -182,6 +183,14 @@ const ICON_PATHS: Record<IconName, ReactNode> = {
       <path d="M12 6v6l4 2" />
     </>
   ),
+  maximize: (
+    <>
+      <path d="M8 3H5a2 2 0 0 0-2 2v3" />
+      <path d="M21 8V5a2 2 0 0 0-2-2h-3" />
+      <path d="M3 16v3a2 2 0 0 0 2 2h3" />
+      <path d="M16 21h3a2 2 0 0 0 2-2v-3" />
+    </>
+  ),
 };
 
 export interface LucideIconProps {