/*

 ░▒▓██████▓▒░░▒▓█▓▒░      ░▒▓██████▓▒░░▒▓███████▓▒░ ░▒▓██████▓▒░░▒▓█▓▒░        
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░        
░▒▓█▓▒░      ░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░        
░▒▓█▓▒▒▓███▓▒░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓███████▓▒░░▒▓████████▓▒░▒▓█▓▒░        
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░        
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░        
 ░▒▓██████▓▒░░▒▓████████▓▒░▒▓██████▓▒░░▒▓███████▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓████████▓▒░ 
                                                                               
*/

:root {
	--db-purple: #b064ee;
	--db-green: #27ff97;
}

html {
	background: black;
	color: white;
}

body {
	padding: 6em;
	padding-top: 4em;
	margin: 0 auto;
	background-image: url("gradient.jpg");
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: top center;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: "SF Pro Expanded", "SF Pro Display", -apple-system, system-ui, sans-serif;
	font-stretch: expanded;
}

header {
	max-width: 1024px;
	margin: 0 auto;
	text-align: center;
}

a {
	color: #56D2FF;
}

p, footer {
	font-stretch: normal;
	font-size: 1.6em;
	margin: 0;
}


/*

░▒▓█▓▒░░▒▓█▓▒░▒▓████████▓▒░▒▓███████▓▒░ ░▒▓██████▓▒░  
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓████████▓▒░▒▓██████▓▒░ ░▒▓███████▓▒░░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓█▓▒░░▒▓█▓▒░▒▓████████▓▒░▒▓█▓▒░░▒▓█▓▒░░▒▓██████▓▒░  
                                                      
*/

.logo {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
}

.app-icon {
	height: 64px;
}

.app-logo {
	height: 48px;
}

.advanced-research {
	font-size: 1em;
	margin-bottom: 2em;
}

h1 {
	font-size: 2.4em;
	margin-top: 0em;
	margin-bottom: 0.4em;
	font-weight: normal;
	max-width: 20em;
	margin-left: auto;
	margin-right: auto;
	font-stretch: expanded;
}


/*

░▒▓███████▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓████████▓▒░▒▓████████▓▒░▒▓██████▓▒░░▒▓███████▓▒░ ░▒▓███████▓▒░ 
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░  ░▒▓█▓▒░      ░▒▓█▓▒░  ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░        
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░  ░▒▓█▓▒░      ░▒▓█▓▒░  ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░        
░▒▓███████▓▒░░▒▓█▓▒░░▒▓█▓▒░  ░▒▓█▓▒░      ░▒▓█▓▒░  ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░░▒▓██████▓▒░  
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░  ░▒▓█▓▒░      ░▒▓█▓▒░  ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░      ░▒▓█▓▒░ 
░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░  ░▒▓█▓▒░      ░▒▓█▓▒░  ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░      ░▒▓█▓▒░ 
░▒▓███████▓▒░ ░▒▓██████▓▒░   ░▒▓█▓▒░      ░▒▓█▓▒░   ░▒▓██████▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓███████▓▒░  
                                                                                            
*/

.button {
	display: flex;
    align-items: center;
    justify-content: center;
    height: 2.4em;
    border-radius: 0.5em;
    font-size: 1.5em;
    text-decoration: none;
    box-sizing: border-box;
    padding-left: 1em;
    padding-right: 1em;
}

.button:active {
	box-shadow:
	inset  3px  3px 0 rgba(0,0,0,0.35),
	inset -3px -3px 0 rgba(255,255,255,0.55);
	filter: brightness(0.93);
	transform: scale(0.98);
}

.button:focus-visible {
	outline: 2px dotted #000;
	outline-offset: -5px;
}

.button-download {
	background: var(--db-purple); color: #fff;
}

.button-download:hover {
	filter: brightness(1.08);
}

.button-buy {
	background: rgba(216, 216, 216, 0.08);
	border: 1px solid rgba(216, 216, 216, 0.45);
	color: var(--db-green);
}

.button-buy:hover {
	background: rgba(216, 216, 216, 0.14);
}

.button-container {
	margin-top: 2.2em;
}

.button-wrapper {
	display: inline-block;
}

.button-wrapper-left {
	padding-right: 1.2em;
}

.button-description {
	font-size: 1em;
	margin-top: 0.5em;
	margin-bottom: 1.2em;
}

