fix(SW-217): Styling fixes for teaser-card

components/TempDesignSystem/TeaserCard/teaserCard.module.css

@@ -18,24 +18,17 @@
   border: 1px solid var(--Base-Border-Subtle);
 }
 
-.imageContainer {
+.image {
   width: 100%;
-  height: 12.58625rem; /* 201.38px / 16 = 12.58625rem */
-  overflow: hidden;
-}
-
-.backgroundImage {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
+  height: 12.5rem; /* 200px */
 }
 
 .content {
-  display: flex;
-  flex-direction: column;
+  display: grid;
   gap: var(--Spacing-x-one-and-half);
-  align-items: flex-start;
   padding: var(--Spacing-x2) var(--Spacing-x3);
+  grid-template-rows: auto 1fr auto;
+  flex-grow: 1;
 }
 
 .description {
@@ -53,17 +46,6 @@
   width: 100%;
 }
 
-.body {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-  line-clamp: 3;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  /* line-height variables are in %, so using the value in rem instead */
-  max-height: calc(3 * 1.5rem);
-}
-
 @media (min-width: 1367px) {
   .card:not(.alwaysStack) .ctaContainer {
     grid-template-columns: repeat(auto-fit, minmax(0, 1fr));