.blog-post {
    display: flex;
    gap: 20px;
    max-width: 1200px;
    margin: 24px auto;
    padding: 18px;
    border: 1px solid #074f2c;
    border-radius: 8px;
    background: #f2f2f2;
    align-items: flex-start;
  }

  .post-image {
    flex: 0 0 180px;
    max-width: 35%;
  }

  .post-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
    display: block;
  }

  .post-body { flex: 1 1 auto; min-width: 0; }

  .post-header {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 10px;
    width: 100%;
  }

.post-title { font-size: 1.4rem; margin: 0; color: #111; }
.post-date { margin-left: auto; color: #666; font-size: 0.95rem; white-space: nowrap; }

.post-content p { margin: 0; line-height: 1.6; color: #222; }

.section-blog {padding:20px;}

@media (max-width: 720px) {
  .blog-post { flex-direction: column; }
  .post-image { max-width: 100%; flex: 0 0 auto; }
  .post-header { flex-direction: column; align-items: flex-start; gap: 6px; }
  .post-date { margin-left: 0; margin-top: 4px;}
}