*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{background:#E8DFF5;color:#4A6741;font-family:'Crimson Pro',serif;font-weight:400;overflow-x:hidden;line-height:1.7}
.glade{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 10%;position:relative;overflow:hidden}
.glade-1{background:linear-gradient(180deg,#E8DFF5 0%,#F5C6D0 100%)}
.glade-2{background:linear-gradient(180deg,#F5C6D0 0%,#E8DFF5 50%,#B8D4E3 100%);min-height:120vh}
.glade-3{background:linear-gradient(180deg,#B8D4E3 0%,#E8DFF5 100%)}
.glade-4{background:linear-gradient(180deg,#E8DFF5 0%,#B8D4E3 50%,#E8DFF5 100%)}
.glade-5{background:linear-gradient(180deg,#E8DFF5 0%,#3D4A3A 100%);color:#E8DFF5}

.display-heading{font-family:'Playfair Display',serif;font-weight:900;font-size:clamp(3rem,8vw,7rem);letter-spacing:-0.02em;line-height:1.05;color:#4A6741;text-align:center;opacity:0;transform:translateY(30px);transition:opacity 1.2s ease-out,transform 1.2s ease-out}
.display-heading.visible{opacity:1;transform:translateY(0)}
.tagline{font-family:'Cormorant Garamond',serif;font-weight:300;font-style:italic;font-size:clamp(1rem,2vw,1.4rem);color:#8B7D6B;margin-top:16px;opacity:0;transition:opacity 1s ease-out 0.5s}
.tagline.visible{opacity:1}

/* Dandelion cluster */
.dandelion-cluster{position:absolute;top:40px;right:60px;display:flex;gap:12px}
.dandelion{width:30px;height:30px;animation:dandelionDrift 6s ease-in-out infinite}
.d2{animation-delay:1s}.d3{animation-delay:2s}
@keyframes dandelionDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(3px,-5px)}}

/* Thicket */
.thicket-block{max-width:38em;opacity:0;transform:translateY(20px);transition:opacity 0.8s ease-out,transform 0.8s ease-out}
.thicket-block.visible{opacity:1;transform:translateY(0)}
.block-left{align-self:flex-start;margin-bottom:60px}
.block-right{align-self:flex-end}
.thicket-block h2{font-family:'Playfair Display',serif;font-weight:700;font-size:clamp(1.8rem,4vw,3rem);letter-spacing:-0.02em;color:#4A6741;margin-bottom:12px}
.thicket-block p{font-size:clamp(1rem,1.5vw,1.15rem);color:#4A6741}
.vine-path{position:absolute;width:100%;height:200px;top:50%;transform:translateY(-50%);z-index:0;pointer-events:none}
.vine-path path{transition:stroke-dashoffset 2s ease-out}

/* Hollow */
.moth-ring{position:absolute;width:300px;height:300px;display:flex;align-items:center;justify-content:center}
.moth{width:40px;height:30px;position:absolute;transition:opacity 1s ease-out}
.moth.visible{opacity:0.6 !important}
.m1{top:0;left:50%;transform:translateX(-50%)}
.m2{bottom:20%;left:10%}
.m3{bottom:20%;right:10%}
.vellum-block{max-width:38em;text-align:center;padding:40px;background:rgba(232,223,245,0.4);opacity:0;transform:translateY(20px);transition:opacity 0.8s ease-out,transform 0.8s ease-out;position:relative;z-index:1}
.vellum-block.visible{opacity:1;transform:translateY(0)}
.vellum-block p{font-size:clamp(1rem,1.5vw,1.15rem);color:#4A6741;line-height:1.8}

/* Stream */
.stream-line{width:100%;height:80px}
.stream-text{font-family:'Playfair Display',serif;font-weight:700;font-size:clamp(1.8rem,4vw,3rem);color:#4A6741;opacity:0;transition:opacity 0.8s ease-out}
.stream-text.visible{opacity:1}
.above{margin-bottom:20px}.below{margin-top:20px}

/* Twilight */
.twilight-heading{font-family:'Playfair Display',serif;font-weight:900;font-size:clamp(3rem,8vw,7rem);letter-spacing:-0.02em;color:#E8DFF5;opacity:0;transform:translateY(30px);transition:opacity 1.2s ease-out,transform 1.2s ease-out}
.twilight-heading.visible{opacity:1;transform:translateY(0)}
.twilight-sub{font-family:'Cormorant Garamond',serif;font-weight:300;font-style:italic;font-size:1rem;color:rgba(232,223,245,0.6);margin-top:16px;opacity:0;transition:opacity 1s ease-out 0.5s}
.twilight-sub.visible{opacity:1}

/* Fireflies */
.fireflies{position:fixed;inset:0;z-index:0;pointer-events:none}

/* Accent color references */
.ref-firefly{color:#D4A843}
.ref-dewdrop{color:#B8D4E3}
.ref-petal{color:#F5C6D0}

@media(max-width:600px){
.glade{padding:60px 6%}
.dandelion-cluster{top:20px;right:20px}
.block-left,.block-right{align-self:center}
}
