Rebuild core UI shell and homepage for a cleaner responsive design while preserving light/dark/system theming

[Copilot]

This PR reworks the site’s primary UI shell and homepage to be simpler, cleaner, and more consistent across desktop/mobile. It preserves and hardens the existing theme behavior (light, dark, and system auto) while reducing animation/styling complexity that could cause visual glitches.

• Layout shell refresh (header/nav/footer)

  • Simplified top navigation with clearer visual hierarchy.
  • Added active-route highlighting for nav links.
  • Added a mobile navigation menu toggle with proper expanded/collapsed state.
  • Kept footer structure intact.

• Theme system retained and tightened

  • Preserved 3-mode theme cycle: light -> dark -> system.
  • Improved resilience around storage access and mode restoration.
  • Updated theme toggle labeling to reflect current mode and next action.
  • Continued system-theme sync via prefers-color-scheme in system mode.

• Homepage redesign

  • Replaced the dense custom hero implementation with a cleaner, card-based layout.
  • Kept key content signals (latest project, latest post, counts) but with simpler structure and spacing.
  • Improved mobile readability and action clarity (Projects/Blog/Contact CTAs).

• CSS simplification to reduce rendering risk

  • Removed large bespoke hero styling and first-load navbar animation complexity.
  • Limited global transitions to interactive elements (a, button) rather than applying to all nodes.
  • Kept lightweight reusable motion utilities for subtle, stable animations.

<button
  id="ps-theme-btn"
  aria-label={`Theme: ${modeLabel}. Activate to switch to ${nextModeLabel}.`}
>
  <!-- light / dark / system icon -->
</button>

• Desktop: https://github.com/user-attachments/assets/2fc44666-3890-486e-947b-619700bc45f5
• Mobile (dark): https://github.com/user-attachments/assets/afa5b9cc-c1dc-4431-8604-61da214b8749

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• telemetry.astro.build
  • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node node /home/REDACTED/work/paulsavvas.me/paulsavvas.me/node_modules/.bin/astro build (dns block)
  • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node node /home/REDACTED/work/paulsavvas.me/paulsavvas.me/node_modules/.bin/astro dev --host 0.0.0.0 --port 4321 (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
paulsavvas-me	Ready	Preview, Comment	Apr 7, 2026 0:20am
paulsavvas.com	Ready	Preview, Comment	Apr 7, 2026 0:20am