fix: search bar now takes full width

app/about/page.tsx

@@ -8,8 +8,8 @@ import {
   BrainCircuit,
   Blocks,
   Circle,
-  CheckCircle2,
   CircleCheck,
+  Clock
 } from "lucide-react";
 
 const PHASES = [
@@ -32,13 +32,13 @@ const PHASES = [
     status: "in-progress" as const,
     icon: Users,
     description:
-      "Adding user-centric features so devotees can engage with the archive personally — sign in, save favourite quotes, build collections, share with attribution, and mention passages in their own writing.",
+      "Adding user-centric features so devotees can engage with the archive personally — sign in, save favourite quotes, build collections, share with attribution, and tag someone to a specific text.",
     highlights: [
       "Account sign-in and personal profiles",
       "Save and organise quotes into collections",
       "Share quotes with rich attribution and highlight links",
       "Bookmark verses, letters, and lectures for later reading",
-      "Mention passages — reference any line in the archive from outside the site",
+      "Mention on text — tag someone to look into your selected text",
     ],
   },
   {
@@ -193,7 +193,7 @@ export default function AboutPage() {
                         </span>
                       ) : isInProgress ? (
                         <span className="inline-flex items-center gap-1.5 rounded-full bg-primary/10 px-2.5 py-0.5 text-xs font-medium text-primary">
-                          <CheckCircle2 className="size-3" />
+                          <Clock className="size-3" />
                           In Progress
                         </span>
                       ) : (

components/page-header.tsx

@@ -63,13 +63,14 @@ export function PageHeader({
         <div
           className={cn(
             "flex items-center gap-1.5",
-            // Mobile: float so the title text wraps around it
-            "max-md:float-right max-md:ml-2",
             // Desktop: inline at the right of the flex row
             "md:pt-1 md:order-1",
+            // Mobile float (for title wrapping) only applies when collapsed.
+            // When expanded the search bar fills the full header width and
+            // should NOT have a left margin or be floated.
             searchExpanded
-              ? "max-md:float-none max-md:flex max-md:w-full max-md:min-w-0"
-              : "md:shrink-0",
+              ? "max-md:w-full max-md:min-w-0"
+              : "max-md:float-right max-md:ml-2 md:shrink-0",
           )}
         >
           <HeaderSearchButton