/* HTML */
html {
	scroll-behavior: smooth;
}
@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* Hero logo */
#hero-logo>.letters-container {
	font-size: 3rem;
	line-height: 3rem;
	padding: calc(3rem / 2) calc((3rem / 3.861) - (3rem / 160)) calc(3rem / 2) calc((3rem / 3.861) + (3rem / 160));
}

/* Loading Animations */
[data-trigger] {
	opacity: 0;
	-webkit-transform: translateY(30px);
		-ms-transform: translateY(30px);
			transform: translateY(30px);
	-webkit-transition: opacity .66s ease-out, -webkit-transform .66s ease-out;
	transition: opacity .66s ease-out, -webkit-transform .66s ease-out;
	-o-transition: opacity .66s ease-out, transform .66s ease-out;
	transition: opacity .66s ease-out, transform .66s ease-out;
	transition: opacity .66s ease-out, transform .66s ease-out, -webkit-transform .66s ease-out;
}
[data-trigger].trigger-from-right {
	opacity: 0;
	-webkit-transform: translate(15px, 30px);
		-ms-transform: translate(15px, 30px);
			transform: translate(15px, 30px);
	-webkit-transition: opacity .66s ease-out, -webkit-transform .66s ease-out;
	transition: opacity .66s ease-out, -webkit-transform .66s ease-out;
	-o-transition: opacity .66s ease-out, transform .66s ease-out;
	transition: opacity .66s ease-out, transform .66s ease-out;
	transition: opacity .66s ease-out, transform .66s ease-out, -webkit-transform .66s ease-out;
}
[data-trigger].anim-long {
	opacity: 0;
	-webkit-transform: translateY(30px);
		-ms-transform: translateY(30px);
			transform: translateY(30px);
	-webkit-transition: opacity 1s ease-out, -webkit-transform 1s ease-out;
	transition: opacity 1s ease-out, -webkit-transform 1s ease-out;
	-o-transition: opacity 1s ease-out, transform 1s ease-out;
	transition: opacity 1s ease-out, transform 1s ease-out;
	transition: opacity 1s ease-out, transform 1s ease-out, -webkit-transform 1s ease-out;
}
[data-trigger].anim-long.trigger-from-right {
	opacity: 0;
	-webkit-transform: translate(15px, 30px);
		-ms-transform: translate(15px, 30px);
			transform: translate(15px, 30px);
	-webkit-transition: opacity 1s ease-out, -webkit-transform 1s ease-out;
	transition: opacity 1s ease-out, -webkit-transform 1s ease-out;
	-o-transition: opacity 1s ease-out, transform 1s ease-out;
	transition: opacity 1s ease-out, transform 1s ease-out;
	transition: opacity 1s ease-out, transform 1s ease-out, -webkit-transform 1s ease-out;
}
[data-trigger].visible {
	opacity: 1;
	-webkit-transform: translateY(0px);
		-ms-transform: translateY(0px);
			transform: translateY(0px);
}
.anim-delay-0[data-trigger] {
	-webkit-transition-delay: 0s;
		 -o-transition-delay: 0s;
			transition-delay: 0s;
}
.anim-delay-1[data-trigger] {
	-webkit-transition-delay: .4s;
		 -o-transition-delay: .4s;
			transition-delay: .4s;
}
.anim-delay-2[data-trigger] {
	-webkit-transition-delay: .8s;
		 -o-transition-delay: .8s;
			transition-delay: .8s;
}
.anim-delay-3[data-trigger] {
	-webkit-transition-delay: 1.2s;
		 -o-transition-delay: 1.2s;
			transition-delay: 1.2s;
}
.anim-delay-4[data-trigger] {
	-webkit-transition-delay: 1.6s;
		 -o-transition-delay: 1.6s;
			transition-delay: 1.6s;
}
/*.anim-delay-5[data-trigger] {
	-webkit-transition-delay: 2.5s;
		 -o-transition-delay: 2.5s;
			transition-delay: 2.5s;
}
.anim-delay-6[data-trigger] {
	-webkit-transition-delay: 3s;
		 -o-transition-delay: 3s;
			transition-delay: 3s;
}
.anim-delay-7[data-trigger] {
	-webkit-transition-delay: 3.5s;
		 -o-transition-delay: 3.5s;
			transition-delay: 3.5s;
}
.anim-delay-8[data-trigger] {
	-webkit-transition-delay: 4s;
		 -o-transition-delay: 4s;
			transition-delay: 4s;
}*/

