/* kaigenrei.com */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #f5f0e6; color: #292524; font-family: 'Inter', sans-serif; line-height: 1.7; }
.hero { min-height: 70vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; position: relative; }
.geo-shapes { position: absolute; top: 20%; right: 15%; opacity: 0.15; }
.circle-shape { width: 80px; height: 80px; border-radius: 50%; background: #b45309; }
.rect-shape { width: 60px; height: 80px; background: #4d7c0f; margin-top: -20px; margin-left: 30px; }
.brand { font-family: 'Lora', serif; font-weight: 500; font-size: clamp(2.5rem, 6vw, 4rem); color: #3d2e1f; position: relative; z-index: 1; }
.tagline { font-size: 0.9rem; color: #c4b89a; position: relative; z-index: 1; }
.eras { max-width: 700px; margin: 0 auto; padding: 2rem 1.5rem; display: flex; flex-direction: column; gap: 2rem; }
.era-block { display: flex; align-items: center; gap: 1.5rem; }
.era-block.reverse { flex-direction: row-reverse; }
.era-shape { width: 60px; height: 60px; border-radius: 50%; flex-shrink: 0; }
.era-shape.burnt { background: #b45309; }
.era-shape.olive { background: #4d7c0f; }
.era-shape.mustard { background: #ca8a04; }
.era-content { flex: 1; }
.era-date { font-family: 'Roboto', sans-serif; font-size: 0.65rem; color: #c4b89a; text-transform: uppercase; letter-spacing: 0.1em; }
.era-title { font-family: 'Lora', serif; font-weight: 500; font-size: 1.1rem; color: #3d2e1f; margin: 0.2rem 0; }
.era-text { font-size: 0.8rem; color: #292524; opacity: 0.75; }
.bridge { padding: 2rem; }
.timeline-band { display: flex; align-items: center; justify-content: center; gap: 0; }
.timeline-node { width: 16px; height: 16px; border-radius: 50%; }
.burnt-node { background: #b45309; }
.olive-node { background: #4d7c0f; }
.mustard-node { background: #ca8a04; }
.timeline-line { width: 60px; height: 2px; background: #c4b89a; }
.ceremony { background: #3d2e1f; text-align: center; padding: 4rem 2rem; }
.torii { position: relative; width: 50px; height: 40px; margin: 0 auto 1rem; }
.torii-beam { position: absolute; top: 0; left: 0; right: 0; height: 4px; background: #ca8a04; }
.torii-left { position: absolute; top: 4px; left: 8px; width: 4px; height: 36px; background: #ca8a04; }
.torii-right { position: absolute; top: 4px; right: 8px; width: 4px; height: 36px; background: #ca8a04; }
.ceremony-text { font-family: 'Lora', serif; font-weight: 500; font-size: 1rem; color: #f5f0e6; }
.ceremony-brand { font-size: 0.65rem; color: #c4b89a; 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); }