:root {--brand-blue: #1A365D; --brand-lightBlue: #2B6CB0; --brand-pink: #ED64A6; --brand-softPink: #FFF5F7; --brand-lightPink: #f696c5; --brand-gold: #D69E2E; --page-bg: #f5f5f5; --text-main: #333; --text-muted: #666;}
body {font-family: '微軟正黑體', 'Microsoft JhengHei', sans-serif; -webkit-font-smoothing: antialiased; height: 100%; padding: 0; margin: 0; color: var(--text-main); background-color: var(--page-bg); letter-spacing: .05rem;}
.container-fluid {padding: 0;}
.text-brand-blue {color: var(--brand-blue);}
.text-brand-pink {color: var(--brand-pink);}
.text-brand-gold {color: var(--brand-gold);}
.bg-brand-blue {background-color: var(--brand-blue);}
.bg-brand-softPink {background-color: var(--brand-softPink);}
.font-bold {font-weight: 700;}
.font-light {font-weight: 300;}
.section-py {padding-top: 70px; padding-bottom: 80px;}
.section-header {margin-bottom: 50px;}
.section-title {font-size: 3.6rem; font-weight: 700; color: var(--brand-blue); margin: 0 0 15px; line-height: 1.3;}
.section-intro {font-size: 1.8rem; color: var(--text-muted); line-height: 1.7; margin: 0;}
.hero-quick-links {margin-bottom: 5px;}
.hero-quick-links ul {font-size: 2.2rem; font-weight: 600; line-height: 3rem; text-align: center; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 16px 24px; padding: 0; margin: 0 0 20px;}
.hero-quick-links li {list-style: none; margin-bottom: 0;}
.hero-quick-links a {display: inline-flex; align-items: center; text-decoration: none; color: whitesmoke;}
.hero-quick-links a:hover {color: antiquewhite; text-decoration: none;}
.hero-quick-btn {background-color: var(--brand-pink); color: antiquewhite !important; border-radius: 50px; padding: 10px 22px; box-shadow: 0 4px 14px rgba(237, 100, 166, 0.4); transition: all .25s ease;}
.hero-quick-btn:hover {background-color: var(--brand-lightPink); color: whitesmoke !important; box-shadow: 0 4px 14px rgba(237, 100, 166, 0.4);}
.hero-pattern {background-image: linear-gradient(rgba(26,54,93,.78), rgba(26,54,93,.88)), url('./images/Contact_Us/bg.png'); background-size: cover; background-position: center; background-attachment: fixed; min-height: 60vh; display: flex; align-items: center; position: relative; margin-top: -20px; padding: 0 0 50px;}
.hero-divider {border-top: 1px solid #E1E1E1; margin: 0 0 50px;}
.hero-pattern h1 {font-size: 4rem; font-weight: 700; line-height: 1.3; margin: 0 0 24px;}
.hero-badge {display: inline-block; padding: 4px 16px; border-radius: 50px; background: rgba(237, 100, 166, 0.2); color: antiquewhite; font-weight: 700; letter-spacing: 1px; margin-bottom: 10px; border: 1px solid rgba(237, 100, 166, 0.3); font-size: 2rem;}
.hero-title {color: white;}
.hero-highlight {font-size: 2rem; color: var(--brand-gold); font-weight: 600; margin-bottom: 12px;}
.hero-text {font-size: 1.8rem; line-height: 1.7; color: #e5e7eb; font-weight: 300;}
.hero-wave-wrap {position: absolute; left: 0; bottom: 0; width: 100%; line-height: 0; overflow: hidden;}
.hero-wave-svg {display: block; width: 100%; height: 100px;}
.hero-wave-svg path {fill: var(--page-bg);}
.feature-card {background: white; border-radius: 16px; padding: 30px; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); transition: all 0.3s; height: 100%; margin-bottom: 30px;}
.feature-card:hover {transform: translateY(-5px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);}
.feature-icon-wrapper {width: 64px; height: 64px; background: var(--brand-softPink); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; transition: transform 0.3s;}
.feature-card:hover .feature-icon-wrapper {transform: scale(1.1);}
.feature-card h3 {font-size: 2.2rem; font-weight: 700; margin: 0 0 15px; color: var(--text-main); text-align: center; line-height: 1.5;}
.feature-card p {color: var(--text-muted); line-height: 1.8; font-size: 1.6rem; margin: 0;}
.truth-section {background: white; position: relative; overflow: hidden;}
.truth-row {display: flex; flex-wrap: wrap; align-items: center;}
.truth-img-wrapper {border-radius: 16px; overflow: hidden; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); position: relative; margin-bottom: 30px;}
.truth-img-wrapper img {width: 100%; height: auto; display: block;}
.truth-img-overlay {position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(to top, rgba(0,0,0,0.7), transparent); padding: 30px; color: white; font-size: 1.8rem;}
.truth-img-overlay p {margin: 0;}
.truth-kicker {text-transform: uppercase; letter-spacing: 1px; display: block; margin-bottom: 10px; font-size: 1.6rem;}
.truth-title {font-size: 3.6rem; line-height: 1.3; margin: 0 0 24px; color: var(--brand-blue); font-weight: 700;}
.truth-content {font-size: 1.8rem; color: var(--text-muted); line-height: 1.8;}
.truth-content p {margin: 0 0 18px;}
.truth-highlight {color: var(--brand-blue); font-size: 2.2rem; font-weight: 700; padding-top: 10px;}
.alert-custom {background-color: var(--brand-softPink); border-left: 4px solid var(--brand-pink); padding: 24px; border-radius: 0 8px 8px 0; margin: 20px 0;}
.alert-title {margin: 0 0 10px; color: var(--brand-blue); font-size: 2rem; font-weight: 700;}
.alert-text {margin: 0; font-size: 1.6rem; line-height: 1.8; color: var(--text-main);}
.success-section {background: var(--brand-blue); color: white;}
.success-title {margin: 0 0 15px; font-size: 3.6rem; font-weight: 700;}
.success-intro {margin: 0; font-size: 2rem; color: #a9c4e0;}
.stat-item {margin-bottom: 30px; text-align: center;}
.stat-number {font-size: 48px; font-weight: 900; color: var(--brand-gold); margin-bottom: 10px;}
.stat-desc {font-size: 18px; color: #d1d5db;}
.success-note {margin: 40px 0 0;}
.success-note p {color: #d1d5db; font-size: 16px; line-height: 1.8; margin: 0;}
.partnership-kicker {display: inline-block; padding: 4px 12px; border-radius: 50px; background-color: var(--brand-blue); color: white; font-size: 1.3rem; font-weight: 700; letter-spacing: 1px; margin-bottom: 20px;}
.partnership-title {font-size: 3.2rem; margin: 0 0 24px; color: var(--brand-blue); font-weight: 700;}
.partnership-text {font-size: 1.6rem; color: var(--text-muted); line-height: 1.8; margin: 0 0 24px;}
.partnership-list {list-style: none; padding: 0; margin: 0; color: var(--text-muted); font-size: 1.6rem;}
.partnership-list li {margin-bottom: 15px; display: flex; align-items: flex-start;}
.partnership-list li:last-child {margin-bottom: 0;}
.partnership-list i {margin-top: 4px; margin-right: 12px; color: var(--brand-pink);}
.contact-card {background: white; border-radius: 16px; padding: 30px; border: 1px solid #e5e7eb; box-shadow: 0 10px 15px -3px rgba(0,0,0,0.05);}
.contact-card h3 {margin: 0 0 24px; color: var(--brand-blue); font-size: 2.8rem; font-weight: 700;}
.form-control-custom {border-radius: 8px; padding: 12px 16px; height: auto; border: 1px solid #d1d5db; box-shadow: none; font-size: 1.6rem;}
.form-control-custom:focus {border-color: var(--brand-pink); box-shadow: 0 0 0 3px rgba(237, 100, 166, 0.2);}
.form-group label {font-size: 2rem; font-weight: normal; color: var(--brand-pink);}
.btn-submit {background-color: var(--brand-blue); font-size: 1.8rem; color: white; border: none; border-radius: 8px; padding: 15px; font-weight: 700; width: 100%; transition: background 0.3s;}
.btn-submit:hover {background-color: var(--brand-lightBlue); color: white;}
.faq-section {background: #fff;}
.faq-item {margin-bottom: 28px;}
.faq-item h3 {margin: 0 0 10px; font-size: 2.2rem; color: var(--text-main); font-weight: 700; line-height: 1.5;}
.faq-item p {margin: 0; font-size: 1.7rem; color: var(--text-muted); line-height: 1.8;}
::-webkit-input-placeholder {font-size: 2rem !important; line-height: 3rem !important;}
:-moz-placeholder {font-size: 2rem !important; line-height: 3rem !important;}
::-moz-placeholder {font-size: 2rem !important; line-height: 3rem !important;}
@media (max-width: 767px) {
  .hero-quick-links ul {gap: 10px 16px;}
  .hero-quick-links a,
  .hero-quick-btn {font-size: 1.8rem;}
  .hero-quick-btn {padding: 8px 16px;}
  .hero-pattern {min-height: 65vh; padding: 0 0 35px; margin-top: 0; background-attachment: scroll;}
  .hero-divider {margin-bottom: 24px;}
  .hero-pattern h1 {font-size: 3rem; margin-bottom: 10px;}
  .hero-badge {font-size: 1.6rem; margin-bottom: 0; color: pink;}
  .hero-text {font-size: 1.6rem;}
  .page-summary p,
  .section-intro,
  .truth-content,
  .faq-item p,
  .partnership-text,
  .feature-card p {font-size: 1.5rem;}
  .section-title,
  .truth-title,
  .success-title,
  .partnership-title {font-size: 2.8rem;}
  .contact-card h3 {font-size: 2.4rem;}
}
@media (min-width: 992px) {
  .stat-divider {border-right: 1px solid rgba(255,255,255,0.2);}
  .stat-divider:last-child {border-right: none;}
}