/* CTA button */
.cta-container {
	-webkit-transition: -webkit-transform .166s ease-out;
	transition: -webkit-transform .166s ease-out;
	-o-transition: transform .166s ease-out;
	transition: transform .166s ease-out;
	transition: transform .166s ease-out, -webkit-transform .166s ease-out;
}
.cta-solid {
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% + 4px);
	height: calc(100% + 4px);
	background: -o-linear-gradient(45deg,rgb(255,105,97),rgb(255,179,64),rgb(255,212,38),rgb(49,222,75),rgb(102,212,207),rgb(93,230,255),rgb(64,156,255),rgb(125,122,255),rgb(218,143,255),rgb(255,100,130));
	background: linear-gradient(45deg,rgb(255,105,97),rgb(255,179,64),rgb(255,212,38),rgb(49,222,75),rgb(102,212,207),rgb(93,230,255),rgb(64,156,255),rgb(125,122,255),rgb(218,143,255),rgb(255,100,130));
	background-size: 400%;
	width: 100%;
	height: 100%;
	z-index: -10;
	-webkit-animation: steam 8s linear infinite;
			animation: steam 8s linear infinite;
	border-radius: calc(1.25rem + 2px);
	-webkit-transition: opacity .25s ease-out;
	-o-transition: opacity .25s ease-out;
	transition: opacity .25s ease-out;
	opacity: 0;
	overflow: hidden;
}
.cta-blur {
	position: absolute;
	top: -1rem;
	left: -1rem;
	width: calc(100% + 2rem);
	height: calc(100% + 2rem);
	background: -o-linear-gradient(45deg,rgb(255,105,97),rgb(255,179,64),rgb(255,212,38),rgb(49,222,75),rgb(102,212,207),rgb(93,230,255),rgb(64,156,255),rgb(125,122,255),rgb(218,143,255),rgb(255,100,130));
	background: linear-gradient(45deg,rgb(255,105,97),rgb(255,179,64),rgb(255,212,38),rgb(49,222,75),rgb(102,212,207),rgb(93,230,255),rgb(64,156,255),rgb(125,122,255),rgb(218,143,255),rgb(255,100,130));
	background-size: 400%;
	z-index: -10;
	-webkit-animation: steam 8s linear infinite;
			animation: steam 8s linear infinite;
	border-radius: 2.5rem;
	-webkit-transition: opacity .5s ease-out;
	-o-transition: opacity .5s ease-out;
	transition: opacity .5s ease-out;
	opacity: 0;
	-webkit-box-shadow: inset 0 0 10px 10px var(--background);
			box-shadow: inset 0 0 10px 10px var(--background);
	outline: 2px solid var(--background);
	outline-offset: -1px;
}
.cta-container:hover {
	-webkit-transform: translateY(-5px);
		-ms-transform: translateY(-5px);
			transform: translateY(-5px);
	.cta-solid {
		opacity: 1;
	}
	.cta-blur {
		opacity: 0.5;
	}
}
@-webkit-keyframes steam {
	0% {
		background-position: 0% 0%;
	}
	50% {
		background-position: 100% 0%;
	}
	100% {
		background-position: 0% 0%;
	}
}
@keyframes steam {
	0% {
		background-position: 0% 0%;
	}
	50% {
		background-position: 100% 0%;
	}
	100% {
		background-position: 0% 0%;
	}
}

.cta-btn {
	background: var(--background-more-lighter);
	color: var(--base-opa-85);
	font-weight: 600 !important;
	margin: 2px;
	border-radius: 1.25rem !important;
	padding: 1.25rem 2rem 1.25rem 4.5rem !important;
	-webkit-transition: color .166s ease-out;
	-o-transition: color .166s ease-out;
	transition: color .166s ease-out;
}
.cta-btn:hover {
	background: var(--background-more-lighter) !important;
	color: var(--base) !important;
}
.cta-btn:active {
	background: var(--background-more-lighter) !important;
	color: var(--base) !important;
}
.cta-btn:focus {
	background: var(--background-more-lighter) !important;
	color: var(--base) !important;
}
.cta-btn:focus-visible {
	background: var(--background-more-lighter) !important;
	color: var(--base) !important;
}
.cta-btn>svg {
	width: 1.75rem;
	height: 1.75rem;
	left: 2rem !important;
	right: auto;
}

.cta-btn-purchase {
	padding: 1.25rem 4.5rem 1.25rem 2rem !important;
}
.cta-btn-purchase>svg {
	right: 2rem !important;
	left: auto !important;
}

.cta-info {
	font-size: 0.75rem;
}

/* AI Demo */
#ai-demo-container {
	padding: 1.75rem 1.5rem 1rem 1.5rem;
	max-height: 450px; 
	max-width: 800px;
	-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(80%, rgba(0,0,0,1)), to(rgba(0,0,0,0)));
	-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 80%, rgba(0,0,0,0) 100%); 
			mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(80%, rgba(0,0,0,1)), to(rgba(0,0,0,0))); 
			mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 80%, rgba(0,0,0,0) 100%);
}
@media (min-width: 576px) {
	#ai-demo-container {
		padding: 1.75rem 2rem 1rem 2rem;
	}
}
@media (min-width: 768px) {
	#ai-demo-container {
		padding: 1.75rem 2.5rem 1rem 2.5rem;
	}
}
@media (min-width: 992px) {
	#ai-demo-container {
		padding: 1.75rem 3rem 1rem 3rem;
	}
}

