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

/* ===== julian：黑金 × 星光尊榮 ===== */
:root{
  --bg:#09090b;
  --ink:#f2efe6; --ink-2:#bcb6a6; --ink-3:#8c8678; --ink-4:#615c51;
  --line:rgba(217,195,137,.16); --line-2:rgba(217,195,137,.10);
  --o-50:#17150e; --o-100:#1e1a10; --o-200:#3a3220; --o-300:#8a7a4a;
  --o-400:#d9c389; --o-500:#e3cf97; --o-600:#ecd9a0; --o-700:#f3e6bd;
  --gold:#d9c389; --gold-2:#ecd9a0; --plat:#cfd6e0;
  --panel:rgba(22,21,18,.56);
  --r:18px; --r-sm:12px;
  --serif:"Cormorant Garamond","Noto Serif TC",Georgia,serif;
  --font:"Noto Sans TC",-apple-system,"PingFang TC","Microsoft JhengHei",sans-serif;
}
body.shop-julian{ background:#070708; background-image:none; color:var(--ink); }

/* 背景：純黑 + 香檳金暈 + 星光 canvas */
.jl-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(1200px 720px at 50% -8%, #1a160d 0%, transparent 58%),
    radial-gradient(800px 560px at 102% 106%, #141109 0%, transparent 54%),
    linear-gradient(180deg,#0b0a08,#070707);}
.jl-glow{position:absolute;inset:0;background:radial-gradient(520px 300px at 50% 2%, rgba(236,217,160,.10), transparent 72%);}
.jl-fx{position:absolute;inset:0;width:100%;height:100%;display:block}

/* 品牌區 */
.brand{padding:48px 0 24px;text-align:center}
.jl-hero{display:flex;flex-direction:column;align-items:center}
.jl-eyebrow{font-size:10.5px;letter-spacing:.46em;color:var(--gold);font-weight:700;margin:0 0 16px;padding-left:.46em}
.avatar.jl-avatar{
  width:150px;height:150px;margin:0 auto;border-radius:50%;overflow:hidden;border:0;background:#121009;
  box-shadow:0 0 0 1px rgba(217,195,137,.5), 0 0 0 7px rgba(217,195,137,.06), 0 0 46px -6px rgba(236,217,160,.4), 0 28px 62px rgba(0,0,0,.6);}
.avatar.jl-avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.avatar.jl-avatar>span{font-size:56px}
#brandName,.brand h1{font-family:var(--serif);font-weight:600;font-size:46px;letter-spacing:.02em;margin-top:20px;line-height:1;
  background:linear-gradient(180deg,#fbf4e0 0%,#ecd9a0 52%,#cbb06a 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
#tagline,.tagline{font-size:12.5px;color:var(--ink-2);font-weight:500;letter-spacing:.24em;margin-top:12px}
.jl-rule{width:54px;height:1px;margin:20px auto 0;background:linear-gradient(90deg,transparent,var(--gold),transparent);
  box-shadow:0 0 10px rgba(236,217,160,.5)}
#memberChip{margin-top:16px}

/* 區塊標題 */
.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:9px}
.block-head h2 small{font-family:var(--font);font-size:10px;letter-spacing:.26em;color:var(--ink-4);font-weight:700}
.more-link{color:var(--gold)} .more-link:hover{color:var(--gold-2)}

/* 尊榮方案卡 */
.plans{gap:12px}
.plan{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:border-color .2s, box-shadow .2s, transform .12s}
.plan::before{content:'';position:absolute;top:0;left:16px;right:16px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.45}
.plan:hover{border-color:rgba(217,195,137,.4);transform:translateY(-1px)}
.plan.on{border-color:rgba(217,195,137,.65);box-shadow:inset 0 0 0 1px rgba(217,195,137,.35), 0 0 36px -8px rgba(236,217,160,.55)}
.plan.is-featured{border-color:rgba(217,195,137,.45)}
.plan.is-featured::before{height:2px;opacity:.85}
.plan-name{color:var(--ink)} .plan-sub{color:var(--ink-3)}
.plan-price b{font-family:var(--serif);font-size:1.18em;color:var(--gold-2)} .plan-price b small{color:var(--ink-3)}
.plan-was{color:var(--ink-4)}
.plan-tag{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#171207}
.plan-feats li{color:var(--ink-2)} .plan-feats li::before{color:var(--gold)}
.tick{border-color:var(--ink-4)}
.plan.on .tick,.pay.on .tick{border-color:var(--gold);background:var(--gold)}
.plan.on .tick::after,.pay.on .tick::after{color:#171207}

/* 付款方式 */
.pays{gap:10px}
.pay{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.pay:hover{border-color:rgba(217,195,137,.4)}
.pay.on{border-color:var(--gold);background:rgba(217,195,137,.08)}
.pay b{color:var(--ink)} .pay span{color:var(--ink-3)}

/* 聯絡表單 */
.fld>span{color:var(--ink-2)} .fld i{color:var(--gold-2)} .fld em{color:var(--ink-4)}
.fld input,.fld select,.fld textarea{background:rgba(14,12,8,.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(--gold);box-shadow:0 0 0 3px rgba(217,195,137,.14);outline:none}

/* 結帳列 */
.checkout{background:rgba(12,11,8,.93);border-top:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.total #totalLabel,.total span{color:var(--ink-3)}
#totalAmount{font-family:var(--serif);font-size:1.15em;color:var(--gold-2)}
.pay-btn{background:linear-gradient(135deg,#efdca6,#d9c389);color:#171207;font-weight:800;border:0;box-shadow:0 10px 30px rgba(217,195,137,.3)}
.pay-btn:hover{filter:brightness(1.06)} .pay-btn:disabled{opacity:.5;filter:none}
.fineprint{color:var(--ink-4)}

/* 注意事項（免責框）：黑金玻璃、左側金條 */
.disclaimer{background:rgba(23,21,15,.62) !important;border:1px solid var(--line) !important;
  border-left:3px solid var(--gold) !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(217,195,137,.05),rgba(217,195,137,.12),rgba(217,195,137,.05));border-radius:var(--r)}

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