/* 全方位行銷團隊・共用質感層 v3(2026-10-12)
   語言=「禮券/印鑑」:象牙紙紋+墨藍+朱紅+金線。每張卡都是一張實體票券(金線內框、紙漿漸層、柔影),
   數字/標記=朱紅印章,按鈕=立體朱漆+金圈。只覆寫外觀,不動文字與版面順序;主頁與 21 張決策頁共用。 */
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@600;700;900&display=swap");
:root{
  --ink:#16203a; --ink-2:#3b4255; --mute:#6f6a61;
  --paper:#f5efe3; --card:#fffbf3; --line:#e2d5bb;
  --hot:#c8402a; --hot-2:#a8321f; --hot-soft:#f9e7dc; --gold:#b48a3e; --gold-l:#e3cd9b; --ok:#2f7a55;
  --serif:"Noto Serif TC","Songti TC","PMingLiU",serif;
  --r:18px;
  --shadow:0 1px 0 rgba(255,255,255,.7) inset,0 1px 2px rgba(70,45,20,.08),0 16px 32px -16px rgba(90,55,25,.30);
  --ticket:linear-gradient(180deg,#fffcf6 0%,#fbf4e6 100%);
  --frame:inset 0 0 0 1px #fff,inset 0 0 0 5px #fffbf3,inset 0 0 0 6px rgba(180,138,62,.38);
}
body{background-color:var(--paper);color:var(--ink);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E")}

/* ── 字 ── */
h1,h2,h3,.vs-title,.opt b,.price .amt,.path b,.step b,.why b,.letter h3,.turn,.faq summary,.rule strong{font-family:var(--serif)}
h1{font-weight:900;line-height:1.28;letter-spacing:.005em}
h2{font-weight:900;line-height:1.36}
.hl,h1 .hl,h2 .hl{color:var(--hot);background:linear-gradient(transparent 66%,rgba(200,64,42,.15) 66%)}
.kicker,.eyebrow{display:inline-flex;align-items:center;gap:8px;color:#8a6a2c;font-weight:700;letter-spacing:.12em;font-size:14.5px}
.kicker::before,.eyebrow::before{content:"";width:8px;height:8px;background:var(--gold);transform:rotate(45deg);flex:none}
.sec-head h2::after{content:"";display:block;width:64px;height:2px;margin-top:14px;background:linear-gradient(90deg,var(--hot) 0 40%,var(--gold) 40% 100%)}
.final .sec-head h2::after,.final h2::after{margin-left:auto;margin-right:auto}

/* ── 頂欄:印鑑 logo ── */
.nav{background:rgba(245,239,227,.94);border-bottom:1px solid var(--line);box-shadow:0 1px 0 #fff}
.logo{font-weight:900}
.logo i{background:linear-gradient(145deg,#d24a32,#9d2c1b);border-radius:7px;color:#fff6e6;font-family:var(--serif);
  box-shadow:inset 0 0 0 2px rgba(255,236,200,.55),0 2px 4px rgba(120,40,20,.3)}
.nav-cta{color:var(--hot);border:1.5px solid var(--hot);background:#fffaf1;box-shadow:inset 0 0 0 2px #fffaf1,inset 0 0 0 3px rgba(200,64,42,.25)}

/* ── 按鈕:朱漆+金圈 ── */
.btn-hot{background:linear-gradient(180deg,#d8513a 0%,#c3402a 52%,#a8331f 100%);color:#fff8ec;border-radius:999px;letter-spacing:.06em;
  box-shadow:inset 0 0 0 2px rgba(255,226,178,.55),inset 0 1px 0 rgba(255,255,255,.35),inset 0 -3px 0 rgba(0,0,0,.14),0 12px 24px -10px rgba(168,51,31,.65);
  position:relative;overflow:hidden;text-shadow:0 1px 0 rgba(90,20,10,.35)}
.btn-hot::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,240,210,.5) 50%,transparent 70%);
  transform:translateX(-130%);animation:brandShine 4s ease-in-out infinite;pointer-events:none}
@keyframes brandShine{0%,55%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}
.btn-ghost{border-radius:999px;border-color:rgba(227,205,155,.7);color:#f6e7c8}
@media (prefers-reduced-motion:reduce){.btn-hot::after{animation:none}}

/* ── 票券卡(所有白卡共用) ── */
.row,.path,.step,.pain,.price,.why div,.rule,.opt,.carry,.chip{background:var(--ticket);border:1px solid var(--line);box-shadow:var(--frame),var(--shadow)}
.pain{border-radius:14px}
.pain i,.gift li i{border-radius:50%;background:radial-gradient(circle at 35% 30%,#dc5a41,#a8321f);color:#fff4e2;font-family:var(--serif);
  box-shadow:inset 0 0 0 1.5px rgba(255,228,190,.6),0 2px 4px rgba(120,40,20,.25)}
.turn{font-weight:700}
.turn em{color:var(--hot)}

/* 對照表:墨藍票頭+金線 */
.row{overflow:hidden}
.row h3{background:linear-gradient(180deg,#1d2947,#141c33);color:#f6e7c8;font-family:var(--serif);letter-spacing:.08em;border-bottom:2px solid var(--gold)}
.row .f{border-right:1px dashed var(--gold-l)}
.row .u{background:linear-gradient(180deg,#fdeee4,#f9e3d6)}
.row .so{border-top:1px dashed var(--gold-l);background:#fffdf8}
.vs-title{color:#8a6a2c;letter-spacing:.1em}

/* 時間軸步驟:朱印數字 */
.step .n{background:radial-gradient(circle at 35% 30%,#fbe9de,#f4d6c6);color:var(--hot-2);font-family:var(--serif);border-radius:12px;box-shadow:inset 0 0 0 1.5px rgba(200,64,42,.35)}
.step.big{border:1px solid var(--hot);box-shadow:inset 0 0 0 1px #fff,inset 0 0 0 5px #fffbf3,inset 0 0 0 6px rgba(200,64,42,.45),var(--shadow)}
.step.big .n{background:radial-gradient(circle at 35% 30%,#dc5a41,#a8321f);color:#fff4e2;box-shadow:inset 0 0 0 2px rgba(255,228,190,.6)}

/* 三條路:推薦那張=禮券+朱印「推薦」 */
.path{position:relative}
.path small{color:#8a6a2c;letter-spacing:.08em}
.path li.p::before{color:var(--ok)}
.path li.m::before{color:var(--hot)}
.path.best{background:linear-gradient(180deg,#fff6ec,#fbe8da);border:1px solid var(--hot);
  box-shadow:inset 0 0 0 1px #fff,inset 0 0 0 5px #fff6ec,inset 0 0 0 6px rgba(200,64,42,.5),0 18px 34px -16px rgba(168,51,31,.45)}
.path.best::after{content:"推薦";position:absolute;top:14px;right:14px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--serif);font-weight:900;font-size:14px;color:var(--hot);border:2px solid var(--hot);transform:rotate(-12deg);opacity:.85;
  box-shadow:inset 0 0 0 2px #fff6ec,inset 0 0 0 3px rgba(200,64,42,.6)}

/* 費用卡:墨藍框+金線 */
.price{border:1px solid var(--ink);box-shadow:inset 0 0 0 1px #fff,inset 0 0 0 5px #fffbf3,inset 0 0 0 6px rgba(22,32,58,.5),var(--shadow)}
.price small{color:#8a6a2c}
.price .q{border-top:1px dashed var(--gold-l);color:var(--hot)}
.carry{border-left:4px solid var(--gold);border-radius:12px}

/* FAQ */
.faq{border-top:1px solid var(--gold-l)}
.faq details{border-bottom:1px solid var(--gold-l)}
.faq summary::after{color:var(--gold)}

/* 圖框:像裱起來的相片 */
.opt-pic{box-shadow:0 0 0 1px var(--gold-l),0 10px 20px -12px rgba(90,55,25,.4)!important}
.hero-pic,.info,.scene,.gift-pic,.opt-pic{border:1px solid var(--line);box-shadow:0 0 0 6px #fffbf3,0 0 0 7px var(--gold-l),0 22px 40px -18px rgba(90,55,25,.45)}
.info{background:#fffbf3}
.hero-pic .chip{border-radius:12px}
.hero-pic .chip b{color:var(--hot);font-family:var(--serif)}

/* 結尾:墨藍+金 */
.final,footer{background:radial-gradient(120% 90% at 50% 0%,#24304f 0%,#16203a 62%,#0f1629 100%)}
.final{border-top:3px solid var(--gold)}
.final .kicker{color:var(--gold-l)}
.final .kicker::before{background:var(--gold-l)}
.final p{color:#d4d0c4}

/* 底部固定列 */
.dock{background:rgba(248,243,233,.97);border-top:1px solid var(--gold-l);box-shadow:0 -8px 20px -12px rgba(90,55,25,.3)}

/* ── 主頁專屬 ── */
.rule{border-left:4px solid var(--hot)}
.rule strong{color:var(--hot)}
.gift{background:linear-gradient(180deg,#fbf1e2,#f6e4cc);border-top:1px solid var(--gold-l);border-bottom:1px solid var(--gold-l)}
.cat h3{font-family:var(--serif)}
.cat h3::before{content:"";display:inline-block;width:8px;height:8px;background:var(--gold);transform:rotate(45deg);margin-right:4px;align-self:center}
.opt{border-radius:16px;border:1px solid var(--line)}
.opt:hover{border-color:var(--gold-l)}
.opt:has(input:checked){background:linear-gradient(180deg,#fff6ec,#fbe8da);border-color:var(--hot);
  box-shadow:inset 0 0 0 1px #fff,inset 0 0 0 5px #fff6ec,inset 0 0 0 6px rgba(200,64,42,.55),0 16px 30px -16px rgba(168,51,31,.45)}
.opt:has(input:checked) .tick{background:var(--hot);border-color:var(--hot)}
.opt .tick{border-color:var(--gold-l);background:#fffdf8}
.tiers .free{background:repeating-linear-gradient(90deg,transparent 0 6px,transparent 6px 12px),linear-gradient(180deg,#fdf3df,#f8e9c9);color:var(--ink);
  border:1.5px dashed var(--gold);box-shadow:none;border-radius:10px}
.tiers .free em{color:#8a6a2c}
.tiers .free::after{background:radial-gradient(circle at 35% 30%,#dc5a41,#a8321f);color:#fff4e2;box-shadow:inset 0 0 0 1px rgba(255,228,190,.6)}
.tiers .up{background:#fffdf8;border:1px solid var(--line);border-top:3px solid var(--ink);color:var(--ink-2)}
.tiers .up em{color:var(--ink)}
.uplink{color:var(--hot);border-bottom-color:var(--gold)}
.tag-new{background:var(--hot);border-radius:4px}
.letter{background:linear-gradient(180deg,#1d2947,#141c33);border:1px solid var(--gold);box-shadow:inset 0 0 0 5px #16203a,inset 0 0 0 6px rgba(227,205,155,.45),var(--shadow)}
.letter small,.letter .sign{color:var(--gold-l)}
.why div{border-radius:var(--r)}

/* 成果照(上線 3 個月後) */
.scene.result{position:relative;max-width:900px;margin:26px auto 0}
.scene.result img{aspect-ratio:auto}
.result-tag{position:absolute;left:14px;top:14px;background:var(--hot);color:#fff;font-family:var(--serif);font-weight:700;font-size:15px;padding:6px 14px;border-radius:999px;box-shadow:0 0 0 2px var(--gold-l),0 6px 14px -6px rgba(0,0,0,.5)}