#ai-body-box {
	cursor: default !important;
	-webkit-user-select: none !important;
	   -moz-user-select: none !important;
		-ms-user-select: none !important;
			user-select: none !important;
	position: relative;
	border-radius: 1em;
	background: var(--background-hover-opa-50);
	font-family: 'Noto Serif', -apple-system-ui-serif, ui-serif, 'Georgia', serif;
	line-height: calc(1em * 1.625);
	text-rendering: optimizelegibility;
	word-wrap: break-word;
	-webkit-hyphens: auto;
		-ms-hyphens: auto;
			hyphens: auto;
}
#ai-body-box * {
	cursor: default !important;
	-webkit-user-select: none !important;
	   -moz-user-select: none !important;
		-ms-user-select: none !important;
			user-select: none !important;
}
#ai-body-box svg {
	width: 16px; 
	height: 16px;
	stroke: var(--base);
}
#ai-body-box [class*=hint--]::after {
	font-size: 12px;
	border-radius: 7px;
	padding: 5px 8px;
	text-shadow: none;
	background: rgb(56, 56, 56);
}
.ai-box-contents {
	border-radius: 0 0 10px 10px;
	padding: 0 1.25em 1em 1.25em;
	width: 100%;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
}

#ai-body-selector-container {
	position: absolute;
	top: calc(1em - 1px);
	left: calc(1.25em - 1px);
	z-index: 1;
	background: transparent;
	padding: 1px;
	overflow: hidden;
	border-radius: 10px;
	max-width: calc(100% - 2.5em - 5px - ((16px + 0.939em + 5px) * 2));
}
#ai-body-selector-container>svg {
	position: absolute;
	top: 50%;
	left: 0.5em;
	-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
			transform: translateY(-50%);
}
#ai-body-selector-container>svg.lucide-list-start {
	-webkit-transform: translateY(-50%) rotate(180deg);
		-ms-transform: translateY(-50%) rotate(180deg);
			transform: translateY(-50%) rotate(180deg);
}
#ai-body-selector-container::before {
	content: '';
	position: absolute;
	z-index: -2;
	left: -50%;
	top: -50%;
	width: 200%;
	height: 200%;
	background-color: transparent;
	background-repeat: no-repeat;
	background-size: 50% 50%, 50% 50%;
	background-position: 0 100%, 100% 0, 100% 100%, 0 100%;
	background-image: -webkit-gradient(linear, left top, left bottom, from(var(--neutral)), to(transparent)), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent)), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent)), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));
	background-image: -o-linear-gradient(var(--neutral), transparent), -o-linear-gradient(transparent, transparent), -o-linear-gradient(transparent, transparent), -o-linear-gradient(transparent, transparent);
	background-image: linear-gradient(var(--neutral), transparent), linear-gradient(transparent, transparent), linear-gradient(transparent, transparent), linear-gradient(transparent, transparent);
	-webkit-animation: rotate 6s linear infinite;
			animation: rotate 6s linear infinite;
	pointer-events: none;
	opacity: 1;
	-webkit-transition: opacity .33s ease-out;
	-o-transition: opacity .33s ease-out;
	transition: opacity .33s ease-out;
}
#ai-body-selector-container::after {
	content: ' ';
	position: absolute;
	top: 1px;
	left: 1px;
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	border-radius: 8px;
	z-index: -1;
	background: var(--background);
}
#ai-body-selector-container.hide-hint::before {
	opacity: 0;
}
@-webkit-keyframes rotate {
	100% {
		-webkit-transform: rotate(1turn);
				transform: rotate(1turn);
	}
}
@keyframes rotate {
	100% {
		-webkit-transform: rotate(1turn);
				transform: rotate(1turn);
	}
}
#ai-body-selector {
	max-width: 100%;
	text-align: left;
	padding: 0.375em 2em 0.375em 1.75em;
	font-size: 1em;
	font-weight: 700;
	line-height: 1em;
	background-color: var(--background-hover-opa-50);
	-webkit-transition: background .166s ease-out, border-color .166s ease-out, outline .166s ease-out;
	-o-transition: background .166s ease-out, border-color .166s ease-out, outline .166s ease-out;
	transition: background .166s ease-out, border-color .166s ease-out, outline .166s ease-out;
	border-radius: 8px;
	-webkit-appearance: none;
	   -moz-appearance: none;
			appearance: none;
	outline: none;
	background-repeat: no-repeat;
	background-position-x: calc(100% - 4px);
	background-position-y: 50%;
	background-size: 18px;
	white-space: nowrap;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	   text-overflow: ellipsis;
	border: 1px solid var(--base-opa-15); 
	color: var(--base); 
	background-image: var(--arrow-bg-svg);
	font-family: var(--bs-body-font-family);
}
#ai-body-selector:hover {
	background-repeat: no-repeat;
	background-position-x: calc(100% - 4px);
	background-position-y: 50%;
	background-size: 18px;
	border: 1px solid var(--base-opa-15); 
	background-color: var(--background-hover); 
	background-image: var(--arrow-bg-svg);
}

