* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Noto Sans TC', sans-serif; background-color: #fff9f9; color: #4a4a4a; line-height: 1.6; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
.scroll-reveal { opacity: 0; transform: translateY(40px); transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.scroll-reveal.is-active { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; }

header { background-color: rgba(255, 255, 255, 0.95); position: fixed; width: 100%; top: 0; z-index: 100; box-shadow: 0 2px 15px rgba(0,0,0,0.05); backdrop-filter: blur(5px); }
header .header-content { display: flex; justify-content: space-between; align-items: center; max-width: 1200px; margin: 0 auto; padding: 15px 5%; height: 70px; }
header .header-title h1 { font-size: 22px; font-weight: 700; color: #d66c7a; letter-spacing: 1px; }
header .header-nav { display: flex; gap: 30px; }
header .header-nav a { font-weight: 500; color: #555; transition: color 0.3s; }
header .header-nav a:hover { color: #d66c7a; }

@media (max-width: 768px) {
	header .header-nav { display: none; }
}

main { padding-top: 70px; }

#hero-section { min-height: 90vh; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; background: linear-gradient(135deg, #ffeef0 0%, #fffafb 100%); padding: 5%; }
#hero-section .hero-section-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; max-width: 1200px; margin: 0 auto; gap: 50px; z-index: 2; }
#hero-section .hero-section-left { padding-right: 5%; }
#hero-section .hero-section-title { font-size: 3.5rem; font-weight: 900; color: #c45b69; margin-bottom: 20px; line-height: 1.2; }
#hero-section .hero-section-subtitle { font-size: 1.2rem; color: #666; margin-bottom: 30px; font-weight: 300; }
#hero-section .hero-section-right { position: relative; }
#hero-section .hero-section-media { border-radius: 20px 100px 20px 100px; overflow: hidden; box-shadow: 0 20px 40px rgba(214, 108, 122, 0.15); transform: rotate(-2deg); transition: transform 0.5s; }
#hero-section .hero-section-media:hover { transform: rotate(0deg); }
#hero-section .hero-section-image { width: 100%; height: auto; object-fit: cover; aspect-ratio: 4/3; }

@media (max-width: 960px) {
	#hero-section .hero-section-grid { grid-template-columns: 1fr; text-align: center; }
	#hero-section .hero-section-left { padding-right: 0; }
	#hero-section .hero-section-title { font-size: 2.8rem; }
	#hero-section .hero-section-media { border-radius: 30px; transform: none; }
	#hero-section .hero-section-media:hover { transform: none; }
}

@media (max-width: 500px) {
	#hero-section .hero-section-title { font-size: 2.2rem; }
}

#origin-section { padding: 100px 5%; background-color: #fff; position: relative; }
#origin-section .origin-section-grid { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 5fr 7fr; gap: 60px; align-items: center; }
#origin-section .origin-section-title { font-size: 2.5rem; color: #333; margin-bottom: 20px; font-weight: 700; position: relative; padding-bottom: 15px; }
#origin-section .origin-section-title::after { content: ''; position: absolute; left: 0; bottom: 0; width: 60px; height: 4px; background-color: #d66c7a; }
#origin-section .origin-section-text { font-size: 1.1rem; color: #555; margin-bottom: 15px; text-align: justify; }
#origin-section .origin-section-media { position: relative; border-radius: 15px; overflow: hidden; box-shadow: 0 15px 30px rgba(0,0,0,0.08); }
#origin-section .origin-section-image { width: 100%; aspect-ratio: 1/1; object-fit: cover; }

@media (max-width: 960px) {
	#origin-section .origin-section-grid { grid-template-columns: 1fr; }
	#origin-section .origin-section-title::after { left: 50%; transform: translateX(-50%); }
	#origin-section .origin-section-title { text-align: center; }
}

#celebrate-section { padding: 100px 5%; background-color: #fcf5f6; }
#celebrate-section .celebrate-section-content { max-width: 1200px; margin: 0 auto; }
#celebrate-section .celebrate-section-title { text-align: center; font-size: 2.5rem; color: #333; margin-bottom: 60px; font-weight: 700; }
#celebrate-section .celebrate-section-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
#celebrate-section .celebrate-section-item { background: #fff; border-radius: 20px; padding: 40px 30px; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,0.03); transition: transform 0.4s, box-shadow 0.4s; }
#celebrate-section .celebrate-section-item:hover { transform: translateY(-10px); box-shadow: 0 15px 40px rgba(214, 108, 122, 0.15); }
#celebrate-section .celebrate-section-subtitle { font-size: 1.5rem; color: #c45b69; margin-bottom: 15px; font-weight: 700; }
#celebrate-section .celebrate-section-text { color: #666; font-size: 1.05rem; }

@media (max-width: 960px) {
	#celebrate-section .celebrate-section-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
	#celebrate-section .celebrate-section-grid { grid-template-columns: 1fr; gap: 30px; }
}

#gift-section { padding: 100px 5%; background-color: #fff; }
#gift-section .gift-section-content { max-width: 1000px; margin: 0 auto; }
#gift-section .gift-section-title { text-align: center; font-size: 2.5rem; color: #333; margin-bottom: 60px; font-weight: 700; }
#gift-section .gift-section-list { display: flex; flex-direction: column; gap: 30px; }
#gift-section .gift-section-item { display: flex; align-items: center; background: #fffafb; border: 1px solid #fae1e4; border-radius: 15px; overflow: hidden; transition: all 0.3s ease; }
#gift-section .gift-section-item:hover { background: #fff; box-shadow: 0 10px 25px rgba(214, 108, 122, 0.1); border-color: #f5c4cb; }
#gift-section .gift-section-media { width: 250px; flex-shrink: 0; }
#gift-section .gift-section-image { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1/1; }
#gift-section .gift-section-right { padding: 30px 40px; flex-grow: 1; }
#gift-section .gift-section-subtitle { font-size: 1.4rem; color: #c45b69; margin-bottom: 10px; font-weight: 700; }
#gift-section .gift-section-text { color: #555; }

@media (max-width: 768px) {
	#gift-section .gift-section-item { flex-direction: column; }
	#gift-section .gift-section-media { width: 100%; }
	#gift-section .gift-section-image { aspect-ratio: 2/1; }
	#gift-section .gift-section-right { padding: 25px; }
}

footer { background-color: #333; color: #fff; padding: 40px 5%; text-align: center; }
footer .footer-content { max-width: 1200px; margin: 0 auto; }
footer .footer-text { font-size: 0.9rem; color: #aaa; margin-top: 20px; }
footer .footer-nav { display: flex; justify-content: center; gap: 20px; margin-bottom: 20px; }
footer .footer-nav a { color: #ddd; font-size: 0.95rem; transition: color 0.3s; }
footer .footer-nav a:hover { color: #fff; }