/* 恆美全站設計規則 fm-ui（2026-10-05 開始）
   跟首頁同一套樣子：米色紙底、墨色字、明體標題、白色卡片、紅褐色點綴；不用 emoji 小圖示。
   顏色只用 7 個（從 Tim 偏愛的 16 色挑，跟 fm-brand-tokens 同名）：
   紙 #f4f1ea、墨 #2b2b2b、內文 #4a4540、淡字 #67605a、線 #e6dfd3、紅褐 #a63737、咖啡 #6b4f22（＋白色卡片；LINE 按鈕用 LINE 綠）
   這個檔由 Worker 插進頁面（src/worker.js 的 FM_UI），頁面內容用 .fm-ui 開頭的 class。 */

:root{
  --ui-paper:var(--fm-bg,#f4f1ea); --ui-ink:var(--fm-iron,#2b2b2b); --ui-text:var(--fm-text,#4a4540); --ui-muted:var(--fm-muted,#67605a);
  --ui-line:var(--fm-line,#e6dfd3); --ui-accent:var(--fm-russet,#a63737); --ui-brown:var(--fm-brown,#6b4f22); --ui-card:#fff;
  --ui-line-green:#06c755;
  --ui-serif:'Noto Serif TC','Songti TC','PMingLiU',serif;
  --ui-shadow:0 10px 36px rgba(43,43,43,.06);
}

/* ── 有 .fm-ui 內容的頁：整頁米色紙底 ── */
body:has(.fm-ui){background:var(--ui-paper)}
body:has(.fm-ui) .site-main{background:transparent}
body:has(.fm-ui) .ct-container-full[data-vertical-spacing]{padding-top:10px}
@media (min-width:760px){body:has(.fm-ui) .ct-container-full[data-vertical-spacing]{padding-top:24px}}
.fm-ui{color:var(--ui-text);line-height:1.85;font-size:1rem}
.fm-ui *{box-sizing:border-box}
.fm-ui img{max-width:100%;height:auto;display:block}
.fm-ui a{color:var(--ui-brown);text-underline-offset:3px}
.fm-ui a:hover{color:var(--ui-accent)}
.fm-ui h1,.fm-ui h2,.fm-ui h3{font-family:var(--ui-serif);font-weight:500;color:var(--ui-ink);letter-spacing:.02em;line-height:1.45;scroll-margin-top:var(--scroll-margin-top-offset,90px)}
.fm-ui h1{font-size:clamp(1.85rem,6.4vw,2.9rem);margin:0 0 14px}
.fm-ui h2{font-size:clamp(1.45rem,4.6vw,2rem);margin:0 0 10px}
.fm-ui h3{font-size:1.2rem;margin:0 0 8px}
.fm-ui p{margin:0 0 14px}
.fm-ui .eyebrow{display:block;font-size:.8rem;letter-spacing:.18em;color:var(--ui-accent);margin:0 0 10px}
.fm-ui .lead{color:var(--ui-muted);margin:0 0 26px}

/* 區塊 */
.fm-ui .sec{padding:36px 0 6px}
.fm-ui .sec + .sec{border-top:1px solid var(--ui-line)}
.fm-ui .sec-head{margin:0 0 22px}
.fm-ui .grid2{display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:760px){.fm-ui .grid2{grid-template-columns:1fr 1fr;gap:22px}.fm-ui .sec{padding:64px 0 12px}}

/* 卡片 */
.fm-ui .card{background:var(--ui-card);border:1px solid rgba(43,43,43,.05);box-shadow:var(--ui-shadow);padding:22px 20px;border-radius:4px}
@media (min-width:760px){.fm-ui .card{padding:28px 30px}}
.fm-ui .card > :last-child{margin-bottom:0}

/* 按鈕 */
.fm-ui .btns{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 10px}
.fm-ui .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:2px;font-family:var(--ui-serif);font-size:1rem;letter-spacing:.05em;text-decoration:none;border:1px solid var(--ui-ink);transition:background .2s,color .2s,border-color .2s}
.fm-ui .btn-solid{background:var(--ui-ink);color:#fff}
.fm-ui .btn-solid:hover{background:var(--ui-accent);border-color:var(--ui-accent);color:#fff}
.fm-ui .btn-ghost{background:transparent;color:var(--ui-ink)}
.fm-ui .btn-ghost:hover{background:var(--ui-ink);color:#fff}
.fm-ui .btn-line{background:var(--ui-line-green);border-color:var(--ui-line-green);color:#fff}
.fm-ui .btn-line:hover{background:#05a648;border-color:#05a648;color:#fff}
.fm-ui .btn svg{width:18px;height:18px;flex:none}
.fm-ui .small{font-size:.9rem;color:var(--ui-muted)}
.fm-ui .go{font-family:var(--ui-serif);color:var(--ui-ink);border-bottom:1px solid currentColor;text-decoration:none;padding-bottom:3px}
.fm-ui .go:hover{color:var(--ui-accent)}

/* 重點小標籤 */
.fm-ui .facts{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.fm-ui .facts li{background:#fff;border:1px solid var(--ui-line);border-radius:99px;padding:5px 14px;font-size:.9rem;color:var(--ui-text)}

/* 表格 */
.fm-ui .tbl{width:100%;border-collapse:collapse;background:#fff;font-size:.96rem}
.fm-ui .tbl th,.fm-ui .tbl td{border-bottom:1px solid var(--ui-line);padding:11px 12px;text-align:left;vertical-align:top}
.fm-ui .tbl thead th{background:var(--ui-ink);color:#fff;font-weight:500;font-family:var(--ui-serif);letter-spacing:.04em}
.fm-ui .tbl td.num,.fm-ui .tbl th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.fm-ui .tbl .sub{display:block;font-size:.82rem;color:var(--ui-muted);font-weight:400}
.fm-ui .tbl.lookup td:first-child{width:36%}
.fm-ui .tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 10px}

/* 可以打開的「看更多」 */
.fm-ui details.more{background:#fff;border:1px solid var(--ui-line);border-radius:4px;margin:14px 0}
.fm-ui details.more > summary{cursor:pointer;list-style:none;padding:15px 18px;font-weight:700;color:var(--ui-ink);display:flex;justify-content:space-between;gap:12px;align-items:center}
.fm-ui details.more > summary::-webkit-details-marker{display:none}
.fm-ui details.more > summary::after{content:'＋';color:var(--ui-accent);font-weight:400}
.fm-ui details.more[open] > summary::after{content:'－'}
.fm-ui details.more > .in{padding:0 18px 18px}

/* 常見問題 */
.fm-ui .faq details{background:#fff;border:1px solid var(--ui-line);border-radius:4px;margin:0 0 10px}
.fm-ui .faq summary{cursor:pointer;padding:14px 18px;font-weight:700;color:var(--ui-ink);line-height:1.6;list-style:none;position:relative;padding-right:44px}
.fm-ui .faq summary::-webkit-details-marker{display:none}
.fm-ui .faq summary::after{content:'＋';position:absolute;right:18px;top:14px;color:var(--ui-accent);font-weight:400}
.fm-ui .faq details[open] summary::after{content:'－'}
.fm-ui .faq details p{margin:0;padding:0 18px 16px}

/* 客人怎麼說 */
.fm-ui .voices{display:grid;grid-template-columns:1fr;gap:14px;margin:0 0 14px}
@media (min-width:760px){.fm-ui .voices{grid-template-columns:repeat(3,1fr)}}
.fm-ui .voice{background:#fff;padding:22px 22px 18px;border-radius:4px;box-shadow:var(--ui-shadow);margin:0;position:relative}
.fm-ui .voice::before{content:'“';position:absolute;top:2px;left:14px;font-family:var(--ui-serif);font-size:2.6rem;line-height:1;color:rgba(166,55,55,.28)}
.fm-ui .voice blockquote{margin:10px 0 10px;padding:0;border:0;font-size:.98rem;line-height:1.85;color:var(--ui-text);font-style:normal}
.fm-ui .voice figcaption{font-size:.82rem;color:var(--ui-muted);text-align:left}

/* 照片 */
.fm-ui figure.photo{margin:0}
.fm-ui figure.photo img{border-radius:3px;box-shadow:var(--ui-shadow);background:#fff;padding:8px}
.fm-ui figure.photo figcaption{margin-top:8px;font-size:.84rem;color:var(--ui-muted);line-height:1.7}

/* 提醒框 */
.fm-ui .note{background:#fff;border-left:3px solid var(--ui-accent);padding:14px 18px;margin:14px 0;border-radius:0 4px 4px 0}
.fm-ui .note > :last-child{margin-bottom:0}

/* 清單 */
.fm-ui ul.ticks{list-style:none;margin:0 0 6px;padding:0}
.fm-ui ul.ticks li{position:relative;padding-left:22px;margin:0 0 10px}
.fm-ui ul.ticks li::before{content:'';position:absolute;left:4px;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--ui-accent)}
.fm-ui ul.ticks li .why{display:block;font-size:.9rem;color:var(--ui-muted)}

/* 相關頁 */
.fm-ui .links{display:grid;grid-template-columns:1fr;gap:10px;list-style:none;margin:0;padding:0}
@media (min-width:600px){.fm-ui .links{grid-template-columns:1fr 1fr}}
.fm-ui .links a{display:block;background:#fff;border:1px solid var(--ui-line);border-radius:4px;padding:14px 16px;text-decoration:none;color:var(--ui-ink)}
.fm-ui .links a b{display:block;font-family:var(--ui-serif);font-weight:500;font-size:1.05rem}
.fm-ui .links a span{display:block;font-size:.88rem;color:var(--ui-muted)}
.fm-ui .links a:hover{border-color:var(--ui-accent)}
.fm-ui .links a:hover b{color:var(--ui-accent)}

/* ── 點兩下就知道價錢 ── */
.fm-ui .pick{margin:0 0 6px}
.fm-ui .pick fieldset{border:0;margin:0 0 16px;padding:0;min-width:0}
.fm-ui .pick legend{font-family:var(--ui-serif);font-size:1.08rem;color:var(--ui-ink);margin:0 0 8px;padding:0}
.fm-ui .pick legend b{display:inline-block;width:1.7em;height:1.7em;line-height:1.7em;text-align:center;border-radius:50%;background:var(--ui-ink);color:#fff;font-size:.82rem;margin-right:8px;font-family:system-ui,sans-serif;vertical-align:1px}
.fm-ui .pick .opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:8px}
.fm-ui .pick .opts.two{grid-template-columns:1fr 1fr}
.fm-ui .pick label{position:relative;cursor:pointer}
.fm-ui .pick input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.fm-ui .pick label span{display:flex;height:100%;flex-direction:column;justify-content:center;min-height:48px;padding:8px 16px;border:1px solid var(--ui-line);border-radius:4px;background:#fff;color:var(--ui-text);line-height:1.4;transition:border-color .15s,background .15s}
.fm-ui .pick label small{font-size:.8rem;color:var(--ui-muted)}
.fm-ui .pick input:checked + span{border-color:var(--ui-ink);background:var(--ui-ink);color:#fff}
.fm-ui .pick input:checked + span small{color:#d9d3c8}
.fm-ui .pick input:focus-visible + span{outline:2px solid var(--ui-accent);outline-offset:2px}
.fm-ui .pick .hide{display:none}
.fm-ui .result{background:var(--ui-ink);color:#efeae0;border-radius:4px;padding:20px 20px 16px;margin:6px 0 0}
.fm-ui .result .price{font-family:var(--ui-serif);font-size:2.6rem;line-height:1.1;color:#fff;margin:0 0 6px;font-variant-numeric:tabular-nums}
.fm-ui .result .price small{font-size:1rem;color:#d9d3c8;margin-left:6px}
.fm-ui .result ul{margin:10px 0 0;padding:0 0 0 1.1em}
.fm-ui .result li{margin:0 0 4px}
.fm-ui .result a{color:#fff}

/* ════ 手機最下面固定一條：打電話／加 LINE／怎麼來 ════ */
.fm-bar{display:none}
@media (max-width:899px){
  .fm-bar{display:grid;grid-template-columns:1fr 1.25fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:90;background:#fff;border-top:1px solid #e6dfd3;box-shadow:0 -6px 20px rgba(43,43,43,.08);padding:6px 8px calc(6px + env(safe-area-inset-bottom));gap:6px}
  .fm-bar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:50px;border-radius:6px;text-decoration:none;color:#2b2b2b;font-size:.82rem;font-weight:700;letter-spacing:.04em;font-family:system-ui,-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif}
  .fm-bar a svg{width:22px;height:22px}
  .fm-bar a.line{background:#06c755;color:#fff}
  .fm-bar a:active{background:#f4f1ea}
  .fm-bar a.line:active{background:#05a648}
  body.fm-has-bar{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  /* 預購單的小計列本來黏在最下面 → 往上讓出底部按鈕的高度 */
  body.fm-has-bar .fm-order .total{bottom:calc(64px + env(safe-area-inset-bottom))}
  /* 選單打開時讓出位置 */
  body.ct-offcanvas-active .fm-bar,body[data-panel*="in"] .fm-bar{display:none}
}

/* ════ 手機選單：深色底、白字，服務直接攤開 ════ */
#offcanvas .ct-panel-inner{background:#2b2b2b !important}
#offcanvas{--theme-text-color:rgba(255,255,255,.92)}
#offcanvas .ct-menu-link,#offcanvas .ct-menu-link:visited{color:#fff !important}
#offcanvas .current-menu-item > .ct-menu-link,#offcanvas .current-menu-item > .ct-sub-menu-parent > .ct-menu-link{color:#f5d90a !important}
/* 「服務項目」直接攤開（Tim：14 個服務藏在小箭頭裡，很多人不知道要點）：分類變小標，服務一項一項列出來 */
#offcanvas .mobile-menu li.fm-mega > ul.sub-menu,#offcanvas .mobile-menu li.fm-mega > ul.sub-menu > li > ul.sub-menu{display:block !important;height:auto !important;opacity:1 !important;visibility:visible !important;max-height:none !important}
#offcanvas .mobile-menu li.fm-mega > .ct-sub-menu-parent .ct-toggle-dropdown-mobile,#offcanvas .mobile-menu li.fm-mega > ul.sub-menu > li > .ct-sub-menu-parent .ct-toggle-dropdown-mobile{display:none !important}
#offcanvas .mobile-menu li.fm-mega > ul.sub-menu > li > .ct-sub-menu-parent > .ct-menu-link{font-size:.78rem !important;font-weight:400 !important;letter-spacing:.16em;color:rgba(255,255,255,.55) !important;padding-top:16px !important}
#offcanvas .mobile-menu li.fm-mega > ul.sub-menu > li > ul.sub-menu > li > .ct-menu-link{font-size:1.02rem !important;font-weight:500 !important}
#offcanvas .ct-toggle-dropdown-mobile{color:#fff !important;width:44px;height:44px}
#offcanvas .ct-toggle-close{color:#fff !important}
#offcanvas .ct-toggle-close svg{fill:#fff}
#offcanvas .menu-item-description,#offcanvas .ct-menu-link .description{color:rgba(255,255,255,.62) !important}
#offcanvas [data-id] *{border-color:rgba(255,255,255,.15)}