.ai-title-bar {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
		-ms-flex-pack: end;
			justify-content: flex-end;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	padding: 1em 1.25em;
	border-radius: 10px 10px 0 0;
}
.ai-title-bar>.spacer {
	font-size: 1em;
	font-weight: 700;
	padding-top: 0.375em;
	padding-bottom: 0.375em;
	-webkit-box-flex: 1;
		-ms-flex-positive: 1;
			flex-grow: 1;
	visibility: hidden;
	border: none;
}

.ai-box-btn {
	padding: 0.45em;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	margin-left: 5px;
	border: none;
	outline: none;
	border-radius: 0.45em;
	background: transparent;
	font-size: inherit;
	-webkit-transition: background .166s ease-out;
	-o-transition: background .166s ease-out;
	transition: background .166s ease-out;
}
.ai-box-btn>svg {
	opacity: 0.5;
	-webkit-transition: opacity .166s ease-out;
	-o-transition: opacity .166s ease-out;
	transition: opacity .166s ease-out;
}
.ai-box-btn:hover>svg {
	opacity: 1;
}
.ai-box-btn:hover {
	background: var(--background-hover);
}

.ai-disclaimer {
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
	padding-left: 1em;
	padding-right: 1em;
	width: 100%;
}
.ai-disclaimer>p {
	margin: 0;
	padding-bottom: 1em;
	opacity: 0.4;
	font-size: 80%;
	line-height: 130%;
	text-align: center;
}

.ccai-micro-summary {
	margin: 0 0 1em 0;
}
.ccai-summary-container {
	border-radius: 1em;
	padding: 1em;
	outline: 1px solid transparent;
	-webkit-transition: background .166s ease-out, outline .166s ease-out;
	-o-transition: background .166s ease-out, outline .166s ease-out;
	transition: background .166s ease-out, outline .166s ease-out;
	background: var(--background-hover);
}
.ccai-summary-container:not(:last-of-type) {
	margin-bottom: 1em;
}
.ccai-summary-container:hover {
	outline: 1px solid var(--base-opa-15);
}
.ccai-summary-container:hover .ccai-point>svg {
	opacity: 1;
}
.ccai-summary-container .demo-jump-btn {
	display: inline;
	width: 1em;
	height: 1em;
	padding: 0;
	margin: 0 0 0 0.325em;
	outline: none;
	border: none;
	background: transparent;
}
.ccai-summary-container .demo-jump-btn>svg {
	width: 1em;
	height: 1em;
	opacity: 0.33;
	-webkit-transition: opacity .166s ease-out;
	-o-transition: opacity .166s ease-out;
	transition: opacity .166s ease-out;
}
.ccai-summary-container .demo-jump-btn:hover>svg {
	opacity: 1;
}
.ccai-sub-points-container.collapse-expanding .demo-jump-btn:after { /* needed to prevent glitch arising from hint when showing collapse */
	display: none !important;
}
.ccai-point,.ccai-sub-point {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
		-ms-flex-pack: start;
			justify-content: flex-start;
	-webkit-box-align: start;
		-ms-flex-align: start;
			align-items: flex-start;
}
.ccai-point>span>p,
.ccai-sub-point>span>p {
	display: inline;
}
.ccai-point>span>p>em,
.ccai-sub-point>span>p>em {
	font-style: normal;
	border-radius: 0.25em;
}
.ccai-point>svg {
	width: 1em;
	height: 1em;
	margin-right: 0.3125em;
	padding: 0.3125em 0;
	opacity: 0.66;
	-webkit-box-sizing: content-box;
			box-sizing: content-box;
	-webkit-transition: opacity .166s ease-out, -webkit-transform .166s ease-out;
	transition: opacity .166s ease-out, -webkit-transform .166s ease-out;
	-o-transition: transform .166s ease-out, opacity .166s ease-out;
	transition: transform .166s ease-out, opacity .166s ease-out;
	transition: transform .166s ease-out, opacity .166s ease-out, -webkit-transform .166s ease-out;
}
.ccai-summary-container.collapse-expanded .ccai-point>svg {
	-webkit-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
			transform: rotate(90deg);
}

