:root {
	/* Height of the navbar when the page is scrolled and the header is in its
	   compact, sticky state. Elements that stick below the header must offset
	   their own "top" by at least this much, or the header covers them. */
	--navbar-height-scrolled: 5.25rem;
}

body {
	line-height: 1.6!important;
}

.body--index,
.body--features {
	background-color: #e7e2ff;
}

h1, h2, h3, h4, h5, h6 {
	line-height: 1.2!important;
}

img {
	max-width: 100%;
	height: auto;
}

.split-button {
	display: flex;
	gap: 2px;
}

.split-button a {
	padding: 1rem 2rem;
	background-color: var(--primary-1);
	display: inline-block;
	color: #fff;
	text-align: center;
	font-size: 1rem;
	font-weight: 600;
	text-decoration: none;
}

.split-button a:first-child {
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	padding-left: 2rem;
}

.split-button a:first-child:hover {
	filter: brightness(1.08);
	transition: filter 160ms ease;
}

.split-button a:last-child {
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	padding-right: 2rem;
	color: #fff;
	margin-top: -.5px;
	background: rgba(255, 255, 255, 0.08);
	backdrop-filter: blur(4px);
	border: 1px solid rgba(255, 255, 255, 0.18);
}

.split-button a:last-child:hover {
	background: rgba(255, 255, 255, 0.14);
	border-color: rgba(255, 255, 255, 0.28);
	color: #ffffff;
	transition: all 180ms ease;
}

.split-button--light a {
	background-color: var(--neutral-0);
	color: var(--neutral-9);
}

.split-button--light a:hover {
	background-color: var(--neutral-0);
}

.split-button + .caption {
	font-size: 80%;
	font-weight: normal;
	color: #fff;
	margin-top: 5px;
}

.eyebrow {
	font-size: 15px;
	text-transform: uppercase;
}

/* Header */

.announcement-bar {
	background-color: #fff;
	color: #0f1824;
	font-size: 14px;
	padding: 5px;
	text-align: center;
}

.navbar {
	padding-bottom: 2rem;
	background-color: #0f1824;
}

.navbar-link-github {
	display: flex;
	align-items: center;
	gap: 5px;
}

.navbar-github-logo,
.navbar-github-logo-mobile {
  max-width: 18px;
  position: relative;
}

.navbar-github-logo-mobile {
	display: none;
}

.menu-icon-top-line,
.menu-icon-middle-line,
.menu-icon-bottom-line,
.menu-icon-top-line,
.menu-icon-middle-line,
.menu-icon-bottom-line {
	background-color: var(--neutral-1);
}

@media screen and (min-width: 992px) {
	.navbar-link, 
	.navbar-link:hover, 
	.navbar-link.w--current,
	.navbar-link, 
	.navbar-link:hover, 
	.navbar-link.w--current {
		color: var(--neutral-1);
	}
}

@media screen and (max-width: 991px) {
	.navbar-github-logo {
		display: none;
	}

	.navbar-github-logo-mobile {
		display: block;
	}
}

/* Sticky header (desktop only: on mobile the navbar scrolls with the page). */

@media screen and (min-width: 992px) {
	html {
		scroll-padding-top: 7rem;
	}

	.navbar {
		position: sticky;
		top: 0;
		z-index: 1000;
		transition: padding-top 250ms ease, padding-bottom 250ms ease, box-shadow 250ms ease;
	}

	.navbar--scrolled {
		padding-top: 1rem;
		padding-bottom: 1rem;
		box-shadow: 0 6px 24px rgba(15, 24, 36, 0.12);
	}

	.body--index .navbar--scrolled,
	.body--features .navbar--scrolled {
		box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
	}
}

/* Footer */

.footer {
	background-color: #0f1824;
}

.footer-details {
	margin-bottom: 10px;
}

/* Sections */

/* The Lottie container has no intrinsic size: the width matches the images of
   the same sections, and the aspect ratio is set by site.js from the animation. */
.lottie-animation {
	width: 100%;
	max-width: 650px;
	height: auto;
	aspect-ratio: 16 / 9;
}

.section .hero-image-wrapper img {
	max-width: 650px;
	position: relative;
}

.section-left .hero-image-wrapper {
	margin-right: -5rem;
}

