/* Ghost Narrative Layer – design spec */

/* Container */
.ghost-narrative {
  max-width: 800px;
  margin: 80px auto;
  padding-top: 120px;
  padding-bottom: 120px;
  color: rgba(245,242,234,0.90);
  font-family: 'Inter', sans-serif;
  font-weight: 300;
  line-height: 1.7;
  letter-spacing: 0.02em;
  font-size: 28px; /* desktop */
}

/* Paragraph spacing */
.ghost-narrative p {
  margin: 0 0 32px 0;
}

/* Animation – initial state */
.ghost-narrative .ghost-paragraph {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 800ms ease, transform 800ms ease;
}

/* Animation – when in view */
.ghost-narrative .ghost-paragraph.in-view {
  opacity: 1;
  transform: translateY(0);
}

/* Responsive font sizes */
@media (max-width: 1024px) {
  .ghost-narrative {font-size: 24px;}
}
@media (max-width: 600px) {
  .ghost-narrative {font-size: 20px;}
}

@media (prefers-reduced-motion: reduce) {
  .ghost-line {
    opacity: 1;
    transform: none;
    transition: none;
  }
}