.ccai-point>span {
	max-width: calc(100% - 1em - 0.3125em);
	-webkit-box-flex: 1;
		-ms-flex-positive: 1;
			flex-grow: 1;
}
.ccai-sub-point {
	margin-left: calc(1em + 0.3125em);
}
.ccai-sub-point:not(:last-of-type) {
	padding-bottom: 0.5em;
}
.ccai-sub-point:first-of-type {
	padding-top: 0.5em;
}
.ccai-sub-point>b {
	margin-right: calc(0.3125em * 2);
}

.collapse-custom {
	height: 0;
	opacity: 0;
	-webkit-transform: translateY(-1em);
		-ms-transform: translateY(-1em);
			transform: translateY(-1em);
	-webkit-transition: height .166s ease-out, opacity .166s ease-out, -webkit-transform .166s ease-out;
	transition: height .166s ease-out, opacity .166s ease-out, -webkit-transform .166s ease-out;
	-o-transition: height .166s ease-out, opacity .166s ease-out, transform .166s ease-out;
	transition: height .166s ease-out, opacity .166s ease-out, transform .166s ease-out;
	transition: height .166s ease-out, opacity .166s ease-out, transform .166s ease-out, -webkit-transform .166s ease-out;
}
.collapse-custom:not(.show) {
	overflow: hidden;
}
.collapse-custom.collapse-expanding {
	overflow: hidden;
}
.collapse-custom.show {
	height: auto;
	opacity: 1;
	-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
			transform: translateY(0);
}

.ccai-outline-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
		-ms-flex-pack: justify;
			justify-content: space-between;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	border-radius: 0.5em;
	padding: 0.25em 0.5em;
	margin-left: -0.5em;
	width: calc(100% + 0.5em);
	outline: 1px solid transparent;
	-webkit-transition: background .166s ease-out, outline .166s ease-out;
	-o-transition: background .166s ease-out, outline .166s ease-out;
	transition: background .166s ease-out, outline .166s ease-out;
}
.ccai-outline-item:hover {
	background: var(--background-hover-opa-66); 
	outline: 1px solid var(--base-opa-15);
}
.outline-text {
	text-transform: capitalize;
	white-space: nowrap;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	   text-overflow: ellipsis;
}
.outline-time {
	white-space: nowrap;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
		-ms-flex-pack: center;
			justify-content: center;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	margin-left: 0.5em;
	opacity: 0.4;
	-webkit-transition: opacity .166s ease-out;
	-o-transition: opacity .166s ease-out;
	transition: opacity .166s ease-out;
}
.ccai-outline-item:hover>.outline-time {
	opacity: 1;
}
.outline-time>svg {
	margin-left: 0.25em;
}

.ccai-quote {
	border-radius: 1em;
	padding: 0.75em 1em 0.95em 1em;
	background: var(--background-hover);
}
.ccai-quote:not(:last-child) {
	margin-bottom: 1em;
}
.ccai-quote>span {
	font-size: 112.5%;
	line-height: 125%;
	display: inline-block;
	padding: 0.5em;
	word-wrap: break-word;
	-webkit-hyphens: auto;
		-ms-hyphens: auto;
			hyphens: auto;
}

.ccai-quote-options {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
		-ms-flex-pack: start;
			justify-content: flex-start;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
}
.ccai-quote-options>button {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	padding: 0.4em;
	margin-left: 0.25em;
	opacity: 0.4;
	background: transparent;
	border: none;
	outline: none;
	-webkit-transition: opacity .166s ease-out;
	-o-transition: opacity .166s ease-out;
	transition: opacity .166s ease-out;
}
.ccai-quote-options>button>svg {
	width: 1.2em;
	height: 1.2em;
}
.ccai-quote-options>button:hover {
	opacity: 1;
}

.ccai-res {
	border-radius: 1em;
	padding: 0.75em 1em 0.95em 1em;
	background: var(--background-hover);
}
.ccai-res:not(:last-child) {
	margin-bottom: 1em;
}
.ccai-res>span {
	display: block;
	padding: 0.5em;
}

.ccai-res-options {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
		-ms-flex-pack: start;
			justify-content: flex-start;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
}
.ccai-res-options>span {
	text-transform: uppercase;
	opacity: 0.4;
	font-weight: 700;
	font-size: 80%;
	-webkit-box-flex: 1;
		-ms-flex-positive: 1;
			flex-grow: 1;
	white-space: nowrap;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	   text-overflow: ellipsis;
}
.ccai-res-options>button {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	padding: 0.4em;
	margin-left: 0.25em;
	opacity: 0.4;
	background: transparent;
	border: none;
	outline: none;
	-webkit-transition: opacity .166s ease-out;
	-o-transition: opacity .166s ease-out;
	transition: opacity .166s ease-out;
}
.ccai-res-options>button>svg {
	width: 1.2em;
	height: 1.2em;
}
.ccai-res-options>button:hover {
	opacity: 1;
}

