/* ═══════════════════════════════════════════════════════════════
   脊整適 Chill Chiro — 個人化選課測驗 共用樣式（Quiz Core CSS）
   同時被首頁 index.html（Modal 內）與獨立頁 find-your-course.html
   （沉浸式頁面容器內）載入，確保視覺永遠一致，不會分流。
   修改此檔案即可同時更新兩個頁面的測驗外觀。
   ═══════════════════════════════════════════════════════════════ */

/* 開始 / 開始找答案 按鈕（首頁測驗入口區塊與獨立頁首屏共用） */
.btn-quiz-start{padding:15px 42px;border-radius:999px;background:transparent;border:1.5px solid var(--gold);color:var(--gold);font-size:14.5px;font-weight:600;letter-spacing:.08em;transition:background .35s,color .35s,transform .35s,box-shadow .35s;display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-family:inherit;}
.btn-quiz-start svg{width:15px;height:15px;transition:transform .35s;}
.btn-quiz-start:hover{background:var(--gold);color:#fff;transform:translateY(-3px);box-shadow:0 14px 32px rgba(184,137,74,.28);}
.btn-quiz-start:active{transform:translateY(-1px) scale(.97);}
.btn-quiz-start:hover svg{transform:translateX(3px);}

/* 進度條（極簡，不顯示精確題數） */
.quiz-progress-label{display:block;font-size:10.5px;letter-spacing:.24em;color:var(--text2);text-transform:uppercase;margin-bottom:10px;opacity:.65;}
.quiz-progress{width:100%;height:2px;background:rgba(33,28,21,.08);border-radius:2px;overflow:hidden;}
.quiz-progress-bar{height:100%;width:8%;background:var(--gold);border-radius:2px;transition:width .5s cubic-bezier(.4,0,.2,1);}

/* 題目／結果 進出場過場 */
.q-block,.r-block{opacity:0;transform:translateY(14px);transition:opacity .38s ease,transform .38s ease;}
.q-block.in,.r-block.in{opacity:1;transform:none;}
.q-block.out,.r-block.out{opacity:0;transform:translateY(-10px);}

/* ── 問題卡片 ── */
.q-title{font-family:'Cormorant Garamond','Noto Serif TC',serif;font-size:clamp(22px,3vw,30px);font-weight:400;color:var(--text);line-height:1.4;margin:14px 0 26px;}
.q-options{display:flex;flex-direction:column;gap:12px;}
.q-card{display:block;width:100%;text-align:left;padding:20px 22px;border-radius:16px;border:1px solid var(--line);background:#fff;cursor:pointer;transition:border-color .3s,box-shadow .3s,transform .3s,background .3s;font-family:inherit;}
.q-card:hover{border-color:var(--gold);box-shadow:0 10px 28px rgba(184,137,74,.14);transform:translateY(-2px);}
.q-card:active{transform:translateY(0) scale(.99);}
.q-card.picked{border-color:var(--gold);background:linear-gradient(135deg,rgba(184,137,74,.08),rgba(212,168,102,.03));}
.q-card-title{display:block;font-size:15.5px;font-weight:600;color:var(--text);margin-bottom:5px;line-height:1.5;}
.q-card-desc{display:block;font-size:13px;color:var(--text2);line-height:1.75;}
@media(max-width:640px){
  .q-card{padding:18px;}
  .q-card-title{font-size:15px;}
}

/* ── 結果卡片 ── */
.r-eyebrow{display:block;font-size:11px;letter-spacing:.24em;color:var(--sage);text-transform:uppercase;margin-bottom:10px;font-weight:500;}
.r-heading{font-family:'Cormorant Garamond',serif;font-size:clamp(24px,3.2vw,32px);font-weight:300;color:var(--text);line-height:1.3;margin-bottom:18px;}
.r-analysis{font-size:14px;color:var(--text2);line-height:1.95;margin-bottom:30px;padding-bottom:26px;border-bottom:1px solid var(--line);}

.r-primary-card{background:linear-gradient(160deg,#fff,var(--cream));border:1px solid rgba(184,137,74,.28);border-radius:24px;padding:28px 26px;box-shadow:var(--sh);margin-bottom:22px;}
.r-card-label{display:inline-block;font-size:10.5px;letter-spacing:.2em;color:var(--gold);text-transform:uppercase;font-weight:600;margin-bottom:12px;}
.r-course-name{font-family:'Cormorant Garamond',serif;font-size:clamp(22px,3vw,28px);font-weight:500;color:var(--text);line-height:1.3;margin-bottom:10px;}
.r-course-meta{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;}
.r-course-cat{font-size:12px;color:var(--sage);letter-spacing:.04em;padding:3px 10px;border:1px solid rgba(94,112,83,.3);border-radius:999px;}
.r-course-price{font-family:'Cormorant Garamond',serif;font-size:24px;color:var(--gold);font-weight:400;}
.r-course-reason{font-size:13.5px;color:var(--text2);line-height:1.85;margin-bottom:22px;}
.r-actions{display:flex;gap:12px;flex-wrap:wrap;}
.r-btn-primary{flex:1;min-width:150px;text-align:center;padding:14px 20px;border-radius:999px;background:var(--gold);color:#fff;font-size:14px;font-weight:600;letter-spacing:.04em;transition:background .3s,transform .3s;box-shadow:0 10px 26px rgba(184,137,74,.32);}
.r-btn-primary:hover{background:var(--gold2);transform:translateY(-2px);}
.r-btn-primary:active{transform:translateY(0) scale(.96);}
.r-btn-secondary{flex:1;min-width:150px;text-align:center;padding:14px 20px;border-radius:999px;border:1px solid var(--line);color:var(--text);font-size:14px;font-weight:500;transition:border-color .3s,background .3s,transform .3s;cursor:pointer;}
.r-btn-secondary:hover{border-color:var(--gold);background:rgba(184,137,74,.06);}
.r-btn-secondary:active{transform:scale(.97);}

.r-secondary-card{padding:18px 20px;border:1px dashed var(--line);border-radius:12px;margin-bottom:26px;opacity:.82;}
.r-card-label-sm{display:block;font-size:10px;letter-spacing:.18em;color:var(--text2);text-transform:uppercase;margin-bottom:8px;}
.r-secondary-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px;}
.r-course-name-sm{font-size:14.5px;font-weight:600;color:var(--text);}
.r-course-price-sm{font-family:'Cormorant Garamond',serif;font-size:17px;color:var(--gold);}
.r-link-sm{font-size:12.5px;color:var(--text2);text-decoration:underline;text-underline-offset:3px;cursor:pointer;}
.r-link-sm:hover{color:var(--gold);}

.r-restart{display:block;margin:8px auto 0;background:none;border:none;font-size:12.5px;color:var(--text2);letter-spacing:.06em;cursor:pointer;font-family:inherit;text-decoration:underline;text-underline-offset:3px;transition:color .3s;}
.r-restart:hover{color:var(--gold);}

/* 獨立測驗頁專用的「返回官方網站」次要連結（首頁 Modal 版不會用到，因為首頁本身就是官方網站） */
.r-return-link{display:block;text-align:center;margin:14px auto 0;font-size:12.5px;color:var(--text2);letter-spacing:.04em;text-decoration:underline;text-underline-offset:3px;transition:color .3s;}
.r-return-link:hover{color:var(--gold);}

@media(max-width:640px){
  .r-primary-card{padding:24px 20px;}
  .r-actions{flex-direction:column;}
  .r-btn-primary,.r-btn-secondary{width:100%;}
}

@media(prefers-reduced-motion:reduce){
  .q-block,.r-block,.q-card,.btn-quiz-start{transition:none!important;}
}