.blog-latest {
  padding-inline:1rem 
}

@media(min-width:64rem) {
  .blog-latest {
    padding-inline:4rem 
  }
}

.blog-latest__header {
  padding-bottom:2rem;
}

@media(min-width:64rem) {
  .blog-latest__header {
    padding-bottom:2rem;
    display:flex;
    align-items:center;
  }
}

.blog-latest__title {
   font-weight:300; 
}

.blog-latest__header a {
 margin-left:auto; 
}

.blog-latest__content {
  margin:0 -10px;  
}

.blog-latest__list-wrap.swiper {
  padding-bottom:3.125rem; /* 50px */
}

.blog-latest__list-wrap.swiper .swiper-slide {
  height:auto;
  display:flex;
}

.blog-latest__list-wrap.swiper {
  padding-inline:10px;
}

@media(min-width:64rem) {
  .blog-latest__list-wrap.swiper {
    padding-bottom:3.125rem; /* 50px */
  }
  
  .blog-latest__list-wrap.swiper .swiper-slide {
  }
}

.blog-latest__list {
  list-style:none;
  margin:0;
  padding:0;
}

@media(min-width:64rem) {
  .blog-latest__list {
    display:flex;
    align-items:stretch;
    gap:1.25rem;
  }
}

.blog-latest__item {
  border-radius:1.5rem;
  overflow:hidden;
  box-shadow:0 5px 5px #ccc;
  margin-bottom:1rem;
  position:relative;
  height:auto;
  display:flex;
  flex-direction:column;
}

@media(min-width:64rem) {
  .blog-latest__item {
    width:calc(25% - 0.844rem) !important; /* 4 cards with gap */
    margin-bottom:0;
    height:100%;
  }
}

.blog-latest__item--banner {
  color:#fff;
  background: linear-gradient(to right, rgba(0,88,169,1) 0%,rgba(0,154,222,1) 100%);
}

.blog-latest__banner {
  position: relative;
  height: 100%;
  align-content: center;
  padding: 1.5rem;
  display:flex;
  flex-direction:column;
  flex:1;
}

.blog-latest__banner-content {
  margin:2rem 0;
  font-size:clamp(1.25rem, 3vw, 1.25rem);
}

.blog-latest__image-wrap {
  height:250px;
  position:relative;
  overflow:hidden;
}

.blog-latest__image {
  object-fit:cover;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  transform:scale(1);
  transition:all .3s;
}

.blog-latest__item:hover .blog-latest__image,
.blog-latest__item:focus-within  .blog-latest__image{
  transform:scale(1.05);
}

.blog-latest__item-title {
  font-weight:300;
  font-size:clamp(1.125rem, 3vw, 1.5rem);
  line-height:120%;
  border-top:1px solid #d9d9d9;
  padding-top:1rem;
  min-height:75px;
}

.blog-latest__content-wrap {
  padding:1.5rem;
  display:flex;
  flex-direction:column;
  flex:1;
}

.blog-latest__tags svg {
  display:inline-block;
  width:20px;
  height:20px;
  fill:#0058A9;
  position:relative;
  top:5px;
}

.blog-latest__tag-link {
  display:inline-block;
  text-transform:uppercase;
  margin-bottom:.5rem;
  margin-right:.5rem;
  font-size:0.9rem;
}

.blog-latest__tag-link:last-child {
  border-right:0;
  margin-right:0;
  padding-right:0;
}

.blog-latest__more {
  margin-top:auto;
}

.blog-latest__link {
  margin-left:auto;  
}

.blog-latest__link:after {
  content:'';
  display:block;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:5;
}

.blog-latest__banner .button {
  width:100%;  
}

.blog-latest__read-time {
  padding-right:1rem;
  margin-right:1rem;
  position:relative;
}

{#
.blog-latest__read-time:after {
  content:'';
  display:block;
  position:absolute;
  right:-4px;
  top:8px;
  width:8px;
  height:8px;
  border-radius:100%;
  background-color:#5b6670;
}
#}

/*******************
* Carousel Navigation
********************/

.blog-latest__pagination {
  bottom: 1.375rem !important; /* 22px */
}

@media(min-width:64rem) {
  .blog-latest__pagination {
    bottom: 0px !important;
  }
}

.blog-latest .swiper-button-prev,
.blog-latest .swiper-button-next {
  top: 95%;
  color: #5B6670;
  font-weight: bold;
  border: 1px solid #5B6670;
  border-radius: 100%;
  width: 2.5rem; /* 40px */
  height: 2.5rem; /* 40px */
  background:#fff;
  padding:0;
}

.blog-latest .swiper-button-prev:after,
.blog-latest .swiper-button-next:after {
  font-size: 1.3rem;
}

.blog-latest .swiper-pagination-bullet {
  border: 2px solid #5b6670;
  background: #fff;
  width: 0.938rem; /* 15px */
  height: 0.938rem; /* 15px */
}

.blog-latest .swiper-pagination-bullet-active {
  color: #5B6670;
  background: #5B6670;
}

@media(min-width:64rem) {
  .blog-latest .swiper-button-prev,
  .blog-latest .swiper-button-next {
    display: none;
  }
}