/*
 * patch_cta.css — Team Epsilon UX 修補
 * 範圍：聯絡表單、頁尾、浮動 CTA、CTA Strip
 * 深色主題 / amber 色系不變
 */

/* ── 表單輸入 Focus State ──────────────────────────────────── */

/* 加入 focus 時的 amber glow 邊框與陰影，並補齊 transition */
.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--amber-d);
  box-shadow: 0 0 0 3px rgba(212, 168, 67, 0.15);
  transition: border-color 0.2s, box-shadow 0.2s;
}

/* placeholder 顏色統一使用 --white-3（較暗的提示色） */
.form-input::placeholder,
.form-textarea::placeholder {
  color: var(--white-3);
}

/* select 預設顯示也使用 --white-3 */
.form-select {
  color: var(--white-3);
}

/* ── 表單送出按鈕 ──────────────────────────────────────────── */

/* hover 加入 amber 光暈，強化可點擊感 */
.form-submit:hover {
  background: var(--amber-l);
  box-shadow: 0 0 16px rgba(212, 168, 67, 0.25);
}

/* active 按壓縮放，提供物理回饋 */
.form-submit:active {
  transform: scale(0.98);
}

/* ── Checkbox 群組 Focus ──────────────────────────────────── */

/* 整個 checkbox-row 取得 focus-within 時加入 amber 低亮光暈 */
.checkbox-row:focus-within {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px rgba(212, 168, 67, 0.12);
  border-radius: 4px;
}

/* ── Contact Channels ─────────────────────────────────────── */

/* channel 列 hover 時給予極淡白色背景與圓角，增加互動感 */
.channel {
  transition: background 0.2s;
  border-radius: 6px;
  padding-left: 8px;
  padding-right: 8px;
}

.channel:hover {
  background: rgba(255, 255, 255, 0.03);
}

/* channel-icon 加入 amber 光暈，讓圖示更聚焦 */
.channel-icon {
  filter: drop-shadow(0 0 6px rgba(212, 168, 67, 0.2));
}

/* ── CTA Strip ────────────────────────────────────────────── */

/* 頂部加 border-top 讓 strip 從內容區自然分隔（amber 調性） */
.cta-strip {
  border-top: 1px solid var(--line);
}

/* 標題使用負 letter-spacing，精煉壓縮感 */
.cta-strip h2 {
  letter-spacing: -0.02em;
}

/* ── Float CTA ────────────────────────────────────────────── */

/* 浮動按鈕加深陰影，強化懸浮於頁面上的視覺層次 */
.float-btn {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
  transition: all 0.2s ease;
}

/* hover 上移並加強陰影，清楚傳達可互動性 */
.float-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.55);
}

/* ── 頁尾欄位標題 ─────────────────────────────────────────── */

/* footer-col-title 用更大 letter-spacing 與更小字體，精緻的欄位標籤感 */
.footer-col-title {
  letter-spacing: 0.08em;
  font-size: 0.7rem;
}

/* ── 頁尾連結 Hover ───────────────────────────────────────── */

/* 連結 hover 顯示 amber，與整體品牌色系對齊 */
.footer-links a:hover {
  color: var(--amber);
  transition: color 0.15s;
}

/* ── 頁尾底部分隔線 ───────────────────────────────────────── */

/* footer-bottom 確保有 line 分隔線（已有 footer-top 的 border-bottom，此處補底部） */
.footer-bottom {
  border-top: 1px solid var(--line);
  padding-top: 24px;
}

/* ── 版權文字 ─────────────────────────────────────────────── */

/* footer-copy 使用更暗的白色與更小字號，降低視覺權重 */
.footer-copy {
  color: var(--white-3);
  font-size: 0.75rem;
}
