@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');

:root {
	--page-w: 75.5rem;

	--fon-t: "DM Sans", serif;
	--fon-h: "DM Sans", serif;

	--sca-t: 1.125rem;
	--sca-h: 1rem;
	--sca-lh: 1em;
	--sca-mar: 1rem;
	--sca-pad: 2.5rem;

	--ratio: .3125;

	--fon-w1: 400;
	--fon-w5: 400;
	--fon-w7: 600;
	--fon-w9: 600;

	--col-dar: #fff;
	--col-dar-op25: #55b2b4;
	--col-bg: #f3f5f5;
	--col-lig: #55b2b422;
	--col-sep: #55b2b499;
	--col-pri: #55b2b4;
	--col-pri-op75: #55b2b4BF;
	--col-pri-bg: #3d7777;
	--col-acc: #4285F4;
	--col-acc-bg: #265959;

	--col-red: #F03D3E;
	--col-gre: #007B40;

	--col-grad-v: linear-gradient(180deg, var(--col-dar) 0%, var(--col-pri) 100%);

	--rad-s: 0;
	--rad-m: 0;
	--rad-l: 0;
	--rad-bt: 0;

	--sha-s: none;
	--sha-m: none;
	--sha-l: none;
	--sha-i: inset 0 .125rem .25rem 0 var(--col-dar-op25);

	--ani-f: all 500ms cubic-bezier(.7,0,.3,1);
}

body {
	background-color: #e0e1e1;
}
picture,
.video {
	box-shadow: 0 0 0 1px var(--col-sep);
	background-image: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_2362_22' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='10' height='10'%3E%3Crect width='10' height='10' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_2362_22)'%3E%3Cpath d='M0 10L23 -13' stroke='%2355B2B4' stroke-opacity='0.5'/%3E%3Cpath d='M-2 2L21 -21' stroke='%2355B2B4' stroke-opacity='0.5'/%3E%3Cpath d='M9 11L32 -12' stroke='%2355B2B4' stroke-opacity='0.5'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.bg {
	background-color: transparent!important;
	background-repeat: repeat!important;
	background-size: 20px!important;
	box-shadow: 0 0 0 1px var(--col-sep);
	background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_2362_22' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='20' height='20'%3E%3Crect width='20' height='20' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_2362_22)'%3E%3Cpath d='M0 20L23 -3' stroke='%2355B2B4' stroke-opacity='0.5'/%3E%3Cpath d='M-2 2L21 -21' stroke='%2355B2B4' stroke-opacity='0.5'/%3E%3Cpath d='M16 24L39 1' stroke='%2355B2B4' stroke-opacity='0.5'/%3E%3C/g%3E%3C/svg%3E%0A")!important;
}
picture img,
.video img {
	opacity: 0;
}

.section.bg, .card.bg, .frame.bg,
.section.bg h2, .section.bg h3, .section.bg h4, .section.bg h5, .section.bg h6, .card.bg h2, .card.bg h3, .card.bg h4, .card.bg h5, .card.bg h6 {
	color: #fff;
}

.section h2,
.section h3,
.section h4,
.section h5,
.section h6 {
	font-weight: 500;
}
.section h2 strong,
.section h3 strong,
.section h4 strong,
.section h5 strong,
.section h6 strong{
	font-weight: 800;
}

::placeholder {
	color: var(--col-sep);
}

.card + h5.quote:after {
    border-color: var(--col-bg);
}
.quote img {
	filter: grayscale(100%);
	mix-blend-mode: overlay;
}

iframe {
	filter: grayscale(100%);
	mix-blend-mode: overlay;
}