* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Lora', serif; background: #FFF8EE; color: #4A3728; line-height: 1.85; font-size: 17px; }
h1, h2 { font-family: 'Lora', serif; font-weight: 600; color: #2E1F14; }

.contents-pill { position: sticky; top: 16px; z-index: 100; float: right; margin-right: 24px; }
.pill-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(255, 248, 238, 0.7); backdrop-filter: blur(8px); border: 1px solid rgba(200, 170, 130, 0.3); cursor: pointer; margin-left: auto; }
.pill-flame { animation: flameSway 3s ease-in-out infinite alternate; transform-origin: center bottom; }
@keyframes flameSway { 0% { transform: scaleX(0.95) rotate(-2deg); } 100% { transform: scaleX(1.05) rotate(2deg); } }
.pill-links { display: none; background: rgba(255, 248, 238, 0.7); backdrop-filter: blur(8px); border: 1px solid rgba(200, 170, 130, 0.3); border-radius: 12px; padding: 12px 16px; margin-top: 8px; }
.pill-links.open { display: block; }
.pill-links a { display: block; font-family: 'Source Sans 3', sans-serif; font-size: 14px; color: #D4A052; text-decoration: none; padding: 4px 0; border-bottom: 1px dashed rgba(212, 160, 82, 0.3); }
.pill-links a:last-child { border-bottom: none; }
.pill-links a:hover { color: #B8834A; }

.essay-section { max-width: 680px; margin: 0 auto; padding: 48px 40px; }
.essay-section > * { opacity: 0; transform: translateY(15px); transition: opacity 0.5s ease-out, transform 0.5s ease-out; }
.essay-section.visible > * { opacity: 1; transform: translateY(0); }

.hero-section { min-height: 80vh; display: flex; align-items: center; justify-content: center; padding: 80px 40px; }
.hero-card { text-align: center; }
.hero-card h1 { font-size: 36px; margin-bottom: 12px; position: relative; }
.hero-card h1::before { content: ''; position: absolute; top: -20px; left: 50%; transform: translateX(-50%); width: 200px; height: 200px; background: radial-gradient(circle, rgba(212, 160, 82, 0.06) 0%, transparent 70%); border-radius: 50%; z-index: -1; }
.subtitle { font-family: 'Source Sans 3', sans-serif; font-weight: 400; font-size: 16px; color: #8A7460; }

.glass-card { background: rgba(255, 248, 238, 0.7); backdrop-filter: blur(8px); border-radius: 16px; border: 1px solid rgba(200, 170, 130, 0.3); border-top: 1px solid rgba(255, 255, 255, 0.5); box-shadow: 0 4px 16px rgba(46, 31, 20, 0.08); padding: 32px; transition: transform 0.3s ease-out, box-shadow 0.3s ease-out; }
.glass-card:hover { transform: scale(1.015); box-shadow: 0 8px 24px rgba(46, 31, 20, 0.12); }

.card-label { font-family: 'Source Sans 3', sans-serif; font-weight: 400; font-size: 13px; letter-spacing: 0.03em; color: #8A7460; display: block; margin-bottom: 12px; }

.study-card h2 { font-size: 28px; margin-bottom: 16px; }
.study-card p { margin-bottom: 12px; }

.essay-block h2 { font-size: 28px; margin-bottom: 16px; position: relative; }
.essay-block h2::before { content: ''; position: absolute; top: -10px; left: -20px; width: 160px; height: 160px; background: radial-gradient(circle, rgba(212, 160, 82, 0.06) 0%, transparent 70%); border-radius: 50%; z-index: -1; }
.essay-block p { margin-bottom: 16px; }

.candle-divider { display: flex; align-items: center; justify-content: center; gap: 16px; max-width: 680px; margin: 0 auto; padding: 8px 40px; }
.divider-line { flex: 1; height: 1px; background: #D4A052; opacity: 0.3; }
.candle-svg .candle-flame { animation: flameSway 3s ease-in-out infinite alternate; transform-origin: center bottom; }

.site-footer { max-width: 680px; margin: 0 auto; text-align: center; padding: 48px 40px; border-top: 1px solid rgba(212, 160, 82, 0.2); }
.footer-label { font-family: 'Source Sans 3', sans-serif; font-size: 13px; letter-spacing: 0.03em; color: #8A7460; }

/* Palette: #D4A052 #F0DCC4 #B8834A #1A110A */
@media (max-width: 600px) {
    .essay-section { padding: 32px 24px; }
    .candle-divider { padding: 8px 24px; }
    .hero-card h1 { font-size: 28px; }
    .contents-pill { margin-right: 16px; }
}
