body{
    font-family: 'Barlow'
}
/* Title */
.blog-title {
      font-size: 3.7vw;
    color: #7A7A7A;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-weight: 700;
    padding-bottom: 4vw;
}

/* Card */
.blog-card {
  border: 1px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  transition: 0.3s ease;
  height: 100%;
}

.blog-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
}

/* Image */
.blog-image {
  position: relative;
  overflow: hidden;
}

.blog-image img {
  width: 100%;
  object-fit: cover;
  transition: 0.4s ease;
}

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

/* Badge */
.badge-tag {
  position: absolute;
  top: 15px;
  left: 15px;
  background: #ff5722;
  color: #fff;
  font-size: 12px;
  padding: 5px 10px;
  font-weight: 600;
  border-radius: 3px;
}

/* Content */
.blog-content {
  padding: 20px;
}

.blog-content h4 {
  font-size: 1.14vw;
    font-weight: 600;
    font-family: 'Barlow'
}

.blog-content p {
     font-size: 1.05vw;
    color: #616161;
    font-weight: 400;
    font-family: 'Barlow';
    padding: 0.5vw 0 1.2vw;
}

/* Read More */
.read-more {
      font-size: 1.05vw;
    color: #C69762;
    font-weight: 400;
    font-family: 'Barlow';
    padding: 0.5vw 0 1.2vw;
}

.read-more:hover {
  text-decoration: underline;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .blog-title {
    font-size: 32px;
    padding-bottom: 20px;
  }

  .blog-image img {
    height: 200px;
  }
  .blog-content h4 {
    font-size: 20px;
}
.blog-content p{
    font-size: 17px;
}
.read-more {
    font-size: 17px;
}
}

@media (max-width: 576px) {
  .blog-content h4 {
    font-size: 18px;
  }

  .blog-content p {
    font-size: 13px;
  }
  .read-more{
    font-size: 13px;
  }
}

/* ===== HEADER ===== */
.breadcrumb-text {
  color: #777;
  font-size: 14px;
}

.blog-main-title {
     font-size: 3.23vw;
    color: #C69762;
    font-weight: 800;
    font-family: 'Barlow';
    margin-bottom: 2vw;
}

/* ===== AUTHOR ===== */
.author-box {
  gap: 10px;
}

.author-img {
  width: 45px;
  height: 45px;
  border-radius: 50%;
}

.author-name {
  margin: 0;
  font-weight: 600;
  color: #C69762;
}

/* ===== IMAGE ===== */
.blog-banner img {
  width: 100%;
  border-radius: 10px;
}

/* ===== CONTENT ===== */
.blog-description p {
  font-size: 1.15vw;
    color: #616161;
    font-family: 'Barlow';
    font-weight: 400;
    padding: 0.5vw 9.5vw 0.5vw 0vw;
    margin-bottom: 0;
}

.blog-description h5 {
     font-size: 1.7vw;
    color: #C69762;
    font-weight: 700;
    font-family: 'Barlow';
}
.blog-description h4 {
     font-size: 1.3vw;
    font-weight: 700;
    font-family: 'Barlow';
}
.blog-description ul li{
     font-size: 1.15vw;
    color: #616161;
    font-family: 'Barlow';
    font-weight: 400;
    padding: 0.3vw 9.5vw 0.3vw 0vw;
    margin-bottom: 0;
    list-style: disc;
}

/* ===== SUGGESTED BLOGS ===== */
.suggested-section {
  background: #1c1c4d;
}

.blog-card {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  transition: 0.3s;
}

.blog-card img {
  width: 100%;
  /* height: 200px; */  
  object-fit: cover;
}

.blog-card:hover {
  transform: translateY(-5px);
}

.blog-card h5 {
  font-size: 18px;
  font-weight: 600;
}

.blog-card p {
  /* font-size: 14px; */
  color: #555;
}

.blog-card a {
  color: #ff5722;
  text-decoration: none;
}


.blog-crumbs li a , .blog-crumbs li span{
    color: #000 !important;
}
.blog-crumbs li{
    color: #C69762 !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  .blog-main-title {
    font-size: 28px;
  }

  .newsletter {
    text-align: center;
  }

  .newsletter-form {
    flex-direction: column;
    margin-top: 15px;
  }

  .newsletter-form input {
    width: 100%;
  }

  .blog-card h5 {
  font-size: 18px;
  font-weight: 600;
}

.blog-card p {
  /* font-size: 14px; */
  color: #555;
}

.blog-card a {
  text-decoration: none;
}

.blog-description p{
    font-size: 16px;
    padding: 5px 0;
}

.blog-description h5{
    font-size: 25px;
    padding: 5px 0;
}
.blog-description h4{
    font-size: 20px;
    padding: 5px 0;
}
.blog-description ul li{
    font-size: 16px;
    padding: 5px 0;
}

}


@media (max-width: 576px){
    .blog-title {
        padding-bottom: 20px;
    }
    
.blog-description p{
    font-size: 16px;
    padding: 5px 0;
}

.blog-description h5{
    font-size: 25px;
    padding: 5px 0;
}
.blog-description h4{
    font-size: 20px;
    padding: 5px 0;
}
.blog-description ul li{
    font-size: 16px;
    padding: 5px 0;
}

}