* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Noto Serif', serif; background: #F5F0E8; color: #3A4A4A; line-height: 1.85; font-size: 16px; }
h1, h2 { font-family: 'Josefin Sans', sans-serif; font-weight: 300; }
.dark-bg { background: #1A3A4A; color: #E0D8D0; }
.dark-bg h2 { color: #D4A84B; }
.light-bg { background: #F5F0E8; color: #3A4A4A; }
.light-bg h2 { color: #1A3A4A; font-size: 32px; margin-bottom: 16px; line-height: 1.4; }
.gold-text { color: #D4A84B; }

.hero { height: 100vh; min-height: 500px; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.hero-words { display: flex; flex-direction: column; align-items: center; gap: 8px; z-index: 2; }
.word { font-family: 'Josefin Sans', sans-serif; font-size: 48px; font-weight: 300; color: #E0D8D0; opacity: 0; }
.word.gold { color: #D4A84B; }
.word.show { opacity: 1; transition: opacity 0.4s ease; }
.gold-line { width: 0; height: 1px; background: #D4A84B; transition: width 0.4s ease; }
.gold-line.drawn { width: 80px; }

.mountain-svg { position: absolute; bottom: 0; width: 100%; height: 120px; }
.mountain-path { fill: none; stroke: #8A9A8A; stroke-width: 1.5; stroke-dasharray: 2000; stroke-dashoffset: 2000; }
.mountain-path.drawn { transition: stroke-dashoffset 1s ease; stroke-dashoffset: 0; }

.section { padding: 80px 24px; }
.section.narrow { max-width: 640px; margin: 0 auto; }
.section.wide { padding: 80px 64px; }
.section.centered { display: flex; align-items: center; justify-content: center; min-height: 50vh; }
.section p { margin-bottom: 16px; }
.section.dark-bg p { color: #E0D8D0; }

.two-col { display: flex; gap: 48px; align-items: center; max-width: 960px; margin: 0 auto; }
.col-text { flex: 1; }
.col-visual { flex: 1; }
.aurora { width: 100%; }
.aurora-path { fill: none; stroke: #D4A84B; stroke-width: 2; filter: drop-shadow(0 0 8px rgba(212, 168, 75, 0.4)); animation: waveFloat 6s ease-in-out infinite; }
.aurora-path.delay { stroke-opacity: 0.5; animation-delay: 1s; }
@keyframes waveFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }

.quote-block { text-align: center; max-width: 560px; }
.quote-mark { font-family: 'Noto Serif', serif; font-size: 80px; color: #D4A84B; line-height: 0.5; display: block; }
.quote-text { font-size: 24px; font-style: italic; color: #E0D8D0; margin-top: 16px; }

.section { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease, transform 0.6s ease; }
.section.visible { opacity: 1; transform: translateY(0); }

.site-footer { display: flex; justify-content: space-between; padding: 24px 40px; background: #1A3A4A; color: #8A9A8A; font-family: 'Space Mono', monospace; font-size: 13px; }

/* Palette: #8A3A4A #2A5A4A #E0D8D0 */
@media (max-width: 768px) {
    .two-col { flex-direction: column; }
    .section.wide { padding: 48px 24px; }
    .word { font-size: 36px; }
}