/* Better Mood Body 網站共用樣式（價目表／初心／配搭頁）2026-11-14 */
:root{--cream:#F3EEE4;--ink:#3F4A3B;--muted:#6B7466;--line:rgba(63,74,59,.15);--s:#6F8466;--sand:#C9BFA6;--paper:#FFFDF8;--sc:"Pinyon Script",cursive}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--cream);color:var(--ink);font-family:"Noto Serif HK","Noto Serif TC",serif;line-height:1.75;letter-spacing:.03em;-webkit-font-smoothing:antialiased;background-image:linear-gradient(rgba(63,74,59,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(63,74,59,.05) 1px,transparent 1px);background-size:32px 32px}
a{color:inherit}
.wrap{max-width:720px;margin:0 auto;padding:0 18px}
.en{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic}
.top{position:sticky;top:0;z-index:10;background:rgba(243,238,228,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:56px;gap:10px}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;flex:none}
.brand img{width:30px}
.brand span{font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.28em}
.nav-links{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.nav-links a{white-space:nowrap;text-decoration:none;font-size:13.5px;padding:6px 9px;border-radius:999px;color:var(--muted)}
.nav-links a.on{background:var(--s);color:var(--cream)}
@media(max-width:520px){.brand span{display:none}}
.hero{padding:30px 0 10px}
.panel{position:relative;background:var(--s);color:var(--cream);padding:28px 24px 26px;overflow:hidden}
.panel .mono{position:absolute;right:14px;top:-18px;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:130px;line-height:1;color:rgba(243,238,228,.13)}
.panel .kick{position:relative;font-family:var(--sc);font-size:clamp(30px,8vw,40px);line-height:1.1}
.panel h1{position:relative;font-weight:900;font-size:clamp(32px,9vw,46px);line-height:1.25;letter-spacing:.06em;margin-top:6px}
.panel p{position:relative;font-size:15.5px;margin-top:12px;opacity:.95}
.sec{margin:34px 0}
.sec-h{margin-bottom:14px}
.sec-h .k{font-family:var(--sc);font-size:30px;color:var(--s);line-height:1.1}
.sec-h h2{font-weight:900;font-size:24px;letter-spacing:.06em}
.paper{position:relative;background:var(--paper);padding:22px 20px 18px;box-shadow:0 8px 20px rgba(63,74,59,.10);margin-top:22px}
.paper.tape::before{content:"";position:absolute;left:50%;top:-12px;width:100px;height:26px;margin-left:-50px;background:rgba(201,191,166,.85);transform:rotate(-2deg)}
.paper p{font-size:15.5px;margin-top:8px}
.paper p:first-child{margin-top:0}
.paper b{font-weight:700}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 28px;border-radius:999px;text-decoration:none;font-size:16px;font-weight:700;letter-spacing:.1em;background:var(--ink);color:var(--cream);border:0;cursor:pointer}
.btn.wa{background:#25D366;color:#fff}.btn.wa svg{width:20px;height:20px}
.btn.line{background:transparent;border:2px solid var(--ink);color:var(--ink)}
.btnrow{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.pill{display:inline-block;border-radius:999px;padding:2px 12px;font-size:13px;font-weight:600;letter-spacing:.06em}
.p1{background:var(--ink);color:var(--cream)}.p2{background:var(--s);color:var(--cream)}.p3{background:var(--sand);color:var(--ink)}
/* footer */
.site-foot{background:var(--ink);color:var(--cream);padding:40px 0 110px;margin-top:40px}
.fbrand{display:flex;align-items:center;gap:10px}.fbrand img{width:34px;filter:brightness(0) invert(1)}.fbrand span{font-family:"Cormorant Garamond",serif;font-size:14px;letter-spacing:.3em}
.fscript{font-family:var(--sc);font-size:38px;margin:14px 0 6px}
.frow{display:grid;grid-template-columns:86px 1fr;gap:10px;padding:10px 0;border-top:1px solid rgba(243,238,228,.2);font-size:15.5px;line-height:1.6}.frow b{font-weight:700;letter-spacing:.08em;opacity:.85}
.fbtns{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.site-foot .btn.line{border-color:var(--cream);color:var(--cream)}
.fnote{margin-top:18px;font-size:13px;letter-spacing:.12em;opacity:.75}
.wa-float{position:fixed;right:16px;bottom:18px;z-index:20;display:flex;align-items:center;gap:8px;background:#25D366;color:#fff;text-decoration:none;border-radius:999px;padding:12px 18px;font-size:15px;font-weight:700;box-shadow:0 8px 20px rgba(0,0,0,.2)}.wa-float svg{width:22px;height:22px}

.hwa{flex:none;display:inline-flex;align-items:center;gap:6px;background:#25D366;color:#fff;text-decoration:none;border-radius:999px;padding:6px 12px;font-size:13.5px;font-weight:700}.hwa svg{width:16px;height:16px}@media(max-width:560px){.hwa span{display:none}.hwa{padding:7px}}

@media(max-width:420px){.nav-links a{font-size:12.5px;padding:5px 6px}}

.top .wrap{max-width:1000px}.top .brand span{white-space:nowrap}.nav-links{flex:1;min-width:0;justify-content:flex-end}@media(max-width:760px){.top .brand span{display:none}}

.fbrand{flex-wrap:wrap;row-gap:8px}.ftag{font-style:normal;background:#C9BFA6;color:#3F4A3B;font-weight:900;font-size:14.5px;letter-spacing:.08em;padding:3px 12px;margin-left:6px}.fcare{margin-top:10px;font-size:15px;letter-spacing:.06em;opacity:.95}.fcare b{color:#C9BFA6}

@media(max-width:560px){.nav-links{justify-content:flex-start}.nav-links a{font-size:12px;padding:5px 5px;letter-spacing:0}}