/* Blog wrapper sits on page background (transparent) */
.lc-blog {
  font-family: Garamond, serif;
  background: transparent;
  color:#000;
  padding:2rem 1.5rem;
  max-width:960px;
  margin:0 auto;
  border-radius:8px;
}

/* Optional page-level headings (kept for reuse) */
.lc-blog h1 { text-align:center; font-size:2rem; margin:0 0 1rem; color:#ffffff; } /* white if used over hero */
.lc-blog h2 { text-align:center; margin:1rem 0 1.25rem; color:#ffffff; }          /* white if used over hero */

/* Post accordion */
.lc-blog details {
  background:#c0c0c0;
  border:2px solid #999;
  border-radius:8px;
  margin-bottom:1rem;
  padding:1rem;
}
.lc-blog summary {
  font-weight:bold;
  cursor:pointer;
  font-size:1.1rem;
  outline:none;
}
/* White, branded summary bar look */
.lc-blog .post-summary {
  color:#fff;
  background:#014421;       /* brand green bar */
  padding:.75rem 1rem;
  border-radius:6px;
  margin:-.25rem -.25rem .75rem;
  display:block;
}
.lc-blog summary::-webkit-details-marker { display:none; }

.lc-blog .meta { font-size:.95rem; color:#333; margin:.5rem 0 .75rem; font-style:italic; }
.lc-blog .post { line-height:1.6;   color: #000; /* applies to teaser and read more text */}

/* Make bullets black in read more sections */
.lc-blog .post ul,
.lc-blog .post li {
  color: #000;
}

.lc-blog .read-more { display:inline-block; margin-top:.75rem; text-decoration:none; color:#0000ee; }
.lc-blog .read-more:hover { text-decoration:underline; }

/* Sub box (if you re-enable any) */
.lc-blog .sub-details {
  margin-left:1rem;
  font-size:.95rem;
  border:2px solid #999;
  border-radius:8px;
  padding:1rem;
  margin-top:1rem;
  background:#c0c0c0;
}
.lc-blog .sub-details summary { font-size:1rem; }

/* Hidden/visible extended block */
.more[hidden] { display:none; }

@media (max-width:768px){
  .lc-blog{padding:1.25rem}
}

/* Force extended content text to be black */
.lc-blog .more .post {
  color: #000;   /* black text */
}
.lc-blog .more .post p {
  color: #000;   /* also black for paragraphs */
}

#blog .post ul,
#blog .post ol,
#blog .post li {
  color: #000 !important;
}

/* Force body text in blog posts to black (covers <p class="post"> and <div class="post">) */
#blog .post,
#blog .post p,
#blog .post * {
  color: #000 !important;
}

/* Keep the clickable title bar white */
#blog summary.post-summary {
  color: #fff !important;
}

/* Read more / Read less button — green box with white text */
#blog .read-more {
  display: inline-block;
  padding: 0.55rem 0.9rem;
  background: #014421;                    /* brand green */
  color: #fff !important;                 /* force white text */
  border: 1px solid rgba(255,255,255,0.35);
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  line-height: 1;
}

#blog .read-more:hover,
#blog .read-more:focus {
  background: #016a33;                    /* slightly brighter on hover */
  text-decoration: none;
  outline: none;
}

/* Force left-alignment inside the blog block */
.lc-blog { text-align: left; }

/* Keep headings centered if you use them */
.lc-blog h1, .lc-blog h2 { text-align: center; }

/* Teaser + extended content: left + black */
#blog .post,
#blog .post p,
#blog .more .post p {
  text-align: left !important;
  color: #000 !important;
  margin: 0 0 .5rem;
}

/* Read more / Read less button: left-aligned and styled */
#blog .read-more {
  display: inline-block;          /* keeps it to the left, not full width */
  text-align: left;
  padding: 0.55rem 0.9rem;
  background: #014421;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.35);
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  line-height: 1;
}
#blog .read-more:hover,
#blog .read-more:focus {
  background: #016a33;
  text-decoration: none;
}