.section-right .hero-image-wrapper {
	margin-left: -5rem;
}

.section-right .grid-2-column {
	grid-column-gap: 3rem;
}

@media screen and (max-width: 991px) {

	.padding-vertical-3rem,
	.padding-vertical-5rem {
		padding-top: 2rem
	}

	.section .grid {
		grid-template-columns: 1fr;
	}

	.section-left .hero-image-wrapper,
	.section-right .hero-image-wrapper {
		margin-right: 0;
		margin-left: 0;
	}

}

/* Form */

.form-flex {
	display: flex;
	gap: 15px;
	align-items: center;
}

/* Features */

.section-features-hero {
	background-color: #0f1824;
}

.section-features-hero .padding-vertical-5rem {
	padding-bottom: 7rem;
}

.features--background {
    -webkit-backdrop-filter: blur(1rem);
    backdrop-filter: blur(1rem);
    background-color: #6e4cf50d;
    border-radius: 16px;
    padding: 4rem 6rem 5.5rem;
}

.section-features-hero .heading-l,
.section-features-hero .body-l {
	color: #fff;
}

.section-features-hero .eyebrow {
	color: #8686E0;
}

.features__description {
	max-width: 800px;
	margin-left: auto!important;
	margin-right: auto!important;
	margin-top: 1.5rem!important;
}

.features__description > .body-l {
	line-height: 160%!important;
}

.section-features-profile .section__items,
.section-features-ingestion .section__items,
.section-features-engineer .section__items {
	display: flex;
	flex-flow: column;
}

.section-features-profile .section__item,
.section-features-ingestion .section__item,
.section-features-engineer .section__item {
	display: flex;
	gap: 15px;
	border: 0;
	padding: 0;
}

.section-features-profile .section__item-icon,
.section-features-ingestion .section__item-icon,
.section-features-engineer .section__item-icon {
	position: static;
	transform: none;
	background-color: transparent;
	padding: 0;
	flex-shrink: 0;
}

.section-features-identity {
	padding: 150px 0;
}

.section-features-identity .section__description {
	flex-shrink: 4!important;
}

