/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/


textarea::-webkit-resizer {
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.0303 0.96967C11.3232 1.26256 11.3232 1.73744 11.0303 2.03033L2.03034 11.0303C1.73745 11.3232 1.26257 11.3232 0.969678 11.0303C0.676785 10.7374 0.676785 10.2626 0.969678 9.96967L9.96968 0.96967C10.2626 0.676777 10.7374 0.676777 11.0303 0.96967Z" fill="%238BE000"/><path fill-rule="evenodd" clip-rule="evenodd" d="M11.5303 6.46967C11.8232 6.76256 11.8232 7.23744 11.5303 7.53033L7.53034 11.5303C7.23745 11.8232 6.76257 11.8232 6.46968 11.5303C6.17679 11.2374 6.17679 10.7626 6.46968 10.4697L10.4697 6.46967C10.7626 6.17678 11.2374 6.17678 11.5303 6.46967Z" fill="%238BE000"/></svg>');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 12px 12px;
}

/***************************** Page layout CSS ******************************/
html {
	box-sizing:border-box;
	scroll-behavior:smooth;
	background: var(--core-rich-black, #010203);
	overflow: clip auto;
}

*,
:after,
:before {
	box-sizing:inherit;
}

body {
	/* 	color: var(--white, #fff);
	background: var(--Fill-Background, #010203); */
	margin: 0;
	font-family: "Graphik LC Web", sans-serif;
	font-size: var(--static-text-lg, 18px);
	line-height: 170%;
}

body:last-child {
	margin-bottom:0
}

main {
	display:block;
	padding-block: 10px;
}

p {
	margin-top: 0;
}

p:last-of-type {
	margin-bottom: 0;
}

a {
	cursor:pointer
}

a:focus,
a:hover {
	text-decoration:underline
}

blockquote,
figure {
	border:0;
	font:inherit;
	margin:0;
	padding:0
}

h1 {
	font-size:2em;
	margin:.67em 0
}

hr {
	box-sizing:content-box;
	height:0;
	overflow:visible
}

pre {
	font-family:monospace,monospace;
	font-size:1em
}
abbr[title] {
	border-bottom:none;
	text-decoration:underline;
	-webkit-text-decoration:underline dotted;
	text-decoration:underline dotted
}

b,
strong {
	font-weight:bolder
}

code,
kbd,
samp {
	font-family:monospace,monospace;
	font-size:1em
}

small {
	font-size:80%
}

sub,
sup {
	font-size:75%;
	line-height:0;
	position:relative;
	vertical-align:baseline
}
sub {
	bottom:-.25em
}

sup {
	top:-.5em
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size:inherit;
	margin:0
}

h1,
h2,
h3,
h4 {
	font-weight:600
}

h5,
h6 {
	font-weight:500
}

ol,
ul {
	margin:0 0 .5rem
}

ol ol,
ol ul,
ul ol,
ul ul {
	margin:0
}

ul.no-list {
	list-style:none;
	padding-left:0;
	padding-right:0
}

pre {
	overflow:auto
}

code {
	vertical-align:bottom
}

hr {
	background-color:#434c63;
	border:none;
	color:#434c63;
	height:1px
}

img {
	font-size:1rem;
	word-break:normal
}

/***************************** Picture frame CSS ******************************/
:root {
	--frame-size: 10px;
	--triangle-size: 5.282px;
	--frame-color: var(--core-rich-black, #010203);
	--frame-cutout-width: 17.58px;
	--frame-cutout-height: 99.719px;
	--frame-cutout-offset: 1px;
	--frame-cutout-bottom: 0px;
	--frame-decor-width: 12.045px;
	--frame-decor-height: 11.92px;
	--frame-decor-offset: 4.5px;
}

@media screen and (min-width: 768px) {
	:root {
		--triangle-size: 14.462px;
		--frame-decor-width: 20.833px;
		--frame-decor-height: 20.617px;
	}
}

@media screen and (min-width: 992px) {
	:root {
	--frame-cutout-width: 48.135px;
	--frame-cutout-height: 273.033px;
	--frame-cutout-offset: -14px;
	--frame-cutout-bottom: -10px;
	}
}

@media screen and (min-width: 1200px) {
	:root {
		--frame-size: 20px;
		--triangle-size: 20.83px;
		--frame-cutout-width: 69.347px;
		--frame-cutout-height: 330.165px;
		--frame-cutout-offset: -15px;
		--frame-decor-offset: 10px;

	}
}

.tier-one-frame {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 9999;
}

.to-frame-container {
	height: 100vh;
	position: relative;
}

/* Frame border */
.to-frame-container::before {
	position: absolute;
	content: "";
	inset: 0;
	border: var(--frame-size) solid var(--frame-color);
}

/* Corner base */
.to-frame-corner {
	position: absolute;
	width: 0;
	height: 0;
}

/* Top Left */
.to-frame-corner.tl {
	top: var(--frame-size);
	left: var(--frame-size);
	border-top: var(--triangle-size) solid var(--frame-color);
	border-right: var(--triangle-size) solid transparent;
}

/* Top Right */
.to-frame-corner.tr {
	top: var(--frame-size);
	right: var(--frame-size);
	border-top: var(--triangle-size) solid var(--frame-color);
	border-left: var(--triangle-size) solid transparent;
}

/* Bottom Left */
.to-frame-corner.bl {
	bottom: var(--frame-size);
	left: var(--frame-size);
	border-bottom: var(--triangle-size) solid var(--frame-color);
	border-right: var(--triangle-size) solid transparent;
}

/* Bottom Right */
.to-frame-corner.br {
	bottom: var(--frame-size);
	right: var(--frame-size);
	border-bottom: var(--triangle-size) solid var(--frame-color);
	border-left: var(--triangle-size) solid transparent;
}

.to-frame-cutout {
	position: absolute;
	content: "";
	inset: auto 0 var(--frame-cutout-bottom);
	width: var(--frame-cutout-width);
	height: var(--frame-cutout-height);
}

.to-frame-cutout.left {
	right: auto;
	left: var(--frame-cutout-offset);
}

.to-frame-cutout.right {
	right: var(--frame-cutout-offset);
	left: auto;
}

.toh-frame-decor:before,
.toh-frame-decor:after {
	width: var(--frame-decor-width);
	height: var(--frame-decor-height);
	position: absolute;
	content: '';
	background-image: url('https://142972.fs1.hubspotusercontent-na1.net/hubfs/142972/2024%20Website%20Redesign/Decorations/green-corner-vid-decor.svg');
	background-size: cover;
	background-repeat: no-repeat;
	z-index: 11;
}

.toh-frame-decor.top:before {
	inset: var(--frame-decor-offset) auto auto var(--frame-decor-offset);
}

.toh-frame-decor.top:after {
	inset: var(--frame-decor-offset) var(--frame-decor-offset) auto auto;
	transform: rotate(90deg);
}

.toh-frame-decor.bot:before {
	inset: auto auto var(--frame-decor-offset) var(--frame-decor-offset);
	transform: rotate(-90deg);
}

.toh-frame-decor.bot:after {
	inset: auto var(--frame-decor-offset) var(--frame-decor-offset) auto;
	transform: rotate(180deg);
}


/***************************** Sticker CSS ******************************/
.tier-one-sticker {
  --base-z: 1;
  z-index: var(--base-z);
}

.tier-one-sticker.draggable {
	cursor: grab;
}

.tier-one-sticker.dragging {
	cursor: grabbing;
	user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

/***************************** Liquid Ether CSS ******************************/
.liquid-ether-container {
	position: absolute;
	inset: 0;
	overflow: hidden;
	width: 100%;
	height: 100%;
	touch-action: none;
}

/***************************** Container CSS ******************************/
.container {
	padding-inline: 10px;
	max-width: 1440px;
	margin: 0 auto;
}

/***************************** Buttons layout CSS ******************************/
.tier-one-cta,
.tier-one-cta:hover,
.tier-one-cta:focus {
	text-decoration: none;
}

.tier-one-cta.green {
	color: var(--core-rich-black, #010203);
	font-family: "Graphik XCond";
	font-size: 16px;
	font-style: normal;
	font-weight: 600;
	line-height: 100%;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	padding: 16px 32px;
	background: var(--highlight-cyber-green, #8BE000);
	box-shadow: 0 1px 2px 0 rgba(3, 33, 39, 0.05);
	transition: background .3s ease, color .3s ease;
}

.tier-one-cta.green:hover {
	background: #0D1500;
	color: var(--highlight-cyber-green, #8BE000);
}

/* disabled or missing/empty href */
.tier-one-cta.green.disabled {
	color: var(--neutral-4, #8D8E92);
	background: var(--neutral-5, #4C4D4F);
	pointer-events: none;
	user-select: none;
}


/***************************** Text Link layout CSS ******************************/
.tier-one-link.green {
	width: max-content;
	max-width: 100%;
	color: var(--highlight-cyber-green, #8BE000);
	font-family: "Graphik XCond";
	font-size: 16px;
	font-weight: 600;
	line-height: 100%;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	text-decoration: none;
	border-bottom: 2px solid transparent;
	transition: color.3s ease, border-bottom .3s ease;
	padding-right: 20px;
	position: relative;
}

.tol-green-arrow {
	position: absolute;
	content: '';
	inset: auto 0 0 auto;
	width: 16px;
	height: 16px;

}

.tier-one-link.green:hover,
.tier-one-link.green:focus,
.tier-one-link.green:focus-visible {
	text-decoration: none;
	border-bottom: 2px solid var(--highlight-cyber-green, #8BE000);
}

.tier-one-link.green:active {
	color: var(--white, #fff);
	text-decoration: none;
	border-bottom: 2px solid var(--white, #fff);
}


.tier-one-link.green.disabled {
	color: var(--neutral-4, #8D8E92);
	pointer-events: none;
	user-select: none;
}

/***************************** Badge layout CSS ******************************/
.tier-one-badge {
	width: max-content;
	max-width: 100%;
	color: var(--highlight-cyber-green, #8BE000);
	font-family: Graphik XCond;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 1.6px;
	line-height: 100%;
	text-transform: uppercase;
	padding: 5px 8px 5px 8px;
	border: 1px solid var(--neutral-5, #4C4D4F);
	box-shadow: 0 1px 2px 0 rgba(3, 33, 39, 0.05);
}



/***************************** Form CSS ******************************/
.tier-one-form-section .form-container form .input input,
.tier-one-form-section .form-container form select,
.tier-one-form-section .form-container form textarea {
	background: #323232;
	border-radius: 0;
	font-family: "Graphik LC Web";
	/* 	color: var(--highlight-cyber-green, #8BE000); */
	color: var(--core-white, #fff);
}

.tier-one-form-section .form-container form .input input:hover, .tier-one-form-section .form-container form .input input:focus, .tier-one-form-section .form-container form .input input:focus-visible,
.tier-one-form-section .form-container form select:hover, .tier-one-form-section .form-container form select:focus, .tier-one-form-section .form-container form select:focus-visible,
.tier-one-form-section .form-container form textarea:hover, .tier-one-form-section .form-container form textarea:focus, .tier-one-form-section .form-container form textarea:focus-visible {
	/* 	color: var(--highlight-cyber-green, #8BE000); */
	color: var(--core-white, #fff);
	border-color: var(--highlight-cyber-green, #8BE000) !important;
	background: #0d1500 !important;
	background-color: #0d1500 !important;
	font-family: "Graphik LC Web";
	outline: none !important;
}

.tier-one-form-section .form-container form textarea:focus, .tier-one-form-section .form-container form textarea:focus-visible {
	box-shadow: none;
}

}
.tier-one-cta,
.tier-one-cta:hover,
.tier-one-cta:focus,
.tier-one-cta:focus-visible {
	text-decoration: none;
}

.tier-one-form-section .form-container form input[type=submit] {
	color: var(--core-rich-black, #010203);
	font-family: "Graphik XCond";
	font-size: 16px;
	font-style: normal;
	font-weight: 600;
	line-height: 100%;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	padding: 16px 32px;
	background: var(--highlight-cyber-green, #8BE000);
	box-shadow: 0 1px 2px 0 rgba(3, 33, 39, 0.05);
	transition: background .3s ease, color .3s ease;
	border-radius: 0;
	position: relative;
	border: none !important;
}

.tier-one-form-section .hs_submit.hs-submit {
	position: relative;
}

.tier-one-form-section .form-container form input[type=submit]:hover {
	background: #0d1500 !important;
	color: var(--highlight-cyber-green, #8be000) !important;
	border: none !important;
}

/* disabled or missing/empty href */
.tier-one-form-section .form-container form input[type=submit].disabled {
	color: var(--neutral-4, #8D8E92);
	background: var(--neutral-5, #4C4D4F);
	pointer-events: none;
	user-select: none;
	border: none !important;
}


.tier-one-form-section .to-green-cta-dec {
	position: absolute;
	content: '';
	transition: inset .2s ease;
	pointer-events: none;
}

.tier-one-form-section .form-container form input[type=submit].disabled .to-green-cta-dec {
	display: none;
}

.tier-one-form-section .to-green-cta-dec.top-left {
	inset: 0;
}

.tier-one-form-section .to-green-cta-dec.top-right {
	inset: 0 0 auto auto;
	transform: rotate(90deg);
}

.tier-one-form-section .to-green-cta-dec.bottom-right {
	inset: auto 0 0 auto;
	transform: rotate(180deg);
}

.tier-one-form-section .to-green-cta-dec.bottom-left {
	inset: auto auto 0 0;
	transform: rotate(-90deg);
}

.tier-one-form-section .form-container form .hs_submit.hs-submit:hover .to-green-cta-dec.top-left {
	inset: -8px auto auto -8px;
}

.tier-one-form-section .form-container form .hs_submit.hs-submit:hover .to-green-cta-dec.top-right {
	inset: -8px -8px auto auto;
}

.tier-one-form-section .form-container form .hs_submit.hs-submit:hover .to-green-cta-dec.bottom-right {
	inset: auto -8px -8px auto;
}

.tier-one-form-section .form-container form .hs_submit.hs-submit:hover .to-green-cta-dec.bottom-left {
	inset: auto auto -8px -8px;
}

/* .tier-one-form-section .form-container form input[type=submit]:active .to-green-cta-dec.top-left {
inset: 0;
}

.tier-one-form-section .form-container form input[type=submit]:active .to-green-cta-dec.top-right {
inset: 0 0 auto auto;
}

.tier-one-form-section .form-container form input[type=submit]:active .to-green-cta-dec.bottom-right {
inset: auto 0 0 auto;
}

.tier-one-form-section .form-container form input[type=submit]:active .to-green-cta-dec.bottom-left {
inset: auto auto 0 0;
}
*/

.tier-one-form-section .form-container form .hs_submit.hs-submit:active .to-green-cta-dec.top-left {
	inset: 0;
}

.tier-one-form-section .form-container form .hs_submit.hs-submit:active .to-green-cta-dec.top-right {
	inset: 0 0 auto auto;
}

.tier-one-form-section .form-container form .hs_submit.hs-submit:active .to-green-cta-dec.bottom-right {
	inset: auto 0 0 auto;
}

.tier-one-form-section .form-container form .hs_submit.hs-submit:active .to-green-cta-dec.bottom-left {
	inset: auto auto 0 0;
}



@media screen and (min-width: 1200px) {
	main {
		padding-block: 20px;
	}

	.container {
		padding-inline: 20px;
	}
}