/* miris.quest */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #0c1222; color: #e8e8e8; font-family: 'Lato', sans-serif; font-weight: 400; line-height: 1.8; }
.hero { min-height: 90vh; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; background: #0c1222; }
.mountain { position: absolute; bottom: 0; width: 0; height: 0; }
.mountain-1 { border-left: 50vw solid transparent; border-right: 50vw solid transparent; border-bottom: 30vh solid #1e3a5f; opacity: 0.4; left: -10%; }
.mountain-2 { border-left: 40vw solid transparent; border-right: 40vw solid transparent; border-bottom: 22vh solid #1a4731; opacity: 0.3; right: -10%; }
.hero-content { position: relative; z-index: 2; text-align: center; }
.brand { font-family: 'Cormorant', serif; font-weight: 600; font-size: clamp(2.5rem, 7vw, 4rem); color: #ffffff; margin-bottom: 0.5rem; }
.begin-text { font-size: 0.9rem; color: #ffffff; opacity: 0.5; }
.progress-path { position: absolute; left: 50%; top: 0; width: 1px; height: 100%; }
.path-line { width: 1px; height: 100%; border-left: 2px dotted #ffffff; opacity: 0.3; }
.chapter { max-width: 560px; margin: 0 auto; padding: 5rem 2rem; text-align: center; position: relative; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; }
.chapter-1 { background: linear-gradient(to bottom, #0c1222, rgba(30,58,95,0.3)); }
.chapter-2 { background: linear-gradient(to bottom, rgba(30,58,95,0.3), rgba(26,71,49,0.3)); }
.chapter-3 { background: linear-gradient(to bottom, rgba(26,71,49,0.3), #4a1942); background-color: #4a1942; }
.chapter-marker { font-family: 'Fira Code', monospace; font-size: 0.65rem; color: #fbbf24; border: 1px solid #fbbf24; padding: 2px 10px; display: inline-block; margin-bottom: 1.5rem; }
.chapter-title { font-family: 'Cormorant', serif; font-weight: 600; font-size: 2.2rem; margin-bottom: 0.75rem; color: #ffffff; }
.chapter-text { font-size: 0.95rem; color: #e8e8e8; max-width: 440px; margin: 0 auto; opacity: 0.85; }
.milestone { text-align: center; padding: 1.5rem 0; }
.milestone-badge { font-family: 'Fira Code', monospace; font-size: 0.6rem; color: #fbbf24; width: 28px; height: 28px; border: 1px solid #fbbf24; opacity: 0.4; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.return { text-align: center; padding: 5rem 2rem; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.close-text { font-family: 'Cormorant', serif; font-weight: 600; font-size: 1.2rem; color: #e8e8e8; opacity: 0.6; }
.footer-brand { font-size: 0.6rem; color: #e8e8e8; opacity: 0.15; display: block; margin-top: 0.5rem; }
.fade-in { opacity: 0; transform: translateY(12px); transition: opacity 0.5s ease, transform 0.5s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }