Mobile QA fixes, responsive big-type assets, and partner updates

src/app/page.tsx

@@ -34,10 +34,15 @@ export default function Home() {
       <section id="hero" className="bg-brand-navy">
         <div className="mx-auto flex w-full max-w-[1200px] flex-col items-center px-6 pb-6 pt-20">
           <img src="/assets/logo.svg" alt="Hey Mamdani!" className="relative z-10 w-full max-w-[1100px]" fetchPriority="high" decoding="async" />
+          <img
+            src="/assets/now-is-the-time-mobile.svg"
+            alt="NOW is the time to reimagine our city's relationship with technology."
+            className="-mt-2 block w-full md:hidden"
+          />
           <img
             src="/assets/now-is-the-time.svg"
             alt="NOW is the time to reimagine our city's relationship with technology."
-            className="-mt-2 w-full max-w-[900px] md:-mt-12 lg:-mt-24"
+            className="hidden w-full max-w-[900px] md:-mt-12 md:block lg:-mt-24"
           />
         </div>
       </section>
@@ -46,7 +51,8 @@ export default function Home() {
         <div className="mx-auto flex w-full max-w-[1200px] items-stretch justify-between gap-4 px-6 pt-6 md:gap-10 md:pt-8">
           <div className="flex items-center pb-6 md:pb-8">
             <p className="font-serif text-3xl font-bold leading-[1.05] tracking-[-0.06em] md:text-5xl lg:text-6xl">
-              &ldquo;Working New Yorkers know what they need to thrive&rdquo;
+              &ldquo;Working New Yorkers know what they need{" "}
+              <span className="whitespace-nowrap">to thrive&rdquo;</span>
               <span className="mt-2 block font-serif text-lg italic tracking-[-0.06em] md:mt-3 md:text-2xl lg:text-3xl">
                 Mayor Zohran Kwame Mamdani
               </span>
@@ -56,7 +62,7 @@ export default function Home() {
             src="/assets/portrait.svg"
             alt=""
             aria-hidden
-            className="h-32 w-auto shrink-0 self-end sm:h-44 md:h-56 lg:h-72"
+            className="h-44 w-auto shrink-0 self-end sm:h-56 md:h-72 lg:h-96"
             loading="lazy"
             decoding="async"
           />
@@ -65,18 +71,33 @@ export default function Home() {
 
       <section className="bg-brand-lavender text-brand-navy">
         <div className="mx-auto w-full max-w-[1200px] px-6 py-10">
+          <a
+            href="mailto:hello@heymamdani.nyc"
+            aria-label="Email hello@heymamdani.nyc"
+            className="block md:hidden"
+          >
+            <img
+              src="/assets/hey-zohran-mobile.svg"
+              alt="Hey Zohran, we want to help make civic technology awesome. Please email us: hello@heymamdani.nyc"
+              className="block w-full"
+              loading="lazy"
+              decoding="async"
+            />
+          </a>
           <img
             src="/assets/hey-zohran-big.svg"
             alt="Hey Zohran, we want to help make civic technology awesome."
-            className="block w-full"
+            className="hidden w-full md:block"
             loading="lazy"
             decoding="async"
           />
-          <FitText className="block font-display font-black leading-none tracking-tight">
-            <a href="mailto:hello@heymamdani.nyc" className="underline">
-              HELLO@HEYMAMDANI.NYC
-            </a>
-          </FitText>
+          <div className="hidden md:block">
+            <FitText className="block font-display font-black leading-none tracking-tight">
+              <a href="mailto:hello@heymamdani.nyc" className="underline">
+                HELLO@HEYMAMDANI.NYC
+              </a>
+            </FitText>
+          </div>
           <PartnersStrip className="mt-8 text-brand-navy" />
         </div>
       </section>
@@ -157,7 +178,7 @@ export default function Home() {
         </div>
       </section>
 
-      <section className="relative overflow-hidden bg-brand-red bg-[url('/assets/step-and-repeat.svg')] bg-[length:400px_auto] bg-repeat py-20 md:py-28">
+      <section className="relative overflow-hidden bg-brand-red bg-[url('/assets/step-and-repeat.svg')] bg-[length:400px_auto] bg-repeat py-32 md:py-40">
         <div className="relative mx-auto w-full max-w-[1200px] px-6">
           <div className="relative mx-auto max-w-[700px]">
             <img
@@ -166,31 +187,31 @@ export default function Home() {
               aria-hidden
               loading="lazy"
               decoding="async"
-              className="absolute -top-20 left-[12%] z-10 w-32 -rotate-12"
+              className="absolute -top-20 left-[4%] z-10 w-24 -rotate-12 md:w-28"
             />
             <img
               src="/assets/cat.svg"
               alt=""
               aria-hidden
               loading="lazy"
               decoding="async"
-              className="absolute -right-6 top-[4%] z-10 w-20 rotate-6 md:-right-12 md:top-[8%] md:w-32"
+              className="absolute -top-20 right-[4%] z-10 w-24 rotate-6 md:w-28"
             />
             <img
               src="/assets/pizza.svg"
               alt=""
               aria-hidden
               loading="lazy"
               decoding="async"
-              className="absolute -bottom-14 left-[40%] z-10 w-28 rotate-6"
+              className="absolute -bottom-20 right-[4%] z-10 w-24 rotate-6 md:w-28"
             />
             <img
               src="/assets/rat.svg"
               alt=""
               aria-hidden
               loading="lazy"
               decoding="async"
-              className="absolute -left-6 bottom-[6%] z-10 w-20 -rotate-6 md:-left-12 md:bottom-[10%] md:w-28"
+              className="absolute -bottom-20 left-[4%] z-10 w-24 -rotate-6 md:w-28"
             />
             <div className="relative border-8 border-black bg-white p-4 text-black md:p-8">
               <h2 className="whitespace-nowrap text-5xl font-bold leading-none tracking-[-0.04em] md:text-6xl">
@@ -211,8 +232,8 @@ export default function Home() {
                   { label: "Regulate Self-driving Taxis" },
                   { label: "Run a Food Rescue Platform" },
                 ].map((item, i) => (
-                  <li key={item.label} className="flex items-center gap-3">
-                    <span className="flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-black text-sm text-white">
+                  <li key={item.label} className="flex items-start gap-3">
+                    <span className="mt-[0.15em] flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-black text-sm text-white">
                       {i + 1}
                     </span>
                     {item.href ? (
@@ -274,7 +295,7 @@ export default function Home() {
             .map((p, i) => (
               <div
                 key={p.name}
-                className="flex w-[85vw] max-w-[400px] shrink-0 snap-start flex-col border-8 border-black bg-white p-5 text-brand-yellow md:p-6"
+                className="flex w-[85vw] max-w-[400px] shrink-0 snap-start flex-col border-8 border-black bg-white p-5 text-black md:p-6"
               >
                 <div className="text-[18pt] font-bold leading-[22pt] tracking-[-0.04em] md:text-[25pt] md:leading-[28pt]">
                   {String(i + 1).padStart(2, "0")}
@@ -300,18 +321,33 @@ export default function Home() {
 
       <section className="bg-black text-brand-yellow">
         <div className="mx-auto w-full max-w-[1200px] px-6 py-10 text-center">
+          <a
+            href="mailto:hello@heymamdani.nyc"
+            aria-label="Email hello@heymamdani.nyc"
+            className="block md:hidden"
+          >
+            <img
+              src="/assets/we-can-help-mobile.svg"
+              alt="We can help. Please email: hello@heymamdani.nyc"
+              className="block w-full"
+              loading="lazy"
+              decoding="async"
+            />
+          </a>
           <img
             src="/assets/we-can-help-big.svg"
             alt="We can help"
-            className="block w-full"
+            className="hidden w-full md:block"
             loading="lazy"
             decoding="async"
           />
-          <FitText className="block font-display font-black leading-none tracking-tight">
-            <a href="mailto:hello@heymamdani.nyc" className="underline">
-              HELLO@HEYMAMDANI.NYC
-            </a>
-          </FitText>
+          <div className="hidden md:block">
+            <FitText className="block font-display font-black leading-none tracking-tight">
+              <a href="mailto:hello@heymamdani.nyc" className="underline">
+                HELLO@HEYMAMDANI.NYC
+              </a>
+            </FitText>
+          </div>
           <PartnersStrip className="mt-8 text-brand-yellow" />
         </div>
       </section>

src/data/partners.json

@@ -24,10 +24,19 @@
       "partner": true,
       "participant": true
     },
+    {
+      "name": "Metagov",
+      "url": "https://metagov.org",
+      "logo": "/partners/metagov.svg",
+      "description": "Metagov is a community of research and practice gathered around the mission to cultivate tools, practices, and communities that enable self-governance in the digital age.",
+      "partner": true,
+      "participant": true
+    },
     {
       "name": "Decentral Park",
       "url": "https://decentralpark.nyc",
       "logo": "/partners/decentralpark.svg",
+      "scale": 2.0,
       "description": "Decentral Park is a NYC-based progressive tech collective convening organizers, professionals, and civic stakeholders to advance cooperative economics and implement civic tools.",
       "partner": true,
       "participant": true
@@ -40,13 +49,6 @@
       "partner": true,
       "participant": false
     },
-    {
-      "name": "Metagov",
-      "url": "https://metagov.org",
-      "logo": "/partners/metagov.svg",
-      "partner": false,
-      "participant": true
-    },
     {
       "name": "New_ Public",
       "url": "https://newpublic.org",