/* ============================================================
   產品中心 · v2 視覺 — 僅適用 products.html / en/products.html
   風格：Editorial 大地色 + 香檳金編輯式排版
   ============================================================ */

/* 頁面底色（覆蓋 .inner-page 的舊底色）*/
body.v2-products { background:#F6F3EE; }

/* ---------- 通用 ---------- */
.v2-wrap  { width:min(1180px, 92%); margin-inline:auto; }
.v2-kicker{ font-family:'Inter','Noto Sans TC',sans-serif; letter-spacing:.32em;
            text-transform:uppercase; font-size:12px; color:#C2A25E; }
.v2-sereno{ font-family:'Playfair Display','Noto Serif TC',serif; font-weight:600; }

/* ============================================================
   HERO — 左右分欄 Editorial
   ============================================================ */
.v2-products .v2-hero{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  background:#E9E2D8; overflow:hidden;
}
.v2-hero .v2-hero-text{
  padding:clamp(48px,6vw,96px) clamp(24px,5vw,72px);
  display:flex; flex-direction:column; justify-content:center; gap:22px;
}
.v2-hero-text h1{
  font-family:'Playfair Display','Noto Serif TC',serif; font-weight:500;
  font-size:clamp(34px,4.2vw,58px); line-height:1.16; color:#14130F;
  letter-spacing:.01em; margin:0;
}
.v2-hero-text h1 em{ font-style:normal; color:#C2A25E; }
.v2-hero-text > p{
  font-size:15.5px; line-height:1.85; color:#5C574F; max-width:52ch; margin:0;
}
.v2-hero-stats{ display:flex; gap:clamp(28px,4vw,56px); margin-top:8px;
  border-top:1px solid #DCD5CB; padding-top:22px; }
.v2-hero-stats .hs b{
  font-family:'Playfair Display','Noto Serif TC',serif; font-weight:600;
  font-size:clamp(24px,2.6vw,34px); color:#14130F; display:block;
}
.v2-hero-stats .hs span{ font-size:13px; color:#8A8176; letter-spacing:.12em;
  text-transform:uppercase; }
.v2-hero .v2-hero-media{ position:relative; min-height:460px; }
.v2-hero-media img{ position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; }

/* ============================================================
   色系索引 SHOP BY COLOUR
   ============================================================ */
.v2-colours{ background:#F6F3EE; padding:clamp(56px,7vw,96px) 0; }
.v2-colours .v2-kicker{ display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:clamp(28px,3.4vw,44px); }
.v2-colours .v2-kicker span{ font-family:'Inter',sans-serif; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; font-size:11px; color:#8A8176; }
.v2-swatch-row{ display:grid; grid-template-columns:repeat(7,1fr); gap:clamp(10px,1.4vw,18px); }
.v2-swatch{ display:block; text-decoration:none; }
.v2-swatch .chip{ aspect-ratio:1/1; width:100%; border-radius:2px; position:relative;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1); box-shadow:inset 0 0 0 1px rgba(0,0,0,.06); }
.v2-swatch:hover .chip{ transform:translateY(-4px); }
.v2-swatch b{ display:block; font-family:'Noto Sans TC',sans-serif; font-weight:600;
  font-size:14px; color:#14130F; margin-top:12px; letter-spacing:.06em; }
.v2-swatch span{ display:block; font-family:'Inter','Noto Sans TC',sans-serif;
  font-size:11.5px; color:#8A8176; letter-spacing:.04em; margin-top:2px; }

/* ============================================================
   編輯式系列索引（深色）— 10 行細線索引
   ============================================================ */
.v2-archive{ background:#16150F; color:#F4F1EA; padding:clamp(60px,7vw,96px) 0; }
.v2-archive .v2-archive-head{ display:flex; justify-content:space-between; align-items:flex-end;
  margin-bottom:clamp(30px,4vw,52px); gap:24px; flex-wrap:wrap; }
.v2-archive-head h2{ font-family:'Playfair Display','Noto Serif TC',serif; font-weight:500;
  font-size:clamp(26px,3vw,40px); color:#F4F1EA; margin:12px 0 0; }
.v2-archive-head p{ color:#A7A091; font-size:14px; line-height:1.8; max-width:40ch; margin:0; }
.v2-index{ list-style:none; margin:0; padding:0; }
.v2-index li{ display:block; }
.v2-index li a{ display:grid; grid-template-columns:52px 1.4fr 1fr 1fr 40px; align-items:center;
  gap:18px; padding:22px 6px; border-top:1px solid rgba(255,255,255,.13); transition:background .3s;
  color:inherit; text-decoration:none; }
.v2-index li a:hover{ background:rgba(255,255,255,.03); }
.v2-index li .no{ font-family:'Inter',sans-serif; font-size:13px; color:#C2A25E; letter-spacing:.08em; }
.v2-index li .zh{ font-family:'Noto Serif TC',serif; font-weight:500; font-size:19px; color:#F4F1EA; }
.v2-index li .en{ font-family:'Playfair Display',serif; font-style:italic; font-size:14px;
  color:#8A8176; letter-spacing:.03em; }
.v2-index li .sp{ font-size:13px; color:#A7A091; letter-spacing:.03em; }
.v2-index li .ct{ font-family:'Inter',sans-serif; font-size:13px; color:#C2A25E;
  white-space:nowrap; text-align:right; }
.v2-index li .go{ font-size:20px; color:#C2A25E; text-align:right; }
.v2-archive .v2-archive-all{ margin-top:26px; }
.v2-archive-all a{ color:#C2A25E; text-decoration:none; font-size:14px; letter-spacing:.1em;
  border-bottom:1px solid rgba(194,162,94,.4); padding-bottom:4px; }

/* ============================================================
   SPOTLIGHT 藏家之選
   ============================================================ */
.v2-spotlight{ background:#E9E2D8; }
.v2-spotlight .v2-spot-in{ display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
.v2-spot-media{ position:relative; min-height:520px; }
.v2-spot-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.v2-spot-text{ padding:clamp(44px,6vw,88px) clamp(28px,5vw,72px);
  display:flex; flex-direction:column; justify-content:center; gap:20px; }
.v2-spot-text h2{ font-family:'Playfair Display','Noto Serif TC',serif; font-weight:500;
  font-size:clamp(28px,3.4vw,46px); line-height:1.2; color:#14130F; margin:0; }
.v2-spot-text p{ font-size:15px; line-height:1.85; color:#5C574F; margin:0; max-width:46ch; }
.v2-btn{ display:inline-flex; align-items:center; gap:10px; padding:13px 26px;
  background:#14130F; color:#F4F1EA; text-decoration:none; font-size:14px;
  letter-spacing:.08em; border-radius:2px; width:fit-content; transition:background .3s; }
.v2-btn:hover{ background:#2a2822; color:#fff; }
.v2-btn.gold{ background:#C2A25E; color:#14130F; font-weight:600; }
.v2-btn.gold:hover{ background:#cdb074; }

/* ============================================================
   QUOTE CTA 收尾
   ============================================================ */
.v2-quote{ background:#1E1C16; color:#F4F1EA; text-align:center;
  padding:clamp(60px,8vw,104px) 24px; }
.v2-quote .v2-kicker{ justify-content:center; }
.v2-quote h2{ font-family:'Playfair Display','Noto Serif TC',serif; font-weight:500;
  font-size:clamp(28px,4vw,52px); color:#F4F1EA; margin:18px auto; max-width:16ch; line-height:1.18; }
.v2-quote p{ color:#A7A091; font-size:14.5px; max-width:52ch; margin:0 auto 30px; line-height:1.8; }
.v2-quote .v2-qbtns{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ============================================================
   響應式（先做桌面為主，輔基本自適應）
   ============================================================ */
@media (max-width:900px){
  .v2-hero{ grid-template-columns:1fr; }
  .v2-hero-media{ min-height:320px; order:-1; }
  .v2-spot-in{ grid-template-columns:1fr; }
  .v2-spot-media{ min-height:300px; }
  .v2-swatch-row{ grid-template-columns:repeat(4,1fr); }
  .v2-index li a{ grid-template-columns:40px 1.2fr 1fr 34px; }
  .v2-index li .sp{ display:none; }
}
