/** @format */



body {

	position: initial;

	background-color: hsl(280, 90%, 5%);

}



/* Hace que el div ocupe toda la pantalla */

.full-screen {

	max-width: 100vw;

	min-height: 100vh;

	display: flex;

	justify-content: center;

	align-items: center;

	padding-top: 50px;

	-webkit-backdrop-filter: blur(50px);

	/* Add this line first, it fixes blur for Safari*/

}



.ait2 {

	border-radius: 28px;

	background: #f6e8fb;

	margin: 48px auto;

	padding: 60px 16px;

	display: flex;

	justify-content: center;

	align-items: center;

	flex-direction: column;

}



img.ai {

	max-width: 350px;

	display: inline-block;

}



canvas {

	position: absolute !important;

	top: 0px;

	left: 0px;

	width: 100vw;

	min-height: 100vh;

	z-index: -1000 !important;

}



.ait h1 {

	font-size: 22px;

	font-weight: 600;

	background: linear-gradient(30deg, #ffc115, #ff49b9, #d24bff);

	/* background: linear-gradient(90deg, #ff7700, #ff009d, #9900ff); para fondo claro*/

	-webkit-text-fill-color: transparent;

	-webkit-background-clip: text;

	display: inline-block;

}



.ait h2 {

	color: #fff;

	font-weight: 500;

	font-size: 20px;

	padding: 0 16vw;

	line-height: normal;

}



.boton.ait {

	background: linear-gradient(120deg, #ffab02, #ff009d, #9900ff);

	color: #fff;

	box-shadow: #ff00b2 0px 1px 1px;

	transition: 0.4s;

	padding: 9px 21px 9px 10px;

	font-size: 22px;

	margin-top: 20px;

	border-radius: 16px;

}



.boton.ait:hover {

	box-shadow: #ff00b2 0px 1px 16px;

}



#TryButton {

	padding: 9px 22px 9px 18px;

	border-radius: 50px;

	border: none;

	cursor: pointer;

	color: #fff;

	background: linear-gradient(120deg, #ffab02, #ff009d, #9900ff);

	font-family: 'Raleway', sans-serif;

	font-size: 18px;

	font-weight: 500;

	margin-top: 26px;

	margin-right: 16px;

	transition: all 2s;

	position: relative;

}



#TryButton:hover {

	filter: hue-rotate(-360deg);

	transition: all 2s;

}



#TryButton:active {

	filter: hue-rotate(720deg);

	transition: 0s;

}



#TryButton::before {

	content: '';

	z-index: -1;

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

	background: linear-gradient(120deg, #ffab02, #ff009d, #9900ff);

	transform: scale(1.15, 1.3);

	filter: blur(10px);

	-webkit-backdrop-filter: blur(10px);

	border-radius: inherit;

	opacity: 0;

	transition: opacity 1s;

}



#TryButton:hover::before {

	opacity: 1;

}



#TryButton:hover::after {

	content: '';

	z-index: -1;

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	left: 0;

}



/* .price-toggle {

	margin-bottom: 20px;

	text-align: center;

} */



.price-toggle button {

	font-family: 'Raleway';

	font-weight: 600;

	margin-right: 8px;

	cursor: pointer;

	border: none;

	background-color: #bbb;

	color: #fff;

	padding: 8px 12px;

	border-radius: 50px;

	transition: background-color 0.3s;

}



.price-toggle button:hover {

	background-color: #000;

}



.price-toggle button.active {

	background-color: #f70;

}



.price-content {

	text-align: center;

	padding: 20px;

	margin: 0 auto;

}