/* DEFINITIONS */

:root {
    --bright-green: #21AF4F;
    --bright-blue: #2A84D5;
    --dark-blue: #162F41;
    --mid-blue: #204761;
    --mid-grey: #7990A0;
    --white: #FFFFFF;
    --black: #000000;
    --foreground: var(--black);
    --background: var(--white);
    --link: var(--bright-blue);
	--homes: #2A80CD;
	--place-nature: #21A94F;
	--sustainable-business: #FFB600;
	--production-construction: #FF7866;
    --link-interaction: color-mix(in lab, var(--bright-blue) 80%, var(--white));
	--fs-5: clamp(3rem, 3.7vi + 3.27rem, 4.5rem);
	--fs-4: clamp(2.44rem, 2.38vi + 1.85rem, 3.75rem);
	--fs-3: clamp(1.95rem, 1.56vi + 1.56rem, 2.81rem);
	--fs-2: clamp(1.56rem, 1vi + 1.31rem, 2.11rem);
	--fs-1: clamp(1.2rem, 0.6vi + 1.06rem, 1.45rem);
	--fs-0: clamp(0.97rem, 0.32vi + 0.89rem, 1.05rem);
	--fs--1: clamp(0.92rem, 0.24vi + 0.86rem, 0.99rem);
	--fs--2: clamp(0.8rem, 0.17vi + 0.76rem, 0.89rem);
}

/* GENERAL */

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
.h1 a,
.h2 a,
.h3 a,
.h4 a,
.h5 a,
.h6 a,
blockquote {
	color: inherit;
}
h1,
h2,
h3,
.h1,
.h2,
.h3 {
	text-wrap: balance;
	line-height: 120%;
}
h1,
.h1 {
	font-size: var(--fs-4);
	text-wrap: balance;
}
h2,
.h2 {
	font-size: var(--fs-3);
}
h3,
.h3 {
	font-size: var(--fs-2);
}
h4,
h5,
p,
.h4,
.h5,
.p {
	font-size: var(--fs-0);
}
a {
	transition: 0.3s color linear, 0.3s background-color linear;
}
.x-site > .x-layout,
.x-main.full {
	min-block-size: calc(100vh - 22.1rem);
}
.x-col,
.x-text {
	color: var(--foreground);
}
.dark,
.dark .x-col,
.dark .x-text {
	--foreground: var(--white);
	--background: var(--dark-blue);
	color: var(--foreground);
}
.dark a {
	--link: var(--mid-grey);
	--link-interaction: var(--white);
}
.dark #header-logo svg .future-homes,
.dark .x-text svg .future-homes {
	fill: var(--white);
}
.dark #header-logo svg .hub,
.dark .x-text svg .hub {
	fill: var(--mid-grey);
}
#title h1 {
	margin-block: 0;
}

/* HEADER */

.x-masthead {
	--foreground: var(--dark-blue);
	--background: var(--white);
}
.x-masthead .x-bar {
	color: var(--dark-blue);
	box-shadow: 0px -21px 11px 30px color-mix(in lab, var(--dark-blue) 10%, transparent);
}
.x-masthead #header-logo {
	color: var(--foreground);
	display: flex;
	justify-content: flex-start;
	align-items: center;
	inline-size: min(100%, 13 * var(--fs-2));
	block-size: 100%;
	font-size: var(--fs-2);
	font-weight: 500;
	padding-block: 0.7rem;
	gap: 1.3em;
}
.x-masthead #header-logo svg {
	flex: 0 1 min(100%, 6rem);
	block-size: 100%;
	margin-inline: 0 auto;
	aspect-ratio: 0.8388671875;
}
.x-masthead #header-logo svg .future-homes {
	fill: var(--foreground);
}
.x-masthead #header-logo .site-name {
	flex: 1;
}
.x-masthead .back a {
	color: var(--foreground);
	display: flex;
	font-size: var(--fs-0);
	flex-wrap: wrap;
	align-items: center;
	gap: 1ex;
}
.x-masthead .back svg {
	inline-size: 1ex;
	height: auto;
}

/* FOOTER */

.x-colophon .x-text {
	display: flex;
	flex-wrap: wrap;
	color: var(--foreground);
	justify-content: space-between;
	align-items: center;
	inline-size: min(100%, 1400px);
	margin-inline: auto;
	padding-block: 2rem;
	gap: 3rem;
}
.x-colophon .privacy a,
.x-colophon .privacy a:hover {
	--link: var(--white);
	--link-interaction: var(--white);
	text-decoration: underline;
	text-decoration-color: transparent;
	transition: 0.3s text-decoration-color linear;
}
.x-colophon .privacy a:hover {
	text-decoration: underline;
	text-decoration-color: inherit;
}
.x-colophon .x-text p {
	flex: 1 0 1rem;
	margin-block: 0;
	justify-self: center;
}
.x-colophon .x-text .logo a {
	display: inline-flex;
	inline-size: auto;
	block-size: 7.5rem;
}
.x-colophon .x-text .logo svg {
	inline-size: min(100%, 8rem);
	block-size: 100%;
	margin-inline: 0 auto;
	aspect-ratio: 0.8388671875;
}
.x-colophon .x-text .linkedin {
	justify-self: flex-end;
	flex: 0 1 min(100%, 1.8rem);
}
.x-colophon .x-text .linkedin a {
	box-shadow: 0 0 0 1px inset;
	color: var(--white);
	border-radius: 3px;
	padding-block: 0.3lh;
	display: flex;
	align-items: center;
	transition: 0.3s box-shadow linear;
}
.x-colophon .x-text .linkedin a:hover {
	box-shadow: 0 0 0 2.5px inset;
}
.x-colophon .x-text .linkedin svg {
	inline-size: 100%;
}

/* CTA */

.cta svg {
	inline-size: 1em;
	height: auto;
}
.cta .icon.svg-arrow {
	translate: 0 0.1em;
	rotate: 315deg;
	transition: 0.4s translate ease-in-out;
}
.cta:hover .icon.svg-arrow {
	translate: 0.15em -0.05em;
}

/* BANNER */

