/* ────────────────────────────────────────────────────────────
   全站精修層 site-refine.css

   放在各頁 <style> 之後載入，只做「收斂」不做「重寫」：
   修掉結構缺陷（高度不齊、按鈕不對齊），並把過重的視覺調細緻。

   原則：
   · 尺寸收斂 —— 同一種元件在每頁長得一樣
   · 重量減輕 —— 字重、陰影、圓角、字距都往下調一階
   · 留白拉開 —— 行距與間距放鬆，讓內容自己呼吸
   改任何一條之前先想：這是在修缺陷，還是只是換口味？
   ──────────────────────────────────────────────────────────── */

/* ── 1. 日期卡：等高、按鈕貼齊底部 ──
   原本卡片沒有 flex，內容長短不同時按鈕就會高低不一。 */
.dates-grid{
  align-items: stretch;
  gap: 18px;
}
.date-card{
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  padding: 26px 24px 22px;
  border: 1px solid rgba(184,146,42,.18);
  box-shadow: 0 1px 3px rgba(58,53,48,.04), 0 8px 24px rgba(58,53,48,.06);
  transition: border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.date-card:hover{
  border-color: rgba(184,146,42,.55);
  transform: translateY(-2px);
  box-shadow: 0 2px 6px rgba(58,53,48,.05), 0 14px 34px rgba(58,53,48,.10);
}
/* 詳細資訊撐開剩餘空間，把按鈕推到底 */
.date-card .date-detail{
  flex: 1 1 auto;
  margin-bottom: 20px;
  line-height: 1.8;
}
.date-card .signup-btn{ margin-top: auto; }

/* ── 2. 日期字：數字對齊、字距收斂 ── */
.date-month{
  font-size: 11px;
  letter-spacing: 2.5px;
  font-weight: 500;
  opacity: .9;
  margin-bottom: 8px;
}
.date-num{
  font-size: 25px;
  font-weight: 600;
  letter-spacing: .01em;
  font-variant-numeric: tabular-nums;
  margin-bottom: 10px;
}
.date-loc{
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: .02em;
  margin-bottom: 6px;
}
.date-detail{ font-size: 13px; }

/* ── 3. 按鈕：從「粗獷」調成「安靜但清楚」──
   原本 16px/700/字距1.5/大漸層/濃陰影，四項疊在一起就重了。 */
.signup-btn,
.event-signup-btn{
  padding: 13px 22px;
  border-radius: 10px;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: .06em;
  background: var(--gold, #b8922a);
  box-shadow: 0 1px 2px rgba(138,109,26,.18);
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.signup-btn:hover,
.event-signup-btn:hover{
  background: var(--gold-deep, #8a6d1a);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(138,109,26,.24);
}
.signup-btn:focus-visible,
.event-signup-btn:focus-visible{
  outline: 2px solid var(--gold-deep, #8a6d1a);
  outline-offset: 3px;
}
.signup-btn .signup-sub,
.signup-sub{
  font-size: 10px;
  font-weight: 400;
  letter-spacing: .18em;
  opacity: .72;
  margin-top: 4px;
}

/* ── 4. 段落標題：字距與間距收斂 ── */
.section-eyebrow{
  font-size: 11px;
  letter-spacing: .28em;
  font-weight: 500;
  margin-bottom: 12px;
}
.section-heading,
.section-title{
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.35;
  text-wrap: balance;
  margin-bottom: 30px;
}

/* ── 5. 區塊留白：上下呼吸一致 ── */
.dates-section{ padding: 64px 0; }

/* ── 6. 近期開課卡：對齊與重量 ── */
.event-card{
  border-radius: 14px;
  transition: border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.event-card:hover{ transform: translateY(-2px); }
.event-card .meta{ line-height: 1.9; }

/* ── 7. 導覽列：字距放鬆一點，不要擠 ── */
.aol-nav-links{ gap: 20px; }
.aol-nav-links a{ letter-spacing: .03em; }

/* ── 8. 內文行距 ── */
body{ letter-spacing: .01em; }

/* ── 9. 頁尾：字距收斂、層次拉開 ──
   原本 letter-spacing 4px／3px／2px 三層都很寬，
   中文被拉散、英文像招牌字，整體顯得鬆散粗糙。 */
footer{
  padding: 64px 24px 40px;
  background: linear-gradient(180deg, #f7f0e4 0%, #f2e9d9 100%);
  border-top: 1px solid rgba(184,146,42,.14);
}
footer .footer-logo{ margin-bottom: 18px; }
footer .footer-logo img{
  height: 42px;
  opacity: .92;
}
footer .footer-name{
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .22em;
  margin-bottom: 8px;
  color: #2d3559;
}
footer .footer-tag{
  font-size: 11.5px;
  letter-spacing: .16em;
  color: #9a7b28;
  margin-bottom: 0;
  font-style: italic;
  opacity: .9;
}
footer .footer-divider{
  height: 1px;
  max-width: 220px;
  margin: 26px auto 20px;
  background: linear-gradient(90deg, transparent, rgba(184,146,42,.32), transparent);
}
footer .copyright{
  font-size: 11px;
  letter-spacing: .1em;
  color: #9c8a70;
}

@media (max-width: 640px){
  .dates-grid{ grid-template-columns: 1fr; gap: 14px; }
  .date-card{ padding: 22px 20px 20px; }
  .date-num{ font-size: 23px; }
  .dates-section{ padding: 48px 0; }
  footer{ padding: 48px 20px 32px; }
  footer .footer-name{ font-size: 15px; letter-spacing: .18em; }
  footer .footer-logo img{ height: 36px; }
}

@media (prefers-reduced-motion: reduce){
  .date-card, .signup-btn, .event-signup-btn, .event-card{ transition: none; }
  .date-card:hover, .event-card:hover,
  .signup-btn:hover, .event-signup-btn:hover{ transform: none; }
}