.license {
	margin-top: 0.5em;
	font-size: 1em;
	opacity: 0.5;
	margin-bottom: 2em;
	max-width: 28em;
	margin-left: auto;
	margin-right: auto;
}

/*

 ░▒▓███████▓▒░▒▓█▓▒░      ░▒▓█▓▒░▒▓███████▓▒░░▒▓████████▓▒░░▒▓███████▓▒░ 
░▒▓█▓▒░      ░▒▓█▓▒░      ░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░        
░▒▓█▓▒░      ░▒▓█▓▒░      ░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░        
 ░▒▓██████▓▒░░▒▓█▓▒░      ░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓██████▓▒░  ░▒▓██████▓▒░  
       ░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░             ░▒▓█▓▒░ 
       ░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░             ░▒▓█▓▒░ 
░▒▓███████▓▒░░▒▓████████▓▒░▒▓█▓▒░▒▓███████▓▒░░▒▓████████▓▒░▒▓███████▓▒░  
                                                                         
*/

.slide {
	width: 100%;
	max-width: 1024px;
	display: block;
	margin: 0 auto;
}


.caption {
	font-size: 2em;
	text-align: center;
	margin-top: 2em;
	/*margin-bottom: 1em;*/
}


/*

░▒▓████████▓▒░▒▓██████▓▒░ ░▒▓██████▓▒░▒▓████████▓▒░▒▓████████▓▒░▒▓███████▓▒░  
░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ ░▒▓█▓▒░   ░▒▓█▓▒░      ░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ ░▒▓█▓▒░   ░▒▓█▓▒░      ░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓██████▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ ░▒▓█▓▒░   ░▒▓██████▓▒░ ░▒▓███████▓▒░  
░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ ░▒▓█▓▒░   ░▒▓█▓▒░      ░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓█▓▒░     ░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░ ░▒▓█▓▒░   ░▒▓█▓▒░      ░▒▓█▓▒░░▒▓█▓▒░ 
░▒▓█▓▒░      ░▒▓██████▓▒░ ░▒▓██████▓▒░  ░▒▓█▓▒░   ░▒▓████████▓▒░▒▓█▓▒░░▒▓█▓▒░ 
                                                                              
*/

.devil {
	width: 6em;
}

footer {
	font-size: 0.6em;
	color: silver;
	clear: both;
}

.social {
	margin-bottom: 2em;
}

.social a {
	text-decoration: none;
	margin-right: 1em;
}

.icon {
	width: 20px;
	height: 20px;
}



/*

░▒▓██████████████▓▒░ ░▒▓██████▓▒░░▒▓███████▓▒░░▒▓█▓▒░▒▓█▓▒░      ░▒▓████████▓▒░ 
░▒▓█▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░        
░▒▓█▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░        
░▒▓█▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓███████▓▒░░▒▓█▓▒░▒▓█▓▒░      ░▒▓██████▓▒░   
░▒▓█▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░        
░▒▓█▓▒░░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░░▒▓█▓▒░▒▓█▓▒░▒▓█▓▒░      ░▒▓█▓▒░        
░▒▓█▓▒░░▒▓█▓▒░░▒▓█▓▒░░▒▓██████▓▒░░▒▓███████▓▒░░▒▓█▓▒░▒▓████████▓▒░▒▓████████▓▒░ 

*/

@media (max-width: 480px) {
	body {
		padding: 1em;
		max-width: 480px;
		margin: 0 auto;
		font-size: 17px;
		background-size: 200% auto;
	}

	.logo {
		margin-top: 2em;
	}

	.app-icon {
		height: 42px;
	}

	.app-logo {
		height: 36px;
	}

	.advanced-research {
		margin-top: 0.2em;
		margin-bottom: 2em;
	}

	.button-wrapper-left {
		padding-right: 0em;
	}

	h1 {
		font-size: 1.2em;
		line-height: 1.4;
		margin-top: 0.2em;
	}

	.license {
		font-size: 0.8em;
	}

	p {
		font-size: 1em;
	}

	.button-container {
		margin-top: 2em;
	}

	.button {
		font-size: 0.8em;
		margin-left: 0.5em;
		margin-right: 0.5em;
	}

	.button-description {
		font-size: 0.6em;
	}

	.caption {
		font-size: 1.6em;
		margin-bottom: 0.8em;
	}

	.devil {
		width: 3em;
	}
}