/* 版面風格：優雅奢華與現代極簡的融合。使用象牙白與香檳色作為基調，搭配細膩的金屬色系（金色、古銅色）框線與漸層。強調視覺層次感、柔和的陰影效果，以及流暢的微互動體驗，營造出一種高質感且內斂的「英雄」氣息。 */
:root { --color-ivory: #FFFBF7; --color-champagne: #F8F5F0; --color-navy: #1a2332; --color-gold: #D4AF37; --color-gold-light: #f8ecc0; --color-gold-dark: #9e9877; --color-dark-text: #2d2d2d; --color-muted-text: #8a8a8a; --color-border: #E8E3DC; --bg-gradient: linear-gradient(135deg, var(--color-ivory) 0%, var(--color-champagne) 100%); --gold-gradient: linear-gradient(135deg, var(--color-gold) 0%, rgba(212, 175, 55, 0.7) 100%); --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.08); --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Noto Sans TC', sans-serif; background: var(--bg-gradient); color: var(--color-dark-text); line-height: 1.6; min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
.container-fluid { width: 100%; max-width: 800px; position: relative; z-index: 1; }
.content-area { background: white; padding: 60px; border-radius: 24px; border: 1.5px solid var(--color-gold-light); box-shadow: var(--shadow-lg); position: relative; overflow: hidden; }
.content-area::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--gold-gradient); }
h2 { color: var(--color-navy); font-weight: 300; font-size: 32px; letter-spacing: 2px; margin-bottom: 40px; position: relative; display: inline-block; }
h2::after { content: ''; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 40px; height: 1px; background: var(--color-gold); }
h3 { color: var(--color-gold-dark); font-size: 18px; font-weight: 600; margin: 32px 0 16px; border-left: 3px solid var(--color-gold); padding-left: 15px; }
p, ul { color: var(--color-muted-text); font-size: 15px; margin-bottom: 20px; text-align: justify; }
ul { padding-left: 20px; list-style-type: none; }
ul li { position: relative; margin-bottom: 12px; padding-left: 24px; }
ul li::before { content: '✦'; position: absolute; left: 0; color: var(--color-gold); font-size: 12px; }
strong { color: var(--color-dark-text); font-weight: 600; }
.terms-link { color: var(--color-gold); text-decoration: none; border-bottom: 1px solid transparent; transition: var(--transition-smooth); }
.terms-link:hover { border-bottom-color: var(--color-gold); }
.back-button { display: inline-flex; align-items: center; justify-content: center; width: 100%; padding: 16px; margin-top: 40px; background: white; border: 1.5px solid var(--color-gold-dark); border-radius: 12px; color: var(--color-dark-text); text-decoration: none; font-weight: 500; transition: var(--transition-smooth); gap: 10px; }
.back-button:hover { background: var(--color-ivory); border-color: var(--color-gold); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(212, 175, 55, 0.15); }
@media (max-width: 768px) { body { padding: 20px 15px; } .content-area { padding: 40px 24px; } h2 { font-size: 26px; } }