:root{
	--accent:#7dfc4f;
	--accent-dark:#46b52a;
	--text-light:#ffffff;
	--text-muted:#b5d0df;
}

*{
	box-sizing:border-box;
}

html,
body{
	height:100%;
	margin:0;
}

body{
	font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
	background:#083249;
	color:var(--text-light);
	display:flex;
	flex-direction:column;
}

/* TOPO */

.topbar{
	position:fixed;
	top:0;
	left:0;
	right:0;
	height:56px;
	padding:0 18px;
	display:flex;
	align-items:center;
	background:linear-gradient(90deg,#024c6a,#00628a);
	box-shadow:0 4px 12px rgba(0,0,0,.35);
	z-index:100;
}

/* CONTEÚDO */

.main-wrapper{
	flex:1;
	padding-top:56px;
	display:flex;
	align-items:center;
	justify-content:center;
}

.screen{
	width:100%;
}

.screen-title{
	font-size:clamp(2rem,4vw,3rem);
	font-weight:800;
	text-transform:uppercase;
	color:#a4f2ff;
	margin-bottom:12px;
}

.text-muted{
	color:var(--text-muted)!important;
	font-size:1.05rem!important;
}

/* BOTÕES */

.btn-accent{
	background:linear-gradient(135deg,#a7ff7c,#7dfc4f);
	border:2px solid rgba(125,252,79,.9);
	color:#00240f !important;

	font-weight:900;
	font-size:1.15rem;
	letter-spacing:.03em;

	padding:18px 38px;
	min-width:430px;

	border-radius:999px;

	box-shadow:
		0 14px 30px rgba(0,0,0,.45),
		0 0 22px rgba(125,252,79,.30);

	transition:.2s ease;

	text-decoration:none;
}

.btn-accent:hover{
	background:linear-gradient(135deg,#b8ff95,#8cff60);
	transform:translateY(-2px);
	color:#001a0b !important;

	box-shadow:
		0 18px 36px rgba(0,0,0,.55),
		0 0 28px rgba(125,252,79,.45);
}

.btn-accent i{
	width:24px;
	text-align:center;
}

/* RODAPÉ */

.footer{
	background:linear-gradient(90deg,#024c6a,#00628a);
	padding:12px 16px;
	text-align:center;
	font-size:1.08em;
	color:var(--text-muted);
}

/* MOBILE */

@media (max-width:576px){

	.main-wrapper{
		padding-top:70px;
		padding-left:15px;
		padding-right:15px;
	}

	.screen-title{
		font-size:1.9rem;
	}

	.btn-accent{
		min-width:100%;
		font-size:1rem;
		padding:16px 24px;
	}
}