@import 'variables';
@import '_mixins';

ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

.page-content {
	overflow: hidden;
}

.box-1 {
	h1 {
		font-size: 1.75rem;
		margin: 25px 0;
		font-weight: 600;
		text-align: center;
		color: #000;
		font-family: 'Open Sans', sans-serif;
		padding: 40px 20px;
		text-transform: uppercase;
	}
}

.box-2 {
	padding-bottom: 80px;

	@include respond-below(md) {
		padding-bottom: 50px;
	}

	h2 {
		color: #000;
		font-size: 32px;
		font-weight: 300;
		letter-spacing: 4px;
		line-height: 1;
		font-family: 'URW Form', sans-serif;
		text-transform: uppercase;
		margin-bottom: 40px;
	}

	ul {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(292px, 1fr));
		column-gap: 70px;
		row-gap: 40px;

		li {
			display: flex;
			flex-direction: column;
			align-items: center;
			row-gap: 4px;

			img {
				width: 100%;
				max-width: 292px;
			}
			p {
				color: #000;
				font-size: 19px;
				font-weight: 400;
				font-family: 'URW Form', sans-serif;
				letter-spacing: 3px;
				margin: 0;
				text-transform: uppercase;
			}
		}
	}

	.row {
		&:not(:last-child) {
			margin-bottom: 90px;
		}
	}
}

.box-3 {
	margin-bottom: 140px;

	p {
		margin: 0;
		color: #000;
		font-size: 15px;
		font-weight: 400;
		font-family: 'URW Form', sans-serif;
		letter-spacing: 1px;
		text-transform: uppercase;
	}
}