/*
 Theme Name: GeneratePress Child - 金富翁
 Template: generatepress
 Version: 3.0
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@700;900&family=Noto+Sans+TC:wght@400;500;700&display=swap');

:root {
  --gold: #c9a84c;
  --gold-light: #f0c040;
  --gold-dark: #8a6b20;
  --bg: #0a0600;
  --bg2: #110900;
  --bg3: #160f02;
  --border: #2a1f08;
  --text: #f0e8d0;
  --muted: #7a6030;
}

*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: hidden; }

body {
  background: var(--bg) !important;
  color: var(--text) !important;
  font-family: 'Noto Sans TC', sans-serif !important;
  margin: 0; padding: 0; overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }

/* ── 導航 ── */
.site-header { background: var(--bg2) !important; border-bottom: 2px solid var(--gold) !important; box-shadow: 0 2px 20px rgba(0,0,0,0.8) !important; width: 100%; position: relative; z-index: 100; }
.site-title a { color: var(--gold-light) !important; font-family: 'Noto Serif TC', serif !important; font-weight: 900 !important; font-size: clamp(1em, 3.5vw, 1.4em) !important; text-shadow: 0 0 20px rgba(240,192,64,0.4) !important; }
.site-description { color: var(--muted) !important; font-size: 0.78em !important; }
.main-navigation a { color: var(--text) !important; font-weight: 500 !important; font-size: 0.92em !important; transition: color 0.2s; }
.main-navigation a:hover, .main-navigation .current-menu-item > a { color: var(--gold-light) !important; }
.main-navigation .menu { background: var(--bg2) !important; }
.main-navigation .sub-menu { background: var(--bg3) !important; border: 1px solid var(--border) !important; }
.menu-toggle { background: transparent !important; border: 1px solid var(--gold) !important; color: var(--gold) !important; border-radius: 4px !important; }

/* ── 全域 ── */
a { color: var(--gold) !important; text-decoration: none !important; transition: color 0.2s; }
a:hover { color: var(--gold-light) !important; }
h1,h2,h3,h4,h5 { font-family: 'Noto Serif TC', serif !important; color: var(--gold-light) !important; line-height: 1.4; word-break: break-word; }

/* ── 版面 ── */
.site-content, .content-area, #page, .site-inner { background: var(--bg) !important; }

/* ── 文章/頁面 ── */
.post, article { background: var(--bg3) !important; border: 1px solid var(--border) !important; border-radius: 10px !important; padding: 24px !important; margin-bottom: 16px !important; transition: border-color 0.25s; }
.post:hover { border-color: var(--gold) !important; }
.entry-title { font-size: clamp(1em, 3vw, 1.25em) !important; margin: 0 0 10px !important; }
.entry-title a { color: var(--gold-light) !important; }
.entry-title a:hover { color: #fff !important; }
.entry-meta, .entry-footer { color: var(--muted) !important; font-size: 0.82em !important; }
.entry-content p { color: var(--text) !important; line-height: 1.9 !important; }
.entry-content h2, .entry-content h3 { color: var(--gold-light) !important; }
.entry-content ul li, .entry-content ol li { color: var(--text) !important; margin-bottom: 6px; }
.entry-content table { width: 100%; border-collapse: collapse; display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.entry-content th { background: var(--bg3) !important; color: var(--gold-light) !important; border: 1px solid var(--border) !important; padding: 10px 12px !important; }
.entry-content td { border: 1px solid var(--border) !important; padding: 8px 12px !important; color: var(--text) !important; }
.entry-content blockquote { border-left: 3px solid var(--gold) !important; background: var(--bg3) !important; padding: 14px 18px !important; border-radius: 0 8px 8px 0 !important; color: #d4b96a !important; }
.cat-links a, .tags-links a { background: rgba(201,168,76,0.15) !important; border: 1px solid rgba(201,168,76,0.4) !important; color: var(--gold-light) !important; padding: 2px 9px !important; border-radius: 4px !important; font-size: 0.76em !important; font-weight: 700 !important; display: inline-block; margin: 2px; }

/* ── 側邊欄 ── */
.widget { background: var(--bg3) !important; border: 1px solid var(--border) !important; border-radius: 10px !important; padding: 18px !important; margin-bottom: 18px !important; }
.widget-title { color: var(--gold-light) !important; font-family: 'Noto Serif TC', serif !important; font-size: 0.95em !important; font-weight: 700 !important; border-bottom: 2px solid var(--gold) !important; padding-bottom: 10px !important; margin-bottom: 14px !important; }
.widget ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.widget ul li { border-bottom: 1px solid var(--border) !important; padding: 8px 0 !important; }
.widget ul li:last-child { border-bottom: none !important; }
.widget ul li a { color: #d4b96a !important; font-size: 0.88em !important; }
.widget ul li a:hover { color: var(--gold-light) !important; }

/* ── 按鈕/搜尋 ── */
.button, button, input[type="submit"] { background: linear-gradient(135deg, var(--gold), var(--gold-light)) !important; color: #0a0600 !important; border: none !important; border-radius: 6px !important; font-weight: 700 !important; padding: 10px 20px !important; cursor: pointer !important; }
.search-field { background: var(--bg3) !important; border: 1px solid var(--border) !important; color: var(--text) !important; border-radius: 6px !important; padding: 9px 12px !important; width: 100% !important; }
.search-field:focus { border-color: var(--gold) !important; outline: none !important; }

/* ── 分頁 ── */
.pagination { text-align: center; margin-top: 24px; }
.pagination .page-numbers { background: var(--bg3) !important; color: var(--gold) !important; border: 1px solid var(--border) !important; border-radius: 5px !important; padding: 6px 12px !important; margin: 3px !important; display: inline-block !important; }
.pagination .current, .pagination .page-numbers:hover { background: linear-gradient(135deg, var(--gold), var(--gold-light)) !important; color: #0a0600 !important; font-weight: 700 !important; }

/* ── 頁尾 ── */
.site-footer { background: var(--bg2) !important; border-top: 1px solid var(--border) !important; color: var(--muted) !important; text-align: center !important; padding: 28px 16px !important; }
.site-footer a { color: var(--gold) !important; }

/* ── 捲動條 ── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--gold-dark); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--gold); }

/* ════ 首頁元件 ════ */

.jfw-hero {
  width: 100%; background: var(--bg2);
  padding: clamp(50px,8vw,90px) 20px clamp(60px,10vw,100px);
  text-align: center; position: relative; overflow: hidden;
}
.jfw-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 60% at 50% 0%, #2d1900 0%, transparent 70%); pointer-events: none; }
.jfw-badge { display: inline-block; background: rgba(201,168,76,0.15); border: 1px solid rgba(201,168,76,0.4); color: #f0c040; border-radius: 20px; padding: 5px 18px; font-size: clamp(0.72em,2vw,0.85em); font-weight: 700; margin-bottom: 18px; letter-spacing: 1px; }
.jfw-hero h1 { font-size: clamp(2em,7vw,3.8em) !important; font-weight: 900 !important; color: #f0c040 !important; text-shadow: 0 0 40px rgba(240,192,64,0.4) !important; margin: 0 0 16px !important; line-height: 1.2 !important; }
.jfw-hero p { color: #b09060; font-size: clamp(0.9em,2.5vw,1.1em); max-width: 560px; margin: 0 auto 32px; line-height: 1.85; }

.jfw-nav-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; padding: 0 8px; }
.jfw-nav-btn { background: rgba(201,168,76,0.12); border: 1.5px solid rgba(201,168,76,0.5); color: #f0e8d0 !important; padding: 11px 20px; border-radius: 6px; font-weight: 600; font-size: clamp(0.82em,2vw,0.92em); text-decoration: none !important; transition: all 0.2s; display: inline-block; }
.jfw-nav-btn:hover { background: rgba(201,168,76,0.25) !important; border-color: var(--gold) !important; color: #f0c040 !important; transform: translateY(-2px); }
.jfw-nav-btn.primary { background: linear-gradient(135deg,#c9a84c,#f0c040) !important; color: #0a0600 !important; border-color: transparent !important; }
.jfw-nav-btn.primary:hover { opacity: 0.88 !important; color: #0a0600 !important; }

.jfw-stats { width: 100%; background: #0e0700; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); display: flex; justify-content: center; flex-wrap: wrap; }
.jfw-stat { text-align: center; padding: clamp(18px,3vw,28px) clamp(20px,4vw,40px); border-right: 1px solid var(--border); flex: 1 1 100px; }
.jfw-stat:last-child { border-right: none; }
.jfw-stat-num { font-family: 'Noto Serif TC', serif; font-size: clamp(1.6em,4vw,2.4em); font-weight: 900; color: #f0c040; line-height: 1; }
.jfw-stat-label { color: #6a5020; font-size: clamp(0.72em,1.8vw,0.82em); margin-top: 5px; }

.jfw-section { max-width: 1100px; margin: 0 auto; padding: 48px 16px 0; }
.jfw-section-header { text-align: center; margin-bottom: 28px; }
.jfw-section-header h2 { font-size: clamp(1.2em,3.5vw,1.7em) !important; margin-bottom: 8px !important; }
.jfw-section-header h2::after { content: ''; display: block; width: 48px; height: 3px; background: linear-gradient(90deg,#c9a84c,#f0c040); margin: 10px auto 0; border-radius: 2px; }
.jfw-section-header p { color: var(--muted); font-size: 0.9em; }

.jfw-cat-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(150px,1fr)); gap: 14px; }
.jfw-cat-card { background: var(--bg3); border: 1px solid var(--border); border-radius: 10px; padding: 24px 14px; text-align: center; text-decoration: none !important; display: block; transition: border-color 0.25s, transform 0.2s; }
.jfw-cat-card:hover { border-color: var(--gold) !important; transform: translateY(-4px); }
.jfw-cat-icon { font-size: 2em; margin-bottom: 10px; display: block; }
.jfw-cat-name { color: #f0c040 !important; font-weight: 700; font-size: 0.92em; display: block; margin-bottom: 4px; }
.jfw-cat-count { color: var(--muted); font-size: 0.75em; }

.jfw-main-grid { max-width: 1100px; margin: 0 auto; padding: 40px 16px 60px; display: grid; grid-template-columns: 1fr 280px; gap: 28px; align-items: start; }
.jfw-sec-title { color: #f0c040 !important; font-family: 'Noto Serif TC', serif !important; font-size: clamp(1em,3vw,1.2em) !important; margin: 0 0 16px !important; padding-bottom: 10px !important; border-bottom: 1px solid var(--border) !important; }
.jfw-post { background: var(--bg3); border: 1px solid var(--border); border-radius: 10px; padding: 20px; margin-bottom: 14px; transition: border-color 0.25s, transform 0.2s; }
.jfw-post:hover { border-color: var(--gold); transform: translateX(3px); }
.jfw-post-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.jfw-tag { background: rgba(201,168,76,0.15); border: 1px solid rgba(201,168,76,0.4); color: #f0c040; font-size: 0.72em; font-weight: 700; padding: 2px 9px; border-radius: 4px; white-space: nowrap; }
.jfw-post-date { color: var(--muted); font-size: 0.76em; }
.jfw-post-title { color: #f0e8d0; font-weight: 700; font-size: clamp(0.9em,2.5vw,1em); margin: 0 0 6px; line-height: 1.5; word-break: break-word; }
.jfw-post:hover .jfw-post-title { color: #f0c040; }
.jfw-post-excerpt { color: var(--muted); font-size: 0.82em; line-height: 1.6; margin: 0; }

/* ── 響應式 ── */
@media (max-width: 900px) {
  .jfw-main-grid { grid-template-columns: 1fr; }
  .jfw-sidebar { display: grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: 14px; }
}
@media (max-width: 600px) {
  .jfw-cat-grid { grid-template-columns: repeat(2,1fr); }
  .jfw-nav-btns { flex-direction: column; align-items: center; }
  .jfw-nav-btn { width: 100%; max-width: 300px; text-align: center; }
  .jfw-stat { flex: 1 1 45%; border-right: none; border-bottom: 1px solid var(--border); }
  .jfw-stat:nth-child(even) { border-left: 1px solid var(--border); }
  .jfw-stat:last-child { border-bottom: none; }
  .jfw-sidebar { grid-template-columns: 1fr; }
}

/* ════ 修正置中問題 ════ */

/* 強制移除 GeneratePress 容器限制 */
.page-template-front-page .site-content,
.home .site-content,
.home .content-area,
.home #primary,
.home .inside-article,
.home .entry-content,
.home article {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  border: none !important;
  background: transparent !important;
}

/* 移除 GeneratePress grid 限制 */
.home .grid-container,
.home .site-main {
  padding: 0 !important;
  max-width: 100% !important;
}

/* Hero 置中 */
.jfw-hero {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: clamp(16px, 5vw, 60px) !important;
  padding-right: clamp(16px, 5vw, 60px) !important;
}

/* 統計數字置中 */
.jfw-stats {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* Section 內容置中 */
.jfw-section,
.jfw-main-grid {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
}

/* ════ 文章內頁修正 ════ */

/* 強制所有內容區白底改深色 */
.single .site-content,
.single .content-area,
.single #primary,
.single .site-main,
.single article,
.single .post,
.single .inside-article,
.page .site-content,
.page .content-area,
.page #primary,
.page .site-main,
.page article,
.page .inside-article {
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* 文章容器 */
.single .inside-article,
.page .inside-article {
  background: var(--bg3) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: clamp(20px, 5vw, 40px) !important;
  max-width: 860px !important;
  margin: 32px auto !important;
}

/* 文章標題 */
.single .entry-title,
.page .entry-title {
  font-size: clamp(1.3em, 4vw, 2em) !important;
  color: var(--gold-light) !important;
  margin-bottom: 12px !important;
  line-height: 1.35 !important;
}

/* meta 資訊（日期、作者） */
.single .entry-meta,
.page .entry-meta {
  color: var(--muted) !important;
  font-size: 0.83em !important;
  margin-bottom: 24px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid var(--border) !important;
}
.single .entry-meta a,
.page .entry-meta a { color: var(--gold) !important; }

/* 文章正文 */
.single .entry-content,
.page .entry-content {
  background: transparent !important;
  color: var(--text) !important;
}

.single .entry-content p,
.page .entry-content p {
  color: var(--text) !important;
  line-height: 1.95 !important;
  margin-bottom: 1.2em !important;
}

.single .entry-content h2,
.page .entry-content h2 {
  color: var(--gold-light) !important;
  font-size: clamp(1.1em, 3.5vw, 1.45em) !important;
  margin: 1.8em 0 0.6em !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid var(--border) !important;
}

.single .entry-content h3,
.page .entry-content h3 {
  color: var(--gold) !important;
  font-size: clamp(1em, 3vw, 1.2em) !important;
  margin: 1.4em 0 0.5em !important;
}

.single .entry-content ul,
.single .entry-content ol,
.page .entry-content ul,
.page .entry-content ol {
  padding-left: 1.4em !important;
  margin-bottom: 1.2em !important;
}

.single .entry-content li,
.page .entry-content li {
  color: var(--text) !important;
  line-height: 1.85 !important;
  margin-bottom: 6px !important;
}

/* 表格 */
.single .entry-content table,
.page .entry-content table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 1.4em 0 !important;
  display: block !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}
.single .entry-content th,
.page .entry-content th {
  background: #1e1502 !important;
  color: var(--gold-light) !important;
  border: 1px solid var(--border) !important;
  padding: 10px 14px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
.single .entry-content td,
.page .entry-content td {
  border: 1px solid var(--border) !important;
  padding: 9px 14px !important;
  color: var(--text) !important;
}
.single .entry-content tr:hover td,
.page .entry-content tr:hover td {
  background: rgba(201,168,76,0.06) !important;
}

/* 引用區塊 */
.single .entry-content blockquote,
.page .entry-content blockquote {
  border-left: 3px solid var(--gold) !important;
  background: #1e1502 !important;
  padding: 14px 20px !important;
  border-radius: 0 8px 8px 0 !important;
  color: #d4b96a !important;
  margin: 1.4em 0 !important;
}

/* 文章底部 footer */
.single .entry-footer,
.page .entry-footer {
  color: var(--muted) !important;
  font-size: 0.82em !important;
  margin-top: 24px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--border) !important;
}

/* 導覽（上一篇/下一篇） */
.post-navigation {
  background: var(--bg3) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px !important;
  padding: 20px !important;
  margin: 16px auto !important;
  max-width: 860px !important;
  display: flex !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
.post-navigation .nav-label { color: var(--muted) !important; font-size: 0.75em !important; }
.post-navigation .nav-previous a,
.post-navigation .nav-next a { color: var(--gold) !important; font-weight: 600 !important; font-size: 0.9em !important; }
.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover { color: var(--gold-light) !important; }

/* 留言區 */
.comments-area {
  background: var(--bg3) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: clamp(16px,4vw,32px) !important;
  max-width: 860px !important;
  margin: 16px auto 40px !important;
}
.comments-title,
.comment-reply-title { color: var(--gold-light) !important; }
.comment-body { background: var(--bg2) !important; border: 1px solid var(--border) !important; border-radius: 8px !important; padding: 16px !important; margin-bottom: 12px !important; }
.comment-author .fn { color: var(--gold) !important; }
.comment-meta { color: var(--muted) !important; font-size: 0.8em !important; }
.comment-content p { color: var(--text) !important; }

/* 留言表單 */
.comment-form input,
.comment-form textarea {
  background: var(--bg2) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 6px !important;
  padding: 9px 12px !important;
  width: 100% !important;
}
.comment-form input:focus,
.comment-form textarea:focus { border-color: var(--gold) !important; outline: none !important; }
.comment-form label { color: var(--muted) !important; font-size: 0.88em !important; }

/* 手機版文章排版 */
@media (max-width: 600px) {
  .single .inside-article,
  .page .inside-article {
    margin: 16px 12px !important;
    padding: 18px !important;
    border-radius: 8px !important;
  }
  .post-navigation { margin: 12px !important; }
  .comments-area { margin: 12px 12px 32px !important; }
}

/* ════ 修正首頁 Hero 置中 ════ */
.home .jfw-hero,
.front-page .jfw-hero {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

/* 移除 GeneratePress grid 對首頁的左側限制 */
.home .grid-container,
.home .site-main,
.home #primary,
.home .content-area {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Hero 內所有子元素置中 */
.jfw-hero > * {
  position: relative;
  z-index: 1;
  width: 100%;
  text-align: center !important;
}

.jfw-hero h1,
.jfw-hero p,
.jfw-hero .jfw-badge {
  text-align: center !important;
  width: 100% !important;
}

.jfw-nav-btns {
  justify-content: center !important;
  width: 100% !important;
}

/* ════ 修正手機版文字被截斷 ════ */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

.site, #page, .site-content,
.grid-container, .site-main,
.content-area, #primary,
.inside-article, .entry-content,
.single .inside-article,
.page .inside-article {
  max-width: 100% !important;
  overflow-x: hidden !important;
  word-break: break-word !important;
  word-wrap: break-word !important;
}

/* 文章內頁手機版 */
@media (max-width: 768px) {
  .single .inside-article,
  .page .inside-article {
    margin: 12px 8px !important;
    padding: 16px !important;
    width: calc(100% - 16px) !important;
    box-sizing: border-box !important;
  }

  .entry-content,
  .entry-content p,
  .entry-content h2,
  .entry-content h3,
  .entry-content ul,
  .entry-content ol {
    max-width: 100% !important;
    overflow-x: hidden !important;
    word-break: break-word !important;
  }

  /* 目錄表格手機版 */
  .entry-content table {
    font-size: 0.82em !important;
    display: block !important;
    overflow-x: auto !important;
  }
}

/* ════ 手機版選單修正 ════ */

/* 選單按鈕樣式 */
.menu-toggle {
  background: transparent !important;
  border: 1.5px solid var(--gold) !important;
  color: var(--gold) !important;
  border-radius: 6px !important;
  padding: 7px 14px !important;
  font-size: 1.1em !important;
  cursor: pointer !important;
  z-index: 1000 !important;
  position: relative !important;
}

.menu-toggle:focus { outline: none !important; }
.menu-toggle .mobile-menu { color: var(--gold) !important; }

/* 手機版選單 — 浮動覆蓋（不推頁面） */
@media (max-width: 768px) {
  .main-navigation .menu,
  .main-navigation > div > ul,
  .main-navigation ul.menu {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    background: rgba(10,6,0,0.97) !important;
    border: none !important;
    border-right: 2px solid var(--gold) !important;
    z-index: 9999 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 60px 24px 40px !important;
    margin: 0 !important;
    overflow-y: auto !important;
  }

  /* 選單項目 */
  .main-navigation ul.menu li {
    width: 100% !important;
    max-width: 320px !important;
    text-align: center !important;
    border-bottom: 1px solid var(--border) !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }

  .main-navigation ul.menu li:last-child {
    border-bottom: none !important;
  }

  .main-navigation ul.menu li a {
    display: block !important;
    padding: 16px 20px !important;
    font-size: 1em !important;
    font-weight: 600 !important;
    color: var(--text) !important;
    letter-spacing: 0.5px !important;
  }

  .main-navigation ul.menu li a:hover,
  .main-navigation ul.menu .current-menu-item > a {
    color: var(--gold-light) !important;
    background: rgba(201,168,76,0.08) !important;
    border-radius: 6px !important;
  }

  /* 選單開啟時，header 維持固定不動 */
  .site-header {
    position: relative !important;
    z-index: 10000 !important;
  }

  /* 確保主內容不被推下去 */
  .main-navigation.toggled .menu,
  .main-navigation.toggled ul {
    position: fixed !important;
  }
}

/* ════ 手機選單 v2：右側滑入 ════ */
@media (max-width: 768px) {

  /* 預設隱藏，移到右側外面 */
  .main-navigation .menu,
  .main-navigation > div > ul,
  .main-navigation ul.menu {
    position: fixed !important;
    top: 0 !important;
    right: -100% !important;
    left: auto !important;
    width: 75% !important;
    max-width: 300px !important;
    height: 100vh !important;
    background: rgba(10,6,0,0.82) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-left: 1px solid var(--gold) !important;
    border-right: none !important;
    z-index: 9999 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 60px 28px 40px !important;
    margin: 0 !important;
    gap: 4px !important;
    transition: right 0.3s ease !important;
    overflow-y: auto !important;
  }

  /* 開啟時滑入 */
  .main-navigation.toggled .menu,
  .main-navigation.toggled > div > ul,
  .main-navigation.toggled ul.menu {
    right: 0 !important;
  }

  /* 選單項目 */
  .main-navigation ul.menu li {
    width: 100% !important;
    text-align: left !important;
    border-bottom: 1px solid rgba(42,31,8,0.6) !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }

  .main-navigation ul.menu li:last-child { border-bottom: none !important; }

  .main-navigation ul.menu li a {
    display: block !important;
    padding: 14px 4px !important;
    font-size: 0.95em !important;
    font-weight: 600 !important;
    color: var(--text) !important;
  }

  .main-navigation ul.menu li a:hover,
  .main-navigation ul.menu .current-menu-item > a {
    color: var(--gold-light) !important;
    background: transparent !important;
  }
}

/* ════ 選單按鈕顏色修正 ════ */
@media (max-width: 768px) {
  /* 漢堡按鈕：深棕金邊，半透明背景 */
  .menu-toggle {
    background: rgba(201,168,76,0.12) !important;
    border: 1.5px solid var(--gold) !important;
    color: var(--gold-light) !important;
    border-radius: 6px !important;
    padding: 7px 13px !important;
    font-size: 1em !important;
    line-height: 1 !important;
  }

  .menu-toggle:hover {
    background: rgba(201,168,76,0.25) !important;
  }

  /* 遮罩層（點外側關閉用） */
  .jfw-menu-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 9998;
    cursor: pointer;
  }

  .jfw-menu-overlay.active {
    display: block;
  }
}