body[data-appearance="dark"] {
	#ai-body-box 					{ outline: 1px solid var(--background-hover); }
	#ai-body-selector 				{ border-color: var(--background-hover); }
	#ai-body-selector:hover 		{ border-color: var(--background-hover); outline: 1px solid var(--base-opa-85); }
	.ccai-summary-container:hover 	{ outline: 1px solid var(--base-opa-85); }
}

/* Customization Demo */
#settings-sticky-container {
	position: sticky; 
	top: 5rem;
}
#settings-container {
	cursor: default !important;
	-webkit-user-select: none !important;
	   -moz-user-select: none !important;
		-ms-user-select: none !important;
			user-select: none !important;
}
#settings-title-container {
	position: relative;
	height: calc(14px * 1.5 + 0.25rem + 2px);
	padding: 0 12px;
}
.settings-title {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
		-ms-flex-pack: center;
			justify-content: center;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	font-size: 14px !important;
	font-family: var(--bs-body-font-family) !important;
	font-weight: 600;
	line-height: 1.5em !important;
	padding: 0.125em 0.5em;
	border-radius: 0.5em;
	border: 1px solid var(--background-hover);
	-webkit-transition: border-color .33s ease-out;
	-o-transition: border-color .33s ease-out;
	transition: border-color .33s ease-out;
}

#personalize-hint {
	position: absolute;
	top: 0.25rem;
	left: 12px;
	margin-top: -1px;
	margin-left: -1px;
	padding: 1px;
	background: transparent;
	overflow: hidden;
	border-radius: calc(0.5em + 2px);
	z-index: 0;
}
#personalize-hint::before {
	content: '';
	position: absolute;
	z-index: -2;
	left: -50%;
	top: -50%;
	width: 200%;
	height: 200%;
	background-color: transparent;
	background-repeat: no-repeat;
	background-size: 50% 50%, 50% 50%;
	background-position: 0 100%, 100% 0, 100% 100%, 0 100%;
	background-image: -webkit-gradient(linear, left top, left bottom, from(var(--neutral)), to(transparent)), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent)), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent)), -webkit-gradient(linear, left top, left bottom, from(transparent), to(transparent));
	background-image: -o-linear-gradient(var(--neutral), transparent), -o-linear-gradient(transparent, transparent), -o-linear-gradient(transparent, transparent), -o-linear-gradient(transparent, transparent);
	background-image: linear-gradient(var(--neutral), transparent), linear-gradient(transparent, transparent), linear-gradient(transparent, transparent), linear-gradient(transparent, transparent);
	-webkit-animation: rotate 6s linear infinite;
			animation: rotate 6s linear infinite;
	pointer-events: none;
	opacity: 1;
	-webkit-transition: opacity .33s ease-out;
	-o-transition: opacity .33s ease-out;
	transition: opacity .33s ease-out;
}
#personalize-hint>.settings-title {
	background: var(--background);
}
#personalize-hint.hide-hint::before {
	opacity: 0;
}

.more-menu-item {
	height: 34px;
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
		-ms-flex-pack: justify;
			justify-content: space-between;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	opacity: 1;
	padding: 0 10px;
	margin: 3px 2px;
	border-radius: 8px;
	font-size: 14px !important;
	font-weight: 400;
	-webkit-transition: background .166s ease-out;
	-o-transition: background .166s ease-out;
	transition: background .166s ease-out;
	white-space: nowrap;
}
.more-menu-item>span {
	white-space: nowrap;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	   text-overflow: ellipsis;
	padding-right: 15px;
	max-width: calc(100% - 16px - 15px);
}
.more-menu-item svg {
	width: 1rem;
	height: 1rem;
	opacity: 0.4;
	-webkit-transition: opacity .166s ease-out;
	-o-transition: opacity .166s ease-out;
	transition: opacity .166s ease-out;
}
.more-menu-item:hover>svg {
	opacity: 1;
}
.more-menu-item>select {
	-webkit-appearance: none;
	-moz-appearance: none;
		 appearance: none;
	color: var(--base);
	white-space: nowrap;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	   text-overflow: ellipsis;
	background: transparent;
	border: none;
	outline: none;
	opacity: 0.4;
	font-size: 14px;
	font-weight: 400;
	padding: 10px 25px 10px 5px;
	text-align: right;
	-moz-text-align-last: right;
		 text-align-last: right;
	background-repeat: no-repeat;
	background-position-x: calc(100% - 4px);
	background-position-y: 50%;
	background-size: 16px;
	background-image: var(--arrow-bg-svg);
	-webkit-transition: opacity .166s ease-out;
	-o-transition: opacity .166s ease-out;
	transition: opacity .166s ease-out;
}
.more-menu-item:hover>select {
	opacity: 1;
}

