:root {
  --theme-color: #999;
  --margin-padding: 120px;
  --border-color: #d2d2d2;
  --heading-color: #000;
  --assistant-color: #efefef;
 --color-dark-1: #000000;  
 --color-border-dark: rgba(136, 136, 136, .3);
}

.mos-img img{
  display: none;
}

.post-meta {
 list-style-type:none;
 padding:0;
 margin:0;
 font-size:13px;
 line-height:1;
 font-weight:500
}
.post-meta i {
 font-size:14px !important;
 vertical-align:middle;
 margin-right:4px
}
.post-meta li {
 display:inline-flex;
 flex-wrap:wrap;
 align-items:center;
 line-height:1.6;
 vertical-align:middle
}
.post-meta li span {
 vertical-align:middle
}
.post-meta li:not(:last-child):after {
 content:'/';
 color:var(--color-dark-1);
 display:inline-block;
 margin-left:6px;
 margin-right:5px;
 transition:all 0.2s ease-in-out
}
.post-meta ul {
 padding-left:0
}
.post-meta span {
 display:inline-block;
 vertical-align:middle;
 white-space:nowrap
}
.post-meta_block li {
 display:block;
 margin:0.5em 0
}
.post-meta_block li:not(:last-child):after {
 display:none
}
.post-meta_flex {
 display:flex;
 justify-content:space-between
}
.post-meta_flex li:not(:last-child):after {
 display:none
}
.post-meta__divider {
 display:inline-block;
 vertical-align:middle;
 margin:0 1em;
 width:calc(1 * (60 * 1px));
 height:1px;
 background-color:var(--color-border-dark)
}
@media screen and (min-width: 1920px) {
 .post-meta__divider {
  width:calc(1 * (50 * 1px));
 }
}
.post-meta_mini li:after {
 display:none !important
}
.post-meta_mini-small li:after {
 display:none !important
}
.post-meta_mini-small .post-meta__divider {
 width:50px
}
.default-button {
  text-transform: uppercase;
  position: relative;
  height: 48px;
  cursor: pointer;
  transform: translate3d(20px, 0, 0);
  font-size: 12px;
  line-height: 10px;
  letter-spacing: 4px;
  margin-top: 30px;
  z-index: 4;
  grid-area: content-button;
}
.default-button .left,
.default-button .right {
  position: absolute;
  left: 0;
  top: -18px;
  width: 48px;
  height: 100%;
  z-index: 1;
  display: flex;
  justify-content: flex-end;
  transform: translate3d(-20px, 0, 0);
}
.default-button .left::before,
.default-button .right::before {
  content: "";
  width: 48px;
  display: block;
  height: 48px;
  border-radius: 50%;
  background-color: var(--theme-color);
  transform: scale(1);
}
.default-button .left.left,
.default-button .right.left {
  transition: all 0.45s cubic-bezier(0.475, 0.425, 0, 0.995);
}
.default-button .left.right,
.default-button .right.right {
  transition: all 0.45s cubic-bezier(0.475, 0.425, 0, 0.995) 0.45s;
}
.default-button .center {
  position: absolute;
  left: 0;
  right: 0;
  top: -6px;
  width: 0;
  height: 24px;
  background-color: var(--theme-color);
  z-index: 1;
  transform-origin: right;
  transition: all 0.45s cubic-bezier(0.475, 0.425, 0, 0.995) 0.45s, transform 0.45s cubic-bezier(0.475, 0.425, 0, 0.995);
}
.default-button .text {
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  position: relative;
  z-index: 3;
}
.default-button .plus-icon {
  position: relative;
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 15px;
  z-index: 2;
  color: var(--heading-color);
  font-size: 16px;
}
.default-button .plus-icon.text:before, .default-button .plus-icon.text:after {
  display: none;
}
.default-button .plus-icon:before, .default-button .plus-icon:after {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  left: 0;
  width: 100%;
  height: 1px;
  background-color: var(--heading-color);
}
.default-button .plus-icon:after {
  transform: rotate(90deg);
  transform-origin: center;
}
.default-button:hover .left {
  transform: translate3d(20px, 0, 0);
  width: 100%;
  transition-duration: calc(0.45s - 0.15s);
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  transition-delay: 0.45s;
}
.default-button:hover .center {
  width: 100%;
  transform: scaleX(0);
  transition: width 0.45s cubic-bezier(0.475, 0.425, 0, 0.995), transform calc(0.45s - 0.15s) cubic-bezier(0.19, 1, 0.22, 1) 0.45s;
}
.default-button:hover .right {
  transform: translate3d(20px, 0, 0);
  width: 100%;
  transition-delay: 0s;
}
.body-innerwrapper {
  overflow-x: visible;
}
*,
*::after,
*::before {
	box-sizing: border-box;
}

:root {
	--page-padding: 1.5rem;
	--color-bg: #12100e;
	--color-link: rgba(255,255,255,0.6);
	--color-link-hover: #fff;
	--color-bg-1: #fafafa;
	--color-co-1: #111;
	--color-bg-2: #fafafa;
	--color-co-2: #111;
	--color-bg-3: #fafafa;
	--color-co-3: #111;
	--color-bg-4: #fafafa;
	--color-co-4: #111;
	--color-bg-5: #fafafa;
	--color-co-5: #111;
	--color-bg-6: #fafafa;
	--color-co-6: #111;
}


/* Page Loader */
.js .loading::before,
.js .loading::after {
	content: '';
	position: fixed;
	z-index: 5000;
}

.js .loading::before {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--color-bg);
}

.js .loading::after {
	top: 50%;
	left: 50%;
	width: 60px;
	height: 60px;
	margin: -30px 0 0 -30px;
	border-radius: 50%;
	opacity: 0.4;
	background: var(--color-link);
	animation: loaderAnim 0.7s linear infinite alternate forwards;
}

