Randomize homepage “Free and open source” quote with client-side quote pool

[Copilot]

The homepage “Free and open source” section currently renders a single static statement. This change introduces a small curated quote pool and rotates the displayed quote per visit while preserving the existing layout and interaction model.

• Component behavior update (FreeAndOpenSourceAside.astro)

  • Replaced the single static line with an in-code pool of 5 short Aspire positioning quotes.
  • Added an inline client script to select a random quote at runtime so different visits can see different copy.
  • Kept the DOM structure/styling of the section intact (title + one paragraph).

• Accessibility hardening

  • Added aria-live="polite" to the quote paragraph so assistive tech can announce updated text appropriately.
  • Switched to a stable selector (document.querySelector('[data-random-aspire-quote]')) for quote target lookup.

• Focused test updates (custom-components.vitest.test.ts)

  • Updated existing FreeAndOpenSourceAside coverage to assert localized title rendering.
  • Added targeted assertions that the randomization hook and quote pool are emitted in rendered output.

<p data-random-aspire-quote aria-live="polite">{aspireQuotes[0]}</p>

<script is:inline define:vars={{ aspireQuotes }}>
  const quotes = aspireQuotes;
  const quoteElement = document.querySelector('[data-random-aspire-quote]');
  if (quoteElement instanceof HTMLElement) {
    quoteElement.textContent = quotes[Math.floor(Math.random() * quotes.length)];
  }
</script>