.enum--3 {
	& .container {
		display: flex;
		scroll-snap-type: x mandatory;
		gap: 1rem;
        scroll-padding: var(--pd);
        padding-block: var(--pd);
        padding-inline: var(--pd);
		& .item {
			flex: 0 0 calc(25% - (1rem * 3) / 4);
			scroll-snap-align: start;
			display: flex;
			row-gap: 1rem;
			border: var(--px) solid var(--g2);
			border-radius: 1rem;
			background-color: var(--bg);
			box-shadow: 0 0.4rem 0.7rem 0.2rem var(--g2);
			flex-direction: column;
			padding: 1rem;
			transition: border .25s linear;
			@media (max-width: 767px) {flex: 0 0 15rem;}
			& .person {
				display: flex;
				gap: 1rem;
				& .img {
					width: 20%;
					& img {
						aspect-ratio: 1 / 1;
						width: 100%;
						border-radius: 50%;
						border: .3rem solid var(--bg);
						box-shadow: 0 0.4rem 0.7rem 0.2rem var(--g2);
					}
				}
				& .data {
					width: calc(80% - 1rem);
					display: flex;
					flex-direction: column;
					& .name {
						font-size: 1rem;
						line-height: 160%;
						font-weight: 700;
						color: var(--g5);
					}
					& .location {
						font-size: .8rem;
						line-height: 160%;
						font-weight: 400;
						color: var(--g4);
					}
				}
			}
			& .review {
				flex-grow: 1;
				font-size: .8rem;
				line-height: 160%;
				font-weight: 400;
				color: var(--g6);
			}
		}
	}
	& .btn {
		text-align: center;
		& a {
			display: inline-block;
			text-decoration: none;
			color: var(--bg);
			background-color: var(--main);
			padding: 0.7rem 1.4rem;
			transition: background .25s linear;
			font-weight: 300;
			font-size: 1rem;
			letter-spacing: .08rem;
			border-radius: 0.5rem;
			&:hover {
				background: var(--main-dark);
			}
		}
	}
}