#customization-container {
	-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(70%, rgb(0, 0, 0)), color-stop(98%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
	-webkit-mask-image: linear-gradient(rgb(0, 0, 0) 70%, rgba(0, 0, 0, 0) 98%, rgba(0, 0, 0, 0) 100%);
			mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(70%, rgb(0, 0, 0)), color-stop(98%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
			mask-image: linear-gradient(rgb(0, 0, 0) 70%, rgba(0, 0, 0, 0) 98%, rgba(0, 0, 0, 0) 100%);
	padding: 0.5rem 1rem;
}
#captions-container {
	cursor: default !important;
	-webkit-user-select: none !important;
	   -moz-user-select: none !important;
		-ms-user-select: none !important;
			user-select: none !important;
	text-rendering: optimizelegibility;
	word-wrap: break-word;
	-webkit-hyphens: auto;
		-ms-hyphens: auto;
			hyphens: auto;
	max-height: 75%;
	color: var(--base);
	background: var(--background);
	-webkit-transition: color .33s ease-out, background .33s ease-out;
	-o-transition: color .33s ease-out, background .33s ease-out;
	transition: color .33s ease-out, background .33s ease-out;
}
#captions-container[data-appearance="dark"] {
	outline: 1px solid var(--background-hover);
}
#captions-container[data-theme="slate"] {
	outline: 1px solid var(--background-hover);
}
#captions-container>h1 {
	text-transform: capitalize;
	font-size: 1.95552em;
	font-weight: 500;
	line-height: 1.2141em;
}
#captions-container>h2 {
	line-height: 1.5;
	margin-top: 1.25rem;
	font-size: 1.43em;
	font-weight: 500;
	text-transform: capitalize;
}
#captions-details {
	color: var(--base-opa-66);
}

#captions-container.font-serif {
	font-family: 'Noto Serif', -apple-system-ui-serif, ui-serif, 'Georgia', serif;
}
#captions-container:not(.font-serif) {
	font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

#captions-container[data-zoom="50"] { font-size: 15px; line-height: 25px; }
#captions-container[data-zoom="75"] { font-size: 16px; line-height: 26px; }
#captions-container[data-zoom="85"] { font-size: 17px; line-height: 27px; }
#captions-container[data-zoom="100"] { font-size: 18px; line-height: 29px; }
#captions-container[data-zoom="115"] { font-size: 19px; line-height: 30px; }
#captions-container[data-zoom="125"] { font-size: 20px; line-height: 31px; }
#captions-container[data-zoom="150"] { font-size: 21px; line-height: 32px; }
#captions-container[data-zoom="175"] { font-size: 23px; line-height: 33px; }
#captions-container[data-zoom="200"] { font-size: 26px; line-height: 38px; }
#captions-container[data-zoom="250"] { font-size: 28px; line-height: 39px; }
#captions-container[data-zoom="300"] { font-size: 37px; line-height: 51px; }

body[data-appearance="dark"] {
	#settings-container {
		outline: 1px solid var(--background-hover);
	}
	#captions-container {
		outline: 1px solid var(--background-hover);
	}
}

@font-face {
	font-family: "Noto Serif";
	src: url("/static/fonts/NotoSerif-VariableFont_wdth,wght.ttf") format("truetype");
	font-style: normal;
}
@font-face {
	font-family: "Noto Sans";
	src: url("/static/fonts/NotoSans-VariableFont_wdth,wght.ttf") format("truetype");
	font-style: normal;
}

/* Pricing Section */
#pricing-box {
	margin-top: 1.75rem;
}
#pricing-box [class*=hint--] {
	cursor: default;
	text-decoration: underline;
	-webkit-text-decoration-style: dotted;
			text-decoration-style: dotted;
	-webkit-text-decoration-color: var(--base-opa-15);
			text-decoration-color: var(--base-opa-15);
	text-decoration-thickness: 2px;
	-webkit-transition: -webkit-text-decoration-color .166s ease-out;
	transition: -webkit-text-decoration-color .166s ease-out;
	-o-transition: text-decoration-color .166s ease-out;
	transition: text-decoration-color .166s ease-out;
	transition: text-decoration-color .166s ease-out, -webkit-text-decoration-color .166s ease-out;
}
#pricing-box [class*=hint--]:hover {
	-webkit-text-decoration-color: var(--base-opa-50);
			text-decoration-color: var(--base-opa-50);
}
#pricing-box [class*=hint--]::after {
	font-size: 0.875em;
	line-height: 1.25;
	width: 300px;
	white-space: normal;
	word-wrap: break-word;
	-webkit-hyphens: auto;
		-ms-hyphens: auto;
			hyphens: auto;
	padding: 0.75em 1em;
	text-align: left !important;
}
#pricing-logo {
	display: inline-block;
	text-decoration: none;
}
#pricing-logo>.letters-container {
	font-size: 1rem;
	line-height: 1rem;
}

