Keep corgi artwork fully visible in mini program banners

pets-fe/pages/meetups/meetups.wxml

@@ -2,12 +2,11 @@
   <view class="eyebrow">LET'S WALK TOGETHER</view>
   <view class="title">约个伴一起遛 🌿</view>
   <view class="banner">
-    <text>好天气，和新朋友一起走走</text>
-    <strong>
-      下一次快乐
-      <br />
-      从这里出发
-    </strong>
+    <view class="banner-copy">
+      <text>好天气，和新朋友一起走走</text>
+      <view class="banner-title first">下一次快乐</view>
+      <view class="banner-title">从这里出发</view>
+    </view>
     <image src="/assets/corgi-family-five.png" mode="aspectFit" />
   </view>
   <view class="row">
@@ -45,10 +44,8 @@
     </view>
     <view class="detail">
       <view bindtap="location">📍 {{active.place_name}} {{active.latitude?'· 点开地图':''}}</view>
-      <br />
-      🗓 {{active.date}}
-      <br />
-      🐕 {{active.participants}} / {{active.max_people}} 人已报名
+      <view>🗓 {{active.date}}</view>
+      <view>🐕 {{active.participants}} / {{active.max_people}} 人已报名</view>
     </view>
     <view class="desc">{{active.description}}</view>
     <view wx:if="{{active.host_user_id!==userId&&!joined}}">

pets-fe/pages/meetups/meetups.wxss

@@ -2,31 +2,36 @@
   background: #dfeee2;
   border-radius: 34rpx;
   min-height: 245rpx;
-  padding: 36rpx;
-  position: relative;
-  overflow: hidden;
+  padding: 30rpx;
+  display: flex;
+  align-items: center;
+  gap: 12rpx;
 }
-.banner text,
-.banner strong {
+.banner-copy {
+  flex: 1;
+  min-width: 0;
+}
+.banner-copy text,
+.banner-title {
   display: block;
-  position: relative;
-  z-index: 2;
 }
-.banner text {
+.banner-copy text {
   color: #549375;
   font-size: 22rpx;
 }
-.banner strong {
+.banner-title {
   font-size: 35rpx;
   line-height: 1.3;
+  font-weight: 800;
+  white-space: nowrap;
+}
+.banner-title.first {
   margin-top: 16rpx;
 }
 .banner image {
-  width: 290rpx;
-  height: 220rpx;
-  position: absolute;
-  right: -30rpx;
-  bottom: 0;
+  width: 52%;
+  height: 190rpx;
+  flex-shrink: 0;
 }
 .add {
   font-size: 24rpx;