<!-- 📦 一張商品卡片的完整結構 -->

<div class="card">

  <!-- 1️⃣ 圖片輪播區 -->
  <div class="carousel">
    <div class="carousel-track">
      <div class="carousel-slide"><img src="圖片1.jpg"/></div>
      <div class="carousel-slide"><img src="圖片2.jpg"/></div>
    </div>
    <span class="carousel-badge badge-new">NEW</span>
    <div class="carousel-dots">...圓點...</div>
  </div>

  <!-- 2️⃣ 卡片內容區 -->
  <div class="card-body">
    <div class="card-title">商品標題</div>
    <div class="card-desc">商品描述說明文字</div>

    <!-- 3️⃣ 標籤 + 收藏/分享按鈕 -->
    <div class="meta-row">
      <span class="origin">TW</span>
      <span class="tag">食品</span>
      <div class="meta-actions">
        <button class="action-btn">♡</button>
        <button class="action-btn">⤴</button>
      </div>
    </div>

    <!-- 4️⃣ 倒數計時 -->
    <div class="countdown warn">⏱ 剩 3 天</div>

    <!-- 5️⃣ 動作按鈕 -->
    <div class="btn-group">
      <button class="btn btn-primary">立即購買</button>
      <button class="btn">加入行事曆</button>
    </div>
  </div>

</div>