.pg_news{
	& .liste_news_btn{
		display: flex;
		justify-content: end;
		align-items: center;
		padding: 0.25rem 0.5rem;
		margin-bottom: 1rem;
		background: linear-gradient(to left, #f5f5f5, transparent);
		border-radius: 0 10px 10px 0;

		& button{
			background: none;
			border: 0 none;
			cursor: pointer;
			font-size: 1.2em;
			color: #999;
			&.active{
				color: var(--mc-primary);
			}
		}
	}
	& .liste_news{
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap:1rem;
		
		& > .item{
			padding-bottom: 1rem; 
			border-bottom: 1px solid var(--mc-primary);

			& .wrapper{
				display: grid;
				grid-template-columns: minmax(150px, 1fr);
				grid-template-rows: auto auto auto 1fr;
				grid-template-areas: 
					'visuel'
					'date'
					'titre'
					'texte'
					'lien'
				;
				gap:0 2rem;
				justify-content: center;
				max-width: 350px;
				margin-inline: auto;
				padding: 0.5rem;

				& .visuel {
					grid-area: visuel;

					& img{
						width: min(350px, 100%);
						height: 200px;
						object-fit: cover;
						
						&.img_default{							
							object-fit: scale-down;
							opacity: 0.3;
						}
					}
				}
				& .date{
					grid-area: date;
					padding: 0.25rem;
					font-size: 0.9rem;
					color:var(--mc-primary);
				}
				& .titre{
					grid-area: titre;
					--_clr-a:var(--mc-text);
					font-size: 1.2rem;
					font-weight: 600;
					line-height: 1;
					padding-bottom: 0;
					margin-top: 0;
					letter-spacing: unset;
					
					&::before{
						display: none !important;
					}
				}
				& .texte{
					grid-area: texte;
					line-height: 1;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 3;
					overflow: hidden;
					text-overflow: ellipsis;
				}
				& .lien{
					display: none;
				}
			}
		}

		&.liste_news__line{
			flex-direction: column;

			& > .item{
				& .wrapper{
					max-width: unset;
				}
			}
		}
		
	}
	
	& .fiche{
		width:min(1200px, calc(100% - 1em));
		margin:0 auto;
		padding: 1rem;
		display: grid;
		grid-template-columns: 1fr minmax(300px, 0.75fr);
		grid-template-rows: auto auto auto 1fr;
		grid-template-areas: 
			'categorie categorie'
			'titre titre'
			'details visuel'
			'texte visuel'
		;
		gap:0 2rem;

		&.fiche_wo_visuel{
			grid-template-areas: 
			'categorie categorie'
			'titre titre'
			'details details'
			'texte texte'
		;
		}

		& .visuel{
			grid-area: visuel;
			display: flex;
			align-items: start;
			justify-content: center;

			& .visuel_wrapper{
				&.sticky{
					position:sticky;
					top: 2rem;
				}
			}
			& img{
				border-radius: 0px;
			}
		}			
		& .date{
			color:var(--mc-grey);
		}		
		& .categorie{
			grid-area: categorie;
		}
		& .titre{
			--c-title-h1:var(--mc-text);
			grid-area: titre;
			margin-top: 0;
			padding-top: 1rem;
			padding-bottom: 0.5rem;			
		}
		& .details{
			display: flex;
			justify-content: space-between;
			color:var(--mc-grey);
			padding: 0.5rem 0;
			font-size: 0.9rem;
		}
		& .texte{
			grid-area: texte;
			padding-top: 0.5rem;
			padding-bottom: 1rem;
		}
	}
	& .autres_news{
		margin-top: 2rem;
	}

	@media (max-width: 990px) {
		& .liste_news{			
			grid-template-columns: repeat(3, 1fr);

			& > .item{
				flex-basis: fill;
			}
		}
	}
	@media (max-width: 768px) {
		& .fiche{
			grid-template-columns: 1fr;
			grid-template-rows: auto auto auto auto 1fr;
			grid-template-areas: 
				'titre'
				'categorie'
				'details'
				'visuel'
				'texte'
			;

			& .titre{
				&::before{
					display: none;
				}
			}
		}
		& .liste_news_btn{
			display: none;
		}
		& .liste_news{			
			grid-template-columns: repeat(2, 1fr);

			& > .item{
				flex-basis: fill;
			}
		}
	}
	@media (max-width: 580px) {
		& .liste_news{			
			grid-template-columns: 1fr;

			& > .item{
				& .wrapper{
					display: flex;
					flex-direction: column;
					gap: 1rem;

					& .visuel {
						& img{
							width: 100%;
						}
					}
				}
			}
		}
	}

}