body {
  font-family: 'Inter', sans-serif;
  /* Solid dark gray background matching screenshot */
  background-color: #191923; 
}

/* Scroll Reveal Animation Classes */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #191923;
}

::-webkit-scrollbar-thumb {
  background: #2d2d39;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #ffc107;
}

/* --- Blog SPA Specific Styles --- */
.chart-container {
  position: relative;
  width: 100%;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  height: 250px;
  max-height: 300px;
  background-color: #20202a;
  border: 1px solid #2d2d39;
  border-radius: 0.5rem;
  padding: 1rem;
}

@media (min-width: 768px) {
  .chart-container { height: 300px; }
}

/* Prismic Rich Text formatting overrides */
.prismic-content h1 { font-size: 2.25rem; font-weight: 700; margin-top: 2rem; margin-bottom: 1rem; color: #ffc107; }
.prismic-content h2 { font-size: 1.875rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.75rem; color: #ffc107; border-bottom: 1px solid #2d2d39; padding-bottom: 0.5rem; }
.prismic-content h3 { font-size: 1.5rem; font-weight: 600; margin-top: 1.25rem; margin-bottom: 0.5rem; color: #ffc107; }
.prismic-content p { margin-bottom: 1.25rem; line-height: 1.75; color: #d1d5db; }
.prismic-content a { color: #ffc107; text-decoration: underline; }
.prismic-content ul { list-style-type: disc; margin-left: 1.5rem; margin-bottom: 1.25rem; color: #d1d5db; }
.prismic-content ol { list-style-type: decimal; margin-left: 1.5rem; margin-bottom: 1.25rem; color: #d1d5db; }
.prismic-content li { margin-bottom: 0.5rem; }
.prismic-content img { max-width: 100%; height: auto; border-radius: 0.5rem; border: 1px solid #2d2d39; margin: 2rem auto; display: block; }
.prismic-content pre { background-color: #15151e; padding: 1rem; border-radius: 0.5rem; overflow-x: auto; margin-bottom: 1.5rem; border: 1px solid #2d2d39; }
.prismic-content code { color: #ffc107; font-family: monospace; }
.prismic-content strong, .prismic-content b { color: #ffc107; font-weight: 600; }

/* Utilities */
.fade-in { animation: fadeIn 0.4s ease-in-out forwards; }
@keyframes fadeIn { 
  from { opacity: 0; transform: translateY(10px); } 
  to { opacity: 1; transform: translateY(0); } 
}