button {
	cursor: pointer;
}

::selection {
	background-color: var(--color-foreground-darker);
	color: var(--color-foreground-strong);
}

.main-menu {
	.menu-item-has-children {
		position: relative;
	}

	.menu-item-has-children > a::after {
		transition: rotate 0.2s, translate 0.2s, color 0.3s;
	}
}

@media (min-width: 901px) {
	.main-menu .menu-item-has-children:hover > a::after {
		rotate: 225deg;
		translate: 0 2px;
		border-color: var(--color-carbon);
	}
}

input,
a,
button,
textarea,
select {
	accent-color: var(--color-accent);
}

.arrow-link {
	font-weight: 500;
	text-decoration: none;
	position: relative;
	display: inline-flex;
	gap: 5px;
	color: var(--color-foreground-strong);
	background: linear-gradient(currentColor, currentColor) left bottom no-repeat;
	background-size: 0 1px;
	transition: background 0.5s;
	align-items: center;

	&:hover {
		background-size: 100% 1px;
	}

	&::after {
		content: '';
		rotate: 135deg;
		border-style: solid;
		border-width: 1.5px;
		border-color: currentColor transparent transparent currentColor;
		width: 7px;
		height: 7px;
	}
}

.sub-menu {
	position: absolute;
	top: 100%;
	left: -19px;
	list-style-type: none;
	padding: 5px 0 0;
	margin: 0;
	min-width: 198px;
	opacity: 0;
	pointer-events: none;
	translate: 0 -30px;
	transition: opacity 0.2s ease-in-out, translate 0.2s ease-in-out;
	z-index: -1;

	.main-menu & {
		display: block;
	}

	.menu-item-has-children:hover & {
		translate: 0 0;
		opacity: 1;
		pointer-events: all;
		transition: opacity 0.4s ease-in-out, translate 0.4s ease-in-out;
	}

	li {
		background: #fff;
		padding: 4px;
	}

	a {
		height: 48px;
		transition: background 0.3s;
		padding: 0 15px;

		&:hover {
			background: var(--color-lunar);
			color: var(--color-abyss);
		}
	}
}

summary {
	transition: color 0.3s;
	cursor: pointer;

	&::after,
	&::before {
		content: '';
		position: absolute;
		width: 14px;
		border-top: 2px solid var(--color-gray);
		top: 37px;
		right: 0;
		transition: rotate 0.3s, opacity 0.3s;
	}

	&::after {
		rotate: 90deg;
	}

	details[open] & {
		color: var(--color-foreground-strong);

		&::after {
			rotate: 360deg;
			opacity: 0;
		}

		&::before {
			rotate: 180deg;
			border-color: var(--color-foreground-strong);
		}
	}
}

.details-group {
	position: relative;

	/* &:last-child {
		margin-bottom: -50px;
	} */
}

.content-slider {
	--timeout: 5s;
	--slide: 0;
	--current-slide: var(--slide);
}

.content-slider__tab {
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 0 1.25em;
	border: 0;
	color: var(--color-background-muted);

	transition: background 0.3s, color 0.3s;

	&:hover {
		color: var(--color-foreground-strong);
	}
}

.button:hover {
	background: var(--color-foreground);
}

.button--accent:hover {
	background: var(--color-accent-lighter);
}

.button--accent-2:hover {
	background: var(--color-earth-lighter);
}

[data-timeout] .content-slider__tab {
	span {
		position: relative;
		z-index: 2;
	}

	&::before {
		content: '';
		position: absolute;
		top: 0;
		right: 0;
		left: auto;
		height: 100%;
		width: 100%;
		max-width: 0;
		z-index: 1;
		background: var(--color-foreground-darker);
		transition: max-width 0.5s;
	}
}

.content-slider__tab--active {
	background: var(--color-foreground-darker);
	color: var(--color-foreground-strong);
}

[data-timeout] .content-slider__tab--active {
	background: var(--color-background-accent);

	&::before {
		max-width: 100%;
		left: 0;
		right: auto;
		transition: max-width var(--data-timeout) linear;
	}
}

