Remove overlays, put text above/below banner image

- Removed gradient overlays from brand cards
- Removed shared background banner approach
- Each card now has its own banner <img> showing the relevant half
  (object-position: left for FI-NE, right for LACUEOR)
- Logo + eyebrow sit above the image, tagline + CTA below
- Dropdown now updates both card images simultaneously
- Cleaned up orphaned CSS (.brand-card-overlay, .brand-card-name, .brands-banner-img)
- Responsive padding for header/footer sections

style.css

@@ -377,30 +377,30 @@ body::before {
 }
 
 .brands-grid {
-    position: relative;
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 0;
     max-width: 1200px;
     margin: 0 auto;
-    min-height: 560px;
-    overflow: hidden;
 }
 
-/* Shared banner image behind both brand cards */
-.brands-banner-img {
-    position: absolute;
-    inset: 0;
-    width: 100%;
+.brand-card-image-wrap {
+    display: flex;
+    flex-direction: column;
     height: 100%;
-    object-fit: cover;
-    object-position: center;
-    z-index: 0;
-    transition: opacity 0.4s ease, transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    width: 100%;
 }
 
-.brands-grid:hover .brands-banner-img {
-    transform: scale(1.04);
+.brand-card-header {
+    flex-shrink: 0;
+    padding: 32px 52px 20px;
+    text-align: center;
+}
+
+.brand-card-footer {
+    flex-shrink: 0;
+    padding: 20px 52px 40px;
+    text-align: center;
 }
 
 .brand-card {
@@ -408,48 +408,26 @@ body::before {
     overflow: hidden;
     display: flex;
     flex-direction: column;
-    align-items: center;
-    justify-content: flex-end;
-    min-height: 560px;
     text-decoration: none;
     cursor: pointer;
 }
 
 .brand-card--fine {
-    position: relative;
-    z-index: 1;
-    background: rgba(232, 224, 208, 0.82);
+    background: var(--fine-beige);
     border-right: 1px solid var(--border);
 }
 
 .brand-card--lacueor {
-    position: relative;
-    z-index: 1;
-    background: rgba(26, 24, 20, 0.78);
+    background: var(--lacueor-dark);
 }
 
-.brand-card-overlay {
-    position: absolute;
-    inset: 0;
-    pointer-events: none;
-}
-
-.brand-card--fine .brand-card-overlay {
-    background: linear-gradient(
-        to bottom,
-        rgba(232, 224, 208, 0.2) 0%,
-        rgba(232, 224, 208, 0.6) 50%,
-        rgba(232, 224, 208, 0.92) 100%
-    );
-}
-
-.brand-card--lacueor .brand-card-overlay {
-    background: linear-gradient(
-        to bottom,
-        rgba(14, 12, 10, 0.1) 0%,
-        rgba(14, 12, 10, 0.55) 50%,
-        rgba(14, 12, 10, 0.93) 100%
-    );
+.brand-card-image {
+    display: block;
+    width: 100%;
+    height: auto;
+    flex-shrink: 0;
+    object-fit: cover;
+    transition: opacity 0.4s ease;
 }
 
 .brand-card-top-accent {
@@ -485,20 +463,12 @@ body::before {
     opacity: 1;
 }
 
-.brand-card-content {
-    position: relative;
-    z-index: 2;
-    width: 100%;
-    padding: 48px 52px;
-    text-align: center;
-}
-
 .brand-card-eyebrow {
     font-size: 8px;
     font-weight: 500;
     letter-spacing: 0.32em;
     text-transform: uppercase;
-    margin-bottom: 18px;
+    margin-bottom: 14px;
     display: block;
 }
 
@@ -517,9 +487,7 @@ body::before {
     min-width: 110px;
     height: auto;
     object-fit: contain;
-    margin: 0 auto 16px;
-    position: relative;
-    z-index: 2;
+    margin: 0 auto;
     transition: opacity var(--transition);
 }
 
@@ -536,24 +504,6 @@ body::before {
     opacity: 1;
 }
 
-.brand-card-name {
-    font-family: var(--font-serif);
-    font-size: clamp(36px, 4vw, 58px);
-    font-weight: 300;
-    letter-spacing: 0.08em;
-    line-height: 1;
-    margin-bottom: 14px;
-    display: block;
-}
-
-.brand-card--fine .brand-card-name {
-    color: var(--charcoal);
-}
-
-.brand-card--lacueor .brand-card-name {
-    color: var(--cream);
-}
-
 .brand-card-tagline {
     font-family: var(--font-serif);
     font-size: 15px;
@@ -1036,8 +986,12 @@ footer {
         border-bottom: 1px solid var(--border);
     }
 
-    .brand-card {
-        min-height: 480px;
+    .brand-card-header {
+        padding: 24px 28px 16px;
+    }
+
+    .brand-card-footer {
+        padding: 16px 28px 32px;
     }
 
     .b2b-benefits {
@@ -1084,12 +1038,12 @@ footer {
         padding: 0;
     }
 
-    .brand-card-content {
-        padding: 36px 28px;
+    .brand-card-header {
+        padding: 20px 24px 14px;
     }
 
-    .brands-grid {
-        min-height: 360px;
+    .brand-card-footer {
+        padding: 14px 24px 28px;
     }
 
     .banner-selector {