/* ── 手寫的自訂樣式 ── */

/* ===== Wilder：石面禪觀 × 砂岩暖調 ===== */
:root{
  --bg:#1b1613;
  --ink:#ece3d6; --ink-2:#c6b7a3; --ink-3:#938678; --ink-4:#645a4f;
  --line:rgba(221,201,169,.15); --line-2:rgba(221,201,169,.09);
  --o-50:#1c1612; --o-100:#241c16; --o-200:#3a2e22; --o-300:#7a6346;
  --o-400:#cbb08a; --o-500:#d8c09d; --o-600:#e6d4b4; --o-700:#f1e4cd;
  --bronze:#cbb08a; --bronze-2:#e6d4b4; --bronze-d:#9c7f58;
  --panel:rgba(40,32,25,.56);
  --r:16px; --r-sm:11px;
  --font:"Noto Sans TC",-apple-system,"PingFang TC","Microsoft JhengHei",sans-serif;
  --serif:"Noto Serif TC",Georgia,"Songti TC",serif;
}
body.shop-wilder{ background:#171310; background-image:none; color:var(--ink); }

/* 背景：暖砂岩底 + 放大模糊的石臉(頭像) + 暗幕 + 石粒 */
.wd-bg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#15110e}
.wd-stone{position:absolute;inset:0;background:
  radial-gradient(130% 90% at 50% -10%, #2b2219 0%, #1d1711 52%, #130f0c 100%),
  radial-gradient(60% 50% at 80% 112%, rgba(203,176,138,.08), transparent 60%);}
.wd-face{position:absolute;inset:-8%;
  background-image:var(--brand-avatar,none);
  background-size:cover;background-position:28% 20%;background-repeat:no-repeat;
  filter:saturate(.58) brightness(.78) contrast(1.04) blur(12px);
  opacity:.62;transform:scale(1.05);transform-origin:50% 30%;
  animation:wdBreathe 27s ease-in-out infinite;will-change:transform,opacity}
.wd-veil{position:absolute;inset:0;background:
  linear-gradient(180deg, rgba(19,15,12,.22) 0%, rgba(20,16,12,.5) 38%, rgba(19,15,12,.88) 74%, #15110e 100%),
  radial-gradient(76% 50% at 50% 14%, transparent 46%, rgba(19,15,12,.42) 100%);}
.wd-grain{position:absolute;inset:0;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");}
@keyframes wdBreathe{0%{transform:scale(1.05);opacity:.58}50%{transform:scale(1.1);opacity:.68}100%{transform:scale(1.05);opacity:.58}}
@media (prefers-reduced-motion:reduce){ .wd-face{animation:none} }

/* 品牌區 */
.brand{padding:52px 0 26px;text-align:center}
.wd-hero{display:flex;flex-direction:column;align-items:center}
.wd-eyebrow{font-size:10.5px;letter-spacing:.42em;color:var(--bronze);font-weight:700;margin:0 0 18px;padding-left:.42em}
.avatar.wd-avatar{
  width:150px;height:150px;margin:0 auto;border-radius:50%;overflow:hidden;background:#241c15;
  border:1px solid rgba(221,201,169,.35);
  box-shadow:0 0 0 6px rgba(203,176,138,.06), 0 0 50px -10px rgba(203,176,138,.4), 0 28px 64px rgba(0,0,0,.62);}
.avatar.wd-avatar img{width:100%;height:100%;object-fit:cover;object-position:60% 28%}
.avatar.wd-avatar>span{font-size:60px;filter:grayscale(.3)}
#brandName,.brand h1{font-family:var(--serif);font-weight:600;font-size:52px;letter-spacing:.015em;margin-top:18px;line-height:1;
  color:#f3ead9;text-shadow:0 2px 30px rgba(203,176,138,.22)}
#tagline,.tagline{font-size:12px;color:var(--bronze);font-weight:600;letter-spacing:.34em;margin-top:14px;padding-left:.34em}
.wd-manifesto{font-family:var(--serif);font-weight:500;font-size:15px;line-height:2.05;color:var(--ink-2);
  max-width:30em;margin:22px auto 0;text-align:center;text-wrap:balance;letter-spacing:.02em}
.wd-rule{width:56px;height:1px;margin:26px auto 0;background:linear-gradient(90deg,transparent,var(--bronze),transparent);opacity:.7}
#memberChip{margin-top:18px}

/* 區塊標題 */
.block-head h2{font-family:var(--serif);font-weight:700;font-size:19px;color:var(--ink);letter-spacing:.02em;display:flex;align-items:baseline;gap:10px}
.block-head h2 small{font-family:var(--font);font-size:9.5px;letter-spacing:.3em;color:var(--ink-4);font-weight:700}
.more-link{color:var(--bronze)} .more-link:hover{color:var(--bronze-2)}

/* 方案卡 */
.plans{gap:12px}
.plan{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);transition:border-color .22s, box-shadow .22s, transform .12s}
.plan::before{content:'';position:absolute;top:0;left:18px;right:18px;height:1px;background:linear-gradient(90deg,transparent,var(--bronze),transparent);opacity:.5}
.plan:hover{border-color:rgba(221,201,169,.4);transform:translateY(-1px)}
.plan.on{border-color:rgba(221,201,169,.6);box-shadow:inset 0 0 0 1px rgba(221,201,169,.35), 0 0 40px -10px rgba(203,176,138,.5)}
.plan.is-featured{border-color:rgba(221,201,169,.46)}
.plan.is-featured::before{height:2px;opacity:.9}
.plan-name{color:var(--ink);font-family:var(--serif);font-weight:600}
.plan-sub{color:var(--ink-3)}
.plan-price b{color:var(--bronze-2)} .plan-price b small{color:var(--ink-3)}
.plan-was{color:var(--ink-4)}
.plan-tag{background:linear-gradient(135deg,var(--bronze-d),var(--bronze));color:#1a130b}
.plan-feats li{color:var(--ink-2)} .plan-feats li::before{color:var(--bronze)}
.tick{border-color:var(--ink-4)}
.plan.on .tick,.pay.on .tick{border-color:var(--bronze);background:var(--bronze)}
.plan.on .tick::after,.pay.on .tick::after{color:#1a130b}

/* 付款方式 */
.pays{gap:10px}
.pay{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.pay:hover{border-color:rgba(221,201,169,.4)}
.pay.on{border-color:var(--bronze);background:rgba(203,176,138,.1)}
.pay b{color:var(--ink)} .pay span{color:var(--ink-3)}

/* 聯絡表單 */
.fld>span{color:var(--ink-2)} .fld i{color:var(--bronze-2)} .fld em{color:var(--ink-4)}
.fld input,.fld select,.fld textarea{background:rgba(14,11,9,.6);border:1px solid var(--line);color:var(--ink);border-radius:var(--r-sm)}
.fld input::placeholder,.fld textarea::placeholder{color:var(--ink-4)}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--bronze);box-shadow:0 0 0 3px rgba(203,176,138,.15);outline:none}

/* 結帳列 */
.checkout{background:rgba(16,12,10,.93);border-top:1px solid var(--line);backdrop-filter:blur(11px);-webkit-backdrop-filter:blur(11px)}
.total #totalLabel,.total span{color:var(--ink-3)}
#totalAmount{color:var(--bronze-2);font-family:var(--serif)}
.pay-btn{background:linear-gradient(135deg,#e2cba3,#cbb08a);color:#1a130b;font-weight:800;border:0;box-shadow:0 10px 30px rgba(203,176,138,.3)}
.pay-btn:hover{filter:brightness(1.05)} .pay-btn:disabled{opacity:.5;filter:none}
.fineprint{color:var(--ink-4)}

/* 注意事項 */
.disclaimer{background:rgba(36,28,21,.6) !important;border:1px solid var(--line) !important;
  border-left:2px solid var(--bronze) !important;border-radius:var(--r-sm);color:var(--ink-2) !important;line-height:1.95}
.copyright{color:var(--ink-4)}

/* 載入骨架 */
.sk{background:linear-gradient(100deg,rgba(203,176,138,.05),rgba(203,176,138,.12),rgba(203,176,138,.05));border-radius:var(--r)}

@media (min-width:560px){ .sheet{max-width:496px} }