/* General Body & Typography */
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; line-height: 1.6; margin: 0; background-color: #f0f2f5; color: #333; }
.container { max-width: 840px; margin: 20px auto; padding: 0 20px; }
/* Header & Footer */
.site-header { background-color: #ffffff; padding: 20px; text-align: center; border-bottom: 1px solid #e0e0e0; margin-bottom: 20px; }
.site-header h1 { margin: 0; font-size: 2.8em; font-family: 'Georgia', serif; color: #111; }
.site-header a { text-decoration: none; color: inherit; }
.site-footer { text-align: center; margin-top: 40px; padding: 20px; font-size: 0.9em; color: #888; }
/* Homepage Post Entry Styling */
.post-entry { background-color: #ffffff; margin-bottom: 20px; border-radius: 5px; box-shadow: 0 1px 4px rgba(0,0,0,0.08); padding: 25px 30px; }
.post-entry h2 a { text-decoration: none; color: #1a0dab; font-size: 1.7em; }
.post-entry h2 a:hover { text-decoration: underline; }
.post-meta { font-size: 0.85em; color: #777; margin-bottom: 1em; }
.post-excerpt { color: #555; }
.read-more { display: inline-block; margin-top: 15px; text-decoration: none; color: #ffffff; background-color: #007bff; padding: 8px 15px; border-radius: 4px; font-weight: bold; font-size: 0.9em; }
.read-more:hover { background-color: #0056b3; }
/* Single Article Page Styling */
.article-container { background-color: #ffffff; padding: 30px 40px; border-radius: 5px; box-shadow: 0 1px 4px rgba(0,0,0,0.08); }
.article-header h1 { font-size: 2.5em; margin-bottom: 0.5rem; line-height: 1.2; color: #111; }
.article-content { margin-top: 1.5rem; }
.article-content img { max-width: 100%; height: auto; border-radius: 8px; margin: 1.5em 0; }
.article-content a { color: #007bff; }
.back-link { display: inline-block; margin-bottom: 20px; font-weight: bold; text-decoration: none; color: #555; }
.back-link:hover { color: #000; }
/* Related Posts Section */
.related-posts { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid #eee; }
.related-posts h3 { font-size: 1.3em; color: #333; margin-bottom: 1em; border-bottom: 2px solid #007bff; padding-bottom: 5px; display: inline-block; }
.related-posts ul { list-style-type: none; padding: 0; }
.related-posts li { margin-bottom: 0.7rem; }
.related-posts a { text-decoration: none; color: #007bff; }
.related-posts a:hover { text-decoration: underline; }

/* Responsive Adjustments for Mobile */
@media (max-width: 600px) {
    .container {
        padding: 0 10px;
        margin: 10px auto;
    }
    .article-container, .post-entry {
        padding: 20px;
    }
    .site-header h1 {
        font-size: 2em;
    }
    .post-entry h2 a {
        font-size: 1.5em;
    }
    .article-header h1 {
        font-size: 1.9em;
        line-height: 1.3;
    }
}