@import "./base.css";

.speakers .main__title {
	font-size: 98px;
}

.shopping-cart-icon--primary g path {
	fill: var(--color-primary);
}

.speakers__wrapper {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(5, 1fr);
	column-gap: 200px;
	row-gap: 120px;
}

.speaker__wrapper {
	max-width: 460px;
}

.speaker__photo {
	width: 310px;
	height: 310px;
	object-fit: cover;
	margin-bottom: 36px;
}

.speaker__photo--top {
	object-position: top;
}

.speaker__name {
	font-size: 32px;
	margin-bottom: 20px;
}

.speaker__company {
	font-size: 24px;
	margin-bottom: 32px;
}

.speaker__bio {
	font-size: 20px;
}

.speaker__company,
.speaker__bio {
	color: var(--color-text-on-secondary);
}

@media (width: 1000px) {
	.speakers__wrapper {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 840px) {
	.nav {
		background-color: var(--color-text-on-primary);
	}
}