feat(header): place WRNexus nav item directly after Home

Reorder the shared navLinks array so 'WRNexus' renders as the second
item (right after Home) in both the desktop menubar and the mobile menu
panel. The mobile menu panel already includes a top-right cross close
icon (#mobile-menu-close, aria-label="Close menu") wired to closeMenu().

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/components/Header.astro

@@ -30,7 +30,11 @@ const currentPath = Astro.url.pathname;
   ]}
   id="main-header"
 >
-  <div class="container-wrapper">
+  <!-- Full-bleed inner wrapper: the header background already spans the full
+       viewport (the <header> is fixed left-0 right-0); this inner row stretches
+       edge-to-edge too, keeping only responsive horizontal padding so the logo
+       and nav never touch the screen edges and stay legible down to 360px. -->
+  <div class="w-full px-4 sm:px-6 lg:px-8 xl:px-12">
     <nav class="flex items-center justify-between h-16 lg:h-20" aria-label="Main navigation">
       <!-- Logo -->
       <a href="/" class="flex items-center gap-2 group" aria-label="WorkRoot IT Solutions LLP - Home">

src/pages/index.astro

@@ -19,6 +19,7 @@ const services = [
     outcome: 'Ship a fast, SEO-ready web product your customers actually convert on.',
     description: 'Angular, React, Next.js, Astro frontends backed by Spring Boot APIs — built for speed, scale, and search visibility.',
     features: ['Angular/React/Next.js', 'Spring Boot APIs', 'Astro Static Sites'],
+    cta: 'Discuss your web project',
   },
   {
     icon: 'smartphone',
@@ -27,6 +28,7 @@ const services = [
     outcome: 'Launch on iOS and Android from a single codebase — without the native-team overhead.',
     description: 'Cross-platform React Native and Expo apps with offline-first sync, push notifications, and store-ready builds.',
     features: ['React Native / Expo', 'iOS & Android', 'Offline-First Apps'],
+    cta: 'Discuss your mobile app',
   },
   {
     icon: 'brain',
@@ -35,6 +37,7 @@ const services = [
     outcome: 'Replace spreadsheets and ageing tools with one system your operations team trusts.',
     description: 'Custom ERP, CRM, and admin platforms designed around your real workflows — already running in universities and government bodies.',
     features: ['University Management', 'Police Management', 'Crematorium SCMS'],
+    cta: 'Discuss your ERP project',
   },
   {
     icon: 'cloud',
@@ -43,6 +46,7 @@ const services = [
     outcome: 'Roll out secure, compliant platforms across districts without rewriting them for each one.',
     description: 'Multi-district deployments with role-based access, audit trails, and the uptime public services require.',
     features: ['Multi-District Deployments', 'Secure & Compliant', 'High Availability'],
+    cta: 'Discuss your government project',
   },
 ];
 
@@ -191,7 +195,11 @@ const techStack = [
       <div class="absolute inset-0 bg-gradient-to-b from-transparent via-transparent to-secondary-900/50"></div>
     </div>
 
-    <div class="container-wrapper relative z-10 py-24 lg:py-32">
+    <!-- Full-bleed hero content: the <section> gradient already spans the full
+         viewport; this wrapper stretches edge-to-edge (no max-width cap) with
+         responsive horizontal padding so the copy + lead form stay padded and
+         readable from 360px up to ultra-wide displays. -->
+    <div class="w-full px-4 sm:px-6 lg:px-8 xl:px-12 relative z-10 py-14 sm:py-20 lg:py-32">
       <div class="grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-16 items-center">
         <!-- Left column — copy + CTAs -->
         <div class="text-center lg:text-left">
@@ -214,11 +222,11 @@ const techStack = [
         </p>
 
         <!-- Dual CTA Buttons — action verb + clear secondary -->
-        <div class="mt-10 flex flex-wrap justify-center lg:justify-start gap-4 opacity-0 animate-slide-up" style="animation-delay: 0.8s;">
+        <div class="mt-8 sm:mt-10 flex flex-col sm:flex-row sm:flex-wrap justify-center lg:justify-start gap-3 sm:gap-4 opacity-0 animate-slide-up" style="animation-delay: 0.8s;">
           <a
             href="/contact?source=hero"
             data-cta="hero-primary"
-            class="group inline-flex items-center justify-center rounded-xl bg-gradient-to-r from-primary-500 to-primary-600 px-10 py-5 text-lg font-bold text-white transition-all hover:shadow-2xl hover:shadow-primary/50 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-primary-400 focus:ring-offset-2 focus:ring-offset-secondary-900"
+            class="group inline-flex w-full sm:w-auto items-center justify-center rounded-xl bg-gradient-to-r from-primary-500 to-primary-600 px-8 sm:px-10 py-4 sm:py-5 text-lg font-bold text-white transition-all hover:shadow-2xl hover:shadow-primary/50 sm:hover:scale-105 focus:outline-none focus:ring-2 focus:ring-primary-400 focus:ring-offset-2 focus:ring-offset-secondary-900"
           >
             Get my free proposal
             <svg class="ml-2 w-5 h-5 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
@@ -228,7 +236,7 @@ const techStack = [
           <a
             href="/portfolio"
             data-cta="hero-secondary"
-            class="group inline-flex items-center justify-center rounded-xl border-2 border-white/30 bg-white/5 backdrop-blur-sm px-10 py-5 text-lg font-bold text-white transition-all hover:bg-white/10 hover:border-white/50 focus:outline-none focus:ring-2 focus:ring-white/50 focus:ring-offset-2 focus:ring-offset-secondary-900"
+            class="group inline-flex w-full sm:w-auto items-center justify-center rounded-xl border-2 border-white/30 bg-white/5 backdrop-blur-sm px-8 sm:px-10 py-4 sm:py-5 text-lg font-bold text-white transition-all hover:bg-white/10 hover:border-white/50 focus:outline-none focus:ring-2 focus:ring-white/50 focus:ring-offset-2 focus:ring-offset-secondary-900"
           >
             <svg class="mr-2 w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
               <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
@@ -279,7 +287,7 @@ const techStack = [
         </p>
 
         <!-- Micro-trust line under CTAs -->
-        <p class="mt-6 text-sm sm:text-base text-secondary-300 opacity-0 animate-slide-up flex flex-wrap items-center justify-center lg:justify-start gap-x-3 gap-y-2" style="animation-delay: 0.9s;" aria-label="Trust signals">
+        <p class="mt-6 text-sm sm:text-base text-secondary-300 opacity-0 animate-slide-up flex flex-wrap items-center justify-center lg:justify-start gap-x-3 gap-y-2" style="animation-delay: 0.95s;" aria-label="Trust signals">
           <span class="inline-flex items-center gap-2">
             <svg class="w-4 h-4 text-accent-400" fill="currentColor" viewBox="0 0 20 20" aria-hidden="true">
               <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/>