/*Titre au-dessus des tests*/
.title-tests {max-width: 1280px; margin: 0 auto 40px; width: calc(100% - 64px);font: 24px/normal SFR-Bold;}

/*Test Frandroid*/
#Frandroid-lame { max-width: 1280px; width: calc(100% - 64px); margin: 0 auto 40px; display: flex; gap: 40px; font: 14px/normal SFR-Regular}
#Frandroid-lame .lame-container { background: #FFF; padding: 24px; display: flex; flex-direction: column; gap: 24px; border-radius: 8px; width: 100%;}
#Frandroid-lame #Lame-bref > div {display: flex; gap: 40px;}
#Frandroid-lame .lame-container .tableau { display: flex; flex-direction: column; gap: 24px; width: 100%; font: 16px/normal SFR-Bold }
#Frandroid-lame .lame-container .row { background: var(--clr-bg); padding: 6px 16px; border-radius: 8px; display: flex; 
justify-content: space-between; max-width: 376px; align-items: center;}
#Frandroid-lame .lame-container .row p:last-child { display: flex; align-items: center;}
#Frandroid-lame .row p span { font-size: 24px; line-height: 36px;}
#Frandroid-lame .lame-container .evaluation { display: flex; flex-direction: column; gap: 24px; width: 100%;}
#Frandroid-lame b {font: normal 16px / 24px SFR-Bold;}
#Frandroid-lame [aria-level="4"] {font: normal 24px / 36px SFR-Bold;}
#Frandroid-lame [aria-level="5"] {font: normal 16px / 24px SFR-Bold;}
#Frandroid-lame .evaluation h4 {color: #067647; margin: 0;}
#Frandroid-lame .evaluation [aria-level="5"] {color: #067647; margin: 0;}
#Frandroid-lame .evaluation h4:nth-child(3) { color: var(--clr-sfr2);}
#Frandroid-lame .evaluation [aria-level="5"]:nth-child(3) { color: var(--clr-sfr2);}
#Frandroid-lame .lame-container .evaluation ul { list-style: unset; list-style-position: inside;}

#Frandroid-lame .lame-container:last-child { max-width: 400px; }
#Frandroid-lame .lame-container .note { background: #222222; border-radius: 70px; width: 100px; height: 100px; margin: auto; display: flex;
	align-items: center; justify-content: center;}
#Frandroid-lame .lame-container:last-child p:last-child { color: var(--clr-grey);}
#Frandroid-lame .lame-container .note p { font: 32px/normal SFR-Bold; color: #FFF; display: flex; align-items: center;}
#Frandroid-lame .note p span { font: 40px/60px SFR-Bold; }
#Frandroid-lame .lame-container .bloc-img { background: radial-gradient(83.05% 422.43% at 2.05% 74.46%, #CB45FE 0%, #415EFF 100%); 
width: 100%; height: 58px; border-radius: 8px; display: flex; align-items: center; justify-content: center;}

/*Spécificité BHT*/
#Inf .title-tests,
#Inf .Test-SFR-Actus {width: 100%;}
#Inf #Frandroid-lame {width: 100%;}
#Inf #Frandroid-lame h3 {margin-bottom: 0;text-align: left;}
#Inf #Frandroid-lame h4 {font: normal 16px / 24px SFR-Bold;margin: 0;}

/*Test SFR Actus*/
.Test-SFR-Actus {max-width: 1280px; width: calc(100% - 64px); margin: 0 auto 40px;background: #FFF; padding: 24px;border-radius: 8px;display: grid; grid-template-columns: auto auto; gap: 40px;}
.Test-SFR-Actus picture {display: flex;}
.Test-SFR-Actus picture img {max-width: 100%; height: auto;border-radius: 8px;}
.Test-SFR-Actus [aria-level="4"] {font: normal 24px / 36px SFR-Bold;margin-bottom: 8px;}
.Test-SFR-Actus p {margin-bottom: 16px; font: 14px/normal SFR-Regular;}
.Test-SFR-Actus > div {display: flex;flex-direction: column;}
.Test-SFR-Actus > div a[class^="link"] {margin-top: auto;width: fit-content;}


@media screen and (max-width: 1100px){
    /*Titre au-dessus des tests*/
    .title-tests {max-width: 486px; margin: 0 auto 24px; width: calc(100% - 32px);font: 18px/normal SFR-Bold;}

    /*Test Frandroid*/
	#Frandroid-lame { width: calc(100% - 32px); max-width: 486px; flex-direction: column; gap: 16px;}
	#Frandroid-lame #Lame-bref > div {flex-direction: column; gap: 24px;}
	#Frandroid-lame .lame-container {padding: 16px;}
	#Frandroid-lame .lame-container .tableau { gap: 16px;}
	#Frandroid-lame .lame-container .evaluation { gap: 16px;}
	#Frandroid-lame .lame-container:last-child { max-width: unset; }
	#Frandroid-lame .lame-container .bloc-img { height: 36px;}
	#Frandroid-lame .lame-container .row {max-width: none;}
	#Frandroid-lame [aria-level="4"] {font: normal 16px / 24px SFR-Bold;}
	#Inf #Frandroid-lame {width: 100%; max-width: 486px;}
	
	/*Test SFR Actus*/
    .Test-SFR-Actus {max-width: 486px; width: calc(100% - 32px); margin: 0 auto 24px;padding: 16px;grid-template-columns: auto; gap: 24px;}
    .Test-SFR-Actus picture img {width: 100%;}
    .Test-SFR-Actus h3 {margin-bottom: 4px;}
    .Test-SFR-Actus [aria-level="4"] {font: normal 16px / 24px SFR-Bold;margin-bottom: 4px;}
    .Test-SFR-Actus > div a[class^="link"] {margin: 0 auto;}
}