*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:#f5f1e8;
  color:#26231f;
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  line-height:1.9;
}
main{overflow:hidden}
.hero,.section{
  min-height:82vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:72px 24px;
}
.hero{min-height:100vh}
.crest{
  width:72px;height:72px;border:1px solid #8d7b5d;border-radius:50%;
  display:grid;place-items:center;margin-bottom:28px;font-size:14px;letter-spacing:.15em
}
.eyebrow,.date,.scroll{letter-spacing:.22em;font-size:12px}
h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(42px,10vw,76px);margin:10px 0}
h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:34px;margin:8px 0 22px}
.jp-title{letter-spacing:.35em;font-size:13px;color:#7f6d52}
.section{min-height:70vh;border-top:1px solid rgba(38,35,31,.12)}
.small{font-size:12px;color:#6b655d;margin-top:26px}
.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s ease,transform 1s ease}
.reveal.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
}