/*
 * Conference page (Qrypto Con) — typography override
*/

body.page-template-conference-template {
	--qc-sky-pale: #82CBFF;
	--qc-sky: #1DA1FF;
	--qc-blue: #216AE8;
	--qc-violet: #7b2bff;
	--qc-red: #FF2C2C;
	--qc-yellow: #ffce00;
	--qc-cream: #FFEC9D;
	--qc-green: #4ede75;

	--qc-spectrum:
		var(--qc-sky-pale) 0%,
		var(--qc-sky) 7.5%,
		var(--qc-blue) 15%,
		var(--qc-red) 39%,
		var(--qc-yellow) 58%,
		var(--qc-cream) 79%,
		var(--qc-green) 100%;

	--qc-spectrum-btn:
		var(--qc-sky-pale) 0%,
		var(--qc-sky-pale) 8%,
		var(--qc-sky) 19%,
		var(--qc-blue) 29%,
		var(--qc-red) 63%,
		var(--qc-yellow) 90%,
		#FFD938 100%;

	--qc-spectrum-bar:
		var(--qc-sky-pale) 0%,
		var(--qc-sky-pale) 23%,
		var(--qc-sky) 31%,
		var(--qc-blue) 40%,
		var(--qc-red) 66%,
		var(--qc-yellow) 88%,
		#FFDE53 100%;

	--qc-common-gradient:
		var(--qc-sky) 0%,
		var(--qc-blue) 40%,
		var(--qc-red) 70%,
		var(--qc-yellow) 100%;

	--qc-surface: rgba(72, 72, 72, .2);
	--qc-surface-flat: #1F1F1F;

	#content {
		font-family: "Syne", "Poppins", sans-serif;
		position: relative;
	}

	/* Changing already exisiting classes */
	.primary-btn {
		border: 1px solid transparent;
		background-color: #000;
		background-image:
			linear-gradient(rgb(196 171 171 / 20%), rgb(228 200 200 / 20%)),
			radial-gradient(66% 130% at 70.5% -72%, rgb(255 255 255 / 85%) 0%, rgb(170 175 180 / 85%) 55%, transparent 100%),
			linear-gradient(168deg, var(--qc-spectrum-btn));
		background-origin: border-box;
		background-clip: border-box;
		box-shadow:
			inset 0 1px 0 rgba(255, 255, 255, .22),
			inset 0 -1px 0 rgba(255, 255, 255, .07);
	}

	.main-menu-wrapper .menu-main-menu-container .menu .menu-item:hover>a:after {
		background-image: linear-gradient(95deg, var(--qc-common-gradient));
		height: .25rem;
	}

	.gradient-outline.gradient::after {
		background: linear-gradient(110deg, var(--qc-common-gradient));
		height: 2px;
	}

	.footer-bg {
		position: relative;
		z-index: 2;
	}

	.carousel-wrapper {
		.carousel-controller {
			button {
				border: solid 1px rgb(138, 138, 138);
				padding: 10px;
				border-radius: 50%;

				svg {
					width: 18px;
					height: 18px;
				}

				&:not(:disabled) {
					background-color: #000;
					background-image:
						linear-gradient(var(--qc-surface), var(--qc-surface)),
						radial-gradient(66% 130% at 70.5% -72%, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .85) 55%, transparent 100%),
						linear-gradient(168deg, var(--qc-spectrum-btn));
					background-origin: border-box;
					background-clip: border-box;
					box-shadow:
						inset 0 1px 0 rgba(255, 255, 255, .22),
						inset 0 -1px 0 rgba(255, 255, 255, .07);
				}
			}
		}
	}

	.carousel-item {
		.track-img {
			border-radius: 28px;
			margin-inline: auto;
			width: 60%;
			min-width: 14rem;
		}
	}

	.inter-desc {
		font-family: Inter, sans-serif;
	}

	.qc-hero {
		display: flex;
		align-items: center;
	}

	.qc-title {
		width: fit-content;
		font-weight: 600;
		line-height: 1.05;
		letter-spacing: -0.02em;
		background-image: linear-gradient(95deg, var(--qc-common-gradient));
		background-clip: text;
		color: transparent;
		-webkit-text-fill-color: transparent;
	}

	.qc-subtitle {
		font-weight: 500;
		line-height: 1.35;
	}

	.qc-desc {
		font-weight: 400;
		line-height: 1.5;
	}

	.qc-rule {
		width: 3rem;
		height: 4px;
		background-image: linear-gradient(95deg, var(--qc-common-gradient));
	}

	.qc-gradient-shadow {
		position: absolute;
		bottom: 5px;
		width: 100%;
		height: 16px;
		background: linear-gradient(110deg,
				var(--qc-sky) 0%,
				var(--qc-blue) 25%,
				var(--qc-red) 50%,
				var(--qc-yellow) 80%,
				var(--qc-green) 120%);
		filter: blur(26px);
		opacity: 1;
	}

	.qc-gradient-strip {
		position: absolute;
		bottom: 0;
		width: 100%;
		height: 7px;
		background: linear-gradient(110deg,
				var(--qc-sky) 0%,
				var(--qc-blue) 25%,
				var(--qc-red) 50%,
				var(--qc-yellow) 80%,
				var(--qc-green) 120%);
		filter: blur(8px);
	}

	.qc-btn {
		position: relative;
		min-width: 10rem;
		padding: .5rem 1rem;
	}

	.qc-btn-primary {
		position: relative;
		border: 2px solid transparent;
		background-color: #000;
		background-image:
			linear-gradient(var(--qc-surface), var(--qc-surface)),
			radial-gradient(66% 130% at 70.5% -72%, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .85) 55%, transparent 100%),
			linear-gradient(168deg, var(--qc-spectrum-btn));
		background-origin: border-box;
		background-clip: border-box;
		box-shadow:
			inset 0 1px 0 rgba(255, 255, 255, .22),
			inset 0 -1px 0 rgba(255, 255, 255, .07);
		transition:
			filter 0.2s ease,
			transform 0.2s ease;
	}

	.qc-btn-primary:hover {
		filter: brightness(1.1);
		transform: translateY(-1px);
	}

	.qc-track-heading {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 1rem;
		gap: 4px;
	}

	.noise-bg {
		background:
			linear-gradient(rgba(26, 26, 26, 0.667), rgba(26, 26, 26, 0.667)),
			url('../assets/images/noise-bg.svg');
		background-size: cover;
	}

	.grey-outlined-btn {
		background-color: #000;
		border-color: #CDCDCD;
	}

	.grey-outlined-btn:hover {
		border-color: #fff;
		background-color: #f1eded18;
	}

	.insights-col.qc {
		display: flex;
		align-items: center;
		gap: 10px;
		padding-right: 1.5rem;

		.label {
			color: #216AE8;
		}

		.label.orange {
			color: #FF5500;
		}

		.label.yellow {
			color: #FFCE00;
		}

		.label.green {
			color: #4EDE75;
		}
	}

	.rgb-gradient-stroke {
		background: linear-gradient(110deg,
				var(--qc-sky) 0%,
				var(--qc-blue) 10%,
				var(--qc-red) 40%,
				var(--qc-yellow) 80%,
				var(--qc-green) 120%);
		width: 100%;
		height: 1px;
	}

	.qc-dates {
		--qc-date-line: rgba(255, 255, 255, .14);

		.qc-date {
			position: relative;
			flex: 1 1 auto;
			text-align: center;
		}

		/* .qc-date:hover,
		.qc-date:focus-within {
			z-index: 20;
		} */

		.qc-date-title {
			font-size: 1rem;
			font-weight: 500;
			line-height: 1.4;
			color: #fff;
			margin-bottom: 1rem;
			padding-inline: 1rem;
		}

		.qc-date-when {
			font-size: .875rem;
			line-height: 1.4;
			color: #a3a3a3;
			margin-top: 1rem;
		}

		.qc-date-bar {
			position: relative;
			display: flex;
			align-items: center;
			justify-content: center;
			height: 28px;
			border-radius: 999px;
			background-color: #000;
			background-image:
				linear-gradient(var(--qc-surface), var(--qc-surface)),
				radial-gradient(26% 189% at 30.5% -125%, #000 0%, #000 61%, transparent 100%),
				linear-gradient(90deg, rgba(0, 0, 0, .3) 0%, transparent 11%, transparent 93%, rgba(0, 0, 0, .38) 100%),
				linear-gradient(166deg, var(--qc-spectrum-bar));
			box-shadow:
				inset 0 1px 0 rgba(255, 255, 255, .22),
				inset 0 -1px 0 rgba(255, 255, 255, .07);
		}

		.qc-date-toggle {
			display: grid;
			place-items: center;
			width: 26px;
			height: 26px;
			border-radius: 50%;
			background: #F0F0F0;
			cursor: pointer;
		}

		.qc-date-sign {
			position: relative;
			width: 11px;
			height: 2px;
			border-radius: 1px;
			background: #000;
		}

		.qc-date-sign::before {
			content: "";
			position: absolute;
			inset: 0;
			border-radius: inherit;
			background: inherit;
			transform: rotate(90deg);
			transition:
				transform .25s ease,
				opacity .25s ease;
		}

		.qc-date-toggle:hover .qc-date-sign,
		.qc-date-toggle:focus-visible .qc-date-sign {
			background: var(--qc-red);
		}

		.qc-date-toggle:hover .qc-date-sign::before,
		.qc-date-toggle:focus-visible .qc-date-sign::before {
			transform: rotate(90deg) scaleX(0);
			opacity: 0;
		}

		.qc-date-tip {
			position: absolute;
			bottom: calc(100% + 14px);
			left: 50%;
			z-index: 2;
			width: max-content;
			max-width: min(15rem, 70vw);
			padding: .875rem 1.125rem;
			border-radius: .625rem;
			background: #fff;
			color: #374151;
			box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .55);
			opacity: 0;
			visibility: hidden;
			transform: translate(-50%, 6px);
			transition:
				opacity .2s ease,
				transform .2s ease,
				visibility .2s;
		}

		.qc-date-tip::after {
			content: "";
			position: absolute;
			top: 100%;
			left: 50%;
			transform: translateX(-50%);
			border: 7px solid transparent;
			border-top-color: #fff;
		}

		.qc-date-tip p {
			font-size: .8125rem;
			line-height: 1.5;
		}

		.qc-date-tip .qc-date-tip-title {
			font-size: .9375rem;
			font-weight: 600;
			line-height: 1.3;
			color: #111;
			margin-bottom: .25rem;
		}

		.qc-date-toggle:hover+.qc-date-tip,
		.qc-date-toggle:focus-visible+.qc-date-tip {
			opacity: 1;
			visibility: visible;
			transform: translate(-50%, 0);
		}

		@media (min-width: 768px) {
			.qc-date.qc-date-open .qc-date-tip {
				opacity: 1;
				visibility: visible;
				transform: translate(-50%, 0);
			}

			.qc-date-open .qc-date-sign {
				background: var(--qc-red);
			}

			.qc-date-open .qc-date-sign::before {
				transform: rotate(90deg) scaleX(0);
				opacity: 0;
			}

			&:hover .qc-date-open:not(:hover) .qc-date-tip,
			&:focus-within .qc-date-open:not(:focus-within) .qc-date-tip {
				opacity: 0;
				visibility: hidden;
				transform: translate(-50%, 6px);
			}

			&:hover .qc-date-open:not(:hover) .qc-date-sign,
			&:focus-within .qc-date-open:not(:focus-within) .qc-date-sign {
				background: #000;
			}

			&:hover .qc-date-open:not(:hover) .qc-date-sign::before,
			&:focus-within .qc-date-open:not(:focus-within) .qc-date-sign::before {
				transform: rotate(90deg);
				opacity: 1;
			}
		}
	}

	.bg-ec-black-dark {
		background-color: var(--qc-surface-flat);
	}

	.speaker-card {
		--qc-aurora-speed: 2;
		position: relative;
		overflow: hidden;
		height: 100%;
		background: var(--qc-surface);
		border: 0;
		color: white;

		.gradient-bg {
			position: absolute;
			inset: 0;
			pointer-events: none;
			-webkit-mask-image: linear-gradient(to bottom, transparent 26%, rgba(0, 0, 0, .35) 44%, #000 66%);
			mask-image: linear-gradient(to bottom, transparent 26%, rgba(0, 0, 0, .35) 44%, #000 66%);
		}

		.aurora {
			position: absolute;
			inset: 30% -20% -30%;
			animation: qc-aurora-breathe 9s ease-in-out infinite;
			animation-duration: calc(9s / var(--qc-aurora-speed));
			will-change: filter;
		}

		.orb {
			position: absolute;
			border-radius: 50%;
			mix-blend-mode: screen;
			animation-timing-function: ease-in-out;
			animation-iteration-count: infinite;
		}

		.orb.o1 {
			left: -18%;
			top: 34%;
			width: 78%;
			height: 62%;
			background: radial-gradient(circle at 50% 50%, var(--qc-sky), transparent 68%);
			animation-name: qc-orb-1;
			animation-duration: calc(8s / var(--qc-aurora-speed));
		}

		.orb.o2 {
			left: 4%;
			top: 52%;
			width: 70%;
			height: 58%;
			background: radial-gradient(circle at 50% 50%, var(--qc-blue), transparent 68%);
			animation-name: qc-orb-2;
			animation-duration: calc(11s / var(--qc-aurora-speed));
		}

		.orb.o3 {
			left: 20%;
			top: 46%;
			width: 72%;
			height: 64%;
			background: radial-gradient(circle at 50% 50%, var(--qc-red), transparent 68%);
			animation-name: qc-orb-3;
			animation-duration: calc(7s / var(--qc-aurora-speed));
		}

		.orb.o4 {
			left: 54%;
			top: 38%;
			width: 66%;
			height: 60%;
			background: radial-gradient(circle at 50% 50%, var(--qc-yellow), transparent 68%);
			animation-name: qc-orb-4;
			animation-duration: calc(9.5s / var(--qc-aurora-speed));
		}

		.orb.o5 {
			left: 72%;
			top: 62%;
			width: 58%;
			height: 48%;
			background: radial-gradient(circle at 50% 50%,
					var(--qc-cream),
					var(--qc-green) 50%,
					transparent 70%);
			animation-name: qc-orb-5;
			animation-duration: calc(6.5s / var(--qc-aurora-speed));
		}

		&::before {
			content: "";
			position: absolute;
			inset: 0;
			z-index: 1;
			pointer-events: none;
			background:
				linear-gradient(to bottom, rgba(14, 14, 14, .92) 0%, rgba(14, 14, 14, .55) 34%, rgba(14, 14, 14, 0) 56%),
				radial-gradient(120% 80% at 50% 120%, rgba(0, 0, 0, .42), transparent 60%);
		}

		&::after {
			content: "";
			position: absolute;
			inset: 0;
			z-index: 2;
			pointer-events: none;
			border-radius: inherit;
			padding: 1px;
			background: linear-gradient(110deg, var(--qc-spectrum));
			opacity: .2;
			-webkit-mask:
				conic-gradient(#000 0 0) content-box exclude,
				conic-gradient(#000 0 0);
			mask:
				conic-gradient(#000 0 0) content-box exclude,
				conic-gradient(#000 0 0);
		}

		.content {
			position: relative;
			z-index: 5;
			height: 100%;
			display: flex;
			flex-direction: column;
		}

		.top-section {
			display: flex;
			gap: 30px;
			align-items: flex-start;
		}

		.icon {
			width: 72px;
			height: 72px;
			border-radius: 50%;
			font-size: 36px;
		}

		.top-section p {
			flex: 1;
			font-size: 18px;
			line-height: 1.6;
			color: #fff;
		}

		.bottom {
			display: flex;
			flex-wrap: wrap;
			gap: 10px;
			justify-content: space-between;
			align-items: center;
		}

		.bottom button .sign-icon {
			transition: transform 0.3s ease;
		}

		.bottom button:hover .sign-icon {
			transform: rotate(44deg);
		}

		.avatars {
			display: flex;
		}

		.avatars img {
			width: 45px;
			height: 45px;
			border-radius: 50%;
			object-fit: cover;
			border: 3px solid #151515;
			margin-left: -16px;
		}

		.avatars img:first-child {
			margin-left: 0;
		}

		button {
			padding: 7px 22px;
			border-radius: 999px;
			border: 1px solid #fff;
			background: transparent;
			color: white;
			font-size: 1rem;
			display: flex;
			align-items: center;
			gap: 12px;
			cursor: pointer;
			backdrop-filter: blur(15px);
			transition: .3s;
		}

		button:hover {
			background: rgba(255, 255, 255, .12);
		}
	}
}

@keyframes qc-orb-1 {

	0%,
	100% {
		transform: translate3d(-2%, 8%, 0) scale(1.02);
	}

	50% {
		transform: translate3d(2%, -8%, 0) scale(1.26);
	}
}

@keyframes qc-orb-2 {

	0%,
	100% {
		transform: translate3d(2%, -6%, 0) scale(1.18);
	}

	50% {
		transform: translate3d(-2%, 10%, 0) scale(.96);
	}
}

@keyframes qc-orb-3 {

	0%,
	100% {
		transform: translate3d(2%, 9%, 0) scale(1.1);
	}

	50% {
		transform: translate3d(-2%, -9%, 0) scale(1.3);
	}
}

@keyframes qc-orb-4 {

	0%,
	100% {
		transform: translate3d(-2%, 10%, 0) scale(1.22);
	}

	50% {
		transform: translate3d(2%, -7%, 0) scale(.98);
	}
}

@keyframes qc-orb-5 {

	0%,
	100% {
		transform: translate3d(2%, 7%, 0) scale(1);
	}

	50% {
		transform: translate3d(-2%, -9%, 0) scale(1.28);
	}
}

@keyframes qc-aurora-breathe {

	0%,
	100% {
		filter: blur(46px);
	}

	50% {
		filter: blur(54px);
	}
}

/* Media Queries */

/* large laptop */
@media (min-width: 1440px) {
	.insights-wrapper {
		.insights-col.qc {
			svg {
				width: 42px;
				height: 42px;
			}

			.label {
				font-size: 1.2rem;
			}
		}
	}
}

/* laptop */
@media (min-width: 1024px) {
	.qc-title {
		font-size: 4.5rem;
	}

	.speaker-card {
		.icon {
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}

	.avatars img {
		width: 55px !important;
		height: 55px !important;
	}

	.qc-min {
		width: 3rem !important;
	}
}

@media (max-width: 1023.99px) {
	.qc-btn {
		min-width: 6rem;
		padding: 0.35rem 1rem !important;
	}
}

@media (min-width: 1920px) {
	.qc-hero img {
		right: auto !important;
		left: 51vw;
	}
}

@media (max-width: 1023.99px) {
	.banner-img {
		right: -7rem !important;
		top: 18rem !important;
	}
}

@media (max-width: 1024px) {
	.insights-wrapper {
		.insights-col.qc {
			.label {
				font-size: 1rem;
			}
		}
	}
}



/* tablet */
@media (min-width: 768px) {
	.qc-hero {
		min-height: 600px;
	}

	.qc-date {
		border-left: 1px solid var(--qc-date-line);
	}

	.qc-date:last-child {
		border-right: 1px solid var(--qc-date-line);
	}

	.qc-date-lower {
		padding-top: 2.25rem;
	}

	.qc-min {
		width: 7rem;
	}

	.speaker-card .bottom {
		margin-top: auto;
	}

	.insights-col.qc {
		svg {
			width: 37px;
			height: 37px;
		}

		.label {
			font-size: 1rem;
		}
	}
}

@media (min-width: 768px) and (max-width: 1023.99px) {
	.qc-title {
		font-size: 3rem;
	}
}

@media only screen and (max-width: 767.4px) {
	.qc-title {
		margin-inline: auto;
	}
}

@media (max-width: 767.5px) {
	.insights-wrapper {
		position: relative;
		background: black;
		border-radius: 16px;
		padding: 30px 30px 7px;
		color: white;
	}

	.insights-wrapper::before {
		content: "";
		position: absolute;
		inset: 0;
		padding: 1.5px;
		opacity: 0.8;
		border-radius: inherit;
		background: linear-gradient(95deg, var(--qc-common-gradient));
		-webkit-mask:
			linear-gradient(#fff 0 0) content-box,
			linear-gradient(#fff 0 0);
		-webkit-mask-composite: xor;
		mask-composite: exclude;
		pointer-events: none;
	}

	.speaker-card .bottom {
		margin-top: 2rem;
	}

	/* .speaker-card .bottom a {
		margin-top: auto;
		padding-block: 6rem;
		font-size: 0.9rem !important;
	} */

	.insights-wrapper {
		.insights-col.qc {
			svg {
				width: 30px;
				height: 30px;
			}

			.label {
				font-size: 1rem;
			}
		}
	}

	.mob-banner-img-container {
		display: flex !important;
		justify-content: center;
		margin-top: 2rem;
		overflow: hidden;
	}

	.mob-banner-img-container img {
		border: solid 1px #767676;
		border-radius: 10px;
		width: 80%;
		max-width: 30rem;
		min-width: 13rem;
	}
}

@media (min-width: 640px) {
	.carousel-wrapper {
		margin-right: -0.9rem;
	}

	.carousel-wrapper .track-img {
		margin-inline: 0;
		width: auto !important;
		/* max-width: 23rem; */
	}

	.qc-track-heading {
		display: block !important;
		margin-bottom: 0 !important;
	}

	/* .carousel-controller {
		display: flex !important;
	} */

	.qc-rule.track {
		display: inline-block !important;
	}
}

@media (max-width: 506.5px) {
	.insights-wrapper {
		justify-content: center !important;
	}
}


/* mobile */
@media (min-width: 375px) {}

@media (min-width: 375px) and (max-width: 767.9px) {
	.qc-title {
		font-size: 2.5rem;
	}
}

@media (max-width: 373.9px) {
	.qc-title {
		font-size: 1.8rem;
	}
}

@media (max-width: 377px) {
	.insights-wrapper {
		display: flex;
		justify-content: center;

		.insights-col.qc {
			svg {
				width: 27px;
				height: 27px;
			}

			.label {
				font-size: 0.8rem;
			}
		}
	}
}