@keyframes loaderAnim {
	to {
		opacity: 1;
		transform: scale3d(0.5,0.5,1);
	}
}

.content {
	padding: var(--page-padding);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.content--perspective {
	perspective-origin: 50% 0%;
	perspective: 1000px;
}

.content--sticky {
	width: 100%;
	position: sticky;
	top: 0;
	--offset: 0px;
	top: var(--offset);
	height: calc(100vh - var(--offset));
}
.content--grid,
.content--grid .content__inner {
	display: grid;
	overflow: hidden;
	grid-column-gap: 5vw;
	grid-row-gap: 2vh;
	align-content: center;
	grid-template-areas: 'content-img' 'content-subheading' 'content-title' 'content-text' 'content-button';
	justify-items: center;
}

.content--grid:has(.content__inner) {
	display: block;
	padding: 0;
}

.content__inner {
	width: 100%;
	height: 100%;
	border-radius: 0 0 2rem 2rem;
}
.content__inner .content-subheading,.content__inner .content__title  {
	padding: 10px;
}
.content__inner .content__text  {
	padding: 10px 40px;
}
.content--card {
	display: flex;
	flex-direction: column;
	height: 80vh;
	width: 95vw;
	aspect-ratio: 0.8;
	top: 10vh;
	margin: auto;
	border-radius: 14px;
	gap: 3vh;
	text-align: center;
	margin-bottom: 5vh;
}

.content--card .content__title {
	font-size: clamp(1.5rem,4vw,3.5rem);
}

.content--card .content__title i {
	display: block;
}

.content--half {
	display: flex;
	flex-direction: column;
	gap: 3vh;
	text-align: center;
}

.content--half:nth-child(odd) {
	margin-left: auto;
}

.content__img {
	grid-area: content-img;
	width: 50%;
	height: auto;
}

.content__img--large {
	width: 90%;
	height: auto;
}

.content__img--small {
	height: 35%;
	width: auto;
}

.content__title {
	grid-area: content-title;
	letter-spacing: -0.035em;
	text-transform: uppercase;
	line-height: 1;
	font-weight: normal;
	font-size: clamp(2rem,6vw,4rem);
	margin: 0;
	font-variation-settings: "slnt" 0, "wdth" 400, "wght" 600, "INKT" 400;
}

.content-subheading{
	grid-area: content-subheading;
}
.content__text {
	margin: 0;
	grid-area: content-text;
	line-height: 1.5;
	padding: 0 1rem;
	backface-visibility: hidden;
}

.content__text--narrow {
	max-width: 300px;
}

.content--intro {
	padding-top: 25vh;
	padding-bottom: 25vh;
	z-index: 2;
}

.content--outro {
	padding-top: 50vh;
	padding-bottom: 30vh;
}
.bg-custom { background: #fafafa; color: #111; }
.bg-custom .default-button .text { color: #111; }
.bg-1,.bg-7,.bg-13,.bg-19,.bg-25 { background: var(--color-bg-1); color: var(--color-co-1); }
.bg-2,.bg-8,.bg-14,.bg-20,.bg-26 { background: var(--color-bg-2); color: var(--color-co-2); }
.bg-3,.bg-9,.bg-15,.bg-21,.bg-27 { background: var(--color-bg-3); color: var(--color-co-3); }
.bg-4,.bg-10,.bg-16,.bg-22,.bg-28 { background: var(--color-bg-4); color: var(--color-co-4); }
.bg-5,.bg-11,.bg-17,.bg-23,.bg-29 { background: var(--color-bg-5); color: var(--color-co-5); }
.bg-6,.bg-12,.bg-18,.bg-24,.bg-30 { background: var(--color-bg-6); color: var(--color-co-6); }

.bg-1 .default-button .text,.bg-7 .default-button .text,.bg-1 .default-button .plus-icon,.bg-13 .default-button .text,.bg-19 .default-button .text,.bg-25 .default-button .text  { color: var(--color-co-1); }
.bg-2 .default-button .text,.bg-8 .default-button .text,.bg-14 .default-button .text,.bg-20 .default-button .text,.bg-26 .default-button .text { color: var(--color-co-2); }
.bg-3 .default-button .text,.bg-9 .default-button .text,.bg-15 .default-button .text,.bg-21 .default-button .text,.bg-27 .default-button .text { color: var(--color-co-3); }
.bg-4 .default-button .text,.bg-10 .default-button .text,.bg-16 .default-button .text,.bg-22 .default-button .text,.bg-28 .default-button .text { color: var(--color-co-4); }
.bg-5 .default-button .text,.bg-11 .default-button .text,.bg-17 .default-button .text,.bg-23 .default-button .text,.bg-29 .default-button .text { color: var(--color-co-5); }
.bg-6 .default-button .text,.bg-12 .default-button .text,.bg-18 .default-button .text,.bg-24 .default-button .text,.bg-30 .default-button .text { color: var(--color-co-6); }

@media screen and (min-width: 63em) {
	body {
		--page-padding: 2rem 3rem;
	}

	.content--grid .content__title {
		align-self: end;
	}

	.content--grid,
	.content--grid .content__inner {
		grid-template-areas: 'content-img content-title'  'content-img content-subheading' 'content-img content-text' 'content-img content-button';
		justify-items: start;
	}
	.content__img--large {
		width: 100%;
	}
	.content__img--left {
		justify-self: end;
	}
	.content__text--left {
		text-align: left;
		align-self: start;
	}
	.content--card {
		width: 50vw;
	}
	.content--half {
		width: 50%;
	}
}