/* ========================= */
/* FGN READER ENGINE v1.0 */
/* ========================= */
body {
background: radial-gradient(circle at top, #0f2019, #050c09);
color: #e2f1e8;
font-family: Georgia, serif;
}
/* HERO SECTION */
.fgn-hero {
height: 90vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: linear-gradient(to bottom, #08120d, #0f2019);
text-align: center;
padding: 20px;
}
.fgn-hero h1 {
font-size: 3rem;
letter-spacing: 2px;
margin-bottom: 20px;
}
.fgn-subtitle {
opacity: .7;
margin-bottom: 40px;
}
.fgn-begin {
padding: 14px 30px;
border: 1px solid #e2f1e8;
text-decoration: none;
color: #e2f1e8;
transition: .3s ease;
}
.fgn-begin:hover {
background: #e2f1e8;
color: #08120d;
}
/* STORY WRAPPER */
.fgn-story {
max-width: 850px;
margin: 0 auto;
padding: 120px 20px;
display: flex;
flex-direction: column;
gap: 140px;
}
/* PANEL */
.fgn-panel {
opacity: 0;
transform: translateY(60px);
transition: all .8s ease;
}
.fgn-panel img {
width: 100%;
border-radius: 16px;
box-shadow: 0 30px 70px rgba(0,0,0,0.6);
}
.fgn-panel p {
margin-top: 30px;
font-size: 1.15rem;
line-height: 1.9;
max-width: 85%;
}
.fgn-large img {
transform: scale(1.05);
}
.fgn-text-break {
text-align: center;
font-size: 1.4rem;
line-height: 2.2;
}
/* READING PROGRESS */
#fgn-progress {
position: fixed;
top: 0;
left: 0;
height: 4px;
background: #e2f1e8;
width: 0%;
z-index: 9999;
}
/* MOBILE OPTIMIZATION */
@media (max-width: 768px) {
.fgn-hero h1 {
font-size: 2rem;
}
.fgn-story {
gap: 100px;
}
}
