:root {
  --bg: #071a14;
  --bg-soft: #0b241d;
  --panel: #0d241c;
  --panel-alt: #133228;
  --card: rgba(255,255,255,0.04);
  --line: rgba(255,255,255,0.1);
  --gold: #d4af37;
  --gold-soft: #efd37d;
  --text: #f6f0de;
  --muted: #a7b7ad;
  --ok: #7be2b0;
  --maxw: 1180px;
  --shadow: 0 24px 60px rgba(0,0,0,0.28);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Noto Sans TC", "PingFang TC", system-ui, sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at top left, rgba(212,175,55,0.15), transparent 24%),
    linear-gradient(180deg, #071a14 0%, #06120f 100%);
  line-height: 1.7;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.container { width: min(calc(100% - 2rem), var(--maxw)); margin: 0 auto; }
.site-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--line); backdrop-filter: blur(16px); background: rgba(7,26,20,0.88); }
.site-header .inner, .footer-inner { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding: 1rem 0; }
.site-header .inner { flex-wrap: wrap; }
.brand { display:flex; align-items:center; gap:0.9rem; font-weight:800; }
.brand-badge { width: 2.6rem; height: 2.6rem; border-radius: 0.9rem; display:grid; place-items:center; background: var(--gold); color:#071a14; font-weight:900; }
.nav { display:flex; gap:1.25rem; flex-wrap:wrap; color: var(--muted); font-size:0.95rem; }
.nav a:hover { color: var(--gold-soft); }
.hero { padding: 4.5rem 0 3rem; border-bottom:1px solid var(--line); }
.hero-grid { display:grid; gap:2rem; grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr); align-items:start; }
.eyebrow { display:inline-block; padding:0.35rem 0.85rem; border-radius:999px; background:rgba(212,175,55,0.12); border:1px solid rgba(212,175,55,0.22); color: var(--gold-soft); font-size:0.78rem; font-weight:800; letter-spacing:0.12em; }
.hero h1 { margin: 1rem 0 1rem; font-size: clamp(2.3rem, 5vw, 4.5rem); line-height:1.08; color: var(--text); }
.hero p { color: var(--muted); font-size:1.07rem; }
.hero-note { margin-top: 1rem; font-size: 0.95rem; color: var(--gold-soft); }
.hero-visual { display: grid; gap: 1rem; }
.hero-image { width: 100%; min-height: 240px; object-fit: cover; border-radius: 1rem; border: 1px solid rgba(255,255,255,0.08); }
.actions { display:flex; flex-wrap:wrap; gap:0.9rem; margin-top: 1.5rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; padding: 0.95rem 1.4rem; border-radius: 999px; font-weight:800; transition: 0.2s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: linear-gradient(135deg, #efd37d, #d4af37); color:#071a14; box-shadow: var(--shadow); }
.btn-secondary { border:1px solid var(--line); background:rgba(255,255,255,0.04); color: var(--text); }
.panel, .stat-card, .article-card, .faq-item, .highlight-card, .article-shell, .toc-card { border:1px solid var(--line); background: var(--card); border-radius: 1.5rem; box-shadow: var(--shadow); }
.panel { padding: 1.5rem; }
.meta-list { margin:1.25rem 0 0; padding:0; list-style:none; }
.meta-list li { display:flex; justify-content:space-between; gap:1rem; padding:0.8rem 0; border-bottom:1px solid rgba(255,255,255,0.08); }
.meta-list li:last-child { border-bottom:0; }
.trust-bar, .section { padding: 1.4rem 0 4rem; }
.trust-grid, .stats-grid, .highlights, .article-grid, .faq-grid, .footer-grid { display:grid; gap:1rem; }
.trust-grid { grid-template-columns: repeat(4, 1fr); color: var(--muted); font-size:0.95rem; }
.trust-grid > div { border: 1px solid var(--line); background: rgba(255,255,255,0.03); border-radius: 1rem; padding: 1rem; }
.stats-grid { grid-template-columns: repeat(3, 1fr); }
.stat-card, .highlight-card, .article-card, .faq-item { padding: 1.35rem; }
.section-title { display:flex; justify-content:space-between; gap:1.5rem; align-items:end; margin-bottom: 1.5rem; }
.section-title h2 { margin:0; font-size: clamp(1.9rem, 3.5vw, 3rem); }
.section-title p { margin:0; color: var(--muted); max-width: 42rem; }
.highlights { grid-template-columns: repeat(3, 1fr); }
.article-grid { grid-template-columns: repeat(2, 1fr); }
.article-card h3 { margin: 0.9rem 0 0.55rem; font-size:1.35rem; color: var(--text); }
.article-card-cover { margin: 0.85rem 0 0; border-radius: 1rem; overflow: hidden; border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03); aspect-ratio: 16 / 9; }
.article-card-cover img { width: 100%; height: 100%; object-fit: cover; }
.article-card p, .highlight-card p, .faq-item p { color: var(--muted); }
.kicker { color: var(--gold-soft); font-size: 0.82rem; font-weight:800; letter-spacing: 0.12em; text-transform: uppercase; }
.tag-row { display:flex; flex-wrap:wrap; gap:0.55rem; margin-top:1rem; }
.tag { border:1px solid rgba(212,175,55,0.26); color: var(--gold-soft); padding:0.3rem 0.7rem; border-radius:999px; font-size:0.82rem; }
.compare-table { width:100%; border-collapse: collapse; overflow:hidden; border-radius:1rem; }
.compare-table th, .compare-table td { padding:0.9rem 1rem; border-bottom:1px solid rgba(255,255,255,0.08); text-align:left; }
.compare-table tbody tr:hover { background: rgba(255,255,255,0.03); }
.compare-table th { color: var(--gold-soft); font-size:0.9rem; }
.compare-table td { color: var(--muted); }
.callout { padding:1rem 1.1rem; border-left:4px solid var(--gold); background:rgba(212,175,55,0.08); border-radius: 0 1rem 1rem 0; color: var(--text); }
.footer { border-top:1px solid var(--line); padding:1rem 0 2rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:1rem; color: var(--muted); }
.footer-links a:hover, .trust-link:hover h3 { color: var(--gold-soft); }
.trust-links { grid-template-columns: repeat(4, 1fr); }
.trust-link { display:block; }
.footer-note { color: var(--muted); font-size:0.95rem; }
.breadcrumbs { padding: 1.25rem 0 0; color: var(--muted); font-size: 0.92rem; }
.article-layout { display:grid; grid-template-columns: minmax(0, 1fr) 300px; gap:1.25rem; padding: 1.5rem 0 4rem; }
.article-shell { padding: 2rem; }
.article-shell h1 { margin-top:0.4rem; font-size: clamp(2rem, 4vw, 3.3rem); line-height:1.15; }
.article-shell h2 { margin-top:2.2rem; font-size:1.65rem; }
.article-shell h3 { margin-top:1.4rem; font-size:1.2rem; }
.article-shell p, .article-shell li { color: var(--muted); }
.article-shell strong { color: var(--text); }
.article-shell ul, .article-shell ol { padding-left: 1.3rem; }
.article-shell table { width:100%; border-collapse: collapse; margin:1rem 0; }
.article-shell th, .article-shell td { padding:0.8rem; border-bottom:1px solid rgba(255,255,255,0.08); text-align:left; }
.toc-card { padding: 1.25rem; position: sticky; top: 5.6rem; }
.toc-card ul { margin:0.8rem 0 0; padding-left:1rem; color: var(--muted); }
.related-list { display:grid; gap:1rem; grid-template-columns: repeat(3, 1fr); margin-top: 1.5rem; }
.related-item { border:1px solid var(--line); border-radius:1.25rem; padding:1rem; background:rgba(255,255,255,0.03); }
.guide-journey { margin-top: 2rem; }
.journey-list { display:grid; gap:1rem; grid-template-columns: repeat(3, 1fr); margin-top: 1.5rem; }
.journey-item { border:1px solid var(--line); border-radius:1.25rem; padding:1rem; background:rgba(255,255,255,0.03); display:block; }
.journey-item strong { display:block; margin:0.5rem 0; }
.journey-label { font-size:0.8rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--muted); }
.journey-slug { display:block; margin-top:0.75rem; font-size:0.85rem; color:var(--gold-soft); word-break:break-all; }
@media (max-width: 980px) {
  .hero-grid, .article-layout { grid-template-columns: 1fr; }
  .trust-grid, .stats-grid, .highlights, .article-grid, .related-list, .trust-links, .journey-list { grid-template-columns: 1fr; }
  .nav { display:none; }
  .toc-card { position: static; }
  .section-title { align-items:start; flex-direction:column; }
}
@media (max-width: 720px) {
  .site-header .inner { flex-direction: column; align-items: flex-start; }
  .actions { flex-direction: column; }
  .btn { width: 100%; }
}
### [EOF]