:root{
  --ink:#141110;
  --paper:#faf6f0;
  --paper-dim:#f0e9df;
  --red:#a4272c;
  --red-deep:#7a1c20;
  --gold:#c9a24b;
  --gold-soft:#e8d5a3;
  --line:rgba(20,17,16,0.12);
  --muted:#6b6158;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:"Noto Sans TC","Microsoft JhengHei",sans-serif;
  background:var(--paper);
  color:#332e2a;
  line-height:1.9;
}
h1,h2,h3,.serif{font-family:"Noto Serif TC","Microsoft JhengHei",serif;}
a{color:inherit;}
.wrap{max-width:760px; margin:0 auto; padding:0 24px;}

header{
  position:sticky; top:0; z-index:50;
  background:rgba(250,246,240,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
nav.wrap{display:flex; align-items:center; justify-content:space-between; min-height:64px; max-width:900px;}
.brand{font-family:"Noto Serif TC",serif; font-weight:900; font-size:1.05rem; text-decoration:none;}
.brand span{color:var(--red);}
.back{font-size:0.88rem; font-weight:700; color:var(--red); text-decoration:none;}

article{padding:56px 0 20px;}
.cat{
  display:inline-block; background:var(--paper-dim); color:var(--red); font-size:0.78rem;
  font-weight:700; letter-spacing:0.04em; padding:4px 12px; border-radius:999px; margin-bottom:18px;
}
h1.title{font-size:clamp(1.5rem,4vw,2.1rem); line-height:1.5; margin-bottom:26px;}
.lede{font-size:1.05rem; color:#4a433d; margin-bottom:36px;}
h2.sub{font-size:1.2rem; margin:40px 0 16px; color:var(--red-deep);}
p{margin-bottom:18px; font-size:1rem;}
.tablewrap{overflow-x:auto; margin:24px 0; border:1px solid var(--line); border-radius:12px;}
table{width:100%; border-collapse:collapse; font-size:0.88rem; background:#fff;}
th,td{padding:12px 14px; text-align:left; border-bottom:1px solid var(--line); white-space:nowrap;}
th{background:var(--paper-dim); color:var(--red-deep); font-weight:700;}
tr:last-child td{border-bottom:none;}

.case{
  background:var(--paper-dim); border-left:3px solid var(--gold); border-radius:8px;
  padding:20px 22px; margin:28px 0; font-size:0.95rem;
}
.case .k{color:var(--red); font-weight:700; font-size:0.85rem; letter-spacing:0.05em; margin-bottom:8px; display:block;}

.framework{
  background:var(--ink); color:#d8d0c4; border-radius:16px; padding:32px 28px; margin:36px 0;
}
.framework .k{color:var(--gold); font-size:0.8rem; letter-spacing:0.1em; margin-bottom:6px; display:block;}
.framework h3{color:#fff; font-size:1.15rem; margin-bottom:14px;}
.framework ul{padding-left:1.2em; margin-bottom:14px;}
.framework li{margin-bottom:10px; font-size:0.92rem;}
.framework p.out{font-size:0.88rem; color:#b9afa2; border-top:1px solid rgba(255,255,255,0.12); padding-top:14px;}

.quadgrid{display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin:28px 0;}
@media (max-width:560px){ .quadgrid{grid-template-columns:1fr;} }
.quad{background:#fff; border:1px solid var(--line); border-radius:12px; padding:18px 20px;}
.quad .e{font-size:1.3rem; margin-bottom:6px;}
.quad h4{font-size:0.95rem; margin-bottom:6px;}
.quad p{font-size:0.85rem; color:var(--muted); margin-bottom:0;}

.disclaimer{font-size:0.82rem; color:var(--muted); border-top:1px solid var(--line); padding-top:20px; margin-top:40px;}

.ctaband{
  background:linear-gradient(120deg, var(--red-deep), var(--red)); color:#fff;
  text-align:center; padding:48px 24px; border-radius:16px; margin:40px 0;
}
.ctaband h3{font-size:1.3rem; margin-bottom:10px;}
.ctaband p{color:#f4dede; margin-bottom:20px;}
.cta-btn{
  background:#fff; color:var(--red-deep); padding:11px 26px; border-radius:999px;
  font-weight:700; font-size:0.92rem; text-decoration:none; display:inline-block;
}

.related{padding:20px 0 60px;}
.related h4{font-size:0.9rem; color:var(--muted); margin-bottom:12px;}
.related a{display:block; padding:14px 0; border-bottom:1px solid var(--line); font-weight:700; text-decoration:none; color:var(--ink);}
.related a:hover{color:var(--red);}

footer{background:var(--ink); color:#9a9082; padding:36px 24px; font-size:0.8rem; text-align:center; line-height:1.9;}
footer a{color:var(--gold-soft); text-decoration:none;}

/* FLOATING LINE BUTTON */
.line-float{
  position:fixed; right:20px; bottom:20px; z-index:60;
  display:flex; align-items:center; gap:9px; text-decoration:none;
  background:#06C755; color:#fff; padding:13px 20px 13px 15px; border-radius:999px;
  font-weight:700; font-size:0.92rem; box-shadow:0 8px 22px rgba(6,199,85,0.4);
  animation:line-pulse 2.6s ease-in-out infinite;
}
.line-float:hover{animation-play-state:paused; box-shadow:0 10px 26px rgba(6,199,85,0.5);}
.line-float svg{width:22px; height:22px; flex-shrink:0;}
.line-float .txt{white-space:nowrap;}
@media (max-width:768px){
  .line-float{padding:14px; border-radius:50%; right:16px; bottom:16px;}
  .line-float .txt{display:none;}
}
@keyframes line-pulse{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.06);}
}