/* Main content */
  main {
    padding: 2rem 1rem;
  }
  h1.page-title {
    text-align: center;
    margin-bottom: 2rem;
    color: #004080;
  }

  /* Blog grid */
  .blog-grid {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  }

  /* Blog card */
  article.blog-post {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgb(0 0 0 / 0.1);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.3s ease;
  }
  article.blog-post:hover {
    box-shadow: 0 6px 15px rgb(0 0 0 / 0.15);
  }
  .post-image {
    width: 100%;
    height: 180px;
    object-fit: cover;
  }
  .post-content {
    padding: 1rem 1.25rem;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
  }
  .post-title {
    font-size: 1.25rem;
    margin: 0 0 0.5rem;
    color: #003366;
  }
  .post-date {
    font-size: 0.85rem;
    color: #666;
    margin-bottom: 1rem;
  }
  .post-excerpt {
    flex-grow: 1;
    font-size: 1rem;
    margin-bottom: 1rem;
    color: #444;
  }
  .read-more {
    align-self: flex-start;
    font-weight: 600;
    color: #004080;
  }
   a {
    text-decoration: none;
    color: #004080;
  }
  a:hover {
    text-decoration: none;
  }
   .container {
    /* max-width: 1100px; */
    margin: auto;
    padding: 0 1rem;
  }
  .page-banner-blog.bg-blogs {
  /* background-image: url(../images/pallavi_school/Academics_slider.jpg); */
  background-image: url(../images/pallavi_school/blog-banner.jpg);
  /* box-shadow: inset 0 0 0 1000px rgba(0,0,0,.2); */
  box-shadow: inset 0 0 0 2000px rgb(255, 255, 255, 0.3);
 }
 .page-banner-blog.bg-blogs-how-pallavi {
  /* background-image: url(../images/pallavi_school/Academics_slider.jpg); */
  background-image: url(../images/blogs/blog-1.png);
  /* box-shadow: inset 0 0 0 1000px rgba(0,0,0,.2); */
  box-shadow: inset 0 0 0 2000px rgb(255, 255, 255, 0.3);
 }
 .page-banner-blog {
  position: relative;
  background-size: cover;
  background-position: center center;
  height: 100vh !important;
}


@media (max-width: 768px) {
    .page-banner-blog {
    height: 50vh !important;
    }
    .blog-grid {
    grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
    }
}

@media (max-width: 480px) {
    .page-banner-blog {
    height: 40vh !important;
    }
    .blog-grid {
    grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
    }
}

/* Blog page specific styles */
    .blg-article {
      background: white;
      border-radius: 8px;
      padding: 1.5rem 2rem;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
      margin-bottom: 2rem;
    }

    .blg-sidebar {
      background: white;
      border-radius: 8px;
      padding: 1.25rem 1.5rem;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
      margin-bottom: 2rem;
    }

    .blg-sidebar h3 {
      color: #004080;
      font-size: 1.3rem;
      border-bottom: 2px solid #004080;
      padding-bottom: 0.3rem;
      margin-bottom: 1rem;
    }

    .blg-sidebar ul {
      padding-left: 1.25rem;
      margin: 0;
    }

    .blg-sidebar ul li {
      margin-bottom: 0.6rem;
    }

    .blg-sidebar a {
      color: #004080;
    }

    .blg-article h1 {
      font-size: 2.2rem;
      color: #003366;
    }

    .blg-meta {
      font-size: 0.9rem;
      color: #666;
      margin-bottom: 1.5rem;
    }

    .blg-featured-image {
      width: 100%;
      border-radius: 6px;
      margin-bottom: 1.5rem;
    }

    .blg-article h2 {
      color: #004080;
      font-size: 1.6rem;
      margin-top: 2rem;
      margin-bottom: 1rem;
    }

    .blg-article p {
      font-size: 1.1rem;
      margin-bottom: 1rem;
    }


    @media (max-width: 767.98px) {
      .blg-banner-text {
        left: 10px;
        right: 10px;
        font-size: 1rem;
        max-width: 90%;
      }

      .blg-banner-text h2 {
        font-size: 1.5rem;
      }
    }