Remove phone number and redundant contact section

saadshahd · saadshahd · commit 2bac204cf749 · 2025-10-29T21:59:20.000Z
Privacy: Remove phone number (+447428240774) from resume page and markdown draft.
Remove "Find Me Online" section - GitHub/LinkedIn links already in header.

Additional refinements:
- Apply Link component to contact links across pages
- Adjust spacing consistency (mb-12 → mb-16)
- Refine Button/Badge padding for visual balance
diff --git a/resume-draft.md b/resume-draft.md
@@ -2,7 +2,7 @@
 
 **Principal Software Engineer**
 
-📧 dev.saad.shahd@gmail.com | 🐙 github.com/saadshahd | 💼 linkedin.com/in/saadshahd | 📍 London, United Kingdom | 📞 +447428240774
+📧 dev.saad.shahd@gmail.com | 🐙 github.com/saadshahd | 💼 linkedin.com/in/saadshahd | 📍 London, United Kingdom
 
 ---
 
@@ -103,8 +103,3 @@ Core team member building tools for mobile developers to ship better apps—cras
 **Proficient**: Vue, Angular, Redux, xstate, RxJS, D3, Electron
 
 ---
-
-## Find Me Online
-
-**GitHub**: https://github.com/saadshahd
-**LinkedIn**: https://linkedin.com/in/saadshahd
diff --git a/src/components/Badge.astro b/src/components/Badge.astro
@@ -3,7 +3,7 @@ import { cva, type VariantProps } from 'class-variance-authority';
 import { clsx } from 'clsx';
 
 const badge = cva(
-  'inline-flex items-center px-3 py-1 rounded-full text-sm font-medium border',
+  'inline-flex items-center px-4 py-1 rounded-full text-sm font-medium border',
   {
     variants: {
       variant: {
diff --git a/src/components/Button.astro b/src/components/Button.astro
@@ -13,9 +13,9 @@ const button = cva(
         secondary: 'bg-transparent text-text border-2 border-text-light hover:bg-text hover:text-surface hover:scale-[1.02] active:scale-[0.98]',
       },
       size: {
-        sm: 'px-3 py-1.5 text-xs md:px-4 md:py-2 md:text-sm rounded-md',
-        md: 'px-4 py-2 text-sm md:px-5 md:py-2.5 md:text-base rounded-md',
-        lg: 'px-5 py-2.5 text-sm md:px-7 md:py-3 md:text-base rounded-lg',
+        sm: 'px-2 py-1 text-xs md:px-4 md:py-2 md:text-sm rounded-md',
+        md: 'px-4 py-2 text-sm md:px-6 md:py-2 md:text-base rounded-md',
+        lg: 'px-4 py-2 text-sm md:px-6 md:py-4 md:text-base rounded-lg',
       },
     },
     defaultVariants: {
diff --git a/src/components/typography/Body.astro b/src/components/typography/Body.astro
@@ -1,7 +1,7 @@
 ---
 import { cva, type VariantProps } from 'class-variance-authority';
 
-const bodyVariants = cva('text-text-lighter text-balance', {
+const bodyVariants = cva('text-text-lighter', {
   variants: {
     size: {
       sm: 'text-sm leading-normal',              // 14px → 16.8px after scaling
diff --git a/src/pages/about.astro b/src/pages/about.astro
@@ -1,26 +1,27 @@
 ---
 import Layout from '../layouts/Layout.astro';
+import Container from '../components/Container.astro';
 import Button from '../components/Button.astro';
 import Heading from '../components/typography/Heading.astro';
 import Body from '../components/typography/Body.astro';
 import { FileText } from '@lucide/astro';
 ---
 
 <Layout title="About - Saad Shahd">
-  <div class="max-w-4xl mx-auto px-4 md:px-6 py-20">
-    <Heading level={1} as="h1" class="mb-12"><span>About</span></Heading>
+  <Container width="narrow">
+    <Heading level={1} as="h1" class="mb-16"><span>About</span></Heading>
 
-    <div class="prose prose-lg max-w-none">
+    <div>
       <Body size="lg" as="p" class="text-neutral mb-8 leading-normal">
-        I build systems for a reason—I chase the 'why' without fixating on the 'how.' Over 15 years, I developed a philosophy that makes the 'how' obvious.
+        Over 15 years, a pattern revealed itself: systems fail when we optimize for 'how' before understanding 'why.' When teams chase the right questions first, architecture emerges from constraints.
       </Body>
 
       <Body size="base" as="p" class="mb-6 leading-relaxed">
-        At Wise, I solve content collaboration at scale. Currently building editorial infrastructure that enables 20 teams to work on wise.com without friction, inconsistency, or incorrectness. The challenge isn't just technical—it's solving global→local fintech at scale: regulations differ by market, offerings vary by country, and cultural nuances matter.
+        At Wise, we're solving content collaboration for 20 teams at scale. Building editorial infrastructure that handles global→local fintech tension—regulations collide with cultural nuances, offerings vary by market. The problem space is architectural: how do we maintain coherence and developer experience when constraints multiply?
       </Body>
 
       <Body size="base" as="p" class="mb-6 leading-relaxed">
-        My approach is rooted in functional programming principles I learned the hard way—through production bugs in high-velocity startup environments at Instabug, Statsbomb, and Wise. Traditional thinking says you trade velocity for technical debt. I learned that functional thinking eliminates that trade-off entirely. When you separate behavior from state and make illegal states unrepresentable, you move fast <em>and</em> stay confident.
+        Functional programming principles emerged through production bugs at Instabug, Statsbomb, and Wise. Traditional thinking treats velocity and correctness as opposing forces. Working in high-velocity environments revealed they're complementary: when you separate behavior from state and make illegal states unrepresentable, both increase together. Still learning what's possible when architecture constrains failure.
       </Body>
 
       <Body size="base" as="p" class="mb-6 leading-relaxed">
@@ -32,14 +33,14 @@ import { FileText } from '@lucide/astro';
       </Body>
 
       <Body size="base" as="p" class="text-lg font-medium text-accent">
-        I optimize for the "why" first. The right question makes implementation obvious.
+        Curious about the 'why' first—it often reveals the 'how.'
       </Body>
 
       <!-- Resume CTA -->
-      <div class="mt-10 mb-12">
+      <div class="mt-10 mb-16">
         <Button href="/resume" variant="primary" size="md" class="gap-2">
           <FileText size={20} />
-          View Full Resume
+          Full Background
         </Button>
       </div>
 
@@ -55,5 +56,5 @@ import { FileText } from '@lucide/astro';
         <li>LLM-augmented development patterns</li>
       </Body>
     </div>
-  </div>
+  </Container>
 </Layout>
diff --git a/src/pages/blog.astro b/src/pages/blog.astro
@@ -6,7 +6,7 @@ import Body from '../components/typography/Body.astro';
 
 <Layout title="Blog - Saad Shahd">
   <div class="max-w-6xl mx-auto px-6 py-20">
-    <Heading level={1} as="h1" class="mb-12"><span>Blog</span></Heading>
+    <Heading level={1} as="h1" class="mb-16"><span>Blog</span></Heading>
     <Body size="xl" as="p" class="text-neutral mb-16">
       Technical articles on systems, architecture, and engineering practices
     </Body>
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
@@ -2,35 +2,36 @@
 import Layout from '../layouts/Layout.astro';
 import Heading from '../components/typography/Heading.astro';
 import Body from '../components/typography/Body.astro';
+import Link from '../components/Link.astro';
 ---
 
 <Layout title="Contact - Saad Shahd">
   <div class="max-w-4xl mx-auto px-4 md:px-6 py-20">
-    <Heading level={1} as="h1" class="mb-12"><span>Get in Touch</span></Heading>
+    <Heading level={1} as="h1" class="mb-16"><span>Get in Touch</span></Heading>
     <Body size="lg" as="p" class="text-neutral mb-16 leading-normal">
       Looking to collaborate on realtime systems, discuss functional thinking, or explore how to eliminate complexity before it exists? Let's talk.
     </Body>
 
     <div class="space-y-8">
       <div>
         <Heading level={2} as="h2" class="mb-2 text-accent"><span>Email</span></Heading>
-        <a href="mailto:dev.saad.shahd@gmail.com" class="text-secondary hover:underline text-lg">
+        <Link href="mailto:dev.saad.shahd@gmail.com" variant="inline" class="text-lg">
           dev.saad.shahd@gmail.com
-        </a>
+        </Link>
       </div>
 
       <div>
         <Heading level={2} as="h2" class="mb-2 text-accent"><span>LinkedIn</span></Heading>
-        <a href="https://linkedin.com/in/saadshahd" target="_blank" rel="noopener noreferrer" class="text-secondary hover:underline text-lg">
+        <Link href="https://linkedin.com/in/saadshahd" variant="external" external class="text-lg">
           linkedin.com/in/saadshahd
-        </a>
+        </Link>
       </div>
 
       <div>
         <Heading level={2} as="h2" class="mb-2 text-accent"><span>GitHub</span></Heading>
-        <a href="https://github.com/saadshahd" target="_blank" rel="noopener noreferrer" class="text-secondary hover:underline text-lg">
+        <Link href="https://github.com/saadshahd" variant="external" external class="text-lg">
           github.com/saadshahd
-        </a>
+        </Link>
       </div>
     </div>
   </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -13,20 +13,18 @@ import Body from '../components/typography/Body.astro';
       <Display level={1} as="h1" class="hero-name mb-6 leading-tight opacity-0 max-w-150 md:max-w-170">
         Saad Shahd
       </Display>
-      <Body size="lg" as="p" class="hero-title text-text mb-6 opacity-0 max-w-150 md:max-w-170">
-        Building realtime systems through functional architecture
+      <Body size="lg" as="p" class="hero-title text-text mb-6 opacity-0 max-w-150 md:max-w-170 text-balance">
+        What if systems couldn't break by design?
       </Body>
-      <Body size="base" as="p" class="hero-value text-neutral mb-12 leading-relaxed opacity-0 max-w-150 md:max-w-170 lg:text-lg">
-        I design systems where illegal states can't exist.
-        When you separate behavior from state, reliability isn't a feature—it's inevitable.
-        That's functional architecture in production.
+      <Body size="base" as="p" class="hero-value text-neutral mb-16 leading-relaxed opacity-0 max-w-150 md:max-w-170 lg:text-lg text-balance">
+        Over 15 years, patterns emerged from production systems: when you separate behavior from state and make illegal states unrepresentable, reliability stops being aspirational—it becomes structural. Exploring what's possible when architecture shapes correctness.
       </Body>
       <div class="hero-ctas flex gap-4 justify-center opacity-0">
         <Button variant="primary" size="lg" href="/portfolio">
-          View Work
+          Explore My Work
         </Button>
         <Button variant="secondary" size="lg" href="/contact">
-          Get in Touch
+          Start a Conversation
         </Button>
       </div>
     </section>
diff --git a/src/pages/portfolio.astro b/src/pages/portfolio.astro
@@ -12,16 +12,16 @@ import Body from '../components/typography/Body.astro';
     <Heading level={1} as="h1" class="mb-2"><span>Portfolio</span></Heading>
     <Body size="lg" as="p" class="text-neutral mb-8">Selected case studies showcasing technical depth and impact</Body>
 
-    <div class="grid gap-8 md:gap-12">
+    <div class="grid gap-8 md:gap-16">
       <!-- Statsbomb Case Study -->
       <Card variant="case-study" href="/portfolio/statsbomb">
         <div class="p-8">
-          <Heading level={3} as="h2" class="mb-3"><span>Statsbomb Real Time Data Collection System</span></Heading>
+          <Heading level={3} as="h2" class="mb-4"><span>Statsbomb Real Time Data Collection System</span></Heading>
           <Body size="base" as="p" class="text-neutral mb-6 leading-relaxed">
-            Designed a distributed system that reduced 90-minute match collection from 16 man-hours to 4 concurrent collectors.
-            Built a dataspec and DSL enabling PMs to define sport collection rules without engineering involvement.
-            Why did it scale? The architecture separated collection rules from execution logic. New sports became configuration, not code.
-            We never had to choose between velocity and correctness.
+            How do you collect 90-minute matches without choosing between velocity and correctness?
+            We reduced collection from 16 man-hours to 4 concurrent collectors by building a DSL that let PMs define sports rules without engineering involvement.
+            The architecture separated collection rules from execution logic—new sports became configuration, not code.
+            Lesson learned: architectural separation eliminates trade-offs that feel inevitable.
           </Body>
           <div class="flex flex-wrap gap-2 mb-4">
             <Badge variant="skill">JavaScript</Badge>
@@ -38,10 +38,12 @@ import Body from '../components/typography/Body.astro';
       <!-- Future Case Study Placeholder 1 -->
       <Card variant="case-study">
         <div class="p-8 opacity-50">
-          <Heading level={3} as="h2" class="mb-3"><span>Wise Editorial Platform</span></Heading>
+          <Heading level={3} as="h2" class="mb-4"><span>Wise Editorial Platform</span></Heading>
           <Body size="base" as="p" class="text-neutral mb-6 leading-relaxed">
-            Comprehensive content system enabling 20 teams to collaborate on wise.com.
-            Global→local fintech content at scale with maintained developer experience.
+            How do 20 teams collaborate on wise.com without friction or incorrectness?
+            Building editorial infrastructure that handles global→local fintech complexity—regulations differ by market, offerings vary by country, cultural nuances matter.
+            The challenge is architectural: coherence at scale while preserving developer experience.
+            Still exploring what content collaboration looks like at 16M+ customer scale.
           </Body>
           <div class="flex flex-wrap gap-2 mb-4">
             <Badge variant="skill">TypeScript</Badge>
diff --git a/src/pages/portfolio/statsbomb.astro b/src/pages/portfolio/statsbomb.astro
@@ -9,7 +9,7 @@ import Body from '../../components/typography/Body.astro';
 <Layout title="Statsbomb Real Time Data Collection - Saad Shahd">
   <div class="max-w-4xl mx-auto px-4 md:px-6 py-20">
     <!-- Hero Section -->
-    <div class="mb-12">
+    <div class="mb-16">
       <Button variant="secondary" href="/portfolio" class="mb-8">
         ← Back to Portfolio
       </Button>
@@ -32,7 +32,7 @@ import Body from '../../components/typography/Body.astro';
       </Body>
     </div>
 
-    <hr class="border-neutral-light my-12" />
+    <hr class="border-neutral-light my-16" />
 
     <!-- Problem Section -->
     <section class="mb-16">
@@ -90,7 +90,7 @@ import Body from '../../components/typography/Body.astro';
       </div>
     </section>
 
-    <hr class="border-neutral-light my-12" />
+    <hr class="border-neutral-light my-16" />
 
     <!-- Footer Navigation -->
     <div class="flex justify-between items-center">
diff --git a/src/pages/resume.astro b/src/pages/resume.astro
@@ -4,6 +4,7 @@ import Container from '../components/Container.astro';
 import Button from '../components/Button.astro';
 import Heading from '../components/typography/Heading.astro';
 import Body from '../components/typography/Body.astro';
+import Link from '../components/Link.astro';
 import '../styles/print-resume.css';
 ---
 
@@ -26,12 +27,11 @@ import '../styles/print-resume.css';
         </Button>
       </div>
 
-      <Body size="sm" as="div" class="flex flex-wrap gap-3 text-neutral">
-        <a href="mailto:dev.saad.shahd@gmail.com" class="hover:text-secondary-dark">dev.saad.shahd@gmail.com</a>
-        <a href="https://github.com/saadshahd" target="_blank" class="hover:text-secondary-dark">github.com/saadshahd</a>
-        <a href="https://linkedin.com/in/saadshahd" target="_blank" class="hover:text-secondary-dark">linkedin.com/in/saadshahd</a>
+      <Body size="sm" as="div" class="flex flex-wrap gap-4 text-neutral">
+        <Link href="mailto:dev.saad.shahd@gmail.com" variant="inline">dev.saad.shahd@gmail.com</Link>
+        <Link href="https://github.com/saadshahd" variant="external" external>github.com/saadshahd</Link>
+        <Link href="https://linkedin.com/in/saadshahd" variant="external" external>linkedin.com/in/saadshahd</Link>
         <span>London, United Kingdom</span>
-        <span>+447428240774</span>
       </Body>
     </div>
 
@@ -81,7 +81,7 @@ import '../styles/print-resume.css';
             </div>
             <Body size="sm" as="p" class="text-neutral">London | 03/2022 - Present</Body>
           </div>
-          <Body size="sm" as="p" class="mb-3">Building infrastructure for the world's most international account—helping 16M+ customers move money across borders.</Body>
+          <Body size="sm" as="p" class="mb-4">Building infrastructure for the world's most international account—helping 16M+ customers move money across borders.</Body>
           <Body size="base" as="ul" class="space-y-3">
             <li><strong>Increased conversion 19% through hypothesis-driven experimentation.</strong> Isolated pricing friction points through rapid A/B testing. Short iterations revealed psychological barriers traditional analytics missed—validating hunches with data, not opinions.</li>
             <li><strong>Improved team velocity 4x by eliminating accidental complexity.</strong> Refactored tangled service dependencies into composable modules with clear boundaries. Each team could now deploy independently. Reduced coordination overhead from "everyone talks to everyone" to "services talk through contracts."</li>
@@ -98,7 +98,7 @@ import '../styles/print-resume.css';
             </div>
             <Body size="sm" as="p" class="text-neutral">Bath, UK | 03/2018 - 03/2022</Body>
           </div>
-          <Body size="sm" as="p" class="mb-3">Led core data infrastructure for football analytics platform—serving Premier League clubs, international federations, and media companies.</Body>
+          <Body size="sm" as="p" class="mb-4">Led core data infrastructure for football analytics platform—serving Premier League clubs, international federations, and media companies.</Body>
           <Body size="base" as="ul" class="space-y-3">
             <li><strong>Architected realtime data streaming platform from scratch, handling 10K+ events/second.</strong> Chose event sourcing with Kafka for immutable audit trails—critical when clubs make million-pound decisions on our data. Event-driven design let us replay history, debug production issues in development, and maintain consistency across services without distributed transactions.</li>
             <li><strong>Increased data collection speed 6x through parallel processing architecture.</strong> Previous sequential pipeline became the bottleneck—one slow collector blocked everyone. Redesigned as independent stream processors with coordinated checkpoints. Tradeoff: More complex failure handling, but throughput scaled linearly with workers.</li>
@@ -116,7 +116,7 @@ import '../styles/print-resume.css';
             </div>
             <Body size="sm" as="p" class="text-neutral">Cairo, Egypt | 03/2017 - 03/2018</Body>
           </div>
-          <Body size="sm" as="p" class="mb-3">Built engagement platform for events—the leading event app provider across Middle East and North Africa.</Body>
+          <Body size="sm" as="p" class="mb-4">Built engagement platform for events—the leading event app provider across Middle East and North Africa.</Body>
           <Body size="base" as="ul" class="space-y-3">
             <li><strong>Modernized frontend stack and built event manager dashboards.</strong> Led frontend architecture decisions that enabled teams to ship features faster with better maintainability.</li>
           </Body>
@@ -131,7 +131,7 @@ import '../styles/print-resume.css';
             </div>
             <Body size="sm" as="p" class="text-neutral">Cairo, Egypt | 11/2015 - 08/2016</Body>
           </div>
-          <Body size="sm" as="p" class="mb-3">Core team member building tools for mobile developers to ship better apps—crash reporting, user feedback, and performance monitoring.</Body>
+          <Body size="sm" as="p" class="mb-4">Core team member building tools for mobile developers to ship better apps—crash reporting, user feedback, and performance monitoring.</Body>
           <Body size="base" as="ul" class="space-y-3">
             <li><strong>Built realtime crash reporting dashboard processing 100K+ events daily.</strong> Designed client SDK for minimal performance overhead while capturing rich debugging context. Challenge: Collect enough data to reproduce bugs without impacting app performance—solved through smart sampling, local aggregation, and batched uploads.</li>
           </Body>
@@ -177,14 +177,5 @@ import '../styles/print-resume.css';
         </div>
       </div>
     </section>
-
-    <!-- Find Me Online -->
-    <section>
-      <Heading level={1} as="h2" class="mb-6 text-text"><span>Find Me Online</span></Heading>
-      <div class="space-y-2">
-        <Body size="sm" as="p"><strong>GitHub:</strong> <a href="https://github.com/saadshahd" target="_blank" class="text-secondary hover:text-secondary-dark hover:underline">github.com/saadshahd</a></Body>
-        <Body size="sm" as="p"><strong>LinkedIn:</strong> <a href="https://linkedin.com/in/saadshahd" target="_blank" class="text-secondary hover:text-secondary-dark hover:underline">linkedin.com/in/saadshahd</a></Body>
-      </div>
-    </section>
   </Container>
 </Layout>

Original file line number	Diff line number	Diff line change
`@@ -3,7 +3,7 @@ import { cva, type VariantProps } from 'class-variance-authority';`
`3`	`3`	`import { clsx } from 'clsx';`
`4`	`4`
`5`	`5`	`const badge = cva(`
`6`		`- 'inline-flex items-center px-3 py-1 rounded-full text-sm font-medium border',`
	`6`	`+ 'inline-flex items-center px-4 py-1 rounded-full text-sm font-medium border',`
`7`	`7`	`{`
`8`	`8`	`variants: {`
`9`	`9`	`variant: {`