Feed banner height variable into layout margin creator

Author: AKCodez

static/css/devportal2024-v1.css

@@ -37,7 +37,6 @@
     object-fit: cover;
     content: url("../img/home-hero.svg");
     margin-bottom: 24px;
-    margin-top: 24px;
     @media (min-width: 992px) {
       min-height: 470px;
     }

styles/_pages.scss

@@ -2,7 +2,7 @@
   text-decoration: none;
   display: flex;
   justify-content: space-between;
-  height: 52px;
+  height: $banner-height;
   background: #D919FF !important;
   padding: 7px 35px;
   font-family: "Work Sans";

styles/_top-banner.scss

@@ -1,6 +1,6 @@
 /* Top navigation ----------------------------------------------------------- */
 $nav-height: 80px;
-$banner-height: 0; // Apex 2024 banner was 46px. 0 for no pencil banner.
+$banner-height: 52px; // Apex 2025 banner is 52px. 0 for no pencil banner.
 
 [data-component-name="layouts/RootLayout"] {
   padding-top: $nav-height + $banner-height;