.trace__content {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

.display-card {
	display: grid;
	grid-template-columns: 1fr;
	row-gap: 2rem;
	padding: 1.5rem;
	border-radius: 1.5rem;
}

.trace__content .display-card .image-container {
	width: 100%;
	height: 200px;
	border-radius: 1.5rem;

	& img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		/* object-fit: cover; */
		border-radius: 1.5rem;
	}
}

.quality__content .display-card .image-container {
	width: 100%;
	height: 400px;
	border-radius: 1.5rem;

	& img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		/* object-fit: cover; */
		border-radius: 1.5rem;
	}
}

/* Mobile */
@media only screen and (max-width: 768px) {
	.trace__content {
		grid-template-columns: 1fr;
	}
	.display-card .image-container {
		height: 150px;
	}
}

/* Tablet (portrait) & (landscape) */
@media only screen and (min-width: 768px) and (max-width: 1281px) {
	.trace__content {
		grid-template-columns: repeat(2, 1fr);
		gap: 4rem;
		padding-inline: 6rem;
	}
	.display-card .image-container {
		height: 200px;
	}
}

.benefits {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	height: 20rem;
}

/* .deco-line {
	width: 20px;
	height: 100%;
	background-color: var(--clr-accent-700);
} */

.benefits-details {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	place-items: center;
}

.benefit-card__content {
	margin-top: 3rem;
}

/* Mobile */
@media only screen and (max-width: 768px) {
	.benefits {
		grid-template-columns: 20px 1fr;
		gap: 0;
		height: auto;
	}
	.deco-line {
		width: 10px;
	}
	.benefits-details {
		grid-template-columns: 1fr;
		gap: 3rem;
	}
	.benefit-card__content {
		margin-top: 1.5rem;
	}
}

/* Tablet (portrait) */
@media only screen and (min-width: 768px) and (max-width: 1025px) {
	.benefits {
		grid-template-columns: 15px 1fr;
		gap: 0;
		height: auto;
	}
	.deco-line {
		width: 10px;
	}
	.benefits-details {
		grid-template-columns: 1fr 1fr;
		gap: 5rem 3rem;
	}
	.benefit-card__content {
		margin-top: 1.5rem;
	}
}

/* Tablet (landscape) */
@media only screen and (min-width: 1025px) and (max-width: 1281px) {
	.benefits {
		grid-template-columns: 20px 1fr;
		gap: 1rem;
	}
}

.environment .even-columns {
	grid-template-columns: 1fr;
}

.compliance {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	margin-inline: 65px;
}

.compliance li {
	margin-left: 2rem;
}

/* Mobile */
@media only screen and (max-width: 768px) {
	.environment .even-columns {
		grid-template-columns: 1fr;
	}
	.none-on-mobile {
		display: none;
	}
	.environment .image-container {
		height: 200px;
	}
}

/* Tablet (portrait) */
@media only screen and (min-width: 768px) and (max-width: 1025px) {
	.environment .even-columns {
		grid-template-columns: 1fr;
	}
	.fs-subheading .none {
		display: inline-block;
	}
	.none-on-mobile {
		display: none;
	}
	.environment .image-container {
		height: 250px;
	}
}

.improve-content {
	display: grid;
	grid-template-columns: 1fr 20px 1fr 20px 1fr 20px;
	gap: 2.5em 1rem;
}

.improve-details {
	display: grid;
	grid-template-columns: 1fr;
	gap: 4rem;
	border-radius: 1.5rem;
	padding: 1.5rem 1rem;
	background-color: var(--clr-background-50);
}

.step-content {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	grid-template-rows: subgrid;
	grid-row: span 3;
}

.narrow {
	max-width: 34ch;
}

.arrow {
	align-self: center;
}

/* Mobile */
@media only screen and (max-width: 768px) {
	.improve-content {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 20px 1fr 20px 1fr 20px 1fr;
		gap: 3rem;
	}
	.improve-details {
		border-radius: 1.5rem;
		padding: 1.5rem 1rem;
		background-color: var(--clr-background-50);
		box-shadow: rgba(0, 0, 0, 0.1) 2.4px 2.4px 3.2px;
	}
	.arrow {
		transform: rotate(90deg);
	}
}

/* Tablet (portrait) */
@media only screen and (min-width: 768px) and (max-width: 1025px) {
	.improve-content {
		grid-template-columns: 1fr 20px 1fr;
		gap: 2.5rem 1rem;
	}
	.improve-details {
		border-radius: 1.5rem;
		padding: 1.5rem 1rem;
		background-color: var(--clr-background-50);
		box-shadow: rgba(0, 0, 0, 0.1) 2.4px 2.4px 3.2px;
	}
	.none-on-tebletP {
		display: none;
	}
}

.fourM-inner-padding {
	padding: 3rem 7rem;
}
.background-fill {
	background-color: var(--clr-background-100);
}

.fourM-content-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
}

.fourM-content-details {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

/* Mobile */
@media only screen and (max-width: 768px) {
	.fourM .description,
	.even-columns > p {
		margin-left: 1rem;
	}
	.fourM-inner-padding {
		padding: 3rem;
	}
}

/* Tablet (portrait) */
@media only screen and (min-width: 768px) and (max-width: 1025px) {
	.fourM .description,
	.even-columns > p {
		margin-left: 1rem;
	}
	.fourM-inner-padding {
		padding: 3rem 4rem;
	}
}

/* Tablet (landscape) */
@media only screen and (min-width: 1025px) and (max-width: 1281px) {
	.fourM .description,
	.even-columns > p {
		margin-left: 1rem;
	}
	.fourM-inner-padding {
		padding: 3rem 6rem;
	}
}