#banner.stacked .x-col {
	display: grid;
	grid-template-columns: 1fr;
	align-items: center;
	place-content: center;
}
#banner.stacked .x-col .x-text,
#banner.stacked .x-col .x-frame {
	grid-area: 1 / 1 / 2 / 2;
}
#banner.stacked .x-col .x-text {
	text-align: center;
	z-index: 1;
}
#banner.stacked .x-col .x-frame {
	z-index: 0;
}
#banner.stacked .x-col .x-text h1 {
	font-size: var(--fs-5);
}
#banner.stacked .x-col .x-text h2,
#banner.stacked .x-col .x-text p {
	font-size: var(--fs-2);
	text-wrap: balance;
}
#banner.stacked .x-col .x-text p {
	max-inline-size: min(95%, 80rem);
	margin-inline: auto;
}
#banner .x-frame-inner {
	padding-block: calc(16 / 9 * 50%);
}
#banner video {
	position: relative;
	object-fit: cover;
	z-index: 10;
}
@media (width < 600px) and (orientation: portrait) {
	#banner .x-frame-inner {
		padding-block: calc(16 / 9 * 50%);
	}
}
@media (width >= 600px) and (height >= 600px) {
	#banner .x-frame-inner {
		aspect-ratio: 3;
		padding: 0;
		inline-size: 100%;
		block-size: auto;
	}
}

/* FEATURED */

#featured .resources {
	gap: 3rem;
}
#featured .resources li {
	flex: 1 0 12rem;
}
#featured .resources .pillar,
#featured .resources .title,
#featured .resources .excerpt {
	flex: 1 0 90%;
}
#featured .resources .title {
	font-size: var(--fs-1);
}
#featured .cta .icon.svg-arrow {
	rotate: 90deg;
}
#featured .cta:hover .icon.svg-arrow {
	translate: 0 0.25em;
}
#featured li .cta {
	margin-block-start: 0.3lh;
}
#featured .cta .button {
	display: inline-flex;
	color: var(--white);
	background: var(--dark-blue) linear-gradient(-45deg, var(--bright-blue), var(--bright-green)) no-repeat scroll 0 0 / cover;
	font-size: var(--fs-0);
	mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCA1OTUuMjggMTgyLjUiPjxwYXRoIGQ9Im01OTAuNTQ3IDc4Ljk1Ny0zOC40ODktNjYuNjYxQzU0Ny42NyA0LjY4OCA1MzkuNTU0IDAgNTMwLjc3IDBjMCAwLTc3LjA0LjAwNi03Ny4wNjkuMDA2SDI0LjU4NEMxMS4wMDcuMDA2IDAgMTEuMDE4IDAgMjQuNTk0VjE1Ny45MWMwIDEzLjU3NyAxMS4wMDcgMjQuNTkgMjQuNTg0IDI0LjU5aDUwNi4xODVjOC43ODQgMCAxNi45LTQuNjg4IDIxLjI4OS0xMi4yOThsMzguNDg5LTY2LjY2MWM0LjM5NS03LjYwMiA0LjM5NS0xNi45OCAwLTI0LjU4NCIvPjwvc3ZnPg==");
	mask-repeat: no-repeat;
	align-content: center;
	inline-size: 13.3ex;
	block-size: 1.8lh;
	border-radius: 4px;
	padding-inline: 0 0.6ex;
}

/* RESOURCE LISTING */

