@font-face {
	font-display: swap;
	font-family: Montserrat;
	font-style: normal;
	font-weight: 400;
	src: url(../fonts/montserrat-v29-latin-regular.CIMKXMQI.woff2) format("woff2")
}

@font-face {
	font-display: swap;
	font-family: Montserrat;
	font-style: normal;
	font-weight: 500;
	src: url(../fonts/montserrat-v29-latin-500.DBGu5uxW.woff2) format("woff2")
}

@font-face {
	font-display: swap;
	font-family: Montserrat;
	font-style: normal;
	font-weight: 700;
	src: url(../fonts/montserrat-v29-latin-700.BYRy5CoC.woff2) format("woff2")
}

@font-face {
	font-display: swap;
	font-family: Inter;
	font-style: normal;
	font-weight: 400;
	src: url(../fonts/Inter_18pt-Regular.ttf) format("truetype")
}

@font-face {
	font-display: swap;
	font-family: "Nunito Sans";
	font-style: normal;
	font-weight: 400;
	src: url(../fonts/nunito-sans-v15-latin-regular.GK4zUbTe.woff2) format("woff2")
}

/* Streams page */
.po-streams-page {
	margin-top: 30px;
	font-family: Nunito Sans, sans-serif;
	padding: 0 0 200px;
}

.po-streams-page .po-pagination {
	margin-top: 0;
}

.po-streams-page .po-container {
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.po-streams-page__header {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.po-streams-page__breadcrumbs {
	color: #8aa1b3;
	font-size: 12px;
}

.po-streams-page__title {
	font-family: Montserrat, sans-serif;
	align-self: stretch;
	font-size: 35px;
	font-weight: 400;
	font-style: normal;
	line-height: 100%;
	-webkit-font-smoothing: antialiased;
	margin: 5px 0 0;
}

.po-streams-page__subtitle {
	font-family: Inter, sans-serif;
	color: #8aa1b3;
	font-size: 14px;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	line-height: 1.4;
}

.po-streams-page__banner {
	border-radius: 16px;
	overflow: hidden;
}

.po-streams-page__banner img {
	display: block;
	width: 100%;
	height: 100%;
}

.po-streams-grid {
	display: grid;
	gap: 40px;
	grid-template-columns: minmax(0, 1fr);
}

.po-stream-card {
	background: #fff;
	color: inherit;
	display: flex;
	flex-direction: column;
	gap: 15px;
	text-decoration: none;
}

.po-stream-card__thumb {
	border-radius: 16px;
	position: relative;
	align-self: stretch;
	overflow: hidden;
}

.po-stream-card__thumb img,
.po-stream-card__thumb-placeholder {
	display: block;
	aspect-ratio: 16/9;
	min-height: 218px;
	object-fit: cover;
	width: 100%;
}

.po-stream-card__thumb-placeholder {
	background: linear-gradient(135deg, #e9edf5 0%, #d9e2ef 100%);
}

.po-stream-card__badge {
	display: flex;
	gap: 13px;
	align-items: center;
	background: #FD1717;
	border-radius: 12px;
	padding: 8px 12px;
	position: absolute;
	right: 8px;
	text-transform: uppercase;
	bottom: 8px;
}

.po-stream-card__badge span {
	color: #fff;

	font-family: Montserrat, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: 140%; /* 16.8px */
	letter-spacing: 1.2px;
	text-transform: uppercase;
}

.po-stream-card__title {
	font-family: Montserrat, sans-serif;
	font-size: 25px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: -0.75px;
	-webkit-font-smoothing: antialiased;
}

.po-streams-page .po-pagination .inactive path {
	stroke: #8AA1B3;
}

@media (min-width: 720px) {
	.po-streams-page__title {
		font-size: 40px;
	}

	.po-streams-page__subtitle {
		font-size: 16px;
	}

	.po-streams-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.po-streams-page .po-container {
		gap: 60px;
	}

	.po-streams-page__header {
		gap: 10px;
	}

	.po-streams-page__title {
		font-size: 80px;
		margin: 0;
	}

	.po-streams-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
