/* ══════════════════════════════════════════
   contact.html 專屬樣式
   所有字級皆引用 style.css 的 --fs-* token
   ══════════════════════════════════════════ */

* {  margin: 0; padding: 0; box-sizing: border-box;  }
.navbar {  position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: rgba(10,31,60,0.97); backdrop-filter: blur(12px); padding: 0 40px;  }
.page-hero {  background: linear-gradient(160deg, #0A1F3C 0%, #162247 100%); padding: 120px 40px 60px; text-align: center; color: white;  }
.section {  padding: 72px 40px;  }
.contact-grid {  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px;  }
.contact-card {  background: white; border-radius: var(--radius); padding: 28px; border: 1px solid var(--border); box-shadow: var(--shadow-sm);  }
.contact-card h3 {  font-size: var(--fs-md); font-weight: 800; margin-bottom: 20px;  }
.info-item {  display: flex; align-items: flex-start; gap: 14px; padding: 14px 0; border-bottom: 1px solid rgba(0,0,0,0.05);  }
.info-item:last-child {  border-bottom: none;  }
.info-icon {  width: 42px; height: 42px; background: var(--primary-light); border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: var(--fs-xl); flex-shrink: 0;  }
.info-text .label {  font-size: var(--fs-3xs); color: var(--text2); font-weight: 600; margin-bottom: 2px;  }
.info-text .value {  font-size: var(--fs-sm); font-weight: 700; color: var(--text);  }
.info-text .value a {  color: var(--primary); text-decoration: none;  }
.info-text .value a:hover {  text-decoration: underline;  }
.hotline-box {  background: linear-gradient(160deg, var(--primary), #0049CC); border-radius: var(--radius); padding: 28px; color: white; text-align: center; margin-bottom: 20px;  }
.hotline-box .icon {  font-size: var(--fs-4xl); margin-bottom: 8px;  }
.hotline-box .label {  font-size: var(--fs-3xs); opacity: 0.7; margin-bottom: 4px;  }
.hotline-box .number {  font-size: var(--fs-3xl); font-weight: 900; letter-spacing: 1px;  }
.hotline-box .note {  font-size: var(--fs-3xs); opacity: 0.6; margin-top: 6px;  }
.hours-table {  font-size: var(--fs-2xs);  }
.hours-table tr {  display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid rgba(0,0,0,0.05);  }
.hours-table tr:last-child {  border-bottom: none;  }
.hours-table .day {  color: var(--text2);  }
.hours-table .time {  font-weight: 700;  }
.hours-table .time.red {  color: #E53935;  }
.form-card {  background: white; border-radius: var(--radius); padding: 32px; border: 1px solid var(--border); box-shadow: var(--shadow-sm);  }
.form-card h3 {  font-size: var(--fs-lg); font-weight: 800; margin-bottom: 6px;  }
.form-card > p {  font-size: var(--fs-2xs); color: var(--text2); margin-bottom: 24px;  }
.form-row {  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px;  }
.form-group label span {  color: #E53935;  }
.form-group.full {  grid-column: 1 / -1;  }
.submit-btn {  width: 100%; padding: 14px; background: var(--primary); color: white; border: none; border-radius: var(--radius-sm); font-size: var(--fs-sm); font-weight: 700; cursor: pointer; transition: var(--transition); display: flex; align-items: center; justify-content: center; gap: 8px; font-family: inherit;  }
.submit-btn:hover {  background: var(--primary-dark); transform: translateY(-1px); box-shadow: 0 4px 16px rgba(0,104,255,0.3);  }
.form-note {  font-size: var(--fs-3xs); color: var(--text2); text-align: center; margin-top: 12px;  }
.success-msg {  text-align: center; padding: 40px 20px; display: none;  }
.success-msg.show {  display: block;  }
.success-msg .icon {  font-size: var(--fs-5xl); margin-bottom: 16px;  }
.success-msg h3 {  font-size: var(--fs-xl); font-weight: 800; margin-bottom: 8px;  }
.success-msg p {  font-size: var(--fs-xs); color: var(--text2);  }
footer {  background: var(--navy); color: white; padding: 56px 40px 0;  }
@media (max-width: 768px) {
.contact-grid {  grid-template-columns: minmax(0, 1fr);  }
.form-row {  grid-template-columns: minmax(0, 1fr);  }
.section {  padding: 56px 20px;  }
.page-hero {  padding: 110px 20px 50px;  }
.navbar {  padding: 0 20px;  }
}