Make PostCard style responsive

src/style/modules/_post-card.scss

@@ -1,22 +1,53 @@
 .post-card {
+    display: grid;
+    grid-template-columns: 40% 60%;
+    align-items: baseline;
+    height: 100%;
     width: 100%;
     height: 100%;
     max-width: 333px;
     max-height: 222px;
+    padding: clamp(12px, 1.5vw, 32px);
+    padding-left: clamp(8px, 1vw, 24px);
     background: $color-cream;
+    box-shadow: 0 16px 12px rgba(#000, 0.15), 0 26px 52px rgba(#000, 0.2);
 
-    .wrap {
+    &__left {
         display: flex;
+        align-items: flex-end;
         height: 100%;
-        padding: 40px 20px;
+        padding-bottom: 4px;
+        padding-right: clamp(8px, 1vw, 24px);
+        border-right: 1px solid rgba(#000, 0.2);
+    }
+    &__right {
+        position: relative;
+        margin-top: auto;
+        height: 100%;
+        display: flex;
+        align-items: flex-end;
+    }
+
+    // Country Title
+    &__country {
+        position: relative;
+        margin-top: auto;
+        font-size: clamp(#{rem(12px)}, 1.2vw, #{rem(32px)});
+        color: $color-primary;
+        font-family: $font-serif;
+        line-height: 1.1;
+
+        strong {
+            color: $color-secondary;
+            font-weight: 300;
+        }
     }
 
     // Stamp
     &__stamp {
         position: absolute;
-        top: 20px;
-        right: 20px;
-        flex-shrink: 0;
+        top: 0;
+        right: 0;
 
         img {
             display: block;
@@ -28,7 +59,7 @@
             position: absolute;
             top: 10px;
             left: -8px;
-            transform: rotate(-16deg);
+            transform: rotate(-14deg);
             width: 24px;
             height: 24px;
             box-shadow: 0 0 0 3px $color-cream;
@@ -36,6 +67,7 @@
             overflow: hidden;
 
             img {
+                display: block;
                 width: 100%;
                 height: 100%;
                 object-fit: contain;
@@ -43,46 +75,18 @@
         }
     }
 
-    // Country Title
-    &__country {
-        position: relative;
-        min-width: 105px;
-        margin-top: auto;
-        margin-right: 15px;
-        font-size: rem(20px);
-        color: $color-primary;
-        font-family: $font-serif;
-        line-height: 1.1;
-
-        strong {
-            color: $color-secondary;
-            font-weight: 300;
-        }
-    }
-
-    // Border Line
-    &__border {
-        background-color: rgba(#000, 0.2);
-        height: 180px;
-        width: 1px;
-        margin-top: auto;
-    }
-
     // Address
     ul {
-        width: 60%;
         margin-top: auto;
-        margin-left: 20px;
+        padding-left: clamp(8px, 1vw, 24px);
 
         li {
             display: block;
-            border-bottom: 1px solid #D9CABD;
-            margin-bottom: 2px;
-        }
-        p {
+            margin-bottom: max(2px, 0.25vw);
             color: $color-text;
-            font-size: rem(14px);
+            font-size: clamp(#{rem(11px)}, 0.8vw, #{rem(24px)});
             line-height: 1.4;
+            border-bottom: 1px solid #D9CABD;
         }
     }
 }