/* 115.09.29 調查頁首屏、講座頁邀約區「聯繫晴晞」卡片式大按鈕（律師裁示採乙案；提案 93_系統報告/115.09.29_調查講座頁聯繫大按鈕三版提案）。
   整張卡片為一個連結，連聯繫頁 #investigation／#training；卡內行動提示＝金線＋方印（排版規範第七節第 9 點，不用底線文字）。
   色彩沿用官網：墨 #213e50、金 #957737、框金 #9c8450、卡底 #fbfaf6（同聯繫頁事由卡片）；深色 #1b3240 底、#dae3e7 字、#d8bf80 金。 */
.cta-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:6px 18px;width:100%;max-width:480px;padding:22px 22px 18px;border:1px solid #9c8450;background:#fbfaf6;color:#213e50;text-decoration:none;transition:background-color .3s,border-color .3s}
.cta-card-icon{grid-row:1/3;width:56px;height:56px;display:grid;place-items:center;border:1px solid #a58b51;border-radius:50%;color:#957737}
.cta-card-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.cta-card-en{font-family:var(--sans);font-size:12px;letter-spacing:.08em;color:#6f6245;text-transform:uppercase}
.cta-card strong{font-family:var(--serif);font-size:21px;font-weight:500;line-height:1.5}
.cta-card-desc{font-size:14px;line-height:1.8;color:#46596a}
.cta-card-go{grid-column:2;display:flex;align-items:center;gap:14px;margin-top:10px;font-size:15px;line-height:1.6;color:#213e50;white-space:nowrap;text-wrap-mode:nowrap}
.cta-card-go::after{content:"";order:2;flex:1;min-width:30px;height:1px;background:linear-gradient(90deg,rgba(149,119,55,.2),#957737);transition:background .4s}
.cta-card-go>i{order:3;flex:none;width:34px;height:34px;display:grid;place-items:center;background:#957737;color:#fff;font-style:normal;font-size:15px;line-height:1;transition:transform .3s,box-shadow .3s}
.cta-card:hover,.cta-card:focus-visible{background:#f3eee2;border-color:#957737}
.cta-card:hover .cta-card-go::after,.cta-card:focus-visible .cta-card-go::after{background:#957737}
.cta-card:hover .cta-card-go>i,.cta-card:focus-visible .cta-card-go>i{transform:translateX(4px);box-shadow:0 0 0 4px rgba(149,119,55,.2)}
.cta-card:focus-visible{outline:2px solid #957737;outline-offset:5px}

/* 深色 */
html[data-theme=dark] .cta-card{background:#1b3240;border-color:#a58b51;color:#dae3e7}
html[data-theme=dark] .cta-card:hover,html[data-theme=dark] .cta-card:focus-visible{background:#213a49;border-color:#d8bf80}
html[data-theme=dark] .cta-card:focus-visible{outline-color:#d8bf80}
html[data-theme=dark] .cta-card-icon{border-color:#c8b47f;color:#d8bf80}
html[data-theme=dark] .cta-card-en{color:#c8b47f}
html[data-theme=dark] .cta-card-desc{color:#bac7cb}
html[data-theme=dark] .cta-card-go{color:#dae3e7}
html[data-theme=dark] .cta-card-go::after{background:linear-gradient(90deg,rgba(216,191,128,.2),#d8bf80)}
html[data-theme=dark] .cta-card:hover .cta-card-go::after,html[data-theme=dark] .cta-card:focus-visible .cta-card-go::after{background:#d8bf80}
html[data-theme=dark] .cta-card-go>i{background:#d8bf80;color:#17232b}

/* 行動版：堆疊、卡片滿欄寬 */
@media(max-width:620px){
  .cta-card{max-width:100%;grid-template-columns:44px minmax(0,1fr);padding:18px 16px 16px;gap:6px 14px}
  .cta-card-icon{width:44px;height:44px}
  .cta-card-icon svg{width:22px;height:18px}
}
/* 115.09.30 第二小批（律師裁示）：「前往聯繫晴晞」不拆行（上方 .cta-card-go nowrap）；359 以下收窄內距與圖示、標題 21→19px，
   避免 320 寬「前往聯繫晴／晞」「……邀／約」單字落行；說明句「兩種管道」於 HTML 以 .nw-group 不拆（320 寬講座頁、768 寬調查頁原為「管／道」） */
@media(max-width:359px){
  .cta-card{grid-template-columns:40px minmax(0,1fr);padding:18px 14px 16px;gap:6px 12px}
  .cta-card-icon{width:40px;height:40px}
  .cta-card strong{font-size:19px}
  .cta-card-go{gap:12px}
  .cta-card-go::after{min-width:24px}
}
@media(prefers-reduced-motion:reduce){.cta-card,.cta-card-go>i,.cta-card-go::after{transition:none}}
