feat(footer): implement responsive 3D isometric SVG footer scene with theme tokens

src/components/FooterSection.module.css

@@ -1,195 +1,14 @@
 .footerSection {
   position: relative;
+  isolation: isolate;
   width: 100%;
-  max-width: var(--layout-frame);
-  height: 34rem;
-  overflow: hidden;
+  max-width: var(--layout-frame, 1440px);
+  min-height: auto;
+  height: auto;
+  overflow: visible;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
-  background-color: var(--bg-page);
-}
-
-.bgContainer {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 34rem;
-  z-index: 1;
-}
-
-.bgImage {
-  object-fit: cover;
-  object-position: bottom center;
-  animation: footerArtworkDrift 12s var(--motion-ease-in-out) infinite alternate;
-}
-
-@keyframes footerArtworkDrift {
-  to { transform: scale(1.025) translateY(0.25rem); }
-}
-
-.content {
-  position: relative;
-  z-index: 10;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  text-align: center;
-  margin-top: 5.25rem;
-}
-
-.ctaTitle {
-  font-size: var(--font-size-display-footer);
-  line-height: var(--line-height-display-footer);
-  color: var(--text-primary);
-  margin-bottom: 0.75rem;
-  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
-}
-
-.ctaSubtitle {
-  font-size: var(--font-size-body-large);
-  line-height: var(--line-height-body-large);
-  color: var(--text-secondary);
-  font-weight: 500;
-  letter-spacing: var(--letter-spacing-eyebrow);
-  margin-bottom: 1.25rem;
-}
-
-.emailButton {
-  min-height: 3rem;
-  margin-bottom: 2rem;
-}
-
-.socialRow {
-  display: flex;
-  align-items: center;
-  gap: 3rem;
-}
-
-.socialItem {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 0.75rem;
-  color: var(--text-primary);
-  text-decoration: none;
-  transition:
-    color var(--motion-duration-fast) ease,
-    transform var(--motion-duration-default) var(--motion-ease-out);
-  min-width: 5rem;
-  min-height: 4.75rem;
-}
-
-.socialItem:focus-visible {
-  outline: 2px solid var(--focus-ring);
-  outline-offset: 6px;
-  border-radius: var(--radius-sm);
-}
-
-.socialIcon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 3rem;
-  height: 3rem;
-  transition: transform var(--motion-duration-default) var(--motion-ease-out);
-}
-
-.socialIcon svg {
-  display: block;
-  width: 100%;
-  height: 100%;
-  fill: currentColor;
-  stroke: none;
-}
-
-.socialIcon .giteaCutout {
-  fill: var(--bg-page);
-}
-
-.socialLabel {
-  font-size: var(--font-size-body-small);
-  line-height: var(--line-height-body-small);
-  font-weight: 600;
-  color: var(--text-primary);
-}
-
-@media (max-width: 900px) {
-  .footerSection {
-    height: auto;
-    min-height: 34rem;
-    padding: var(--space-10) var(--layout-page-gutter) var(--space-9);
-  }
-
-  .bgContainer {
-    height: 100%;
-  }
-
-  .content {
-    width: 100%;
-    margin-top: 0;
-  }
-
-  .socialRow {
-    flex-wrap: wrap;
-    justify-content: center;
-    gap: var(--space-6) var(--space-8);
-  }
-}
-
-@media (max-width: 560px) {
-  .footerSection {
-    min-height: 38rem;
-    padding-top: var(--space-9);
-  }
-
-  .ctaTitle {
-    font-size: 2.25rem;
-    line-height: 2.875rem;
-  }
-
-  .ctaSubtitle {
-    max-width: 18.75rem;
-    margin-bottom: var(--space-7);
-    font-size: var(--font-size-body-default);
-    line-height: var(--line-height-body-default);
-    letter-spacing: 0.08em;
-  }
-
-  .emailButton {
-    width: 100%;
-    max-width: 20rem;
-  }
-
-  .socialRow {
-    display: grid;
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-    width: 100%;
-    gap: var(--space-6) var(--space-4);
-  }
-
-  .socialLabel {
-    overflow-wrap: anywhere;
-  }
-}
-
-@media (hover: hover) and (pointer: fine) {
-  .socialItem:hover {
-    color: var(--accent-default);
-    transform: translateY(-2px);
-  }
-
-
-  .socialItem:hover .socialIcon {
-    transform: translateY(-2px) scale(1.05);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .bgImage {
-    animation: none;
-    transform: none;
-  }
+  background-color: var(--bg-page, #ffffff);
 }