/* =============================================================
   派遣 AI 長 — 文章內容樣式（content.css）
   專欄文章的編輯部級呈現:表格、FAQ、底線重點、粗體、重點框。
   套用範圍:.entry-content(Blocksy 文章內容容器)
   ============================================================= */

/* ---- 基礎排版 ---- */
.entry-content{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--brand-ink);}
.entry-content > p{margin-block:0 var(--space-5);}
.entry-content h2{font-family:var(--font-display);font-size:var(--fs-h3);
  line-height:1.5;font-weight:var(--fw-semibold);color:var(--brand-navy);
  margin:var(--space-8) 0 var(--space-5);padding-top:var(--space-5);
  border-top:1px solid var(--border-hair);}
.entry-content h3{font-size:var(--fs-h4);font-weight:var(--fw-semibold);
  color:var(--brand-ink);margin:var(--space-7) 0 var(--space-4);}
.entry-content ul,.entry-content ol{margin:0 0 var(--space-5);padding-left:1.4em;}
.entry-content li{margin-bottom:var(--space-2);line-height:1.85;}

/* ---- 導言(文章第一段,可加 class="art-lead") ---- */
.entry-content .art-lead{font-size:var(--fs-lead);line-height:var(--lh-lead);
  color:var(--ink-700);margin-bottom:var(--space-6);}

/* ---- 粗體:一律深藍,降低視覺噪音 ---- */
.entry-content strong,.entry-content b{color:var(--brand-navy);font-weight:var(--fw-bold);}

/* ---- 底線重點:馬克筆式(天藍淡底,取代傳統底線) ---- */
.entry-content u,.entry-content .hl{
  text-decoration:none;
  box-shadow:inset 0 -0.5em 0 var(--sky-100);
  padding-inline:1px;}

/* ---- 重點框(關鍵要點/結論先行) ---- */
.entry-content .art-key{
  background:var(--navy-50);border-left:3px solid var(--brand-sky);
  padding:var(--space-5) var(--space-6);margin:var(--space-6) 0;
  border-radius:0;}
.entry-content .art-key p:last-child{margin-bottom:0;}
.entry-content .art-key__label{display:block;font-size:var(--fs-eyebrow);
  font-weight:var(--fw-semibold);letter-spacing:var(--ls-caps);
  text-transform:uppercase;color:var(--sky-600);margin-bottom:var(--space-2);}

/* ---- 表格:髮絲線、深藍表頭 ---- */
.entry-content .art-table,
.entry-content table{width:100%;border-collapse:collapse;margin:var(--space-6) 0;
  font-size:var(--fs-sm);line-height:1.75;}
.entry-content table th{background:var(--brand-navy);color:#fff;
  font-weight:var(--fw-semibold);text-align:left;
  padding:12px 16px;border:0;}
.entry-content table td{padding:12px 16px;border:0;
  border-bottom:1px solid var(--border-hair);vertical-align:top;color:var(--ink-700);}
.entry-content table tr td:first-child{color:var(--brand-ink);font-weight:var(--fw-medium);}
.entry-content .art-table-wrap{overflow-x:auto;margin:var(--space-6) 0;}
.entry-content .art-table-wrap table{margin:0;min-width:560px;}

/* ---- FAQ 區塊 ---- */
.entry-content .art-faq{margin:var(--space-6) 0;border-top:1px solid var(--border-strong);}
.entry-content .art-faq__item{border-bottom:1px solid var(--border-hair);
  padding:var(--space-5) 0;}
.entry-content .art-faq__q{display:flex;gap:var(--space-3);align-items:baseline;
  margin:0 0 var(--space-3);font-family:var(--font-display);
  font-size:var(--fs-h5);font-weight:var(--fw-semibold);color:var(--brand-navy);}
.entry-content .art-faq__q::before{content:"Q";flex:none;
  font-family:var(--font-sans);font-size:var(--fs-cap);font-weight:var(--fw-bold);
  color:#fff;background:var(--brand-navy);width:22px;height:22px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:var(--radius-xs);transform:translateY(-2px);}
.entry-content .art-faq__a{margin:0;color:var(--ink-700);line-height:1.9;}

/* ---- 引言 ---- */
.entry-content blockquote{margin:var(--space-6) 0;padding-left:var(--space-6);
  border-left:3px solid var(--brand-sky);font-family:var(--font-display);
  font-size:var(--fs-h4);line-height:1.7;color:var(--brand-navy);
  font-weight:var(--fw-regular);}
.entry-content blockquote p{margin:0;}

/* ---- 文末 CTA 帶（動態光帶 + 軌道點 + 按鈕光暈，與首頁 CTA 同語彙）---- */
.entry-content .art-cta{position:relative;overflow:clip;
  background:
    radial-gradient(70% 120% at 85% 50%,
      color-mix(in srgb, var(--brand-navy) 55%, transparent), transparent 75%),
    var(--surface-deep);
  color:var(--on-surface);
  padding:var(--space-8) var(--space-7);margin:var(--space-8) 0 0;text-align:left;}
.entry-content .art-cta::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 38%,
    color-mix(in srgb, var(--brand-sky) 20%, transparent) 50%,transparent 62%);
  background-size:260% 100%;
  animation:artSweep 7s ease-in-out infinite;}
@keyframes artSweep{0%{background-position:130% 0;}
  55%{background-position:-30% 0;}100%{background-position:-30% 0;}}
.entry-content .art-cta::after{content:"";position:absolute;top:50%;right:-90px;
  width:280px;height:280px;transform:translateY(-50%);border-radius:50%;
  border:1px dashed color-mix(in srgb, var(--brand-sky) 50%, transparent);
  pointer-events:none;animation:artOrbit 40s linear infinite;}
@keyframes artOrbit{to{transform:translateY(-50%) rotate(360deg);}}
.entry-content .art-cta p{position:relative;z-index:1;
  color:var(--on-surface-muted);margin:0 0 var(--space-5);}
.entry-content .art-cta h4{position:relative;z-index:1;color:#fff;
  font-family:var(--font-display);font-size:var(--fs-h4);margin:0 0 var(--space-3);}
.entry-content .art-cta .btn{position:relative;z-index:1;
  background:#fff;color:var(--navy-900);
  display:inline-flex;align-items:center;gap:10px;}
.entry-content .art-cta .btn::before{content:"";position:absolute;inset:-7px;
  border:1px solid color-mix(in srgb, var(--brand-sky) 65%, transparent);
  border-radius:6px;pointer-events:none;
  animation:btnHaloArt 2.4s ease-out infinite;}
@keyframes btnHaloArt{0%{opacity:.9;transform:scale(.96);}
  70%{opacity:0;transform:scale(1.12);}100%{opacity:0;transform:scale(1.12);}}
.entry-content .art-cta .btn::after{content:"→";font-family:var(--font-sans);
  animation:artArrow 1.6s ease-in-out infinite;}
@keyframes artArrow{0%,100%{transform:translateX(0);}50%{transform:translateX(5px);}}
@media (prefers-reduced-motion:reduce){
  .entry-content .art-cta::before,.entry-content .art-cta::after,
  .entry-content .art-cta .btn::before,.entry-content .art-cta .btn::after{animation:none;}
}
