:root{ --logos-visible:6; }

@media (min-width: 1921px) {
	body {
		width: 70%;
	}

	.signal {
		left: 48%;
	}
	
	/*.clients {
		width: 77%;
	}*/
}

@media (max-width: 1920px) {
	
	.clients {
		width: 90%;
	}
}

@media (max-width: 768px) {

	:root{ --logos-visible:3; }
	
	/* Stack cards vertically and adjust their layout */
	.section {
		flex-direction: column;
		align-items: center;
	}

	.signal {
		visibility: hidden;
	}

	.card {
		margin: 20px 0;
		max-width: 90%;
		width: auto;
	}

	.company h2 {
		font-size: 1.2em; /* Reduce the font size of h2 */
	}
	
	.clients h2 {
		font-size: 1.2em; /* Reduce the font size of h2 */
	}

	.company p {
		font-size: 0.9em; /* Reduce the font size of paragraphs */
	}

	.header {
		font-size: 1.2em; /* Reduce the font size of header */
	}

	.section .content h1 {
		font-size: 2em; /* Reduce the font size of main title */
	}

	.section .content p {
		font-size: 1em; /* Reduce the font size of the introductory text */
	}
	
	/*.clients > h2 {
	font-size: 1.1em;
	margin:2em 1em;;	
	}*/

	.carousel-btn{display:none;}
	
	.carousel-track {
		gap: 2em;
	}
	

}

@media (max-width: 965px) {
	main {
		background-size: 250%;
	}
	.signal {
		left: 43%;
	}
	
	.clients {
		width: 90%;
	}

}
@media (max-width: 450px) {
	
	:root{ --logos-visible:2; }
	
	main {
		background-size: 300%;
	}
	.section .content p {
		margin-bottom: -0.1em;
	}
	.section {
		padding-top: 40px;
		padding-bottom: 0;
	}
	.company h2 {
		padding: 0;
	}

	.company p {
		padding: 0 1em;
	}
	
	.article100 {
	display: flex;
	justify-content: center;
	margin: 20px 0;
	max-width: 100%;
	width: auto;
	}

	.clients {
	/*margin: 0 1em;*/
	min-width: 70%;
	} */
	
	.carousel-item img {
		max-height: 4em;
	}
	

	/*.section {
		max-width: none;
	}*/
}