/* Auto-generated from blog.html. Keep page-specific styles here. */

/* Extracted style block 1 from blog.html */
body { margin: 0; font-family: "Poppins", sans-serif; background: linear-gradient(135deg, #f7fcf8, #f4faff); color: #203a2d; }
    .blog-shell { max-width: 1240px; margin: 0 auto; padding: 24px 20px 80px; }
    .blog-hero { background: linear-gradient(135deg, rgba(255,255,255,0.94), rgba(237,250,242,0.96)); border: 1px solid rgba(11,163,78,0.14); border-radius: 28px; box-shadow: 0 22px 44px rgba(15,63,45,0.10); padding: 34px 28px; margin-bottom: 28px; }
    .blog-hero h1 { margin: 0 0 12px; font-size: clamp(2rem, 4vw, 3.2rem); font-family: "Times New Roman", Times, serif; color: #1f5a40; }
    .blog-hero p { margin: 0; max-width: 760px; color: #4c6655; line-height: 1.8; }
    .blog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
    .blog-card { background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 18px 34px rgba(15,63,45,0.10); border: 1px solid rgba(11,163,78,0.10); display: flex; flex-direction: column; }
    .blog-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
    .blog-card__body { padding: 24px; display: flex; flex-direction: column; gap: 14px; }
    .blog-card h2 { margin: 0; font-size: 1.35rem; line-height: 1.4; color: #1f4e39; }
    .blog-card p { margin: 0; color: #52665a; line-height: 1.8; }
    .blog-card a { display: inline-flex; align-items: center; gap: 8px; width: fit-content; text-decoration: none; color: #0ba34e; font-weight: 700; }
    .blog-card a:hover { color: #f16136; }
    @media (max-width: 900px) { .blog-grid { grid-template-columns: 1fr; } }