/* ==============================
   AMOS 商品說明—共用樣式（整潔版）
   作者：AMOS 
   ============================== */

/* ---- 1) 變數 ---- */
:root{
  --brand-purple:#4a178a;
  --accent-gold:#d6b36a;
  --ink:#594d71;
  --card-max:780px;
  --radius:16px;
  --shadow:0 8px 26px rgba(60,0,113,.10);
}

/* ---- 2) 區塊/標題 ---- */
.svc-wrap{ margin:28px 0 40px; }
.svc-section{ margin:26px 0 34px; position:relative; }
.svc-section.last{ margin-bottom:10px; }
.svc-h{
  color:var(--brand-purple);
  font-size:1.24rem;
  font-weight:800;
  border-left:7px solid var(--accent-gold);
  padding-left:12px;
  margin:0 0 14px;
}

/* ---- 3) 一般卡片 ---- */
.svc-card{
  background:#fff; border-radius:var(--radius);
  padding:14px 16px; box-shadow:var(--shadow); margin:12px 0;
}
.svc-card-title{
  display:flex; align-items:center; gap:8px;
  color:var(--brand-purple); font-weight:800; margin:0 0 6px; letter-spacing:.4px;
}
.svc-desc{ margin:6px 0 0; color:var(--ink); line-height:1.75; }
.svc-bullets{ margin:0; padding-left:18px; color:var(--ink); line-height:1.75; }
.svc-bullets li{ margin:4px 0; }

/* ---- 4) 小圖示（標題用） ---- */
.svc-ico-sm{ width:20px; height:20px; flex:0 0 20px; object-fit:contain; }
.svc-svg{ width:20px; height:20px; color:var(--brand-purple); flex:0 0 20px; }

/* ---- 5) VIP 置中區 ---- */
.svc-center{ text-align:center; margin:6px 0 14px; }
.vip-badge{ width:96px; height:auto; display:block; margin:0 auto 6px; }
.svc-sublead{ color:var(--accent-gold); font-weight:800; letter-spacing:.6px; margin-bottom:4px; }
.svc-desc.center{ margin-top:0; }

/* ---- 6) 禮品包裝影像 ---- */
.gift-figure{ margin:14px 0; }
.gift-main{
  width:100%; max-width:var(--card-max); display:block;
  border-radius:14px; box-shadow:0 10px 36px rgba(20,2,44,.18);
  margin-inline:auto;
}
.gift-grid{
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr));
  gap:16px; max-width:var(--card-max); margin:12px auto 0;
}
.gift-grid > img{ width:100%; height:auto; border-radius:18px; box-shadow:0 8px 28px rgba(20,2,44,.14); }
.gift-grid > :only-child{ grid-column:1 / -1; }

/* ---- 7) 底圖：製作出貨（右上角小浮水印） ---- */
.bg-amo-1{
  background-image:url("/ICON/阿莫司底圖_1.png");
  background-repeat:no-repeat;
  background-position:right -30px top -20px;
  background-size:220px auto;
}

/* ---- 8) 禮品包裝段落壓印（單張置中） ---- */
.bg-amo-2{ background:none !important; }
/* 禮品包裝段落：把壓印層放到內容後面，避免覆蓋滑動 */
.svc-section.bg-amo-2{
  position: relative;
  overflow: visible;
  padding-bottom: 18px;
  z-index: 0;                    /* 建立層級基準 */
}
.svc-section.bg-amo-2::before{
  content:"";
  position:absolute;
  left:50%; top:0; height:100%;
  width:min(92vw, var(--card-max));
  transform:translateX(-50%);
  background-image:url("/ICON/阿莫司底圖二-800_1.png");
  background-repeat:no-repeat;
  background-position:center top;
  background-size:cover;
  opacity:.90;
  pointer-events:none;
  z-index:-1;                    /* ✅ 放到內容後面，不干擾觸控 */
}
.svc-section.bg-amo-2 > *{ position:relative; z-index:1; }

/* 圖片區明確允許直向滑動，避免少數瀏覽器誤判 */
.gift-figure,
.gift-grid,
.gift-figure img,
.gift-grid img{
  z-index: 2;               /* ⬆️ 關鍵：把圖片層級抬高 */
  touch-action: pan-y;           /* ✅ 手指可上下滑 */
  -webkit-user-drag: none;       /* 避免拖曳圖片影響手感 */
}

/* ---- 9) 示意：左右圖文（測量示意） ---- */
.svc-media{ display:flex; gap:14px; align-items:center; }
.svc-media .svc-media-txt{ flex:1 1 360px; }
.svc-media .svc-media-img{ flex:0 0 auto; margin:0; }
.svc-media .svc-media-img img{
  width:min(280px, 38vw); height:auto; display:block; border-radius:12px;
  box-shadow:0 8px 24px rgba(20,2,44,.12);
}

/* ---- 10) 大圖標卡：svc-feature ---- */
.svc-feature{ padding:18px 18px; }
.svc-feature .feature-row{
  display:grid; grid-template-columns:88px 1fr; gap:16px; align-items:center;
}
.svc-feature .feature-ico{
  width:88px; height:88px; object-fit:contain; display:block;
  filter:drop-shadow(0 6px 18px rgba(20,2,44,.10));
}
.svc-feature .feature-title{
  margin:0 0 4px; font-weight:800; color:var(--brand-purple); letter-spacing:.4px;
}

/* ---- 11) 區隔標題（▼ 非瑕疵範圍） ---- */
.svc-note{ background:#fbf8ff; }
.svc-note .feature-title, .svc-note .svc-card-title{ color:var(--brand-purple); }

/* ---- 12) RWD ---- */
@media (max-width:900px){
  .svc-h{ font-size:1.08rem; padding-left:7px; border-left-width:6px; }
  .svc-card{ border-radius:14px; padding:12px 14px; }
  .gift-grid{ grid-template-columns:1fr; }

  .svc-media{ flex-direction:column; align-items:stretch; }
  .svc-media .svc-media-txt{ flex:none; width:100%; }
  .svc-media .svc-media-img img{ width:min(92vw, 420px); margin-top:6px; }

  .svc-feature .feature-row{ grid-template-columns:72px 1fr; }
  .svc-feature .feature-ico{ width:72px; height:72px; }
}