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

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

:root {
	--color-bg: #f7f7f7;
	--color-text: #000000;
	--opacity-100: 1;
	--opacity-72: 0.72;
	--opacity-30: 0.3;
	--bp-mobile: 375px;
	--bp-tablet: 768px;
	--bp-desktop: 1024px;
	--bp-wide: 1280px;
	--font-family-ui: "Geist", sans-serif;
	--font-family-body: "Wremena", serif;
	--font-size-ui: 16px;
	--font-size-body: 26px;
	--line-height-body: 1.24;
	--space-xs: 4px;
	--space-sm: 8px;
	--space-md: 16px;
	--space-lg: 24px;
	--rhythm-xl: 160px;
	--rhythm-2xl: 300px;
	--shell-margin-mobile: 20px;
	--shell-margin-tablet: 40px;
	--shell-margin-desktop: 60px;
	--header-offset-top: 20px;
	--header-link-hover: 0.3;
	--home-intro-offset-top: 300px;
	--home-intro-to-feed: 300px;
	--home-feed-to-footer: 280px;
	--about-text-to-contact: 160px;
	--footer-offset-bottom: 20px;
	--grid-gutter-mobile: 0px;
	--grid-gutter-tablet: 60px;
	--grid-gutter-desktop: 88px;
	--grid-stack-mobile: 80px;
	--grid-stack-tablet: 120px;
	--grid-stack-desktop: 160px;
	--grid-column-min: 420px;
	--grid-column-max: 680px;
	--grid-column-max-count: 4;
	--card-meta-inline-gap: 24px;
	--card-stack-gap: 24px;
	--card-link-hover: 0.72;
	--tag-height: 32px;
	--tag-padding-x: 12px;
	--tag-icon-gap: 4px;
	--tag-bg: var(--color-text);
	--tag-text: var(--color-bg);
	--card-link-icon-size: 20px;
	--card-link-icon-container: 32px;
	--card-link-icon-color: var(--color-bg);
	--card-link-icon-bg: var(--color-text);
	--filter-group-gap: 120px;
	--filter-label-gap: 16px;
	--filter-items-gap: 8px;
	--transition-duration: 160ms;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd {
	margin: 0;
}

ul,
ol {
	margin: 0;
	padding: 0;
}

img,
picture,
svg,
video {
	display: block;
	max-width: 100%;
}

img {
	height: auto;
}

iframe {
	border: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

button,
input,
select,
textarea {
	color: inherit;
	font: inherit;
}

button {
	background: transparent;
	border: 0;
	padding: 0;
}

body {
	background-color: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-family-ui);
	font-size: var(--font-size-ui);
	font-weight: 400;
	line-height: 1;
	min-height: 100vh;
	text-rendering: optimizeLegibility;
}

body.admin-bar .site-header {
	top: calc(var(--header-offset-top) + 46px);
}

:focus-visible {
	outline: 2px solid var(--color-text);
	outline-offset: 2px;
}

.site-brand:focus-visible,
.site-about-link:focus-visible,
.site-filter-item:focus-visible,
.feed-card--linked .feed-card__inner:focus-visible {
	outline-offset: 4px;
}

.site {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.site-main {
	flex: 1 0 auto;
}

.shell-row,
.content-shell {
	margin-left: var(--shell-margin-mobile);
	margin-right: var(--shell-margin-mobile);
}

.site-header,
.site-footer,
.site-brand,
.site-about-link,
.site-footer-copy,
.type-ui {
	font-family: var(--font-family-ui);
	font-size: var(--font-size-ui);
	font-style: normal;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: uppercase;
}

.page-content,
.page-content > *,
.type-body {
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
	font-style: normal;
	font-weight: 400;
	letter-spacing: 0;
	line-height: var(--line-height-body);
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

.site-header {
	left: 0;
	position: sticky;
	right: 0;
	top: var(--header-offset-top);
	z-index: 10;
}

.site-header__inner {
	align-items: center;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

.site-brand,
.site-about-link {
	opacity: var(--opacity-100);
	transition: opacity var(--transition-duration) ease;
}

.site-brand:hover,
.site-brand:focus-visible,
.site-about-link:hover,
.site-about-link:focus-visible {
	opacity: var(--header-link-hover);
}

.site-brand {
	justify-self: start;
}

.site-about-link {
	justify-self: end;
}

.site-header__filters {
	display: none;
	gap: var(--filter-group-gap);
	justify-content: center;
	min-height: var(--font-size-ui);
	min-width: 360px;
}

.site-header__filters--empty {
	min-width: 0;
}

.site-filter-group {
	align-items: center;
	display: flex;
	gap: var(--filter-label-gap);
}

.site-filter-group__items {
	display: flex;
	flex-wrap: wrap;
	gap: var(--filter-items-gap);
	justify-content: center;
	min-width: 0;
}

.site-filter-item {
	opacity: var(--opacity-30);
	text-decoration: none;
	transition: opacity var(--transition-duration) ease;
}

.site-filter-item:hover,
.site-filter-item:focus-visible,
.site-filter-item.is-active {
	opacity: var(--opacity-100);
}

.site-filter-item.is-active {
	text-decoration: line-through;
}

.home-intro {
	padding-top: var(--home-intro-offset-top);
	padding-bottom: var(--home-intro-to-feed);
}

.home-intro__text {
	margin: 0 auto;
	max-width: var(--grid-column-max);
	min-width: min(100%, var(--grid-column-min));
	text-align: center;
	width: 100%;
}

.feed-shell {
	margin-left: var(--shell-margin-mobile);
	margin-right: var(--shell-margin-mobile);
}

.feed-grid {
	margin: 0 auto;
	max-width: calc((var(--grid-column-max) * var(--grid-column-max-count)) + (var(--grid-gutter-desktop) * 3));
	width: 100%;
}

.feed-card {
	display: block;
	margin: 0 0 var(--grid-stack-mobile);
	width: 100%;
}

.feed-grid.is-masonry-ready {
	position: relative;
}

.feed-grid.is-masonry-ready .feed-card {
	margin-bottom: 0;
	position: absolute;
}

.feed-card__inner {
	color: inherit;
	display: block;
}

.feed-card--linked .feed-card__inner {
	transition: opacity var(--transition-duration) ease;
}

.feed-card--linked .feed-card__inner:hover,
.feed-card--linked .feed-card__inner:focus-visible {
	opacity: var(--card-link-hover);
}

.feed-card__meta-top,
.feed-card__content,
.feed-card__meta-bottom {
	display: flex;
}

.feed-card__meta-top {
	align-items: center;
	flex-wrap: wrap;
	gap: var(--card-meta-inline-gap);
}

.feed-card__content {
	flex-direction: column;
	gap: var(--card-stack-gap);
	margin-top: var(--card-stack-gap);
}

.feed-card__media {
	width: 100%;
}

.feed-card__media--small {
	width: 60%;
}

.feed-card__media img {
	height: auto;
	width: 100%;
}

.feed-card__media video {
	height: auto;
	width: 100%;
}

.feed-card__text {
	overflow-wrap: anywhere;
	word-break: break-word;
}

.feed-card__text > :not(:last-child) {
	margin-bottom: var(--space-md);
}

.feed-card__meta-bottom {
	align-items: center;
	gap: var(--tag-icon-gap);
	margin-top: var(--card-stack-gap);
}

.feed-card__chip {
	align-items: center;
	background-color: var(--tag-bg);
	color: var(--tag-text);
	display: inline-flex;
	flex: 0 0 auto;
	justify-content: center;
}

.feed-card__chip--tag {
	height: var(--tag-height);
	padding-left: var(--tag-padding-x);
	padding-right: var(--tag-padding-x);
}

.feed-card__chip--icon {
	background-color: var(--card-link-icon-bg);
	color: var(--card-link-icon-color);
	height: var(--card-link-icon-container);
	width: var(--card-link-icon-container);
}

.feed-card__icon-link {
	background-color: var(--card-link-icon-color);
	display: block;
	height: var(--card-link-icon-size);
	mask-image: url("../images/icon-link.svg");
	mask-position: center;
	mask-repeat: no-repeat;
	mask-size: contain;
	width: var(--card-link-icon-size);
	-webkit-mask-image: url("../images/icon-link.svg");
	-webkit-mask-position: center;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
}

.about-shell {
	padding-top: clamp(120px, 21vh, 220px);
	padding-bottom: 120px;
}

.about-block {
	margin: 0 auto;
	max-width: var(--grid-column-max);
	min-width: min(100%, var(--grid-column-min));
	width: 100%;
}

.about-block__contact {
	margin-top: var(--about-text-to-contact);
}

.about-block__label {
	margin-bottom: var(--space-md);
}

.about-block__email {
	display: inline-block;
}

.page-shell {
	padding-top: 140px;
	padding-bottom: 120px;
}

.site-footer {
	flex-shrink: 0;
	padding-bottom: var(--footer-offset-bottom);
}

.site-footer__inner {
	align-items: flex-end;
	display: flex;
	min-height: 1px;
}

.home .site-footer {
	padding-top: var(--home-feed-to-footer);
}

@media (min-width: 768px) {
	.shell-row,
	.content-shell {
		margin-left: var(--shell-margin-tablet);
		margin-right: var(--shell-margin-tablet);
	}

	body.admin-bar .site-header {
		top: calc(var(--header-offset-top) + 32px);
	}

	.about-shell {
		padding-top: clamp(180px, 26vh, 260px);
		padding-bottom: 140px;
	}

	.feed-shell {
		margin-left: var(--shell-margin-tablet);
		margin-right: var(--shell-margin-tablet);
	}

	.feed-grid {
		max-width: calc((var(--grid-column-max) * var(--grid-column-max-count)) + (var(--grid-gutter-tablet) * 3));
	}

	.feed-card {
		margin-bottom: var(--grid-stack-tablet);
	}
}

@media (min-width: 1281px) {
	.shell-row,
	.content-shell {
		margin-left: var(--shell-margin-desktop);
		margin-right: var(--shell-margin-desktop);
	}

	.feed-shell {
		margin-left: var(--shell-margin-desktop);
		margin-right: var(--shell-margin-desktop);
	}

	.feed-grid {
		max-width: calc((var(--grid-column-max) * var(--grid-column-max-count)) + (var(--grid-gutter-desktop) * 3));
	}

	.feed-card {
		margin-bottom: var(--grid-stack-desktop);
	}
}

@media (min-width: 1024px) {
	.site-header__filters {
		align-items: center;
		display: flex;
	}
}

@media (max-width: 1023.98px) {
	.site-header__inner {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	.site-header__filters,
	.site-header__filters--empty {
		display: none;
	}

	.site-about-link {
		grid-column: 2;
	}
}

@media (prefers-reduced-motion: reduce) {
	.site-brand,
	.site-about-link,
	.site-filter-item,
	.feed-card--linked .feed-card__inner {
		transition: none;
	}
}