/* style/blog.css */

/* Base styles for the blog page content, ensuring text contrast on dark body background */
.page-blog {
  color: #FFF6D6; /* Main text color for dark background */
  font-family: Arial, sans-serif;
  line-height: 1.6;
  background-color: #0A0A0A; /* Ensures sections without specific background blend well */
}

.page-blog__container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
}

/* Hero Section */
.page-blog__hero-section {
  position: relative;
  padding-top: var(--header-offset, 120px); /* Ensures content is not hidden by fixed header */
  padding-bottom: 60px;
  display: flex;
  flex-direction: column; /* Image above text */
  align-items: center;
  overflow: hidden; /* For image responsiveness */
}