.blog-hero-section {
  position: relative;
  border-radius: 40px;
  overflow: hidden;
  margin-top: 30px;
}

/* Image */
.blog-hero-section img{
  width: 100%;
  height: 320px;
  object-fit: cover;
  display: block;
}

/* Black overlay */
.blog-hero-section::after{
  content: "";
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background: rgba(0,0,0,0.5);
  border-radius: 40px;
}

/* Text */
.blog-hero-content {
  position: absolute;
  top: 50%;
  left: 50px;
  transform: translateY(-50%);
  z-index: 2; /* text overlay ke upar */
}

.blog-hero-content h2 {
  color: #f97316;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.3;
}

.blog-section {
  background: #ffffff;
  border-left: 2px solid #ddd;
  border-right: 2px solid #ddd;
  border-bottom: 2px solid #ddd;
}

.blog-title {
  font-size: clamp(25px, 5vw, 35px);
  font-weight: 600;
  color: var(--primary-orange);
}

/* Card */

.blog-card {
  text-align: center;
  transition: 0.3s ease;
  cursor: pointer;
  text-decoration: none;
}

/* Image */

.blog-img img {
  height: 220px;
  width: 100%;
  object-fit: fit;
  border-radius: 15px;
}

/* Hover Effect */

.blog-card:hover img {
  transform: scale(1.05);
}

/* Content */

.blog-content {
  margin-top: 20px;
}

.blog-content h3 {
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 500;
  color: #333;
  line-height: 1.4;
}

.blog-content p {
  margin-top: 10px;
  font-size: 14px;
  color: #777;
}

.subscribe-box {
  background: #d6ebdd;
  padding: 40px;
  border-radius: 15px;
}

.baby-img {
  max-width: 250px;
}

@media (max-width: 768px) {
  .subscribe-box {
    padding: 25px;
  }

  .baby-img {
    max-width: 180px;
  }

}