.content-slider__slide {
	background: var(--color-background-accent);
}

/************* SLIDER ****************/

.slider__wrapper {
    position: relative;
}

.slider {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -ms-overflow-style: none;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scroll-snap-stop: always;
}

.slider--vertical {
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    scroll-snap-type: y mandatory;
}

.slider--vertical .slider__slide {
    max-height: 100%;
    overflow: hidden;
}

.slider:not(.slider--mobile-scrollbar):not(.slider--scrollbar) {
    scrollbar-width: none;
}

@media (min-width: 769px) {
    .slider.slider--vertical-on-desktop {
        flex-direction: column;
        overflow-x: hidden;
        overflow-y: auto;
        scroll-snap-type: y mandatory;
    }

    .slider.slider--vertical-on-desktop .slider__slide {
        max-height: 100%;
        overflow: hidden;
    }
}

@media (max-width: 768px) {
    .slider--mobile-no-stick {
        scroll-snap-type: none;
        scroll-behavior: auto;
        scroll-snap-stop: normal;
    }
}

.slider--scrollbar {
    padding-bottom: 10px;
    scrollbar-color: #000 transparent;
}

.slider--scrollbar::-webkit-scrollbar {
    height: 10px;
    border-bottom: 1px dashed #AEAEAE;
}

.slider--scrollbar::-webkit-scrollbar-thumb {
    border-bottom: 1px solid #000;
    height: 10px;
    background: transparent;
    margin-top: -2px;
}

.slider--vertical.slider--scrollbar::-webkit-scrollbar {
    height: auto;
    width: 10px;
    border-top: none;
    border-left: 1px dashed #AEAEAE;
}

.slider--vertical.slider--scrollbar::-webkit-scrollbar-thumb {
    height: auto;
    width: 10px;
    margin-top: 0;
    margin-left: -2px;
}

.scrolling-back {
    scroll-behavior: initial !important;
}

.slider:not(.slider--mobile-scrollbar):not(.slider--scrollbar)::-webkit-scrollbar {
    display: none;
}

.slider--dragging {
    scroll-snap-type: initial;
    /* scroll-behavior: initial; */
}