#listing:has(#resources-filter) .x-col {
	display: grid;
	gap: clamp(1rem, 2vw + 2vh, 4rem);
	align-items: start;
	justify-content: start;
}
.resources {
	grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
	gap: 2.4rem;
}
#resources-filter + .resources li:not(.match),
.resources .hide {
	position: absolute;
	pointer-events: none;
	inset: 0 auto auto auto;
	transform-origin: 0% 0%;
	filter: opacity(0%);
	scale: 0.01;
	z-index: -1;
}
.resources li {
	flex: 1 0 100%;
	align-content: flex-start;
	justify-content: flex-start;
	gap: 0.7rem;
}
#resources-list li {
	gap: 0.4rem 0.65rem;
}
#resources-list .featured {
	--foreground: var(--white);
	--link: var(--white);
	--link-interaction: var(--white);
	outline: 5px solid var(--mid-blue);
	background-color: var(--mid-blue);
	color: var(--foreground);
	border-radius: 5px;
	padding-inline: 0.5rem;
	padding-block: 0.5rem;
}
.resources li :is(div, h3, h4, p) {
	margin-block: 0;
}
.resources .pillar {
	color: var(--mid-grey);
}
.resources .featured .pillar {
	color: color-mix(in lab, var(--mid-grey) 50%, var(--white));
}
.resources .title {
	font-size: var(--fs-1);
	flex: 1 0 100%;
	margin-block-end: 0.1lh;
}
.resources .excerpt {
	font-size: var(--fs--2);
}
.resources .featured-image,
.resources .featured-image a,
.resources .featured-image img {
	aspect-ratio: 1.5;
	display: flex;
	border-radius: 4px;
}
.resources .featured-image a {
	position: relative;
}
.resources .featured-image:not(.empty) a {
	outline: 1px solid var(--mid-blue);
}
.resources .featured-image a::before {
	position: absolute;
	content: '';
	inset: auto 0 0 0;
	block-size: 7px;
	border-radius: 0 0 5px 5px;
	background-color: var(--mid-grey);
	z-index: 1;
}
.resources .homes .featured-image a::before {
	background-color: var(--homes);
}
.resources .place-nature .featured-image a::before,
.resources .place-and-nature .featured-image a::before {
	background-color: var(--place-nature);
}
.resources .production-construction .featured-image a::before,
.resources .production-and-construction .featured-image a::before {
	background-color: var(--production-construction);
}
.resources .sustainable-business .featured-image a::before {
	background-color: var(--sustainable-business);
}
#listing .resource-category {
	display: none;
}
.resources .featured-image {
	flex: 1 0 100%;
	background: linear-gradient(32deg, #b5bcbc 15%, #8b9fa9 85%);
	align-self: flex-start;
	position: relative;
}
#resources-list .bookmark	 {
	position: absolute;
	inset: 0.4rem auto auto 0.1rem;
}
#resources-list .featured .bookmark {
	inset-block-start: 2.3rem;
	inset-inline-start: 0.45rem;
}
#resources-list .bookmark svg path {
	fill-opacity: 0;
	stroke: var(--white);
	stroke-width: 28;
	stroke-opacity: 0.4;
	transition: 0.2s fill-opacity linear, 0.2s stroke-opacity linear;
}
#resources-list .bookmarked .bookmark svg path {
	fill-opacity: 1;
	stroke-opacity: 1;
}
#resources-list li:hover .bookmark svg path {
	fill-opacity: 0.8;
	stroke-opacity: 1;
}
#resources-list .bookmark a {
	color: var(--white);
}
#resources-list .bookmark svg {
    inline-size: 2em;
    block-size: auto;
}
#homes .resources .featured-image {
	background: linear-gradient(32deg, var(--homes), #FFFD94);
}
#place-nature .resources .featured-image {
	background: linear-gradient(32deg, var(--place-nature), #B9DBFF);
}
#production-construction .resources .featured-image {
	background: linear-gradient(32deg, var(--production-construction), #FF87F8);
}
.resources .featured-image.empty {
	box-shadow: -1rem -1rem 5rem color-mix(in lab, var(--background), transparent) inset;
}
.resources .title a,
.resources .featured-image a {
	position: relative;
}
.resources .title a {
	justify-content: start;
	gap: 0;
}
.resources :is(.checklist, .digital-tool, .download, .quick-read, .tool, .video) .title a,
.resources .link .title a {
	padding-inline-end: 1.45em;
}
.resources :is(.checklist, .digital-tool, .download, .quick-read, .tool, .video) .title a::after,
.resources .link .title a::after {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	transition: 0.3s translate ease-in-out, 0.3s filter linear;
}
.resources .featured:is(.checklist, .digital-tool, .download, .quick-read, .tool, .video) .title a::after {
	filter: invert(100%) brightness(200%);
}
.resources .featured.link .title a::after {
	filter: brightness(200%);
}
.resources .link .title a::after {
	background: transparent scroll no-repeat 50% 50% / 20%;
}
.resources :is(.checklist, .digital-tool, .download, .quick-read, .tool, .video) .title a::after {
	background: transparent scroll no-repeat 100% 1.7rem / 1.4em;
}
.resources li:is(.quick-read) .title a::after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCAyNDkuNjc0IDE2OC4zNzIiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAxMDEwMSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiIGQ9Im0xNzcuNDk2IDc1LjQyNyAxMi41NTctNy4yNWMuNTM5LS4zMTEgMS4yMDQtLjMxMSAxLjc0MyAwbDEyLjU1NyA3LjI1Yy41MzkuMzExLjg3Mi44ODcuODcyIDEuNTF2MTQuNDk5YzAgLjYyMy0uMzMzIDEuMTk5LS44NzIgMS41MWwtMTIuNTU3IDcuMjVjLS41MzkuMzExLTEuMjA0LjMxMS0xLjc0MyAwbC0xMi41NTctNy4yNWMtLjU0LS4zMTEtLjg3Mi0uODg3LS44NzItMS41MVY3Ni45MzdjMC0uNjIzLjMzMi0xLjE5OS44NzItMS41MXoiLz48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiMwMTAxMDEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiIGQ9Ik0xMzMuNzgxIDg0LjE4NmMzMS41ODUtNDIuMDc1IDgyLjcwMi00Mi4wNzUgMTE0LjI4NyAwbS0xMTQuMjg3IDBjMzEuNTg1IDQyLjA3NSA4Mi43MDIgNDIuMDc1IDExNC4yODcgME04Ni4wOTQgMTUzLjA1OEgyLjA3OFYxNS4zMTVoODQuMDE2YzUuNTIzIDAgMTAgNC40NzcgMTAgMTB2MTE3Ljc0M2MwIDUuNTIzLTQuNDc3IDEwLTEwIDEwIi8+PHBhdGggZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDEwMTAxIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTkwLjU5NCAxMTcuMDczdjM1Ljk4NWgtODQuMDE2Yy01LjUyMyAwLTEwLTQuNDc3LTEwLTEwVjI1LjMxNWMwLTUuNTIyIDQuNDc3LTEwIDEwLTEwaDg0LjAxNnYzNi4yNDdtLTExOS4wNjEtNC42MkgyNi42NG00NC44OTMgMzcuMjQ0SDI2LjY0bTQ0Ljg5MyAzNy4yNDVIMjYuNjQiLz48L3N2Zz4=");
	background-size: 1.7em;
}
.resources li:is(.checklist) .title a::after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCAxNjguMzcyIDE2OC4zNzIiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAxMDEwMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTk5LjE3NiAxOS43OTJoNTcuNDYzdjE0NC45MDZtLTE0NC45MDYuMDAxVjE5Ljc5Mmg1Ny4xODJtNjQuODggNTQuNTQ1SDY3LjU1N20tMjYuNDM3IDcuNjEtNi41NDMtNi41NDNtNi44MTIgNi41NDNMNTYuNjEgNjYuNzI2bTc3LjE4NSA0NC44NTVINjcuNTU3bS0yNi40MzcgNy42MTEtNi41NDMtNi41NDNtNi44MTIgNi41NDMgMTUuMjIxLTE1LjIyMW03Ny4xODUgNDQuODU1SDY3LjU1N20tMjYuNDM3IDcuNjEtNi41NDMtNi41NDNtNi44MTIgNi41NDMgMTUuMjIxLTE1LjIyMSIvPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAxMDEwMSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiIGQ9Im05Ny42MTUgMjguNjc2LTEyLjU1NyA3LjI1Yy0uNTM5LjMxMS0xLjIwNC4zMTEtMS43NDMgMGwtMTIuNTU3LTcuMjVjLS41MzktLjMxMS0uODcyLS44ODctLjg3Mi0xLjUxVjEyLjY2N2MwLS42MjMuMzMzLTEuMTk5Ljg3Mi0xLjUxbDEyLjU1Ny03LjI1Yy41MzktLjMxMSAxLjIwNC0uMzExIDEuNzQzIDBsMTIuNTU3IDcuMjVjLjUzOS4zMTEuODcyLjg4Ny44NzIgMS41MXYxNC40OTljMCAuNjIzLS4zMzMgMS4xOTktLjg3MiAxLjUxeiIvPjwvc3ZnPg==");
}
.resources li:is(.download) .title a::after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCAxNjguMzcyIDE2OC4zNzIiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAxMDEwMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTY5LjQ2OSAxNDguNThIMTEuNzMzVjMuNjc0aDE0NC45MDZWMTQ4LjU4SDk5LjA2NSIvPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAxMDEwMSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiIGQ9Im03MC43NTggMTM5LjY5NiAxMi41NTctNy4yNWMuNTM5LS4zMTEgMS4yMDQtLjMxMSAxLjc0MyAwbDEyLjU1NyA3LjI1Yy41MzkuMzExLjg3Mi44ODcuODcyIDEuNTF2MTQuNDk5YzAgLjYyMy0uMzMzIDEuMTk5LS44NzIgMS41MWwtMTIuNTU3IDcuMjVjLS41MzkuMzExLTEuMjA0LjMxMS0xLjc0MyAwbC0xMi41NTctNy4yNWMtLjUzOS0uMzExLS44NzItLjg4Ny0uODcyLTEuNTF2LTE0LjQ5OWMwLS42MjMuMzMzLTEuMTk5Ljg3Mi0xLjUxeiIvPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAxMDEwMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTg0LjE4NCAxMDguNDZWNDEuOTQxbTE4LjU4MyA0OS43OS0xOC41ODEgMTguNTgxLTE4LjU4LTE4LjU4MSIvPjwvc3ZnPg==");
}
.resources li:is(.digital-tool) .title a::after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCAxOTUuNDg4IDE2OC4zNzIiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAxMDEwMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTIyLjcwOCA3LjQxNUgxNzIuNzh2MTExLjI0MkgyMi43MDh6bTE3MS4xOTQgMTUzLjU0MkgxLjU4N2wyMS4xMjItNDIuMTY1SDE3Mi43OHoiLz48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiMwMTAxMDEiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJtMTExLjE3MyA3MS43OTYtMTIuNTU3IDcuMjVjLS41MzkuMzExLTEuMjA0LjMxMS0xLjc0MyAwbC0xMi41NTctNy4yNWMtLjUzOS0uMzExLS44NzItLjg4Ny0uODcyLTEuNTFWNTUuNzg3YzAtLjYyMy4zMzMtMS4xOTkuODcyLTEuNTFsMTIuNTU3LTcuMjVjLjUzOS0uMzExIDEuMjA0LS4zMTEgMS43NDMgMGwxMi41NTcgNy4yNWMuNTM5LjMxMS44NzIuODg3Ljg3MiAxLjUxdjE0LjQ5OWMwIC42MjMtLjMzMyAxLjE5OS0uODcyIDEuNTF6Ii8+PHBhdGggZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDEwMTAxIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTMwLjE2MSA2My4wMzZ2LS4wNDNjLS4wMDQtMi44NDUuOTIzLTUuNjEyIDIuNzgxLTcuNzY3bDQuNDAxLTUuMTA4LTguNDY5LTE0Ljc1OC02LjIzNyAxLjE1MmMtMi45NTIuNTQ1LTYgLjAxNC04LjU5NC0xLjQ5NWwtLjMwNS0uMTc4Yy0yLjQyOC0xLjQxMy00LjI3MS0zLjY0Ny01LjE5Ny02LjNsLTIuMTg1LTYuMjU2LTE3LjAxNS0uMDQzLTIuMTI4IDUuOTk1Yy0uOTk3IDIuODExLTIuOTY3IDUuMTczLTUuNTU0IDYuNjU5bC0uMDc1LjA0M2MtMi42IDEuNDk0LTUuNjQ4IDIuMDA3LTguNTk0IDEuNDQ4bC02LjIzMy0xLjE4NC04LjU0NSAxNC43MTQgNC4zNzggNS4xMzRjMS44MzUgMi4xNTEgMi43NjMgNC45MDIgMi43MzkgNy43MjktLjAwMS4wODYtLjAwMS4xNzItLjAwMS4yNTh2LjA0M2MuMDA0IDIuODQ1LS45MjQgNS42MTItMi43ODEgNy43NjhsLTQuNDAyIDUuMTA4IDguNDcgMTQuNzU3IDYuNTE2LTEuMjAzYzIuODY4LS41MyA1Ljc5Ny4wNzYgOC4zMTUgMS41NDYuMDI1LjAxNS4wNS4wMy4wNzUuMDQ0IDIuNTA5IDEuNDU2IDQuNDcgMy42OTQgNS40MjYgNi40MzNsMi4xODUgNi4yNTcgMTcuMDE1LjA0NCAyLjIxNy02LjI0N2MuOTcxLTIuNzM1IDIuOTQ2LTQuOTY1IDUuNDY1LTYuNDA4LjAyNS0uMDE0LjA1LS4wMjguMDc1LS4wNDMgMi41MjUtMS40NTUgNS40NTQtMi4wNDQgOC4zMTctMS41MDFsNi41MSAxLjIzNyA4LjU0NS0xNC43MTQtNC4zNzgtNS4xMzNjLTEuODM1LTIuMTUyLTIuNzYyLTQuOTAyLTIuNzM4LTcuNzI5LjAwMS0uMDg2LjAwMS0uMTczLjAwMS0uMjU5Ii8+PC9zdmc+");
	background-size: 1.7em;
}
.resources li:is(.tool) .title a::after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjciIGhlaWdodD0iMjYiIHZpZXdCb3g9IjAgMCAyNyAyNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1Ljk2OCAwLjQ2NTgySDAuOTg5MDE0VjI1LjQ0NDhIMjUuOTY4VjAuNDY1ODJaIiBzdHJva2U9IiMxNjJGNDEiIHN0cm9rZS13aWR0aD0iMC43IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTMuMjY2OCAxOS4wNDU5TDExLjEwMTkgMjAuMjk1OUMxMS4wMDg5IDIwLjM0OTkgMTAuODkzOSAyMC4zNDk5IDEwLjgwMDkgMjAuMjk1OUw4LjYzNTg2IDE5LjA0NTlDOC41NDI4NiAxOC45OTE5IDguNDg1ODQgMTguODkyOSA4LjQ4NTg0IDE4Ljc4NTlWMTYuMjg2OEM4LjQ4NTg0IDE2LjE3OTggOC41NDI4NiAxNi4wNzk4IDguNjM1ODYgMTYuMDI2OEwxMC44MDA5IDE0Ljc3NjhDMTAuODkzOSAxNC43MjI4IDExLjAwODkgMTQuNzIyOCAxMS4xMDE5IDE0Ljc3NjhMMTMuMjY2OCAxNi4wMjY4QzEzLjM1OTggMTYuMDgwOCAxMy40MTY5IDE2LjE3OTggMTMuNDE2OSAxNi4yODY4VjE4Ljc4NTlDMTMuNDE2OSAxOC44OTI5IDEzLjM1OTggMTguOTkyOSAxMy4yNjY4IDE5LjA0NTlaIiBzdHJva2U9IiMxNjJGNDEiIHN0cm9rZS13aWR0aD0iMC43IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTcuMTQ2OSA1Ljk1ODk4VjEwLjY5N0gxMy4xMzM5SDEzLjE0MjhIMTAuOTQ0OFYxNC42MzIiIHN0cm9rZT0iIzE2MkY0MSIgc3Ryb2tlLXdpZHRoPSIwLjciIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xNS44MjI4IDYuOTg0MTNMMTcuMTQ2NyA1LjY2MTEzTDE4LjQ3MDcgNi45ODQxMyIgc3Ryb2tlPSIjMTYyRjQxIiBzdHJva2Utd2lkdGg9IjAuNyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+");
}
.resources li:is(.video) .title a::after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzciIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAzNyAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI2LjgxNCAwLjk1NzAzMUgxLjAwMDk4VjIwLjA5MTFIMjYuODE0VjAuOTU3MDMxWiIgc3Ryb2tlPSIjMTYyRjQxIiBzdHJva2Utd2lkdGg9IjAuNyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zNi4yNTcgMTYuNzU0OUwyNi44MTQgMTMuNjUyMVY3LjM5NTAyTDM2LjI1NyA0LjI5MTAyVjE2Ljc1NDlaIiBzdHJva2U9IiMxNjJGNDEiIHN0cm9rZS13aWR0aD0iMC43IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTYuMTM5IDExLjk3OTJMMTQuMDUyIDEzLjE4NDNDMTMuOTYyIDEzLjIzNjMgMTMuODUyIDEzLjIzNjMgMTMuNzYyIDEzLjE4NDNMMTEuNjc1IDExLjk3OTJDMTEuNTg1IDExLjkyNzIgMTEuNTMgMTEuODMyMiAxMS41MyAxMS43MjgyVjkuMzE5MjdDMTEuNTMgOS4yMTUyNyAxMS41ODUgOS4xMjAzIDExLjY3NSA5LjA2ODNMMTMuNzYyIDcuODYzMjJDMTMuODUyIDcuODExMjIgMTMuOTYyIDcuODExMjIgMTQuMDUyIDcuODYzMjJMMTYuMTM5IDkuMDY4M0MxNi4yMjkgOS4xMjAzIDE2LjI4NDEgOS4yMTUyNyAxNi4yODQxIDkuMzE5MjdWMTEuNzI4MkMxNi4yODQxIDExLjgzMjIgMTYuMjI5IDExLjkyNzIgMTYuMTM5IDExLjk3OTJaIiBzdHJva2U9IiMxNjJGNDEiIHN0cm9rZS13aWR0aD0iMC43IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4=");
	background-position-y: 2.1rem;
	background-size: 1.7em;
}
.resources .link .title a::after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggc3Ryb2tlPSIjRkZGIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTEwLjAwMDIgNWgtMS44Yy0xLjEyMDExIDAtMS42ODA1OCAwLTIuMTA4NC4yMTc5OS0uMzc2MzMuMTkxNzQtLjY4MjA3LjQ5NzQ4LS44NzM4MS44NzM4MUM1IDYuNTE5NjIgNSA3LjA4MDA5IDUgOC4yMDAydjcuNmMwIDEuMTIwMSAwIDEuNjc5OS4yMTc5OSAyLjEwNzcuMTkxNzQuMzc2My40OTc0OC42ODI2Ljg3MzgxLjg3NDNDNi41MTkyIDE5IDcuMDc4OTkgMTkgOC4xOTY5MSAxOWg3LjYwNjE5YzEuMTE3OSAwIDEuNjc2OSAwIDIuMTA0My0uMjE3OC4zNzYzLS4xOTE3LjY4MzEtLjQ5ODMuODc0OC0uODc0NkMxOSAxNy40ODAyIDE5IDE2LjkyMSAxOSAxNS44MDMxVjE0bTEtNVY0bTAgMGgtNW01IDAtNyA3Ii8+PC9zdmc+");
}
.resources .link .title a[href$=".pdf"]::after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBmaWxsPSIjRkZGIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNjEuMjc5OTk5NyAzMjguMzJjLTEyLjA3MDE2Ny03LjM2MDkxOC0yNi4zMjE5NzctMTAuMzAxNzY4LTQwLjMyLTguMzJIODUuMzMzMzMzdjEyOGgyOC4zNzMzMzMzdi00OC44NTMzMzNoMTIuMTZjMTIuNTk3MTQ0NSAxLjI5NDI0NCAyNS4yNTUyNjUzLTEuNzk0OTQgMzUuODQtOC43NDY2NjcgOC45ODQzNTU4LTcuNzA2MTU1IDEzLjkzNzk0ODQtMTkuMTA3MjggMTMuNDQtMzAuOTMzMzMzLjY2NTE1NzEtMTIuMDA5ODI3LTQuNDk2ODQxLTIzLjYwNDQ2OS0xMy44NjY2NjY2LTMxLjE0NjY2N1ptLTIyLjgyNjY2NjcgNDYuNzJjLTUuMzU5MTEzMyAyLjM1ODk0OC0xMS4yNTEyOTQ5IDMuMjQyNzc1LTE3LjA2NjY2NjcgMi41NmgtOC4zMnYtMzYuMjY2NjY2aDguMzJjNi4wNDE0NjI3LS42NDIxNTcgMTIuMTM2NDMzNS41NDcxMDUgMTcuNDkzMzMzNCAzLjQxMzMzMyA0Ljk4ODkxMzggMy40NzQ2NDYgNy44MTYwMDI1IDkuMjkwMzcxIDcuNDY2NjY2NiAxNS4zNi42NDYyOSA2LjExODk2NS0yLjQ3MzI4NCAxMi4wMjA4NjItNy44OTMzMzMzIDE0LjkzMzMzM1pNMjM2LjE2IDMyMGgtMzUuNDEzMzM0djEyOGgzMy45MmMxNy4yODY3NTggMS42OTE0OTcgMzQuNjk0Mzc2LTEuNjQxODc2IDUwLjEzMzMzNC05LjYgMTYuOTg4MDQ2LTEyLjY2MDg3MSAyNi4wNjM3OTYtMzMuMzI0NDEgMjMuODkzMzMzLTU0LjQgMS4yNzE2NDQtMTguMDU1NjU2LTUuMTYxNjg3LTM1LjgwNTQ0OS0xNy43MDY2NjctNDguODUzMzMzQzI3NS40OTA0NCAzMjIuOTMyNTkgMjU1LjcyODYzNSAzMTcuNDczMTAzIDIzNi4xNiAzMjBabTI4LjE2IDk4Ljk4NjY2N2MtOC44ODc3MDQgNC45OTU3MTktMTkuMDY0NTI1IDcuMjI0MjItMjkuMjI2NjY3IDYuNGgtNS41NDY2Njd2LTgyLjc3MzMzM2g1LjEyYzE3LjkyIDAgMjQuOTYgMS43MDY2NjYgMzIgOC4xMDY2NjYgOC41NDM4NzkgOC44OTU0MjIgMTIuOTU2Mzk3IDIwLjk3MTc4NiAxMi4xNiAzMy4yOCAxLjA5NzUxIDEzLjMyMDQ4NS00LjMwNTQwMyAyNi4zNTEwMzktMTQuNTA2NjY2IDM0Ljk4NjY2N1pNMzM5Ljg0IDQ0OGgyOC44di01My41NDY2NjZoNTguMDI2NjY2VjM3MS44NEgzNjguNjR2LTI5LjIyNjY2Nmg1OC4wMjY2NjZWMzIwSDMzOS44NHYxMjhaTTMyMCA0Mi42NjY2NjdIODUuMzMzMzMzdjIzNC42NjY2NjdoNDIuNjY2NjY2N1Y4NS4zMzMzMzM3SDMwMi4yOTMzMzNMMzg0IDE2Ny4wNHYxMTAuMjkzMzM0aDQyLjY2NjY2NnYtMTI4TDMyMCA0Mi42NjY2NjdaIi8+PC9zdmc+");
}
.resources .link .title a::after {
	filter: invert(80%);
	background-position: 100% 1.8rem;
	background-size: 1.4em;
}
.resources .link.featured .title a::after {
	filter: invert(0%);
}
.dark .resources .link .title a::after {
    filter: none;
}
/* .resources .link .featured-image a::before {
    filter: opacity(0) blur(3px);
    translate: 0 1rem;
} */
.resources .link .featured-image a:hover::before {
    filter: none;
    translate: none;
}
.resources .title a > * {
	flex: auto;
}
.resources .title .pillar {
	flex: 1 0 90%;
	display: flex;
	font-size: var(--fs--2);
	margin-block-end: 0.1lh;
}
.resources .date {
	position: absolute;
	display: inline-flex;
	inset: 0.7rem 1rem auto auto;
	font-size: var(--fs--2);
	background-color: color-mix(in lab, var(--background) 80%, transparent);
	border-radius: 3px;
	padding-inline: 0.3ex;
	transition: 0.2s filter linear;
	filter: opacity(0%);
	pointer-events: none;
}
.resources li:hover .date {
	color: var(--mid-blue);
	filter: opacity(40%);
	pointer-events: inherit;
}
.resources .featured-image img {
    object-fit: cover;
}
.resources .featured-label {
	position: absolute;
	display: inline-flex;
	inset: 0.8rem auto auto 0.9rem;
	font-size: var(--fs--2);
	background-color: color-mix(in lab, var(--mid-blue) 80%, transparent);
	border-radius: 3px;
	padding-inline: 1ex;
	padding-block: 0.1lh;
}
.resources.filter form {
	display: flex;
	flex-wrap: wrap;
	margin-block: 0;
	inline-size: 100%;
	max-inline-size: 100%;
}
.resources .search.panel {
	display: flex;
	flex-wrap: wrap;
	justify-content: start;
	align-items: start;
}
.resources.filter h2,
.resources .search.panel input[type="search"] {
	font-size: var(--fs-1);
	border-block: 1px solid color-mix(in lab, var(--mid-grey), var(--background));
	padding-block: 0.4lh;
}
.resources.filter h2 {
	flex: 1 0 100%;
	margin-block: -1px 0.8lh;
	padding-block: 0.7lh;
}
#resources-search-form {
	flex: 1 0 100%;
	display: flex;
	margin-block: 0 var(--fs-2);
}
#resources-search-panel + form > h2:first-child {
	border-block-start: 0 none;
}
.resources .filter > h3,
.resources .filter > ul {
	flex: 1 0 100%;
}
.resources.filter h3 {
	margin-block: 0 1.1lh;
	font-size: calc(var(--fs-0) * 1.1);
}
.resources .filter.panel {
	flex: 1 0 100%;
	display: flex;
	flex-wrap: wrap;
	margin-block-end: 1.2lh;
	border-block-end: 1px solid color-mix(in lab, var(--mid-grey), var(--background));
	transition: 0.3s filter linear, 0.3s scaler linear;
}
.resources .filter.panel select,
.resources .search.panel input[type="search"],
.resources .filter.panel input[type="date"],
.resources .filter.panel input[type="month"] {
	flex: 1 0 80%;
	padding-block: 0.4lh;
	padding-inline: 0;
	border-inline: none;
	box-sizing: border-box;
	max-inline-size: 100%;
}
.resources .filter.panel select::placeholder,
.resources .search.panel input[type="search"]::placeholder,
.resources .filter.panel input[type="date"]::placeholder,
.resources .filter.panel input[type="month"]::placeholder {
	font-size: inherit;
	color: inherit;
	transition: 0.3s color linear;
}
.resources .filter.panel select:focus-visible,
.resources .search.panel input[type="search"]:focus-visible,
.resources .filter.panel input[type="date"]:focus-visible,
.resources .filter.panel input[type="month"]:focus-visible {
	outline: none;
	box-shadow: none;
	border-block-color: color-mix(in lab, var(--dark-blue) 90%, var(--background));
}
.resources .filter.panel select:focus-visible::placeholder,
.resources .search.panel input[type="search"]:focus-visible::placeholder,
.resources .filter.panel input[type="date"]:focus-visible::placeholder,
.resources .filter.panel input[type="month"]:focus-visible::placeholder {
	color: color-mix(in lab, var(--mid-grey), var(--background));
}
.resources .search.panel button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: inherit;
	background-color: transparent;
	margin-inline: -2.3em 0;
	padding-inline: 1em 0;
	border: none;
	line-height: 100%;
}
.resources .search.panel button:focus-visible {
	box-shadow: none;
}
.resources .search.panel button svg {
    inline-size: 1em;
    height: auto;
}
.resources.filter.hide {
	filter: opacity(0%);
}
.resources.filter .panel .filter {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin-block: 0 clamp(1rem, 1.5vw + 1.5vh, 2rem);
	padding-inline: 0;
	gap: 1rem;
}
.resources .featured-image.empty {
	box-shadow: -1rem -1rem 5rem color-mix(in lab, var(--background) 30%, transparent) inset;
}
.resources.filter .panel .filter a {
	position: relative;
	display: flex;
}
.resources.filter .filter .marker {
	position: relative;
	display: inline-flex;
	font-size: var(--fs--2);
	color: var(--mid-blue);
	line-height: 100%;
	inline-size: 0.8em;
	block-size: 0.8em;
	inset-block-start: 0.25lh;
	margin-inline: 0.2ex 1ex;
	align-content: center;
	justify-content: center;
	padding: 0;
	transition: 0.2s color linear, 0.2s box-shadow linear, 0.2s background-color linear, 0.2s filter linear;
}
.resources.filter .marker svg {
	fill: currentColor;
	fill-opacity: 0;
}
.resources.filter .active > a > .marker svg {
	fill-opacity: 1;
}
.resources.filter .filter .active.partial > a > .marker svg {
	fill-opacity: 0.5;
}
.resources.filter .filter .pillar-homes .marker svg {
	stroke: var(--homes);
}
.resources.filter .filter .pillar-homes .marker svg {
	fill: var(--homes);
}
.resources.filter .filter .pillar-place-nature .marker svg {
	stroke: var(--place-nature);
}
.resources.filter .filter .pillar-place-nature .marker svg {
	fill: var(--place-nature);
}
.resources.filter .filter .pillar-sustainable-business .marker svg {
	stroke: var(--sustainable-business);
}
.resources.filter .filter .pillar-sustainable-business .marker svg {
	fill: var(--sustainable-business);
}
.resources.filter .filter .pillar-production-construction .marker svg {
	stroke: var(--production-construction);
}
.resources.filter .filter .pillar-production-construction .marker svg {
	fill: var(--production-construction);
}