.section-features-identity__image {
	background-image: linear-gradient(to top, #ebbba7 0%, #cfc7f8 100%);
  	border-radius: 15px;
  	padding: 20px;
}

.section-features-identity .section__items {
	margin-top: 70px;
	grid-template-columns: 1fr 1fr;
}

.section-features-security .section__items {
		margin-top: 70px;
	grid-template-columns: 1fr 1fr;
}

.section-features-ingestion {
	padding: 150px 0
}

.section-features-engineer__image {
  position: relative;
  top: 80px;
  left: 20px;
}

.section-features-applications {
	padding: 150px 0;
}

.section-features-applications > .container-1120px {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 30px;
}

.section-features-applications > .container-1120px > .fade-in:nth-child(2) {
	grid-column: 1 / -1;
	grid-row: 1;
}

.section-features-applications__image,
.section-features-applications__items {
	grid-row: 2;
}

.section-features-applications__image {
	background-image: linear-gradient(to top, #ebbba7 0%, #cfc7f8 100%);
    border-radius: 15px;
    padding: 20px;
	width: fit-content;
	max-width: 100%;
}

.section-features-applications__items {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px;
	grid-template-areas: 
		"ai analytics"
		"personalization marketing"
		"cx cx";
}

.section-features-applications .section__item {
	padding: 15px;
	font-size: 14px;
}
.section-features-applications .section__item-title {
	font-size: 15px;
}

.section-features-applications .section__item:nth-child(1) {
	grid-area: ai;
}

.section-features-applications .section__item:nth-child(2) {
	grid-area: analytics;
}

.section-features-applications .section__item:nth-child(3) {
	grid-area: personalization;
}

.section-features-applications .section__item:nth-child(4) {
	grid-area: marketing;
}

.section-features-applications .section__item:nth-child(5) {
	grid-area: cx;
}

.section-features-ai {
	padding: 100px 0;
}

.section-features-ai .section__description {
	flex-shrink: 4!important;
}

.section-features-ai__image {
	background-image: linear-gradient(to top, #ebbba7 0%, #cfc7f8 100%);
    border-radius: 15px;
    padding: 20px;
	width: fit-content;
}

.section-features-ai .section__items {
	margin-top: 70px;
}

/* Case study */

.case-study .stats__wrapper {
	padding-top: 0;
	padding-bottom: 0;
}

@media screen and (max-width: 991px) {

	.case-study .home-quote-and-stats-quote-author {
		margin-bottom: 20px;
	}

}

/* FAQ */

.faq__question,
.faq__question-chevron {
	cursor: pointer;
}

/* Team */

.section-about-us-team {
	overflow: hidden;
}

/* Sections */

.section__title,
.section__description {
	max-width: 1000px;
}

.section__title {
	font-size: 32px;
	margin-top: 20px;
	margin-bottom: 20px;
	color: var(--neutral-9);
}

.section__description {
	color: var(--neutral-7);
	font-size: 1.125rem;
}

.section__columns {
	display: flex;
	gap: 50px;
	margin-top: 30px;
	align-items: start;
}

.section__columns .section__description {
	flex-shrink: 1.2;
}

.section__items {
	display: grid;
	grid-template-columns:  1fr 1fr 1fr;
	gap: 30px;
	margin-top: 30px;
}

.section__item {
	border: 1px solid var(--neutral-3);
	border-radius: 3px;
	padding: 30px;
	position: relative;
	font-size: 15px;
}

.section__item-icon {
	position: absolute;
	left: 50%;
	top: -18px;
	transform: translateX(-50%);
	background-color: #e7e2ff;
	padding: 0 17px;
}

.section__item-title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 5px;
}

/* Home V1 */

@keyframes rotate {
  from { transform: rotate(0deg) }
  to   { transform: rotate(360deg) }
}

@keyframes pulse {
	0% {
		box-shadow: 0 0 0 20px rgba(79, 70, 229, 0.7);
	}

	70% {
		box-shadow: 0 0 0 50px rgba(79, 70, 229, 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(79, 70, 229, 0);
	}
}

.section-home-hero {
	background-color: #0f1824;
}

.section-home-hero .padding-vertical-5rem {
	padding-bottom: 7rem;
}

.section-home-hero h1 {
	font-weight: 600;
	font-size: 2.8rem;
	color: #fff;
}

.section-home-hero .hero-image-wrapper {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 550px;
	height: 550px;
	top: -30px;
	right: -60px;
}

.section-home-hero .hero-image-wrapper-orbit {
    position: absolute;
    border-radius: 9999px;
	transform-origin: 50% 50%;
	background: #6062D0;
	background: linear-gradient(90deg, rgba(96, 98, 208, 0) 0%, rgba(96, 98, 208, 0.6) 100%);
}

.section-home-hero .hero-image-wrapper-orbit-inner {
	width: 63%;
	height: 63%;
	animation: rotate 2s linear infinite;
}

.section-home-hero .hero-image-wrapper-orbit-outer {
	width: 75%;
	height: 75%;
	animation: rotate 2s linear infinite;
	animation-delay: .1s;
}

.section-home-hero .body-l {
	color: #eee;
}

.section-home-map .section-central-image-wrapper {
	position: relative;
	padding: 0!important;
	margin: 0!important;
}

.section-home-map .section-central-image-wrapper > img {
	padding: 0!important;
	margin: 0!important;
	position: relative;
	z-index: 20;
}

.section-home-map .section-central-image-pulse {
    position: absolute;
    width: calc(10% - 1px);
    height: calc(17% - 0.85px);
    margin: auto;
    border-radius: 100%;
    animation: pulse 2s infinite;
    border: 0;
    left: calc(50% - 0px);
    bottom: calc(42% - 1.6px);
    transform: translate(-50%, -50%);
	z-index: 10;
}

.section-home-map p {
	margin-top: 10px;
}

.section-home-security {
	padding: 100px 0;
}

.section-home-security .section__columns > div:first-child {
	flex-shrink: 1.2;
}

.section-home-security__image {
	background-image: linear-gradient(to top, #ebbba7 0%, #cfc7f8 100%);
    border-radius: 15px;
    padding: 20px;
}

.section-home-scalability {
	padding: 100px 0 120px 0;
}

.section-home-scalability__image {
	background-image: linear-gradient(to top, #ebbba7 0%, #cfc7f8 100%);
    border-radius: 15px;
    padding: 20px;
}

.section-home-scalability__image svg > g > g:first-child > path {
	fill: transparent;
}

.section-home-scalability .section__description {
	flex-shrink: 4;
}

.section-home-infra {
	background-color: #1E1B4B;
	color: var(--neutral-1) !important;
	padding: 100px 0;
}

.section-home-infra .eyebrow {
	color: var(--primary-2);
}

.section-home-infra .section__columns {
	gap: 30px;
}

.section-home-infra .section__title {
	color: var(--neutral-0)
}

.section-home-infra .section__description {
	color: var(--neutral-1) !important;
}

.section-home-infra__column {
	border: 1px solid var(--primary-1);
	border-radius: 4px;
	padding: 20px;
}

.section-home-infra__column-title {
	font-size: 21px;
	font-weight: 500;
	margin-bottom: 10px;
}

.section-home-identity {
	padding: 100px 0;
}

.section-home-identity .section__title {
	font-size: 36px;
}

.section-home-identity__image {
	margin-top: -100px;
}

.section-home-connectors {
	padding: 50px 0 150px 0;
}

.section-home-connectors__image {
	position: relative;
}

.section-home-connectors .section__title {
	margin-top: 0;
}

.section-home-connectors .section__items {
	padding: 50px 0;
	border-radius: 10px;
	gap: 60px;
}

.section-home-connectors .section__item {
	border: 0;
	padding: 0;
}

.section-home-connectors .section__item-title {
	font-size: 17px;
	color: var(--neutral-9);
}

.section-home-connectors .section__item-text {
	font-size: 17px;
	color: var(--neutral-7);
}

/* Responsive layout for the custom Home and Features sections. */
@media screen and (max-width: 991px) {

	.section__columns {
		flex-direction: column;
		gap: 2rem;
		width: 100%;
	}

	.section__columns > *,
	.section__items > *,
	.section-features-applications__items > * {
		min-width: 0;
	}

	.section__description,
	.section__item,
	.section__item-text {
		overflow-wrap: anywhere;
	}

	.section-home-security__image,
	.section-home-identity__image,
	.section-features-profile__image,
	.section-features-security__image,
	.section-features-engineer__image,
	.section-features-ai__image {
		order: -1;
	}

	.section-home-security__image,
	.section-home-scalability__image,
	.section-home-identity__image,
	.section-home-connectors__image,
	.section-features-profile__image,
	.section-features-identity__image,
	.section-features-security__image,
	.section-features-ingestion__image,
	.section-features-engineer__image,
	.section-features-ai__image {
		width: 100%;
		max-width: 650px;
		margin-right: auto;
		margin-left: auto;
	}

	.section-features-engineer__image {
		top: auto;
		left: auto;
	}

	.section-features-applications > .container-1120px {
		display: flex;
		flex-direction: column;
		gap: 2rem;
	}

	.section-features-applications__image,
	.section-features-applications__items {
		width: 100%;
	}

	.section-features-applications__image {
		order: -1;
		max-width: 650px;
		margin-right: auto;
		margin-left: auto;
	}

	.section-features-applications__items {
		grid-template-areas: none;
	}

	.section-features-applications .section__item {
		grid-area: auto !important;
	}

	.body--index .section-left .grid-2-column,
	.body--features .section-left .grid-2-column {
		display: flex;
		flex-direction: column;
	}

	.section-home-hero .hero-image-wrapper {
		width: min(100%, 34rem);
		height: auto;
		aspect-ratio: 1;
		top: auto;
		right: auto;
		margin-right: auto;
		margin-left: auto;
	}

	.section .hero-image-wrapper img,
	.lottie-animation {
		max-width: 100%;
	}

	.section-features-profile,
	.section-features-identity,
	.section-features-security,
	.section-features-ingestion,
	.section-features-engineer,
	.section-features-applications,
	.section-features-ai,
	.section-home-security,
	.section-home-scalability,
	.section-home-infra,
	.section-home-identity,
	.section-home-connectors {
		padding-top: 5rem;
		padding-bottom: 5rem;
	}
}

@media screen and (max-width: 768px) {

	.section-home-hero h1 {
		font-size: 2.25rem;
	}

	.section-home-security > .container-1120px,
	.section-home-scalability > .container-1120px,
	.section-home-identity > .container-1120px,
	.section-home-connectors > .container-1120px,
	.section-features-profile > .container-1120px,
	.section-features-identity > .container-1120px,
	.section-features-security > .container-1120px,
	.section-features-ingestion > .container-1120px,
	.section-features-engineer > .container-1120px,
	.section-features-applications > .container-1120px,
	.section-features-ai > .container-1120px {
		width: calc(100% - 3rem);
	}

	.section__items,
	.section-features-identity .section__items,
	.section-features-security .section__items,
	.section-features-applications__items {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.5rem;
	}

	.section-features-identity .section__items,
	.section-features-security .section__items,
	.section-features-ai .section__items {
		margin-top: 3rem;
	}

	.section-home-connectors .section__items {
		gap: 2rem;
		padding-top: 2rem;
		padding-bottom: 2rem;
	}

	.section-features-profile,
	.section-features-identity,
	.section-features-security,
	.section-features-ingestion,
	.section-features-engineer,
	.section-features-applications,
	.section-features-ai,
	.section-home-security,
	.section-home-scalability,
	.section-home-infra,
	.section-home-identity,
	.section-home-connectors {
		padding-top: 4rem;
		padding-bottom: 4rem;
	}

	@keyframes pulse {
		0% {
			box-shadow: 0 0 0 10px rgba(79, 70, 229, 0.7);
		}

		70% {
			box-shadow: 0 0 0 30px rgba(79, 70, 229, 0);
		}

		100% {
			box-shadow: 0 0 0 0 rgba(79, 70, 229, 0);
		}
	}

}

@media screen and (max-width: 480px) {

	.split-button {
		flex-direction: column;
		gap: 0.5rem;
	}

	.split-button a,
	.split-button a:first-child,
	.split-button a:last-child {
		width: 100%;
		padding: 0.875rem 1rem;
		border-radius: 5px;
	}

	.section__title,
	.section-home-identity .section__title {
		font-size: 1.75rem;
	}

	.section__item {
		padding: 1.5rem;
	}

	@keyframes pulse {
		0% {
			box-shadow: 0 0 0 5px rgba(79, 70, 229, 0.7);
		}

		70% {
			box-shadow: 0 0 0 20px rgba(79, 70, 229, 0);
		}

		100% {
			box-shadow: 0 0 0 0 rgba(79, 70, 229, 0);
		}
	}

	.section-home-map .section-central-image-pulse {
		bottom: calc(42%);
	}

}

/* Home V2 */

.max-width-home-v2-banner {
	max-width: unset;
}

/* Contact Us page */

.contact-us-privacy-notice {
	font-size: 13px;
}

table.comparison {
	table-layout: fixed;
	width: 100%;
}
table.comparison td,
table.comparison th {
	padding: 12px;
}
table.comparison .note {
	font-size: 90%;
}

/* Privacy policy page */

.privacy-policy-content {
	text-align: left;
}

.privacy-policy-date {
	margin-top: 3px;
}

.privacy-policy-content > ol {
	margin-left: 10px;
	margin-top: 0px;
}

.privacy-policy-content > ol > li {
	margin-top: 20px;
}

.privacy-policy-content > ol > li:first-child {
	margin-top: 0;
}

.privacy-policy-list-item-title {
  font-size: 19px;
  font-weight: 500;
}

/* CTA */

.section-cta-horizontal h3 {
	margin-top: 0;
}

/* Scroll reveal animations: add the fade-in class to any element that has to
   fade and slide up when it enters the viewport. The class is added by hand in
   the markup, site.js only toggles is-revealed on the elements that carry it. */

.w-mod-js .fade-in {
	opacity: 0;
	transform: translateY(2rem);
	transition: opacity 900ms cubic-bezier(0.22, 0.61, 0.36, 1), transform 900ms cubic-bezier(0.22, 0.61, 0.36, 1);
	will-change: opacity, transform;
}

/* Sibling elements, like the two columns of a 5050 section, follow the first
   one with a short delay instead of animating all at the same time. */
.w-mod-js .fade-in ~ .fade-in {
	transition-delay: 150ms;
}

.w-mod-js .fade-in.is-revealed {
	opacity: 1;
	transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {

	.w-mod-js .fade-in {
		opacity: 1;
		transform: none;
		transition: none;
	}

}
