feat: add dark mode coloring palette and luminous moon illustration

src/components/ScenicHeroJourney.tsx

@@ -3,31 +3,21 @@
 import React from 'react';
 import { HeroSection } from './HeroSection';
 import { RiverJourney } from './RiverJourney';
+import {
+  HeroIllustrationLeft,
+  HeroIllustrationRight,
+  HeroIllustrationSun,
+  HeroIllustrationMoon,
+} from './HeroIllustrations';
 import styles from './ScenicHeroJourney.module.css';
 
-type BackdropImgProps = {
-  name: 'left' | 'right' | 'sun';
-  className: string;
-};
-
-function BackdropImg({ name, className }: BackdropImgProps) {
-  return (
-    <img
-      src={`/assets/bg-illustrations/${name}.svg`}
-      alt=""
-      aria-hidden="true"
-      draggable={false}
-      className={className}
-    />
-  );
-}
-
 function HeroBackdrop() {
   return (
     <div className={styles.heroBackdrop} aria-hidden="true">
-      <BackdropImg name="left"  className={styles.backdropLeft} />
-      <BackdropImg name="right" className={styles.backdropRight} />
-      <BackdropImg name="sun"   className={styles.backdropSun} />
+      <HeroIllustrationLeft className={styles.backdropLeft} />
+      <HeroIllustrationRight className={styles.backdropRight} />
+      <HeroIllustrationSun className={styles.backdropSun} />
+      <HeroIllustrationMoon className={styles.backdropMoon} />
     </div>
   );
 }