.blogHeadSection {
  text-align: center;
  margin-top: -1.7vw;
  margin-bottom: 3vw;
}

.blogHeaderText {
  font-size: 4.688vw;
  font-weight: 700;
  line-height: 7.031vw;
  letter-spacing: -0.1vw;
  color: #4b2d7c;
}

.blogMainGrid {
  display: grid;
  grid-template-rows: 26.458vw 26.458vw 26.458vw;
  grid-template-columns: 21.146vw 21.146vw 21.146vw;
  grid-gap: 2.083vw;
}

.blogPostItem {
  background: #ffffff;
  border-radius: 1.302vw;
  overflow: hidden;
  transition: all 0.3s ease;
  cursor: pointer;
}

.blogPostItem:hover {
  box-shadow: -0.781vw 0.781vw 0.781vw rgba(183, 187, 228, 0.35);
}

.blogPostImg {
  width: 21.146vw;
}

.blogPostTitle {
  font-weight: 600;
  font-size: 1.25vw;
  line-height: 1.875vw;
  text-align: center;
  color: #242424;
  margin-left: 1.198vw;
  margin-top: 1.563vw;
  height: 3.75vw;
  width: 18.75vw;
  text-transform: capitalize;
}

.blogPostAuthorWrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 1.563vw;
  margin-bottom: 2.083vw;
}

.blogPostAuthorImg {
  width: 2.083vw;
  image-rendering: -webkit-optimize-contrast;
  margin-right: 0.99vw;
}

.blogPostAuthorName {
  font-size: 0.833vw;
  line-height: 1.354vw;
  text-align: center;
  color: #242424;
  font-weight: 500;
}

.blogShowMoreSection {
  text-align: center;
  margin-top: 4.688vw;
  margin-bottom: 7.839vw;
}

.blogShowMoreButton {
  font-weight: 600;
  font-size: 0.833vw;
  line-height: 1.25vw;
  text-transform: uppercase;
  background: #edeff7;
  color: #ef0a5f;
  padding: 0.625vw 2.24vw;
  border: 0.15vw solid #ef0a5f;
  border-radius: 2.708vw;
  transition: all 0.3s ease;
}

.blogShowMoreButton:hover {
  color: #ffffff;
  background: #ef0a5f;
}

.blogShowMoreButton:active {
  color: #ffffff;
  background: #cc084f;
  border: 0.15vw solid #cc084f;
}

footer {
  padding-top: 5vw;
}

/*-------------MOBILE BLOG------------*/
@media screen and (max-width: 1023px) {
  footer {
    padding-top: 22.222vw;
  }

  .blogMobileFixWrapper {
    margin-left: -0.417vw;
  }

  .blogHeadSection {
    text-align: center;
    margin-top: 22.222vw;
    margin-bottom: 27.778vw;
  }

  .blogHeaderText {
    font-size: 13.333vw;
    line-height: 20vw;
    margin-left: -5vw;
  }

  .blogMainGrid {
    grid-template-rows: auto;
    grid-template-columns: 91.111vw;
    grid-gap: 4.444vw;
  }

  .blogPostItem {
    border-radius: 6.944vw;
  }

  .blogPostImg {
    width: 91.111vw;
  }

  .blogPostTitle {
    font-size: 6.667vw;
    line-height: 10vw;
    margin-left: 4.444vw;
    margin-top: 8.333vw;
    height: 30vw;
    width: 82.222vw;
  }

  .blogPostAuthorWrapper {
    margin-bottom: 11.111vw;
  }

  .blogPostAuthorImg {
    width: 11.111vw;
    margin-right: 5.556vw;
  }

  .blogPostAuthorName {
    font-size: 4.444vw;
    line-height: 7.222vw;
  }

  .blogShowMoreSection {
    margin-top: 16.667vw;
    margin-bottom: 27.778vw;
  }

  .blogShowMoreButton {
    font-size: 3.889vw;
    line-height: 5.833vw;
    padding: 3.333vw 15vw;
    border: 0.556vw solid #ef0a5f;
    border-radius: 14.444vw;
  }

  .blogShowMoreButton:active {
    border: 0.556vw solid #cc084f;
  }
}