/****************************************************/
/* BLOG */
/****************************************************/



#blog-cats{
    gap: 1rem;
    list-style: none;
    margin: 0 0 2rem;
}
#blog-cats > *{
    gap: 1rem;
    min-width: 14rem;
    text-align: center;
    display: flex;
}
#blog-cats a{
    font-size: 1rem;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    color: var(--primary);
    font-weight: 500;
    line-height: 1.3;
}

#blog-cats a span{
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}


@media (min-width: 992px){
	#blog-cats{
    flex-wrap: wrap !important;
    gap: 0;
    margin: 0 auto 3rem;
    align-items: center;
}
	#blog-cats > *{
    min-width: 0;
}
	#blog-cats  a{
    white-space: normal;
    max-width: 270px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
 }
	#blog-cats a:hover{
		color: #ffffff;
	}
}

/****************************************************/
/* ITEM LIST */
/****************************************************/



.item-list.v1{
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
}
.item-list.v1 > li{
    list-style: none;
    margin: 0 0 20px;
    width: 100%;
    position: relative;
}

.item-post{
    padding: 2rem;
    display: flex;
    flex-direction: column;
}
.item-post .thumb-wrapper{
	width: 100%;
	display: block;
	flex: 1;
}
.item-post .content{
}
.item-post .content .title{
    font-size: 1.9rem;
    line-height: 1.2;
    margin-bottom: 1.5rem;
    font-weight: 400;
}
.item-post .content .excerpt{
    margin-bottom: 1.7rem;
    
}
.item-post .content .button{
    justify-content: space-between;
    display: inline-flex;
    gap: 1rem;
    padding-inline: 2rem;
}
.post-info{
    margin-bottom: 1rem;
    font-size: .8rem;
    width: 100%;
}
.post-info a{
	text-decoration:  none;
	text-transform: uppercase;
}
.post-info .date{}

@media (min-width: 992px){
	
	.item-post{padding: 2.4rem;height: 100%;flex-direction: row;gap: 2rem;transition: all .3s;}
	.item-post:hover,
	.item-post.featured{
		background-color: var(--yellow);
	}
	.item-post .thumb{}
	.item-post .content{
	    flex: 1;
	    width: 100%;
	}
	.item-post .content .title{
	    font-size: 2.6rem;
	    margin-block: 1.9rem 2rem;
	}
	.item-post .content .excerpt{
	    margin-bottom: 1.7rem;
	    margin.-b: ;
	    margin.-b: 1;
	    font-size: 1rem;
	}
	.item-post .content .button{
	    justify-content: space-between;
	    display: inline-flex;
	    gap: 1rem;
	    padding-inline: 2rem;
	}
	.post-info{
	    margin-bottom: 1rem;
		font-size: .8rem;
	}
	.post-info a{
		text-decoration:  none;
		text-transform: uppercase;
	}
	
	.item-list.v1{
		gap: 2rem;
	}
	.item-list.v1 > li{
		width: calc(50% - 1rem);
		margin: 0;
	}
	.item-list.v1 > li:has(.thumb-wrapper){
		width: calc(100%);
	}
		
	.item-list.v1 > li:nth-child(3n+3){
	    width: 100%;
	}
	.item-list.v1 > li:nth-child(3n+3) .item{
	    display: flex;
	    padding-inline: 6rem;
	}
	.item-list.v1 > li:nth-child(3n+3) .subcontent{
	    display: flex;
	    flex-wrap: wrap;
	    padding-block: 2rem;
	}
	.item-list.v1 > li:nth-child(3n+3) .title{
		width: 50%;
		font-size: 4.2rem;
		margin-top: 0;
	}
	.item-list.v1 > li:nth-child(3n+3) .excerpt{
		width: 50%;
		font-size: 1.9rem;
	}
}



/****************************************************/
/* ITEM LIST v2 */
/****************************************************/



.item-list.v2{
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
}
.item-list.v2 > li{
    list-style: none;
    margin: 0 0 20px;
    width: 100%;
    position: relative;
}

.item-list.v2 .item-post{
	border-radius: 1.5rem;
}
.item-list.v2.has-featured > li:nth-child(1) .item{
	background-color: var(--blue);
}

@media (min-width: 992px){
	
	
	.item-list.v2{
		gap: 0.7rem;
	}
	.item-list.v2 > li{
		width: calc(33.3333% - 0.5rem);
		margin: 0;
	}
	.item-list.v2 > li:has(.thumb-wrapper){
		width: calc(100%);
	}
		
	.item-list.v2.has-featured > li:nth-child(1){
	    width: 100%;
	    margin-bottom: 2rem;
	}
	.item-list.v2.has-featured > li:nth-child(1) .item{
	    display: flex;
	    padding: 6rem;
	}
	.item-list.v2.has-featured > li:nth-child(1) .subcontent{
	    display: flex;
	    flex-wrap: wrap;
	    padding-block: 2rem;
	}
	.item-list.v2.has-featured > li:nth-child(1) .title{
		font-size: 4.6rem;
		margin-top: 0;
	}
	.item-list.v2.has-featured > li:nth-child(1) .excerpt{
		display: none;
	}
}

/****************************************************/
/* PAGINATION */
/****************************************************/


.pagination{
    margin-block: 2rem;
    justify-content: center;
    display: flex;
    gap: 1rem;
}
.page-numbers{
	display: flex;
	padding: 10px;
	border: 1px solid;
	text-decoration: none;
	min-width: 50px;
	text-align: center;
	border-radius: 2rem;
	transition: all .3s;
	align-items: center;
	padding-inline: 1.4rem;
	white-space: nowrap;
}
.page-numbers:not(.next){
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding: 0.6rem 1.8rem;
	white-space: nowrap;
}


.page-numbers.current{
  color: #ffffff;
  background-color: var(--primary);
  border-color: var(--primary);
}

@media (max-width: 991px){
	.pagination > .prev,
	.pagination > .next{
		display: none;
	}
}


/****************************************************/
/* SINGLE */
/****************************************************/


.hero-single{
	padding: 2rem;
	margin-bottom: 2rem;
}
.hero-single h1{}

.post-navigation{
	display: flex;
	align-items: center;
	gap: .4rem;
}

.post-navigation > *{
	border-radius: 50%;
}
.post-navigation > *:hover{
	background-color: var(--primary);
}
.post-navigation > *:hover *{
	stroke: #fff;
}
.post-navigation .nav-next{
	transform: rotate(180deg);
}
.post-navigation svg{
	display: block;
}


@media (min-width: 992px){
	
	.hero-single{
		padding: 5rem 4rem;
		gap: 3rem;
		margin-bottom: 3rem;
	}
	.hero-single h1{
		font-size: 3.8rem;
		line-height: 1;
	}

}