*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{background:#F5F0E8;color:#1A1611;font-family:'Source Serif 4',serif;font-weight:400;font-size:clamp(1rem,1.2vw,1.15rem);line-height:1.72;overflow-x:hidden}

.chapter{min-height:100vh;padding:clamp(3rem,8vh,8rem) clamp(16px,4vw,64px);position:relative}
.chapter-num{font-family:'Playfair Display',serif;font-weight:900;font-size:clamp(4rem,10vw,9rem);opacity:0.07;position:absolute;top:2rem;left:2rem;line-height:1;color:#1A1611}

/* Chapter 1 */
.chapter--earth{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.hero-title{font-family:'Playfair Display',serif;font-weight:900;font-size:clamp(5rem,12vw,10rem);letter-spacing:-0.02em;line-height:0.9;color:#1A1611;text-shadow:2px 2px 0 rgba(45,35,25,0.08)}
.hero-sub{font-family:'Caveat',cursive;font-weight:400;font-size:clamp(1rem,2vw,1.4rem);color:#6D6A65;margin-top:1.5rem;max-width:40ch}
.compass-rose{width:48px;height:48px;position:absolute;bottom:2rem;right:2rem;animation:spin 60s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* Crosshatch */
.crosshatch-divider{width:100%;height:20px;overflow:hidden}
.crosshatch-divider svg{width:100%;height:100%}

/* Magazine Spread */
.magazine-spread{display:grid;grid-template-columns:7fr 5fr;gap:clamp(1.5rem,3vw,3rem);max-width:1100px;margin:0 auto}
.section-title{font-family:'Playfair Display',serif;font-weight:700;font-size:clamp(1.8rem,4vw,3.2rem);letter-spacing:-0.02em;line-height:1.1;color:#1A1611;text-shadow:2px 2px 0 rgba(45,35,25,0.08);margin-bottom:1rem}
.body-text{color:#1A1611;max-width:38em;margin-bottom:1.2em}

/* Margin Notes */
.spread-margin{display:flex;flex-direction:column;gap:1rem;position:sticky;top:100px;align-self:start}
.margin-note{padding:0.8rem;border-left:2px solid #C62828}
.margin-caveat{font-family:'Caveat',cursive;font-weight:400;font-size:clamp(0.9rem,1.1vw,1.1rem);color:#6D6A65}

/* Glossary Cards */
.glossary-card{background:#EDE5D5;padding:clamp(0.8rem,1.5vw,1.2rem);box-shadow:0 2px 8px rgba(13,11,9,0.1)}
.card-front{display:flex;align-items:center;gap:0.8rem}
.card-icon{width:32px;height:32px;flex-shrink:0}
.card-term{font-family:'Source Serif 4',serif;font-weight:600;font-size:0.95rem;color:#1A1611}

/* Fold-out */
.chapter--foldout{min-height:auto;padding-bottom:2rem}
.fold-instruction{font-family:'Caveat',cursive;font-weight:400;color:#C62828;margin-bottom:1.5rem}
.foldout-scroll{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.foldout-track{display:flex;width:max-content}
.fold-segment{flex:0 0 clamp(250px,40vw,350px);scroll-snap-align:start;padding:clamp(1.5rem,3vw,2.5rem);border-right:1px dashed #6D6A65;display:flex;flex-direction:column;gap:0.8rem}
.fold-heading{font-family:'Playfair Display',serif;font-weight:700;font-size:clamp(1.2rem,2vw,1.6rem);color:#1A1611}
.fold-text{font-family:'Source Serif 4',serif;font-weight:300;font-size:0.9rem;color:#6D6A65;max-width:28ch}
.fold-icon{width:80px;height:54px;margin-top:auto}

/* Last Mile */
.chapter--lastmile{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.mug-svg{width:clamp(120px,20vw,180px);margin-bottom:2rem}
.lastmile-text{font-family:'Source Serif 4',serif;font-weight:300;font-size:clamp(1.1rem,2vw,1.4rem);color:#1A1611;max-width:45ch;margin-bottom:3rem;line-height:1.8}
.colophon{display:flex;flex-direction:column;align-items:center;gap:0.3rem}
.colophon-line{font-family:'Caveat',cursive;font-size:0.9rem;color:#6D6A65}
.flourish-svg{width:80px;height:16px;margin-top:0.5rem}

/* Reveals */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity 0.6s cubic-bezier(0.22,1,0.36,1),transform 0.6s cubic-bezier(0.22,1,0.36,1)}
[data-reveal].visible{opacity:1;transform:translateY(0)}

@media(max-width:768px){
  .magazine-spread{grid-template-columns:1fr}
  .spread-margin{position:static}
  .fold-segment{flex:0 0 85vw}
}