.slider--dragging * {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.slider__nav {
    display: flex;
    gap: 40px;
}

.slider__control {
	cursor: pointer;
	border: 0;
	background: transparent;
	position: relative;
	padding: 0;
	display: inline-flex;

	& > * {
		pointer-events: none;
		display: block;
	}
}

.slider__wrapper--start .slider__control--prev,
.slider__wrapper--end .slider__control--next {
    opacity: 0.3;
    pointer-events: none;
}

.slider__wrapper--end.slider__wrapper--start .slider__control {
    opacity: 0;
    pointer-events: none;
}

.slider__wrapper:not(.slider__wrapper--loaded) > .slider__control {
    opacity: 0;
    pointer-events: none;
}

.slider__slide {
    /* flex: 0 0 100%; */
    scroll-snap-align: start start;
}

.slide--last,
.slide:last-child {
    scroll-snap-align: end end;
}

.slider__dots {
    display: flex;
    gap: 0;
}

.slider__dot {
	width: 20px;
	height: 30px;
    cursor: pointer;
	display: block;
	position: relative;
	
	&::after {
		background: var(--color-background-muted);
		border-radius: 50%;
		transition: background 0.3s, border-radius 0.3s;
		content: '';
		width: 8px;
    	height: 8px;
		position: absolute;
		top: 50%;
		left: 50%;
		translate: -50% -50%;
	}
}

.slider__dot--active::after {
	border-radius: 0;
    background: var(--color-accent);
}

.slider__wrapper--buttons-side {
    overflow: hidden;
}

@media (min-width: 769px) {
    .slider--vertical-on-desktop.slider--scrollbar::-webkit-scrollbar {
        height: auto;
        width: 1px;
        border-top: none;
        border-left: 1px dashed #AEAEAE;
    }
    
    .slider--vertical-on-desktop.slider--scrollbar::-webkit-scrollbar-thumb {
        height: auto;
        width: 1px;
        margin-top: 0;
        margin-left: -2px;
        border: 0;
        border-left: 1px solid #000;
    }

    .slider--mobile-scrollbar {
        scrollbar-width: none;
    }

    .slider--mobile-scrollbar::-webkit-scrollbar {
        display: none;
    }
}

@media (max-width: 768px) {
    .slider--mobile-scrollbar {
        padding-bottom: 5px;
    }

    .slider--mobile-scrollbar::-webkit-scrollbar {
        height: 10px;
        border-bottom: 1px dashed #AEAEAE;
    }
    
    .slider--mobile-scrollbar::-webkit-scrollbar-thumb {
        border-bottom: 1px solid #000;
        height: 10px;
        background: transparent;
        margin-top: -2px;    
    }
}

.wp-block-audio audio {
	width: 100%;
}

.post-card--default {
	.post-card__title a {
		background: linear-gradient(currentColor, currentColor) left bottom no-repeat;
		background-size: 0 1px;
		transition: background 0.5s;
	}

	&:hover .post-card__title a {
		background-size: 100% 1px;
	}
}

.post-card {
	.arrow-link {
		justify-self: flex-start;
	}
}

.post-card:hover {
	.post-card__image img {
		scale: 1.15;
		transition: scale 1s;
	}
}

.post-card__image img {
	scale: 1;
	transition: scale 0.5s;
}

.cards-slider__bg {
	position: absolute;
	bottom: 0;
	left: 12%;
	object-fit: contain;
	z-index: -1;
	display: block;
	height: 90%;
	width: auto;
}

.cards-slider__subtitle {
	color: var(--color-foreground-muted);
}

.linkedin-link {
	position: absolute;
	top: -10px;
	right: -10px;
	padding: 10px;
	display: block;

	svg path {
		fill: var(--color-background-muted);
	}
}

.activate-on-view .post-card__image {
	position: relative;

	&::after {
		content: '';
		background: var(--color-background);
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 5;
		height: 100%;
		max-height: 100%;
		transition: max-height 1s ease-in-out;
	}
}

.post-card.activate-on-view:nth-child(2) .post-card__image::after {
	transition-delay: 0.15s;
}

.post-card.activate-on-view:nth-child(3) .post-card__image::after {
	transition-delay: 0.3s;
}

.activate-on-view--active .post-card__image::after {
	max-height: 0;
}

.copy-current-url {
	position: relative;
}

.copy-current-url--copied::after {
	position: absolute;
	content: 'Link copied';
	top: 100%;
	left: 50%;
	translate: -50% 0;
	white-space: nowrap;
	text-transform: uppercase;
	font-family: var(--font-alt);
	font-size: 11px;
	letter-spacing: 0.03em;
	line-height: 22px;
	padding: 0 10px;
	background: var(--color-moon);
	margin-top: 13px;
}

.copy-current-url--copied::before {
	content: '';
	position: absolute;
	left: 50%;
	translate: -50% 0;
	top: 100%;
	margin-top: 2px;
	border-style: solid;
	border-color: transparent transparent var(--color-moon);
	border-width: 6px;
}

.wp-block-quote::before {
	content: '';
	width: 44px;
	height: 44px;
	left: 0;
	top: 0;
	position: absolute;
	background: url("../img/icon-quote.svg") no-repeat var(--color-background-accent) center / 20px;
}

.form-row {
	::placeholder {
		color: var(--color-background-muted);
		opacity: 1;
		font-size: 14px;
	}

	input {
		color: var(--color-foreground-strong);
	}

	button {
		&::after {
			content: '';
			position: absolute;
			top: 50%;
			left: 50%;
			rotate: 135deg;
			translate: -50% -50%;
			border-style: solid;
			border-width: 1.5px;
			border-color: currentColor transparent transparent currentColor;
			width: 7px;
			height: 7px;
			transition: translate 0.2s;
		}

		&:hover::after {
			translate: -35% -50%;
		}
	}
}

.arrow-left--bigger::before {
	translate: -27% -50%;
}

.arrow-right--bigger::before {
	translate: -70% -50%;
}

.subscribe-section__container {
	position: relative;
}

.subscribe-section__bg {
	position: absolute;
	bottom: 0;
	left: 0;
	height: 100%;
	width: auto;
	z-index: -1;
	display: block;
}

.post-meta__term.post-meta__term--general {
	background: var(--color-earth);
}

.post-meta__term.post-meta__term--blog {
	background: var(--color-pink);
}

.post-meta__term.post-meta__term--events {
	background: var(--color-light-blue);
}

.post-meta__term.post-meta__term--podcasts {
	background: var(--color-earth);
}

.post-meta__term.post-meta__term--webinars {
	background: var(--color-lavender);
}

.post-meta__term.post-meta__term--white-papers {
	background: var(--color-moon);
}

.post-meta__term.post-meta__term--linkedin {
	background: var(--color-mint);
}

.post-meta__term.post-meta__term--x,
.post-meta__term.post-meta__term--twitter {
	background: var(--color-peach);
}

.post-meta__term.post-meta__term--facebook {
	background: #cde;
}

.main-menu {
	.menu > li > a {
		position: relative;
		&::before {
			position: absolute;
			width: 100%;
			content: '';
			border-top: 1px solid currentColor;
			top: 50%;
			margin-top: 0.5em;
			right: 0;
			width: 0;
			transition: width 0.3s;
		}
		
		&:hover::before {
			width: 100%;
			right: auto;
			left: 0;
		}
	}

	.menu > .current-menu-item > a::before {
		width: 100%;
	}
}

.team-member__dialog {
	width: 90vw;
	max-width: 1180px;
	margin: auto;
	border: 0;
	padding: 120px 80px;
}

dialog:open {
	opacity: 1;
	translate: 0 0;
	transition:
		translate 0.3s ease-out,
		opacity 0.3s ease-out,
		overlay 0.3s ease-out allow-discrete,
		display 0.3s ease-out allow-discrete;
}

dialog {
	opacity: 0;
	translate: 0 40px;
	transition:
		translate 0.15s ease-out,
		opacity 0.15s ease-out,
		overlay 0.15s ease-out allow-discrete,
		display 0.15s ease-out allow-discrete;
}

@starting-style {
	dialog:open {
		opacity: 0;
		translate: 0 40px;
	}
}

dialog::backdrop {
	background-color: rgba(0, 0, 0, 0.3);
	opacity: 0;
	transition:
		display 0.15s ease-out allow-discrete,
		overlay 0.15s ease-out allow-discrete,
		opacity ease-out 0.15s;
}

dialog:open::backdrop {
	opacity: 1;
	transition:
		display 0.5s ease-out allow-discrete,
		overlay 0.5s ease-out allow-discrete,
		opacity ease-out 0.5s;
}

@starting-style {
	dialog:open::backdrop {
		opacity: 0;
	}
}

.team-slider--start .team-slider__control--prev,
.team-slider--end .team-slider__control--next {
	color: var(--color-foreground-darker);
}

.team-member__main {
	display: flex;
	gap: 30px 80px;
}

.team-member__main-text {
	flex: 1;

	.h3-4 {
		margin: 0;
	}

	.team-member__position {
		color: var(--color-background-muted);
		margin: 0 0 10px;
	}
}

.team-member__main-image {
	flex: 0 0 53%;
}

.close-dialog {
	position: absolute;
	top: 30px;
	right: 30px;
	font-size: 28px;
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 5;
}

.team-member__main-content {
	margin-top: 1.5em;
}

.team-member__bottom {
	margin-top: 2em;
	color: var(--color-foreground-muted);

	strong {
		color: var(--color-foreground);
	}
}

.team-popup__linkedin {
	color: var(--color-background-muted);
}

.quote-icon {
	width: 44px;
	height: 44px;
	background: var(--color-background-accent);
	color: var(--color-foreground-strong);
	position: relative;

	svg {
		position: absolute;
		top: 50%;
		left: 50%;
		translate: -50% -50%;
		width: 20px;
	}
}

/* .post-sidebar__move {
	transition: translate 0.7s;
	translate: 0 80px;
}

body:has(.main-header--hidden) .post-sidebar__move {
	translate: 0 0;
} */

/* @property --count {
	syntax: '<integer>';
	initial-value: 0;
	inherits: false;
}

@property --integer {
	syntax: '<integer>';
	initial-value: 0;
	inherits: false;
}

@property --decimal {
	syntax: '<integer>';
	initial-value: 0;
	inherits: false;
} */

/* .count-to-number {
	transition: --integer 2s, --decimal 2s;
	counter-set: int var(--integer) dec var(--decimal);

	&::after {
		content: counter(int);
	}
	
	&.count-to-number--dec::after {
		content: counter(int) "." counter(dec, decimal-leading-zero);
	}

	.activate-on-view--active & {
		--integer: max(var(--count-to) - 0.5, 0);
		--decimal: max((var(--count-to) - var(--integer)) * 100, 0);
	}
} */

.post-grid--loading {
	opacity: 0.6;
}

.post-grid--loading + .post-grid__pagination {
	opacity: 0.6;
	pointer-events: none;
}

.auto-accordion:hover {
	color: var(--color-foreground-strong);

	.accordion__image img {
		height: 250px;
		opacity: 1;
	}
}

.contact-bg {
	display: block;
	position: absolute;
	height: 70%;
	width: auto;
	right: 50%;
	bottom: 0;
	object-fit: contain;
	z-index: -1;
}

.mc4wp-error {
	color: red;
}

.mc4wp-success {
	color: green;
}

@media (min-width: 901px) {
	.menu-activator:active,
	.menu-activator:hover {
		background: #fff;

		&::after {
			rotate: 225deg;
			translate: 0 2px;
		}
	}
}

@media (max-width: 900px) {
	.contact-bg {
		display: none;
	}

	.main-header--menu-open .menu-activator {
		background: #fff;

		&::after {
			rotate: 225deg;
			translate: 0 2px;
		}
	}

	.main-header--menu-open .main-menu {
		display: block;
		position: absolute;
		top: 53px;
		left: var(--page-horizontal-padding);
		margin: 0;
		padding: 0;
	}

	#menu-header-menu {
		flex-direction: column;
		gap: 0;
		height: auto;
		background: #fff;

		a {
			padding: 0 var(--page-horizontal-padding);
			background: #fff;
		}

		.menu-item-has-children {
			padding-right: 45px;
			background: var(--color-background-accent);

			&::after {
				content: '';
				position: absolute;
				top: 50%;
				right: 20px;
				translate: 0 -50%;
				border-style: solid;
				border-color: currentColor;
				border-width: 1px 1px 0 0;
				rotate: 45deg;
				width: 8px;
				height: 8px;
				pointer-events: none;
				transition: rotate 0.2s ease-in-out;
			}
		}

		.menu-item-has-children--open::after {
			rotate: -135deg;
			translate: 4px -50%;
		}
	}

	.sub-menu {
		left: 100%;
		top: 0;
		padding: 0 0 0 5px;
		translate: -15px 0;

		.menu-item-has-children--open & {
			translate: none;
			opacity: 1;
			pointer-events: all;
		}
	}

	.team-member__dialog {
		padding: var(--page-horizontal-padding);
		width: auto;
		max-width: 100%;
		left: var(--page-horizontal-padding);
		right: var(--page-horizontal-padding);
		top: var(--page-horizontal-padding);
		bottom: var(--page-horizontal-padding);
	}

	.team-member__main {
		flex-direction: column-reverse;
		gap: 20px;
	}

	.close-dialog {
		top: 10px;
		right: 7px;
	}


	summary {
		&::after,
		&::before {
			top: 32px;
		}
	}

	.main-menu a::before,
	.main-menu a::after {
		display: none;
	}
}