/* .resources.filter .panel .filter > li > a > .marker {
	background-color: color-mix(in lab, var(--black) 10%, transparent);
}
.resources.filter .panel .filter li.active > a > .marker {
	background-color: var(--foreground);
}
.resources.filter .panel .filter li.active.partial > a > .marker {
	filter: opacity(60%);
	background-color: var(--mid-blue);
}
.resources.filter .panel .filter ul li.active.partial > a > .marker {
	background-color: color-mix(in lab, var(--background) 30%, var(--dark-blue));
	outline-color: color-mix(in lab, var(--background) 30%, var(--dark-blue));
} */
.resources.filter .panel .filter .name {
	flex: 10 0 4rem;
}
.resources.filter .panel .filter .count {
	position: absolute;
	font-size: 0.7em;
	color: var(--foreground);
	inset: auto -1.2rem auto auto;
	text-align: end;
	filter: opacity(0%);
	transition: 0.2s filter linear;
}
.resources.filter .panel .filter a:hover .count {
	filter: none;
}
.resources.filter .panel .filter .pillar > a > .count,
.resources.filter .panel .filter .type .count {
	display: none;
}
.resources.filter .panel .filter .sub-menu-marker {
	inline-size: 1em;
	block-size: 1em;
	position: relative;
	inset: 0.1lh auto auto 0.2em;
	scale: 1 -1;
	transition: 0.2s scale ease-in-out 0.2s;
}
.resources.filter .panel .filter .active .sub-menu-marker {
	scale: 1 1;
	transition-delay: 0s;
}
.resources.filter .panel .filter a {
    color: var(--foreground);
}
.resources.filter .panel .filter a:hover {
    color: color-mix(in lab, var(--background) 20%, var(--foreground));
}
.resources.filter .panel .filter ul,
.resources.filter .panel .filter ul li {
	--foreground: var(--dark-blue);
	--background: var(--white);
}
.resources.filter .panel .filter ul {
	inline-size: min(100%, 40rem);
	align-items: flex-start;
	gap: 0.3rem 1.9rem;
	block-size: 0;
	filter: opacity(0%);
	transition: 0.45s filter linear, 0.15s translate linear, 0.25s block-size linear 0.15s, 0.25s margin-block linear 0.15s;
	margin-block: -0.4lh 0;
	padding-block: 0.7rem 0.2rem;
	pointer-events: none;
	overflow: hidden;
	transition-behavior: allow-discrete;
}
.resources.filter .panel .filter .pillar.active ul {
	block-size: fit-content;
	filter: none;
	pointer-events: inherit;
	margin-block: 0.35lh 0;
	transition-delay: 0s, 0.2s, 0s, 0s;
}
.resources.filter .panel .filter .active ul {
	outline-width: 3px;
}
.resources.filter .panel .filter ul li {
	font-size: var(--fs--1);
	flex: 1 0 min(100%, 24ch);
	min-inline-size: min(100%, 24ch);
	outline: none;
	padding-inline: 0;
}
.resources.filter .panel .filter ul a {
	padding-block: 0 0.4lh;
	padding-inline-end: 1ex;
	border-block-end: 1px solid transparent;
	text-wrap: balance;
	transition: 0.2s border-block-end-color linear;
}
.resources.filter .panel .filter ul a:hover {
	border-block-end-color: var(--link-interaction);
}
.resources.filter .panel .filter ul .count {
	inset-inline-end: 0;
}
.resources .panel:has(select) h3,
.resources .panel:has(input[type="date"]) h3,
.resources .panel:has(input[type="month"]) h3 {
	margin-block-end: 0.5lh;
}
.resources .filter.panel select,
.resources .filter.panel input[type="date"],
.resources .filter.panel input[type="month"] {
	flex: 1 0 100%;
	border: 0 none;
	padding-block: 0.4lh;
	inline-size: 100%;
	background-color: var(--background);
}
.resources .filter.panel select::placeholder,
.resources .filter.panel input[type="date"]::placeholder,
.resources .filter.panel input[type="month"]::placeholder {
	text-transform: uppercase;
}
#resources-filter-clear button {
	background-color: transparent;
	padding-inline: 0;
	inline-size: 100%;
	text-align: start;
}
.resources.filter #resources-filter-clear button .marker {
	float: inline-end;
	font-size: inherit;
}
.resources + .pagination {
	display: flex;
	margin-block: clamp(2rem, 2vw + 2vh, 4rem) 0;
	margin-inline: auto;
	justify-content: center;
	align-items: center;
	list-style: none;
	gap: 1rem;
}
.resources + .pagination.hide {
	position: absolute;
	visibility: hidden;
	filter: opacity(0%);
	pointer-events: none;
	z-index: -1;
}
.resources + .pagination li {
	flex: 0 1 auto;
}
.pagination li {
	transition: 0.5s filter linear;
}
.pagination .disabled {
	filter: opacity(30%);
	pointer-events: none;
}
.pagination .navigation.previous svg {
	transform-origin: 50% 50%;
	rotate: 90deg;
}
.pagination .navigation.next svg {
	transform-origin: 50% 50%;
	rotate: -90deg;
}
.pagination a {
	display: flex;
	align-items: center;
	color: var(--mid-grey);
	aspect-ratio: 1;
	min-inline-size: 0.9em;
	justify-content: center;
	font-size: var(--fs-1);
}
.pagination a:hover {
	color: var(--foreground);
}
.pagination a.current,
.pagination a.current:hover {
	color: var(--foreground);
}
.single-resource #title .x-row {
	inline-size: min(100%, 76rem);
	margin-inline: auto;
}
.single-resource .entry-content > .wp-block-heading,
.single-resource .entry-content > h2,
.single-resource .entry-content > h3,
.single-resource .entry-content > h4,
.single-resource .entry-content > h5,
.single-resource .entry-content > h6,
.single-resource .entry-content > p,
.single-resource .entry-content > ul,
.single-resource .entry-content > ol,
.single-resource .entry-content > div,
.single-resource .entry-content > details,
.single-resource #return .x-row {
	inline-size: min(100%, 60rem);
	margin-inline: auto;
}
.single-resource .entry-content ul,
.single-resource .entry-content ol,
.single-resource .entry-content li,
.single-resource .entry-content p {
	font-size: var(--fs-0);
	margin-block: 1.2lh;
	line-height: 160%;
}
.single-resource .full-width {
	inline-size: 100%;
	aspect-ratio: 1;
	max-inline-size: none;
	max-block-size: 2010px;
    border: 0 none;
}
.single-resource .wp-block-button__link {
	position: relative;
	color: var(--white);
	background: var(--dark-blue) linear-gradient(-45deg, var(--bright-blue), var(--bright-green)) no-repeat scroll 50% 50% / cover;
	border-radius: 4px;
}
.single-resource .wp-block-button__link::after {
	position: absolute;
	content: '';
	background: var(--dark-blue) linear-gradient(-45deg, var(--bright-blue), var(--bright-green)) no-repeat scroll 100% 50% / 30rem;
	inset: 0 -2.2ex 0 auto;
	inline-size: 3ex;
	block-size: 100%;
	mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHZpZXdCb3g9IjAgMCA1OTUuMjggMTgyLjUiPjxwYXRoIGQ9Im01OTAuNTQ3IDc4Ljk1Ny0zOC40ODktNjYuNjYxQzU0Ny42NyA0LjY4OCA1MzkuNTU0IDAgNTMwLjc3IDBjMCAwLTc3LjA0LjAwNi03Ny4wNjkuMDA2SDI0LjU4NEMxMS4wMDcuMDA2IDAgMTEuMDE4IDAgMjQuNTk0VjE1Ny45MWMwIDEzLjU3NyAxMS4wMDcgMjQuNTkgMjQuNTg0IDI0LjU5aDUwNi4xODVjOC43ODQgMCAxNi45LTQuNjg4IDIxLjI4OS0xMi4yOThsMzguNDg5LTY2LjY2MWM0LjM5NS03LjYwMiA0LjM5NS0xNi45OCAwLTI0LjU4NCIvPjwvc3ZnPg==");
	mask-repeat: no-repeat;
	mask-position: 100% 50%;
	mask-size: auto 100%;
	filter: none;
	z-index: 1;
}
.single-resource #return .icon.end.arrow {
	float: inline-start;
	margin-inline: 0 0.9ex;
}
.single-resource #return .icon.end.arrow svg {
	rotate: 180deg;
}
.single-resource #return a .icon.end.arrow svg,
.single-resource #return a:hover .icon.end.arrow svg {
	translate: none;
}
@media (width < 600px) and (orientation: portrait) {
	.single-resource .full-width {
		aspect-ratio: 3 / 4;
	}
}
@media (width >= 600px) {
	#listing:has(#resources-filter) .x-col {
		grid-template-columns: 1fr auto;
	}
	#listing:has(#resources-filter) #resources-filter {
		grid-column: 1 / 2;
		inline-size: clamp(17rem, 15vw, 30rem);
	}
	#resources-empty,
	#listing:has(#resources-filter) #resources-list {
		grid-area: 1 / 2 / 2 / 3;
		inline-size: clamp(16rem, 100%, 1400px - 24.5rem);
	}
	#listing:has(#resources-filter) #recent-posts-pagination {
		grid-column: 1 / 3;
		justify-self: end;
		margin-inline: auto 0;
	}
	#listing:has(#resources-filter) .resources .search.panel p {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		margin-block: 0;
	}
	.single-resource .x-section:first-child .x-row:first-child .x-image img {
		aspect-ratio: 3;
	}
	.single-resource .full-width {
		aspect-ratio: 4 / 3;
	}
	.single-resource .wp-block-button + .wp-block-button {
		margin-inline-start: 1.5rem;
	}
}

/* PRIVACY POLICY */

.privacy h2,
.privacy-policy h2 {
	font-size: var(--fs-1);
}
.privacy p,
.privacy li,
.privacy-policy p 
.privacy-policy li {
	line-height: 140%;
	margin-block: 0.5rem;
}