Only use derived variables

docs/_sass/footer.sass

@@ -9,7 +9,7 @@
     font-weight: $weight-semibold
 
 .bd-footer-subtitle
-  color: $grey-light
+  color: $border-hover
   margin-top: -0.5rem
   transition-duration: $speed
   transition-property: color
@@ -29,7 +29,7 @@
       width: 100%
 
 .bd-footer-tsp
-  color: $grey-light
+  color: $border-hover
   margin-top: 1.5rem
 
 %bd-footer-box
@@ -42,7 +42,7 @@
 
 .bd-footer-support
   @extend %bd-footer-box
-  border-top: 2px solid $white-ter
+  border-top: 2px solid $scheme-main-ter
   box-shadow: none
   padding: 3rem
   .bd-footer-title
@@ -63,7 +63,7 @@
     padding: 0.75rem 1.5rem
 
 .bd-footer-donation-title
-  color: $grey-light
+  color: $border-hover
   margin-bottom: 0.5rem
   strong
     color: currentColor
@@ -103,7 +103,7 @@ $star-figure-height: 156px
   +tablet
     width: calc(33.3333% - 2rem)
   &:hover
-    box-shadow: 0 3rem 3rem -1.25rem rgba($black, 0.1)
+    box-shadow: 0 3rem 3rem -1.25rem rgba($scheme-invert, 0.1)
     transform: translateY(-0.5rem)
     .bd-footer-title,
     .bd-footer-subtitle
@@ -158,7 +158,7 @@ $star-figure-height: 156px
   &.bd-is-more
     font-size: 0.875rem
     a:not(:hover)
-      color: $grey-light
+      color: $border-hover
   &.bd-has-subtitle
     a
       align-items: center
@@ -174,7 +174,7 @@ $star-figure-height: 156px
         font-style: normal
       &:not(:hover)
         em
-          color: $grey-light
+          color: $border-hover
       +mobile
         flex-wrap: wrap
         margin-top: 1rem