.pricing-pt {
	display: inline-block;
	position: relative;
	padding-left: calc(1.5rem + 0.75rem);
}
.pricing-pt>svg {
	width: 1.5rem;
	height: 1.5rem;
	color: var(--green);
	position: absolute;
	left: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
			transform: translateY(-50%);
}

#switch-price>span {
	font-size: 50%;
}

body[data-appearance="dark"] {
	#pricing-box [class*=hint--] {
		-webkit-text-decoration-color: var(--base-opa-40);
				text-decoration-color: var(--base-opa-40);
	}
	#pricing-box [class*=hint--]:hover {
		-webkit-text-decoration-color: var(--base-opa-85);
				text-decoration-color: var(--base-opa-85);
	}
	#pricing-box [class*=hint--]::after {
		outline: 1px solid var(--background-hover);
	}
}

/* Questions and Answers */
.accordion-item {
	background: transparent;
	border-color: transparent;
	color: var(--base);
}
.accordion-button {
	-webkit-box-pack: justify;
		-ms-flex-pack: justify;
			justify-content: space-between;
	border-radius: 0;
	-webkit-box-shadow: none !important;
			box-shadow: none !important;
	padding-left: 0;
	padding-right: 0;
	background: transparent !important;
	color: var(--base) !important;
}
.accordion-button::after {
	display: none;
}
.accordion-button>svg {
	width: 1.5rem;
	height: 1.5rem;
	-webkit-transition: -webkit-transform .166s ease-out;
	transition: -webkit-transform .166s ease-out;
	-o-transition: transform .166s ease-out;
	transition: transform .166s ease-out;
	transition: transform .166s ease-out, -webkit-transform .166s ease-out;
}
.accordion-button:not(.collapsed)>svg {
	-webkit-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
			transform: rotate(180deg);
}
.accordion-button>span {
	white-space: nowrap;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	   text-overflow: ellipsis;
	max-width: calc(100% - 2rem);
}
.accordion-body {
	opacity: 0.66;
	padding-left: 0;
	padding-right: 0;
	word-wrap: break-word;
	-webkit-hyphens: auto;
		-ms-hyphens: auto;
			hyphens: auto;
}

/* Demo Color Themes */

/* Basic (O) */
#captions-container[data-theme="basic"] {
	--base: rgb(0,0,0);
	--base-opa-66: rgba(0,0,0,0.66);
	--background: rgb(255,255,255);
	--background-hover: rgb(235,240,249);
}
#captions-container[data-theme="basic"][data-appearance="dark"] {
	--base: rgb(255,255,255);
	--base-opa-66: rgba(255,255,255,0.66);
	--background: rgb(0,0,0);
	--background-hover: rgb(80,80,80);
}

/* Newspaper (P) */
#captions-container[data-theme="newspaper"] {
	--base: rgb(29,26,26);
	--base-opa-66: rgba(29,26,26,0.66);
	--background: rgb(238,237,237);
	--background-hover: rgb(225,225,225);
}
#captions-container[data-theme="newspaper"][data-appearance="dark"] {
	--base: rgb(242,242,240);
	--base-opa-66: rgba(242,242,240,0.66);
	--background: rgb(28,28,30);
	--background-hover: rgb(80,80,81);
}

/* Paperback (F) */
#captions-container[data-theme="paperback"] {
	--base: rgb(20,18,2);
	--base-opa-66: rgba(20,18,2,0.66);
	--background: rgb(255,252,245);
	--background-hover: rgb(242,240,232);
}
#captions-container[data-theme="paperback"][data-appearance="dark"] {
	--base: rgb(254,250,236);
	--base-opa-66: rgba(254,250,236,0.66);
	--background: rgb(24,22,13);
	--background-hover: rgb(76,74,65);
}

/* Parchment (C) */
#captions-container[data-theme="parchment"] {
	--base: rgb(50,40,29);
	--base-opa-66: rgba(50,40,29,0.66);
	--background: rgb(238,226,204);
	--background-hover: rgb(226,215,193);
}
#captions-container[data-theme="parchment"][data-appearance="dark"] {
	--base: rgb(247,236,221);
	--base-opa-66: rgba(247,236,221,0.66);
	--background: rgb(65,59,49);
	--background-hover: rgb(115,109,100);
}

/* Slate (Q) */
#captions-container[data-theme="slate"] {
	--base: rgb(235,235,244);
	--base-opa-66: rgba(235,235,244,0.66);
	--background: rgb(74,74,77);
	--background-hover: rgb(113,113,116);
}
#captions-container[data-theme="slate"][data-appearance="dark"] {
	--base: rgb(141,141,147);
	--base-opa-66: rgba(141,141,147,0.66);
	--background: rgb(0,0,0);
	--background-hover: rgb(56,56,56);
}